Web Design Checklist: 55 Things Every Website Must Have

website design checklist

Over the years I’ve seen many website owners give up building an online business because their websites failed to meet their expectations. Perhaps they paid 1000s of dollars to get a a website designed but forgot to promote it because they thought the traffic would come automatically or thought the traffic methods they used would generate the desired results.

I decided to put together this document to so you can avoid the common mistakes entrepreneurs and small business owners make when designing and building their websites.

PREPARATION

1. Set Your Goals

Not setting goals is like trying to find your destination without a map or GPS. Write down the goals of your business on a piece of paper and display them in a place where you’ll constantly be reminded of them. They should consist of long term goals (ie make $5000/month so you can spend more time with your family) and short-term goals (ie monthly, weekly, daily). The purpose of short term goals is to achieve your long term ones.

Create a timeline for the planning, building and marketing of your site. Without doing this, procrastination may take over your goals. Decide how much money you want to spend to create your site and how much you will invest for its promotion.

Set a target date for what you want your site to achieve – you can always adjust it if you need to. Make a goal for how many visitors you will attract to your site.

What percentage of these will be actual sales?
When do you expect to make a profit?

Resources

Check out this video Web Design Checklist: Setting Goals

Website Goals
Website Goals – Part 2

2. Stay organized

Organization is an essential part of developing a successful business:

  • Create a daily work schedule for an organized approach to each day.
  • Use an email program that will filter your messages into specific folders.
  • Organize your computer folders and files for quick and easy access.
  • Create a “Frequently Asked Questions” page to lessen support requests.
  • Create templates for frequently used messages.
  • Create a page (that resides on your computer) that contains of a list of products and affiliate programs you’re promoting. Include your log-in information and hyperlinks for easy access.

3. Be passionate
about your niche

Even though it may be tempting to pursue a niche just for the money, you’ll probably loss interest over time because your heart is not in it. Passion will help you to overcome the hurdles you’ll encounter in your business.

Resources

How to Identify a Niche You’re Passionate About
How to Identify Your Passion
7 Tips On How To Be More Productive At Building Your Online Business

4. Spend money to make money

You must be willing to invest in your online business if you want it to be successful. This includes:

5. Register A Domain Name

choose a domain name

Register a domain name that is short and easy to remember. Avoid registering a long domain address or one that includes dashes or numbers because it will only cause confusion. Even though a .com extension is preferable, it probably won’t be available so you have to get creative by adding a word at the beginning or end or selecting a different extension (ie .net, .info, .biz, .co)

Resources

How to Choose A Domain Name That Best Represents Your Online Business
How to Register a Domain Name
How to Choose A Domain Name That Best Represents Your Online Business

DESIGN

6. Define your website’s purpose

Without a clear purpose for your site, you will not know where you are heading. For example, the purpose of my design site, is to help small business owners attain an online presence on the web to sell their products or services. Now, write down the statement of purpose for your web site. Go over it a few times to make sure it is crystal clear, otherwise your customers will try to figure it out for themselves.

Will you be designing an informational site in which you will be presenting information or an e-commerce site where you’ll be selling products. An informational site can be monetized by promoting affiliate products, sell your own products or sell advertising (ie banner ads, text links. An e-commerce site is essentially an online store for selling products online such as clothes, ebooks or services. Both types of sites can be effective, however your success ultimately depends on your website design and marketing strategies.

Resources

7 reasons why you should build a website
Mini Site or Content-based Web Site?
Home Page Design – 7 Crucial Elements of a Beautiful Design

7. Planning your website

Mindmapping – How to Sketch Out Your Site

mind mapping

This is the process that allows you to structure ideas on paper in the logical order your brain follows, rather than the linear process normally used when forming ideas. Take one sheet of paper, draw a circle in the middle – this is the subject of your homepage. From there, draw branches, which have more ideas about your topic. If any topics are related in a more definitive way, create another branch off the current idea branch. Within minutes, you will see your mindmap develop into a dynamic sketch. You might find that a standard sheet of paper is not enough to contain all your thoughts. Use more paper, create more branches, and keep the ideas flowing.

With a clear purpose, definite target market, targeted goals, a domain name and a clear structure, you are now ready to begin building the pages for your successful web site.

Resources

Wireframe Your Website to Build the Best Design
How to Correctly Structure Your Website for Search Engines and Visitors

8. Building your website

One of the fastest and easiest ways to build a content website is by using WordPress. This is content management software that allows you to easily build, market and maintain your site. The design is separate from the information which is stored in a database. This allows you to change the design without affecting the content and you can store an unlimited amount of information in the database.

Even though there are many free templates available to build your WordPress website I highly recommend selecting one of the professional templates from Studio Press. They contain clean code, are optimized for the search engines and have great support staff in their forums. They also can easily be customized to suit your specific business.

Resources

Free Template, Do-It-Yourself or Professional Web Designer?
Top 12 benefits of designing your website with WordPress
4 ways to come up with a beautiful design for your business website
Why Hire A Web Designer?
How To Find a Professional Web Designer In 7 Steps
Top 12 Questions To Ask A Web Designer Before Building Your Website
10 questions to ask yourself before designing a web site

9. Company Logo

Place your logo or brand where it’s easy to find. Usually this is located on the upper-left of the screen). Visitors expect to see it there. Also make sure it links back to your home page from every other page on your site.

10. Tagline defines
your site’s purpose

Your tagline should encapsulate what your site is about. Boil the description down to a few words so visitors will know immediately what to expect.

11. Contrast

Strike a good balance between graphics and text. Avoid using the same color for your background and text as it will be difficult or impossible to read. Good, old-fashioned black-on-white is still best most of the time. It is easy to have too much text on your site (unless it is a book or an article). Visitors usually scan web pages so make sure you use short sentences, small paragraphs and it contains small headings.

12. Color

Have you ever gone to a site where there is a dark background and dark text? You can hardly read it. Try to stick to a light background with dark colored text. For example, a white background with black text is still the easiest to read. Beware of using a dark textured background. The text will become unreadable. The color should not distract your reader from the main points of your site.

13. White Space

This is the space between the elements on a web page. If there is none or too little white space, your web page will appear disorganized. Try to make the page look clean, simple, easy to read and navigate.

14. Navigation

site architecture

The key to good navigation of your site, is for your visitor to find the information quickly and easily. It must be clear and simple. If the presentation and organization of the content is vague, the visitor will get lost, frustrated and move on to another site. Make sure the navigation labels are clear and concise.

The home page is usually the web page that contains all the initial navigation to your web site. However, planning your homepage is only a small fraction of your job when designing your navigation. The deeper you can plan your site’s structure and navigation, the more successful your site’s navigation will be.

Resources

How to Create an Effective Web Site Navigation Structure – Part 1
How to Create an Effective Web Site Navigation Structure – Part 2

15. Provide a clear path to company information

Many people will check out the “about page” to see who who is the author of the website. This helps build trust and confidence with your visitors so they can learn more about you and/or your company.

16. Include contact information

When I can’t find contact information on a site I conclude the author is trying to hide who he or she is and doesn’t want to be contacted. Site visitors want to how they can get in touch with you especially if you’re selling services . List your contact information as text (not in an image) so it will get picked up by search engines, including local searches.

17. Fonts

Writing for your web site is not the same as offline writing. The fonts used for print media are different than web fonts. This is because it’s harder to read text on a computer screen and visitors tend to scan your web pages rather than read them word for word. When deciding on what web font to use, take into consideration the character of your site and whether the web font type is widely available (accommodates different screens and operating systems).

Perhaps you want to use a fancy font for your headings. The problem is most computers only have a few fonts installed by default ie Times Roman, Arial, Verdana, Georgia. If you use a different font it may not appear correctly on your visitor’s computer. Stick with web safe fonts. Use images if you want to use alternative or fancy fonts.

Resources

How to Make Effective Use of Web Fonts
Improve Your Web Site Design with a Fancy Font

Whatfont
This smart WordPress add-on will tell you what font is used on a website or blog.

Whatfont – Chrome Version
Whatfont – Firefox Version

What WordPress Theme is that?
This website is cool. Just enter the URL of the WordPress blog and it will tell you what theme it uses.

http://whatwpthemeisthat.com/

18. Images

Only use graphics that are relevant to your site’s purpose, and aim for a file size that is 12 KB or smaller. If you must include an image that is larger than 12 KB, then use a thumbnail image. Including large or many graphics on your site hinders search engine spiders, since spiders’ primary food is content. Use images sparingly. Add relevant content that will attract both users and search engine spiders.

Use ALT tags for all your images. Not only do sight-impaired visitors use ALT tags, but search engines need them to understand your images.

Resources

How to Prepare Images for Your Web Site – Part 1
How to Prepare Images for Your Web Site – Part 2
How to Prepare Images for Your Web Site – Part 3
Where To Find Free Images Online For Your Website or Blog

19. Site Speed

Google has included site speed as one of its ranking factors. This means slow loading sites may be ranked lower in the search engines than fast loading ones. Check the loading time of your website by goggling “site speed checker.” This will list the websites where you can insert your URL and check the loading time.

Resources

5 Ways to Decrease Your Website Loading Time
How to Calculate and Speed-Up the Download Time of Your Web Site
W3 Total Cache plugin
This plugin increases server performance and reduces the download times by preventing your site from making hundreds of calls to the database.

20. Site Map

Creating a sitemap allows search engine spiders to index your whole website from one page. Make sure your site map page links to all your internal pages and update it whenever you add a new page. Sitemaps will also help visitors navigate your site because they can view all the pages from one source.

Resources

How to Add a Site Map to Your Word Press Blog

21. Redirect non www pages
to www pages.

301 redirect

Non www pages (ie http://domain.com, domain.com) should be redirected to www pages (ie http://www.domain.com). Search engines will view your site as having duplicate pages if this is not done.

Resources

How to Redirect a Web Page Using a 301 Redirect
How to Redirect a Website or Web Page and Preserve Your Rankings
301 Redirect for Multiple Domains
301 Redirect PHP – How to redirect a PHP page or website
301 vs 302 Redirect

22. Link all internal pages to home page using absolute URLs

Using absolute URLS in all your web pages will help create back links to your web site. Increasing the number of back links both from within your site and from other sites will help boost your search engine rankings. Search engines such as Goggle rank websites based on how many links are pointing to your site.

23. Validate all pages for correct html/xhtml/css

Correctly coded web pages have better chances of being spidered because they are following correct the web standards. Run all your web pages through an html validator. All web pages should include the doc type tag so they render properly.

Resources

7 Benefits of HTML Validation
The Importance of HTML / XHTML Validation
HTML validator

24. Check for broken links

link building

Search engine spiders will have a difficult time indexing all pages on your web site if it finds broken links. Web designers should check for broken links both during the design process and after the completion of the site. Run your web site through a link checker.

Resources

Broken Link Checker
How to Quickly Find Broken Links Within and Outside of Your Web Site

25. Limit use of tables

If your site consists of many tables or nested tables (tables within tables) it will slow the loading of your web page. Web designers should use the latest technologies such as xhtml and css for design. This removes a substantial amount of unnecessary code that may clutter your page if using tables. It also allows for proper positioning of elements on the page and easy site maintenance.

Only use tables for tabular data where you need to use rows and columns.

26. Limit use of flash

Flash web pages are not search engine friendly, require the macromedia flash plug-in to view the page and don’t allow the visitor to use the back button to return to the previous page. If you must use flash within your web site, offer an html page as an alternative so visitors with a dial-up modem can still access your site’s information.

27. Limit use of frames

Framed pages consist of a number of pages for each page. i.e. if you have a top frame and a bottom frame for your framed page you will need to create topframe.html and bottomframe.html pages. The framed page will not be search engine friendly because the content is on different pages and may not be compatible with all browsers.

iframes (a page framed within a page) are also not search engine friendly because your main page contains no content (the external page contains the content).

Framed pages may be used to frame external pages from another site. This ensures the visitor will not leave your main site because the navigation structure still remains visible to them.

Resources

How to Create an iFrame
How to Avoid the 12 Common Web Design Mistakes

28. Create Mobile friendly pages

iphone

These days your audience is accessing the Net from a variety of devices ie computers, tablets, mobile phones. In fact mobile devices will soon out number computers. If your website is not mobile friendly you’ll lose a large section of your audience resulting in lost sales. Before building your site make sure you select a theme that is mobile responsive.

Resources

Top 7 Reasons to Create a Mobile-Friendly Website
Top 7 Mobile Web Design Principles to Consider
Mobile Website Design: 5 Must-Have Features
Responsive Web Design: What Is It and What Are Its Benefits?
Mobile-Friendly Sites Convert Visitors Into Customers
Professional Responsive Design Themes
WP Touch Plugin – makes your WordPress site mobile friendly
Genesis Framework – Steps to Convert Your Old WordPress Theme To Genesis
Responsive Web Design vs Dedicated Mobile Website

29. Secure Your WordPress Site

lock

Recently I received a call from a client who had the front page of her wordpress blog hacked. Hidden in the source code was hundreds of links to spam sites. As a result of this Google removed her blog pages for 30 days. She was upset because she had not caused this and her blog pages had some top rankings that attracted a lot of traffic.

Obviously she did not have a secure WordPress website.

Resources

8 Steps To Protect Your WordPress Website From Hackers

30. Cross Browser Compatibility

Not all browsers are created equal. If your website looks good in Internet Explorer it may not render well in Firefox. You could be losing a lot of visitors to your web site if it doesn’t display correctly to your visitors. They will simply click away to your competitors. You need to check how your website appears on multiple browsers.

Resources

What browsers should you check your website for?

31. Robots txt file

robots.txt

The Robots Exclusion Protocol (robots.txt) is a text file that tells certain search engine spiders not to index certain pages or sections of your website. For instance you may not want search engines to spider your site while it’s under construction or want to prevent a directory from being indexed.

Resources

What is a robots txt file used for?

32. Custom 404 Error Page

When you’re surfing the net looking for information you sometimes misspell a website address or encounter a broken link on a website. This causes the 404 error web page to be displayed. When a person sees this they will immediately go elsewhere. If this is your particular website it means you’ll constantly be losing visitors.

How to Create a Custom 404 Error Page to Stop Losing Website Visitors

33. Website Analytics

website analytics

Using a website traffic analysis tool will help you to pinpoint errors in your site’s design, find what sites are linking to yours, and how Google is indexing your web pages. Correcting these website errors will ultimately improve your site’s performance by boosting your web traffic.

Resources

How To Monitor Your Website Traffic
Website Traffic Analysis Tool – Google Webmaster Tools

34. Backup your database

When a hacker takes down your site you’ll lose all the content stored in your database. This could be especially frustrating if you’ve invested years adding new content to your blog. Ask your web host if they make backups of your site on a regular basis. If not look for a web hosting provider that does.

Resources

Backup Buddy Plugin
This is one of the best backup plugins for WordPress. It enables you to schedule WordPress backups (widgets, themes, files, plugins, database), quickly restore your site or easily transfer it to a different domain.

How to Backup mySQL Database With phpMyAdmin

35. Website Maintenance

maintenance

A website not frequently updated won’t attract new visitors on a continuous basis. If you want to get visitors to return you need to offer them new content. Search engines will also visit your web pages more often if new content is continually added to them.

Resources

Website Maintenance Schedule – Why, How, What, Who?
Website Maintenance Tips
How to Update Website Content

36. Redesign

Does your current website look unprofessional?
Do you want to increase your conversion rates?
How long has it been since you’ve redesigned your website?

Perhaps the website you designed several years ago enjoys high search engine rankings but lacks high conversion rates. If a person finds your website through the search engines but is not impressed by the design they will go elsewhere for their products and/or services.

Resources

Website Redesign Checklist – 16 Questions To Ask Before Redesigning Your Website/

WEB COPYWRITING

Have you ever visited a web page you couldn’t read?
Read a web page but couldn’t understand what it was trying to say?
Didn’t understand what the website was about?

Whenever I visit a website I want to know immediately it’s purpose and if it will answer my most pressing questions ie does it have the services I need, is it selling the product I’m looking for and what are the top benefits of the product or service that will motivate me to buy. If this is not stated plainly on the home page within a few seconds I am out of there looking for another web site that better serves my needs.

One of the most important factors of making it easy for visitors to read the information on your website is the layout of your content. If the elements on the page appear cluttered it makes the content difficult to read. Most website visitors don’t actually read every word. Instead they scan the headlines, sub headlines, view the images and click on navigation links to seek more information.

You only have a few seconds to make an impression otherwise they’ll immediately click away to your competitors’ sites.

The ultimate goal of your content is to motivate your readers to take action e.g. subscribe to your newsletter, buy your product or service.

Here are the steps to achieve this goal:

37. Unique Selling Position (USP)

If you selling in a competitive market you need to offer something unique that makes your business, product or service stand out from your competitors. This is defined as your Unique Selling Position or USP. Most website owners realize the importance of having a USP but have difficulty developing one for their own website. If you don’t differentiate yourself from 100 competitors selling the same product or service you may soon be out of business.

Resources

How to develop an effective Unique Selling Position (USP)

38. Benefits versus Features

One of the biggest mistakes website owners make is emphasizing features over benefits. When a visitor arrives at your website they are asking themselves “what’s in it for me?’ They want to know how your product or service will benefit them not all the great features you have.

Resources

Web Copywriting: Benefits versus Features

39. Grab visitors attention with a bold headline

This is the first thing they will read so make sure it states your biggest benefit and peaks their curiosity. Use Arial, Georgia or Tahoma fonts. Avoid using images because they won’t get indexed by the search engines. Stick to text that includes your main keyword.

40. Use sub headlines to keep visitors’ eyeballs glued to the page

Instead of placing all your ideas in one paragraph, create a sub headline for each idea then write a paragraph for each one that expands upon the sub headline.

Article marketing strategy

Resources

How to Write Captivating Headlines That Demand Attention
Headline Copywriting Mistakes To Avoid

41. Use bullet points to break up paragraphs

When scanning a web page bullet points catch your eye so use them to break up your paragraphs. Use short sentences so the information can be read on one line.

42. White space provides breathing room for page elements

Liberal use of white space between all elements of your web page enables visitors to easily read the content. Cascading style sheets (CSS) makes it extremely easy to style your web pages. For example by adding 10 pixels of padding between your paragraphs they’ll be easier to read. By editing the CSS file you can add padding to the paragraphs on every page at the same time.

43. Create internal links to convey more information

Instead of trying to cram all your information on one page, write an introductory paragraph that links to another page (internal page) using anchor text (hyperlinked text) so the visitor can read the rest of the content.

44. Use images to enhance
your content

Avoid using images just because you want to show a pretty picture. Images should be used to illustrate or enhance the point you want to make so make sure they relate to your content.

45. Use contrasting colors to
make your content readable

Black text on a white background it still the best colors to use for website copy. Avoid using dark text on a dark background or light text on a light background…it’s hard to read. Instead use contrasting colors such as light text colors on a dark background ie white text on a black background.

46. Select a readable font size to appeal to your audience

If you use small font you’ll lose a large number of visitors. Don’t assume all your website visitors can read your content. Many have poor eyesight, while others don’t know how to adjust their computer screen display settings to increase font size.

For headlines use large font (ie 20-30 pixels) and/or a contrasting color. For your main content use a font size of at least 12 pixels.

47. Use web safe fonts

Perhaps you want to use a fancy font for your headings. The problem is most computers only have a few fonts installed by default ie Times Roman, Arial, Verdana, Georgia. If you use a different font it may not appear correctly on your visitor’s computer. Stick with web safe fonts. Use images if you want to use alternative or fancy fonts.

48. Proofread your content

Spelling and grammar mistakes will turn off website visitors. Before uploading your new web page make sure you run the content through an online spell checker then get someone else to check for grammar and spelling errors.

49. Ask for web page reviews

It’s easy to lose your objectivity when you write and/or layout your own web copy. Ask your friends or relatives to review your web page. You can also visit online forums to ask for honest reviews.

Resources

5 Experts Review iSiteBuild.com and My 6 Big Takeaways
Website Evaluation – 16 point checklist

50. Create a clear call to action

So you’ve invested many hours creating great web copy. The whole purpose of your content is to get your visitor to take action. Create a natural transition from your main content to your call to action. e.g. “And now I’d like to invite you to download my free report.” If you’re selling a product create a nice “add to cart” graphic so it’s obvious what the visitor needs to do.

Resources

Web Copywriting Checklist: 16 tips for writing effective website copy

51. Build An Opt-in Email List

autoresponders

Building an opt-in email list and sending a newsletter on a regular basis is one of the best ways to build long term relationships with your customers. If your newsletter offers valuable information your subscribers will trust your product recommendations thus helping you generate sales.

Resources

7 types of forms and how to use them to build your list
Subscribers Magnet Review: A WordPress Plugin To Double Email Subscribers Without Getting Any Additional Traffic
YourMailingListProvider (YMLP) Review – Email Marketing Software

WEB HOSTING

So you’ve built your website and all the files are still on your computer. When you get your site online it can be viewed by anyone that has an Internet connection. To get your site online you need a web hosting service. Not all Web hosting companies are equal therefore you need to do some research up front to select a reliable one. To demystify what web hosting is all about here are 4 frequently asked questions (FAQ):

52. How do I choose a web host

The most significant features to look for in a web host include:

  • Sufficient disk space and bandwidth to host your website files
  • Fast, efficient and knowledgeable technical support
  • Ability to set up e-mail accounts
  • Ability to park domains
  • Ability to create subdomains
  • Fantastico for rapid installation of WordPress, Joomla and scripts
  • Website statistics
  • MySQL databases

Check how fast and efficient your potential Web hosting company is by sending them an e-mail or calling them. They should respond almost immediately or at least within 24 hours.

Resources

What Are the Advantages of Web Hosting
Web Hosting Options: Free, Shared, Dedicated or Reseller
What are the Steps to Host a Website
Top 7 Web Hosting Mistakes to Avoid
How to Choose a Hosting Company That’s Reliable

53. How much space and bandwidth do I need?

If you have a static site (no database) that contains 10 to 20 pages you won’t need much space and bandwidth unless you have large images or downloadable files (e.g. video, audio, PDF, flash). If you have all the files stored in one folder on your computer right click on the folder using your mouse. A properties box will pop up displaying the total file size of your folder. This is the least amount of disk space you’ll need however try to get a little more to allow space for e-mail accounts, site statistics, scripts and log files.

If you need to host a website using WordPress or Joomla you’ll need to install a MySQL database. Make sure your Web hosting plan includes MySQL databases. A database driven website usually needs more space and bandwidth than a static site. For a WordPress website 50 MB of disk space and 5 GB of bandwidth will be sufficient and also allow for growth.

Resources

What is bandwidth, Why is it important, How much do I need?

54. How do I manage
my hosting plan?

If you purchased a hosting plan that uses a Linux server you will get a control panel called Cpanel. Cpanel enables you to set up and manage e-mail accounts, install scripts, shopping carts, website building software and view your site statistics. It will also allow file transfer from your computer to the server however I recommend using FTP software for this task instead (e.g. SmartFTP). It will transfer files much more easily and quickly than the file manager in Cpanel.

Resources

What is Hosting Space | How Much Do I Need | How To Choose a Host

55. How do I upload
my site online?

Once you’ve purchased a web hosting plan you’ll need to upload your files to the server to get them online. Instead of using Cpanel download free FTP software such as Filezilla or SmartFTP. Enter the hostname (yourdomain.com), username and password, then click “Go” to connect to the server. A local browser window will open to display the files on your computer. A second window (remote window) will open next to the local browser window to display the files on the server. You should see an empty public.html folder on the server.

To transfer the files from your computer to the server simply drag the files from the local browser window to the remote window (public.html folder). Once this has been completed enter your website address in the browser to view your new website online.

Resources

How to Use Cpanel: Top 7 Ways to Use a Web Host Control Panel
How to Transfer a Domain Name to Another Web Host
The Best Damn Web Marketing Checklist, Period

And now I’d like to invite you to
SUBSCRIBE to my FREE E-COURSE
21 Highly Effective Ways To Generate
Free Traffic To Your Website

Speak Your Mind

*