<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=948814738540454&amp;ev=PageView&amp;noscript=1">
Menu

Tuesday Tip: Get to know the basics of web design

By Chloe Mark | May 2017

As digital marketers, we can't ignore the importance of design – especially in the digital age. Eye catching imagery, strong branding and a well-designed site are essential to complementing your messaging, analytics and paid campaigns. But that doesn't mean you have to have a strong background in design or even go back to take classes in design. It does mean that you need to have an understanding of what works and what simply does not. Tuesday Tip: Get to know the basics of web design. 

Design-basics-for-marketers.jpg

CEO & Founder of Design Inc., Mark Hemeon took the world of digital design and shrunk it down to a few simple rules. Here are a few of my favorites that I find most essential as starters. 

1. Important content goes first

When giving feedback on a layout, look at it as a new user. What's the first thing you notice? If that thing is not what the message is about, the layout should be reworked. In the example below, the right side leaves the user wondering what the article is about whereas the left points you right to the main point, "The Roasting."

basics-of-web-design
Image source: developer.apple.com

 

2. Perfect alignment is the goal

If alignment is off, everything feels off. As a non-designer it can be hard to catch, but if you keep this rule in mind, you'll look for it. With the example on the right, your eye bounces around the page and it just feels messy. On the left, things flow more easily down the the button. 

basics-of-web-design

Image source: developer.apple.com

 

3. Text needs proper space

This too can be hard to pinpoint if you're not a designer, but you'll want to ensure your text is not only the right size, but that it also has plenty of space around it. If not, it feels illegible and it's less likely your readers will make it through your content you fought so hard to bring them to. Even if it takes up more space on the page, it's probably worth it. 

basics-of-web-design

Image source: developer.apple.com

 

4. Contrast is key

When you look at a design long enough, you sometimes assume that things are legible when they're not. Look at it as if it's on a small screen and you have bad eyesite. If those users will not be able to interact with the screen because the color contrast is faded, it should be boosted. Make sure the background contrasts with the icons and type.

The black and white example on the left may feel slightly less exciting than the lime green, but users will not be excited to squint when attempting to read. 

basics-of-web-designImage source: developer.apple.com

 

5. Consider what's comfortable

Especially when it comes to mobile site design, you need to think about how the users are physically interacting with the design. If it's challenging for the user to reach a button or find it, it's less likely they'll click it. As the example from Mark Hemeon's post points out, a lot of the core actions for mobile sites should be located at the buttom third of the phone as it's closest to your thumb. 

basics-of-web-design

Image source: LukeW.com

 

See? It makes sense. Even if your users aren't professional designers, these rules help them find the right information and digest it online. Think about these design principles as you review your designers work, source images and choose ads for your campaigns. For more tips, subscribe to our weekly email below!

Topics: Web Design, User Experience Design, Tuesday Tip, Design Basics: Learning Center

Get a Weekly Tuesday Tidbit