Web Design Review Checklist: What Is Good Design?

So, you have built a website. For whatever reasons, and with whichever instruments. Congratulations! Before launching it to the vast worldwide digital space, however, you might want to stop and check if everything is in order in terms of elements of good design.

Many think that design is a matter of taste, and that is why you are free to color your website as you see fit. But in truth, it’s never about beauty or aesthetics. A good design website has to fulfill your business objective, and make sure that people you are expecting to visit will not be turned away.

This publication is the result of our web design team’s brainstorm in an effort to draw up the one and only, complete and comprehensive website design review checklist. So, grab a coffee, open your website, and see if all your gimmicks are in the right places!

For your convenience, we have divided our web design checklist into 7 sections, and illustrated each one with what we consider good design examples of those particular categories. Put down one point for each item you have checked, and at the end of this article, round up your score to see how good your website design actually is!

Ready? Here we go!

Section #1. The Main Page

Your main page is the cover and title of your website – and just like books, websites, too, are judged by their cover and title. Today’s Internet users browse too many websites to devote any special attention to each one, so be advised that if yours does not make the right impression from the start – it will most definitely be left behind. Here are the most crucial criteria, which your main page must conform to:

Right message. The visitor is able to identify what your site is about in five seconds or less.
Clear next step. The visitor must see exactly where to go from the main page.
Good hero visual. The main page has a central visual, either image, animation or video, that drives the visitor’s focus.
Prompting call to action. At least one, but if your website pursues multiple types of actions, place as many calls as there are possible actions.
Invoke the emotion. Enter your website as if you’ve done it for the first time. Does it make the impression you want your visitor to experience?

Section #2. Structure & Navigation

Websites with good design are organized in such a way that every visitor gets to their goal as easily as possible. When you are launching your site, you surely know what your visitor’s objectives would be: write a post, subscribe, buy, sell, find certain info etc. Structure and navigation of the website represent the level of accessibility of its purpose to the user. Evaluate your website design critically. Here are some tips to check if all is well in this regard:

Simple road map. Your main menu should wrap up all your content into several distinctive categories. Good websites have not more than 5-6 top-level categories, and some studies suggest that an average person is only capable of keeping 4 subjects in the short-term memory. So, the fewer the better would be the general rule of thumb here.
Just a few levels, please. No one likes to open a folder with ten subfolders only to find out that each one contains a hundred more. Do not make your navigation too deep. If you have a lot of categories that cannot be easily merged, consider using an extended drop-down menu, as shown in the picture above.
Display the current position. Show your users exactly where they are on your website, and how they got there. Breadcrumbs are a good way to implement this.
Consistency of pages. Keep the header, footer and logo at the same spot on all your pages. You can only make an exception for your main page if you want it to act as a cover.
Let my people search. No matter how simple and obvious your navigation is, some users just like to type in what they want to find on your website. Give them that possibility with an integrated Search box.

Section #3. User Experience

There is a saying, popular with User Experience specialists, “Good design is as little design as possible”. UX rules and patterns are pure science that comes from years of research, and allows little to none creativity. These good web design principles have been tested on billions of users throughout the history of web design. To find out if they are properly implemented on your website, check the following:

Distinguish between buttons and links. Buttons on your website represent actions. When your visitors see a button, they must get a clear idea of what action they would take by clicking it. Links, on the other hand, presume to take the user to the certain portion of content. The ideal link hints on what’s behind it. Websites where these two are confused end up with visitors who are confused as well.
Organize forms. Most modern websites presume user registration or subscription features, and we’d bet yours does, too. The means for your visitor to enter their data are called forms. Forms consist of fields, boxes, buttons, and drop-downs, which have to be arranged in the correct way. Here is a good guide on do’s and dont’s of forms management. Compare the known practices to your way of forms implementation!
Use check and radio boxes properly. These two elements are frequently confused, much to the users’ regret. A check box presumes a yes-or-no option. If it is checked, it’s a yes. If not, it’s a no. And there is no middle ground. A radio box provides the choice among options, and usually, more than two. Know when to use both elements, and never put the equality sign between them.
Repeat your primary action, instead of using it just once. When you want your visitor to accomplish something on your website, do not leave them with only one way to do it. Place a button on the bottom, and a quick link on the side. A good idea is to make the primary action accessible from multiple pages.

Section #4. Visual Content

Visuals are what grabs the visitor’s attention and makes them want to stay and explore your website further. Lack or poor choice of visuals will bore the user, even if your site is nothing more than a yellow pages directory. But with the right selection of images, animations, icons and video content, you can rest assured that your site will sparkle with colors and enable a vivid experience. Consider these principles when filling your site with such content:

No cheap-looking images. Every picture has to generate additional value to the material it illustrates. Look at yours and see if they do. The best advice is to use your own images, or the ones made specifically for this project. If that is not an option, consider using free photo stocks like Unsplash and Pixabay.
Optimized image size. Of course, the higher the photo’s resolution is, the better, but only to a certain extent. No one will like waiting for large, 10+ Mb pictures to load. Make sure your photos do not slow down your website.
Logo aligned in the top left. Centered logos or other alternative placement solutions for them may look interesting, but will most likely confuse the user. Here is a study which explains why this would happen.
No Flash aminations. The Flash technology is going out-of-date, and has no native support in most modern browsers. If visitors see that they have to install some plugin to view your website, they will most likely just close it and go elsewhere.
Unified icon style. Make sure all your icons and cliparts look like they belong to a single set. The ones that have too little in common will make your website look like meat and fish in the same dish. A good idea would also be to rework the default social share buttons, and make them fit your general style.
All videos are click-to-play. The only exception may be the clip that’s running in the background. This is pretty self-explanatory - no one wants video buffering to cut down their bandwidth, and their speakers to come alive all of a sudden.

Section #5. Textual Content

We do not touch upon copywriting and marketing features of your site’s text, because it does not directly affect the design. Instead, let us focus on how your text actually looks like. Bad typography can kill the brightest visual artworks, and in order not to let that happen with your website, make sure you follow these simple good design principles:

Use three levels of headers. Headers help structurize your text and focus visitor’s attention on what’s important. Studies agree that three levels are generally the happy medium for most websites.
Not more than two font families, and the same ones for titles and body text throughout your website. Again, consistency is the rule of thumb.
Font size at least 14 pt. Your website will be read by people, not robots, and people like to see the letters clearly.
In-text links are clearly identified. Either by color, highlighting or underlining, but, in any case, a reader must perceive them as such.
A show-hide feature for long text. Do not overburden your visitors with the long scroll. Implement the “show more” and “show less” options where applicable. Here is an extremely long article explaining why you won’t be able to read it till the end.

Section #6. Responsiveness

A good website talks to its visitors. And we don’t only mean verbal messages. The elements of your site’s interface must interact with the user’s actions, be it moving the mouse, scrolling up or down or simply watching some content unfold before their eyes. If you want your visitors to treat your website as a living thing, consider implementing one or two of the following:

Responsive mouse-overs. Modern websites highlight the important elements on mouse-over. It might be buttons, menu sections, the logo or page transition links. Make sure that your website is not seen as a static picture, and actually responds to the user’s gestures.
Responsive scrolling. The scrolling wheel is the third mouse button and has to have bound functions just like the other two. Make your graphic elements move on scroll, or images fade on scroll, or screens change on scroll. In other words, do not limit the functionality of the scrolling wheel to just… scrolling!
Pertinent pop-ups. Let’s face it: pop-up windows are annoying. However, some sites just can’t do without them. If this is your case, make your pop-ups appear unobtrusively, and only when the user expects them to. The sites that shade their content with aggressive pop-ups tend to be closed instantly.
Smart active corners. If you are in the trend, and made your menu roll out from the side or corner of the screen, make sure it only does so when the user wants it to. No sliding element should interfere with clicking on links and buttons that are close to the active corner.
Hints for interactive content. If you have an animation or mini-game that is responsive to the user’s actions, leave a hint. A simple “hold & drag” or “click to spin” message will drive your visitor’s response, which, in turn, will increase the time they spend on your website.

Section #7. Adaptability

When you created your website, you were probably using a panoramic, high-resolution monitor, backed up by a powerful GPU. While it all may look nice and pretty on it, keep in mind that the site may - and will be - viewed from a variety of devices, with various screen resolutions and RAM limitations. Failing to deliver the same experience for all of them will not add up to your visitor’s trust. Here are the most basic things to keep in mind in this regard:

Adaptive to at least 3 screen resolutions: Mobile, Tablet, and Desktop. An ideal website looks like app on mobiles, lite-version on tablets and full version on desktops. Take into account different screen resolutions, on which your visitors will browse your website. If you can’t afford having several versions of the site, at least make sure that it is not overloaded with visuals, and the font size stays readable on all screens.
Fast loading on all devices. This flows out directly from the previous point. Visitors want the site to load quickly, or else they will switch to the alternative in the nick of time. You don’t want them to abandon your website because of this, do you?
No finger scrolling obstacles. When scrolling on mobiles and tablets, people use fingers, and they don’t like when the scrolling action ends up with clicking on a button or link. Make sure there is enough center space for the user not to hit any clickables by mistake while scrolling.
Test the scaling. People with poor eyesight also browse websites, and when they enter yours, they shouldn’t leave just because your site behaves strangely under browser scaling. Make sure your columns do not intersect, and your screens change in their normal manner.

All right, by this point, you should have all items on your list checked. We really hope that you found our web design best practices checklist useful. Now let us sum up your points, and see if your design really matches your visitor’s expectations!

1 - 9 points

Your website clearly has problems, and you might want to sit down and address them. Such a raw site will probably not drive a lot of visitors.

10 - 15 points

You have a decent website that may be capable of operating for some time. However, be advised that it will most likely run out-of-date pretty fast. Maybe it’s a good idea to invest into some more fine tuning?

16 - 20 points

Good design is good business, and you’ve got a website, which will serve its purpose flawlessly. Good luck with attracting visitors, followers, and clients!

21+ points

Wow! Your website is so cool you might want to submit it for a good design award! Apply at Awwwards, FWA or CSSDA and see if your site can win the prize!

More posts on web design inspiration: