10 Do's and Don'ts of Web Design

Branding
2016
.
18
.
1

When it comes to building a website there are a handful of basic "do's and don'ts" to keep in mind. Although website design trends and practices are constantly evolving (thanks to folks like Google with their material design practices which is a whole other topic in itself), there are definitely some standards set in place that aid in having a successful web presence in this day and age. Of course there are exceptions to every rule, but the main point is to be knowledgeable and start with the basic fundamentals. While there's dozens of website resources out there I've compiled my own simple list of my personal favorites that successful and compelling sites do and don't do.

1. Do establish headlines and hierarchy, Don’t have all your text be the same size

Use your H1's and H2's and H3's etc...Ok what I mean is just like in a magazine or print editorial, with websites there needs to be headers, sub-headers, call out text and main body copy to create an ease and without overwhelming your viewer with so much content. Also don't be afraid to edit down, crafting just the right amount of content can serve you well than having too much.

2. Do pick a couple of web friendly fonts, Don’t go on a font frenzy

Using typography effectively and beautifully  is an artform in itself, this is what can make or break a website in many instances so when pairing fonts please tread lightly. Sometimes having too many fonts can overwhelm and be an instant turnoff, and just the same as with using lackluster font choices, it's a delicate balance or finding that harmonious formula. Having too many custom fonts (via typekit, etc) also may affect the load time, but a simple rule of thumb if you're not experienced with typography, is to pick no more than two fonts and use visual hierarchy to create interest.

3. Do pay attention to the details, Don’t have a plain jane website

Simple websites can be just as beautiful and effective, it’s the small touches that set your website apart and make it shine. For example, think about things like using appropriate and charming icons that match your brand's aesthetic and using purposeful and consistent photography (more on that below). The idea is similar to decorating your home - a clean/organized home is better than one full of clutter. To make a website interesting does not mean you have to clutter it up with all the belles and whistles, instead keep the layout clean and organized and add little touches to bring it all together, set the tone and convey your brand’s message.

4. Do have a responsive mobile friendly website, Don’t over do it on pop-ups

Having a responsive website is not even optional here - every site nowadays MUST be responsive (aka mobile and tablet friendly) no if’s or but’s. More and more the majority of website visitors are viewing through their phones (and tablets are on the climb too), meaning no longer are we in an age where we can have non-mobile friend websites - unless you want to turn away a huge chunk of your visitors which I’m sure you don’t. Mobile website design has become much more flexible and can still convey the same aesthetic and messaging as your desktop website design, an experienced web designer can design an equally as interesting and beautiful mobile design. This brings us to Pop-ups, which are more and more seen as dated - and some argue a lazy - way of getting your viewers attention. They're something if whenever possible to steer clear of - I know it's usually a must to have an opt-in of some sort on your site, but because pop-ups are so common and overdone they're just not effective ways of communicating messages/actions anymore. There are many other smarter ways to inspire action and pop-ups are no longer necessary. This is definitely an area where effective and creative web design come into play.

5. Do use cohesive imagery to tell a story, Don’t use just any image and forget to edit

Visual consistency is key and images easily make up most of the visual imagery on a website that aid in telling your brand's story, for this reason using any image simply won't do. Make sure all your photos are thoughtfully chosen and edited some way or another - to give a consistent and cohesive feel throughout the site. Just like on instagram the most compelling accounts are ones with visual consistency to them, usually utilizing the same photo treatment on all the images. Paying attention to these details is what makes your website look polished and put together.

6. Do remember retina, Don’t make images too large (or too small)

This may be an obvious one but there are still some sites out there with images that are clearly not at the right resolution and in turn the images looks blurry and pixelated - which is incredibly distracting, unprofessional and a major visual turnoff, so when at all possible make sure to use high res images. At the same time, high res images and retina also have to make to be optimized so they're not SO huge that it takes more than a second or two to load which can equally be a turnoff and steer away viewers.

7. Do get a custom domain, Don’t use free ones

This may be a given but if you have a website and want to look legit and for people to take you seriously you must use a custom domain - and I'll add something more, also use an email with that domain. Meaning don't use "candlesandaroma@gmail.com" instead make sure to use "info@candlesandaroma". You can set this up easily using gmail and trust me this small detail will impress and make your business look much more professional. There's many helpful resources (like this one) out there that tell you how to do this.  

8. Do choose accessibility over aesthetics, Don’t pick pretty but hard to read fonts.

Always make sure to have the viewers best interests in mind. Sure that thin light gray font looks so delicate and beautiful but if it's going to be hard for people to read, you never want to pick looks over customers. Always choose functionality and accessibility (a good practice of UX/UI) over aesthetics - when the two marry though, that's when beautiful and successful websites happen.

9. Do establish a consistent color palette, Don’t not use any color

Having a colorful website is by no means bad, but having too many colors in fonts, links, etc can create a chaotic look and disrupt flow - remember to think about your visitors experience. You want to make sure to you show off your brand and set a vibe but in a calculated and purposeful way so it not only look pretty but also serves to highlight certain CTA’s and important content. Headers, copy, overlays and buttons should only need to use a select few of your main brand colors - use supporting visuals, videos and photos to add most of the color. Even if you're going for a minimal and monotone look, using tiny accents of one or two other colors can add character to your site and enrich your brand (remember think details!).

10. Do know the purpose of your website, Don’t jump into design and skimp on the planning

Building a website is a lot like building a home. You wouldn't start just building walls without ever having a blueprint or even thinking about how big the house is going to be, how many bedrooms, etc - in this case a website is no different. There are many "phases" of a website project and one of the most crucial ones that takes place before the visuals are even considered is research and planning. You need to know how robust your site is going to be, what's the main purpose of your site, what content and how much are you doing to have on each page, what are your call to actions going to be, etc. This will also help you determine the user experience and flow so it's ultimately an enjoyable and beautiful  journey for them and they don’t feel lost. Notice how many sites have a consistent layout (upper nav, sticky nav, main links, sublinks, large homepage hero) this is because they are standards set in place that help the user navigate easily and comfortably through your site.

In the end you can vary it up a little and of course as with any rule there's some room for exceptions. There are also so much more good web design practices out there - but skilled web designers understand the fundamentals that set the foundation for a strong and successful website. Remember simplicity is key, think details details and did I say details?, be consistent and think about your visitors experience - when all these come together you got yourself a lovely home for your business on the web.

Branding, Illustration & more

Hello and welcome! QuaintLife is a design blog that celebrates all things that contribute to living a "Quaint Life". Postings particularly pay tribute to living simply, anything vintage, slightly offbeat, or understated beauty. Topics include art, spaces, music, yummies and all that may that contributes to the beauty of life. To view my professional work visit http://quaint-inc.com

Have a question & need
to get in touch?

Get free branding
advice & goodies

get access to exclusive tips and goodies to help beautify your brand the professional way.

First Name:
Last Name: 
EMAIL:

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form

Keep in touch:

Back to Blogs
Close X

I’m excited to hear from you!

Let’s get started

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form