86 Web design tips for non designers

Why web design tips for non designers?

For a variety of reasons, websites need to be continually changed and updated. It would be great if it were easy and affordable to find a web designer for these ongoing tasks, but it is not.

What often happens – at least what we’ve seen in our experience, is either the work doesn’t get done, or the site owner ends up doing it.

New sites often launch with a clean and professional appearance, but in short order the absence of a web designer becomes apparent.

The subtleties of solid web design begin to erode, and the site becomes more chaotic and less effective.

For this reason, we have developed 86 web design tips for non designers to guide in these decisions, and perhaps to signal when its time to get help.

Our tips are not hard and fast rules. Web design is, after all, art not science, and with some exceptions, there is no right or wrong way to get the job done.

86 Web Design Tips

1. Remember that a website is the sum of its elements. If the elements are not clean and sharp, neither will the site.

2. Don’t be afraid to be different. Most websites are boring and redundant. Fresh web design can be very engaging.

3. Be innovative within the acceptable parameters of your industry.

4. Web design is generally easier when working with a small page size and small elements. If you are having difficulty making a layout work, try using smaller, more closely defined elements.

5. A simple home page is more often than not a good home page.

6. Avoid using a slider on the home page – it slows things down, and multiple images can be confusing for first time visitors. There are exceptions of course (magazine, news and e-Commerce formats).

7. If the home page effectively delivers one simple message – it works.

8. If the home page does not deliver at least one message, it fails – no matter how strong the overall design.

9. The more messages you have on the home page, the more likely the design will be chaotic and the page less likely to be read.

10. Never attempt to design ‘live’. Create a sub domain as a test site, and make design changes there.

11. Good web design requires that you use strong images with adequate resolution.

12. An average website can look amazing when the design includes great images – and the other way around as well.

13. Limit your use of stock images, and try to avoid using them all together on the home page.

14. When you use stock images make sure the colors are vibrant and the backgrounds not washed out.

15. Make sure the basic colors in the images harmonize with one another.

16. Unsharp masking takes a second in a free image program and can enhance the look of the images, but be sure not to overdo it.

17. Sign up for a ‘free week of images’ from one of the stock image websites.

Tumblr home page is great example of clean and simple design

Tumblr home page is great example of clean and simple design

18. Writing strong headlines is important and a key part of effective web design – especially for the home page.

19. If you can’t express your message in a brief headline, don’t expect anyone to understand it.

20. Creating the right headline can be very time consuming – but ultimately, well worth it.

21. Ask yourself probing questions like: is there a compelling reason for a visitor to click though the home page?

22. If not, take a close look at the headline. Make sure it gets the attention of the reader.

23. If your business has a unique message, selling proposition- or anything like it – make sure it the first thing visitors see.

24. If you don’t have a unique message or selling proposition – try to figure one out. If you can’t, get some help.

25. Ask a business associate if he/she can tell within a few seconds what the basic message of your website is. If they are unable to do so, or if they describe a message different than the one you intended – its time to go back to basics.

26. If at all possible, give visitors an incentive to act by including an offer on the home page. If there is no room on the home page, include a button with a link to a page containing the offer.

27. Make sure the offer contains a clearly expressed ‘call to action’, and repeat the call to action numerous times in the text.

simple elegant use of color Minimal-Monkey

simple elegant use of color Minimal-Monkey

28. Make equally sure the offer is meaningful and relevant to what you sell.

29. Try as hard as you can to come up with an offer that is something other than a free ebook. Again, the more relevant to your business, the better.

30. Ask a likely buyer of your product or service if they believe your offer is likely to generate an action. If not, keep experimenting until you find one that is.

31. Consider testing the potential of your various offers via email to selected customers before incorporating in your website.

32. Color is a key element in web design, and once again, simplicity rules.

33. Generally, don’t use more than a couple of colors.

34. Find a pleasing color palate to serve as a guide. Adobe’s color wheel is a terrific free tool. It takes a few minutes to learn, but worth the time.

35. Avoid asking family members for their opinions regarding your website. You want to be sure any opinions you get are completely objective.

36. If you feel you need another opinion, try a web design forum, but realize that probably no one on the forum will actually say they like the site.

37. The importance of typography in web design cannot be overstated. If you find the subject difficult, consider taking a class to learn how to apply typographic techniques.

38. Great use of typography can make your site look great, and poor use will have a devastating affect.

Image and headline say it all

Image and headline say it all

39. The difference between the two is often very subtle.

40. Generally speaking, use only one font family for headlines unless there is very strong reason not to.

41. In every case, use one font for text, and make sure it is web safe to ensure the maximum compatibility between browsers.

42. Be ultra conservative about font selection. If you are having difficulty deciding what font to use, there are many good articles easily found online that can help you make the right selection.

43. Make sure there is ample space between the lines. Too little space makes it difficult to read.

44. Make sure headlines are kerned (reduced spaced between the letters). It may not seem that important, but it is.

45. Limit your use of bold and italic for headlines and body text.

46. Avoid more than occasional use of exclamations.

47. Avoid excessive ‘all caps’ in headlines (unless its part of your style guide), and never use all caps in the body text.

48. Icons are an effective way to draw attention to important content, and to provide a degree of visual relief.

49. When selecting icons, make sure they have some relevance to the content.

The power of the right words and image

The power of the right words and image

50. Generally, avoid animation when using icons.

51. Make sure the icons you use (like all elements) are good quality with plenty of resolution.

52. If you are struggling with conversion (getting visitors to do something), adjusting the layout is seldom, if ever, a solution.

53. Effective copy writing however, is a key to increasing conversions and engaging readers.

54. A good copy writer is worth his/her weight in gold. Spend the time necessary to find that person. Freelance job sites are a reasonable place to look.

55. While most good copy writers can adapt to many situations, employing someone with related experience to your industry is a huge help. If that person can provide a sample – all the better.

56. As with all things, avoid a copy writer who makes excessive claims and promises. If they do, ask for proof to support their claims.

57. Keep the parameters of the projects tight (create goals and time frames).

58. Make sure to establish a set fee for initial projects, and be certain to discuss if revisions will be charged (or not).

59. Include a ‘kill fee’ (ie a fixed percentage if you cancel after seeing the first proof). Copy writers are used to this, and should not object.

60. Remember that the most powerful marketing word in the English language is ‘free’.

61. Do not be reluctant to use it even if you are selling a high end product or service.

62. If you do give something away, be sure it is relevant to your message and what you sell – and preferably not an e-book.

64. Make sure your interior pages are clean and well organized, and establish a consistent format that will make new page additions easy and fast.

Apple home page. Clean and simple.

Apple home page. Clean and simple.

65. If you are making design changes, changing elements, etc.,and find that you are stuck – put it down for a day or so. A fresh perspective can often lead to a better solution.

66. If and when you make layout changes, be sure the page is still easily viewed on all mobile devices. Here is a tool to make sure the site is still mobile responsive. Google mobile test.

67. If your layouts are not super clean and easily readable for mobile – change them. In most situations, its easier to adjust the layout rather modifying the code. If you are having difficulties in this important area – get some help.

68. If your audience is largely on mobile and your site just does not adjust that well from the desktop to mobile devices, consider a separate version just for mobile devices. Mobile versions are a viewing option that can be ignored if the mobile viewer prefers to see the desktop version.

69. Mobile version development is not that expensive – and an often overlooked solution to a thorny web design issue.

70. If you bought a premium theme and are having problems with the theme customization, consider hiring a web designer. If not, you may end us spending a great deal of time and still not have a viable website. Theme customization is not typically very expensive.

71. When considering a purchase of a premium theme, stick with those that have large sales, and of course favorable user reviews. Spend a few minutes reading the reviews. Something of importance may pop out.

72. Before you buy a premium theme, make sure the theme developer offers support. In most cases, the support should be made available on a dedicated support website.

73. If you decide to get some help from a web designer, and you award the job, your first question should be: “are you going to make a back up”?

74. When considering a web designer have that person critique your site as part of their bid. This will reveal whether you have common – or conflicting ideas.

75. If you are having a technical problem and want help, know that web designers often overstate their technical understanding. Ask if that person is a developer as well as a designer.

76. Ask the designer if they are experienced working with sites they did not personally create.

77. Ask for their hourly rate, but be aware that a $75 hour designer may be a lot less expensive than one who charges half as much.

78. As a general rule,its best to work with some near you. The project will get done faster, and probably for less. If you decide to work with someone from another country, make sure everything is clearly spelled out.

79. If you choose to integrate a popup into your web design, be aware it can be a convenient excuse for a new visitor to make a very rapid exit.

80. If you do use a popup, make sure there is a good reason. For example: a sale, or special event of some kind.

81. Make sure the popup is pleasing and in harmony with the rest of the web design.

82. If you decide to sell something on your site, don’t just drop in a PayPal button. Adding a simple e-Commerce interface like Woo Commerce is not that difficult, and will make an enormous difference.

83. The basic rules about images apply even more so with e-Commerce. Make absolutely certain they are sharp.

84. Look carefully at your side bar. Is the material you included clean and readable? Does it add value, or is it merely filler?

85. Limit the use of sidebar promotional graphics to one.

86. For important interior content pages, consider eliminating the side bar and use a two, or three column format.

86. The side bar is a good spot for additional site navigation.

That concludes our 86 website tips for non-designers. Thank you for reading! We hope the tips help you keep your website on the road to success.

About the list

The list of web design tips was compiled by the team at Webfour from our years as web designers and developers. There was considerable discussion about how much detail to provide, but eventually we opted to keep the tips as brief as possible.

The difficult part of this project was gauging the experience level of potential readers. Since we really had no way of knowing, we tried to find a middle ground. Some of the tips are helpful to those with some background in web design, while others work for total beginners. Please let us know your thoughts!

SLIDE SHARE PRESENTATION

6 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *