Web design is an emerging profession compared to other forms of design, due to its progressing medium. As with any design discipline, there are aspects of the design process that are very unique, such as considering desktop and mobile screen resolutions, color usage, integration of negative spaces, and image optimization. Often there are more unique details that supersedes our sense of the bigger picture. We focus on the fact that it is designing for the web and set aside some core design concepts that could potentially make any project stronger without disturbing any technicalities behind.

Rules of Thumb

From my years of constant “trial and error,” I came up with some sort-of principles that could serve as your guide in designing for the web. These are universal rules that I think applies to every website out there.

usatoday sample

1. THE HOMEPAGE IS EVERYTHING

There are several terms used to identify the home page: start page, landing page, front page, index page, and main page, are the most common. Basically, the “home” should contain the most important and necessary information of your website. The home page highlights everything to present a clear definition of your purpose, objective, and mission. It should (at first glance) attract the visitor and provide answers to his questions in order for him to find what he is really looking for.

Sometimes I would like to think that a homepage is an online version of the newspaper where its front page is similar to the paper’s face.

2. PRIORITIZE SITE VISITORS

loading

Majority of the site visitors are not after the “over-all look” of the site – it is just secondary. The main goal of site visitors is to get information as quick as possible. Always consider your readers because they want quick answers and they have a fraction of a second to decide if they will stay in the site or not.

Prioritizing site visitors is the best way to shape your design. Consider page loading speed. If you have too much effects in the site, it will take an eon to finish loading, and your visitor already found another site for the information he needs. Consider accessibility and readability. You are not only designing for yourself, rather, you are designing for a multitude of people.

3. DESIGN ACCESSIBLE NAVIGATION

Website navigation are your visitors’ steering wheel. They will choose where to go: read your company statement, browse through your blog, check your portfolio – the freedom is theirs. The main goal is to give your visitors that freedom to steer wherever they want. Giving your visitors the opportunity to easily access the many pages of your site will most likely satisfy them with their curiosity.

navigation

On the other hand, if you hand them a website with no steering wheel at all, then that is stopping them from interacting. No navigation means no movement from one page to another. (Unless you are working on a one-page static website which only requires scrolling, then it’s perfectly ok.)

4. BUILD SOMETHING FAMILIAR

There is a study that was recently published which investigated on the role of visual complexity and prototypicality regarding first impression of websites* and the results yielded that users strongly prefer website designs that look both simple (low complexity) and familiar (high prototypicality).

It simply means that when you’re designing a website, you should consider both factors. Designs that contradict to what users typically expect of a website may hurt their first impression and all the more damage their expectations.

Chart_Overall

[att_highlight color=”yellow”]* The role of visual complexity and prototypicality regarding first impression of websites: Working towards understanding aesthetic judgments. [International Journal of Human-Computer Studies, vol. 70(11) (2012), pp. 794-811][/att_highlight]

5. DIRECT YOUR READERS

No one should feel lost when they navigate the site. Give your readers some good direction by letting them know what part of the site they are in, where should the go to next, and what other pages could they access to gain more information. Page titles should clearly be visible as well as the body text to help aid in their search.

kitkat design

A good navigation can serve its purpose but it does not hurt to add breadcrumbs, sitemaps, archive page, and links with arrows to guide them throughout the site.

6. MAKE SIMPLE HEADLINES

Just like in newspapers, headlines grab people’s attention before they could even read the content. Making simple headlines could help your readers go through your posts swiftly and read an article that best suits them. Headlines should be concise and relevant to its contents – the shorter the headline, the better. Long headlines with a very good kicker is also accepted as long as it is not a paragraph long.

medium headline

Let your readers decide if they will read your article or not. This is where headlines come in handy. A headline’s goal is to draw your reader’s attention to your articles. Whatever style it may be, make sure it jives.

7. PROVIDE INFORMATIVE PHRASES

Visitors who are more like me tend to scan the page first before reading. Sometimes I just scan the page, read the headings, subheadings, and I am done. Yes, there are some people who do things like that – especially those who read a lot of articles in a day. Informative phrases could help your visitors find their way through the different sections of the post or article.

phrases

Make use of punch lines, taglines, or block quotes to get their attention. Formatting your article also helps as long as it is not too fancy and too cluttered. Use also bullets, numbers, or whatever it is that (for you) could catch someone’s attention.

8. ATTACH REAL IMAGES

There are a lot of websites (especially commercial ones) that make use of stock images purchased at $3 from a famous royalty-free stock photo bank. It may seem great to look at images that are clean, sophisticated, and well-done, but displaying them and captioning that “they are our employees” would somehow imply that your business is a little bit fake. Sorry, no offense.

justin photo

Just remember to always put a face in your site because instinctively, people could relate to that and people will know that the person behind the website is real and not a robot. Studies have shown that visitors more likely trusts websites that have real images embedded.

9. USE APPROPRIATE GRAPHICS

Graphics make a website pop and as well as support the headlines through visuals. It also grabs your readers attention and enhance your site’s content. If creating a more visually appealing site is not enough, know that including images on your page improves your search engine optimization (SEO). Studies have shown that pages with photos and videos attract significantly more visitors than those that don’t.

appropriate graphics

Incorporating graphics to your site can be placed in your header, in the middle of the content, and in between texts which needs to breath. It also breaks the monotony of paragraphs.

10. SHOW CONTACT INFORMATION

What is the point of having a website without any contact information or any means of your visitors to contact you? What is the point of having a site that does not have links to other social networks which could serve as a medium for online marketing?

Dedicating a space for contact information, office location, and other relevant links are as equally important as having a good attention-seeking home page. Include your e-mail address, your mobile numbers, your social network links – anything that your visitors could check out and send some inputs, questions, or comments which you could then evaluate. This is where you get your feedback on your users’ end.

contact

Well, there you have it. Ten basic rules that should be observed when designing for the web. 🙂 If you are just starting out, these “rules of thumb” are pretty much useful when you work on your next project. Hope this helps!

Pin It on Pinterest

Share This