Create a consistent look and feel across your website

While there are many factors that go into developing an appealing website, there are some basic principles of web design and layout – like creating a consistent look and feel across your website – that the good ones tend to follow.  If you’re new to developing a website or you’re in the process of refreshing an old one, there are a few aspects to take into account.

Make the layout simple and straight forward

  • Select a domain name that fits your business’s name or offering so that it’s easy to remember.
  • Determine whether a single page or multi-page site is best. There are pros and cons to each design.1
  • The navigation should be intuitive; the links, messaging, features, and images should make sense no matter where your user enters the site.
  • Structure content on a website as if you’re creating an outline for a report.  Typically, site navigation uses a layout where top level pages display high level concepts and link to supporting webpages for more details.  As technology continues to evolve, encouraging new uses and creating new norms, however, you may decide to use a format where the messaging at the top of the webpage is high level or represents a general concept, but becomes much more detailed as one scrolls down the page.  Both types of layout are common and offer pros and cons to the user.  To determine which layout makes sense for your business, consider your target customer profile, devices they use to access your site, the type of content being presented, technology you plan to use, budget, and website goals and objectives being sought. If you keep important information “above the fold” or at the top of the webpage, visitors will not need to scroll or search for more information.  Some visitors may leave if they don’t see what they’re seeking so think through how your content is received and found.
  • Make sure contact information can be easily found on every page.
  • Design your website with users in mind.
    • Think about which devices your target customers are likely to use to access your site. Ensure your user interface renders content correctly and is flexible for viewing/participating in discussions along with e-commerce capabilities if applicable.
    • Use social media sharing capabilities that fit users’ needs and interests.
    • Make your website accessible to those with disabilities, especially if you market your offering to the US government.
    • Color tones should be easy to read and print.

When adding content…

  • Make sure link descriptions direct to relevant content and accurately describe the page or document to which you are linking or you’ll confuse and frustrate your site visitor.
  • Use correct grammar and spelling. Formatting of text, headers, and bullets, should be consistent across the website.  Errors will make your site look unprofessional.
  • Keep link descriptions short whenever possible and avoid using generic “click here” anchor text.
  • If you link to an Adobe® PDF or another file type, indicate the file type as part of the link description.
  • If you link to another website:
    • Open the webpage in a new window, so that you give them an easy option to return to your site.
    • Check the link policy of the website. While most websites want you to link to them to help their search engine rankings, some websites and organizations are particular about who links to their site and the context under which it’s conducted.
    • Consider adding a warning to the user that they will be leaving your website; this gives them the option of staying and warns them that the privacy and usage policies will likely be different.
  • Use fonts that are clear and easy to read. It’s preferred to use one that renders well across different platforms (Windows® Mac®, and Unix®) such as Ariel, Helvetica, Times New Roman, and Courier.  While there’s a tendency to use small fonts, keep in mind older users or people who read or write for their professions may prefer a larger font.
  • Use bullets, subtitles, tables, and call-out boxes to break up text, and use bold or different colored text to emphasize points you want to make. People scan web pages; they don’t read them.
  • “Post once. Link many.”  In general, do not post the same document to different places on the site.  It’s best to upload your document once and link to it from different pages.  If your document is later updated and needs to replace an earlier version, simply overwrite the earlier version once rather than replace it in multiple locations on your site.
  • Don’t forget SEO because you’ll want users to find your website and its images easily via search engines.

Create a user experience that rocks

  • Offer a ‘sticky’ factor such as a unique feature/offering, graphics/video, blog, or community to entice users to come back and visit your website.
  • Ensure adequate site performance to not turn away users. A slow website will increase your bounce rate and keep users from wanting to come back. To increase response time, minimize the number of components a page needs to download in order to render a webpage. Components like large images, style sheets, Flash, scripts, etc. can add to the time it takes to load a page.
  • Ensure users feel secure when visiting your site; offer Secure Socket Layer technology or obtain a security seal from a leading provider to encourage customers to keep coming back to your site. Post your privacy policy and follow it.
  • Be sure your call-to-action is clear and easy-to-find, especially if you’re an e-commerce site.  Click-through-rate (CTR) will be important for converting user interest into a sale.  Use A/B or multivariant testing on customer landing pages to improve conversion or CTR, and ultimately increase sales.  Keep in mind:  While multivariant testing may help improve sales, non-website related issues such as shipping charges, return policy, or product availability can also hinder web sales. Plus, there may be hidden costs associated with conducting A/B or multivariant tests that should be taken into account to ensure benefits outweigh costs.
  • Be sure your website renders correctly using different browsers since you don’t know which ones users will use to visit your website. As of January 22, 2020, the most common browsers were Google Chrome, Mozilla’s Firefox, and Microsoft Internet Explorer.4  Also, be sure to test your site on different devices – smart phone, tablet PCs, etc. – to fix issues that you can control.  The background will also help you understand, or anticipate, issues customers may notice or not like.  With the proliferation of computing devices and browser editions available, ensuring your website performs well on all platforms is a daunting task.  If you can address the leading browsers and platforms that your target customer profile uses, you’ll have the best chance of success.

Follow laws and tax policies

  • See Section 508 of the Rehabilitation Act of 1998 and the “ADA Update: A Primer for Small Businesses” to learn about serving an aging population and those with disabilities.  With other 50 million Americans with disabilities and an aging population projected to reach 71.5 million by 2030, why wouldn’t you want to target these groups? 2, 3
  • If you sell goods to buyers in other states via the internet, understand sales tax issues pertaining to that state and county.
  • If you collect any information from website visitors, you should have a privacy policy, and one that’s easy to find on your website.

Discover more…

  1. “About Copyright.”  Copyright Clearance Center. Accessed January 22, 2020. http://www.copyright.com/learn/about-copyright/.
  2. “Best Practices for Speeding Up Your Web Site.”  Yahoo! Inc. Accessed January 22, 2020.  http://developer.yahoo.com/performance/rules.html.
  3. “User Experience Basics.”  Usability.gov. Accessed July 30, 2019. http://www.usability.gov/what-and-why/user-experience.html.
  4. Biddle, Toby.  “User Testing for Web Accessibility.”  Six Revisions.  Last modified April 3, 2013. http://sixrevisions.com/usabilityaccessibility/user-testing-web-accessibility/#more-6817.
  5. Bustos, Linda. “5 Dangerous Conversion Optimization Myths.” Get Elastic Ecommerce Blog. July 16, 2013. http://www.getelastic.com/5-dangerous-conversion-optimization-myths/.
  6. Cao, Jerry, Kamil Zieba and Matt Ellis. “Why Content Reigns Supreme in UX Design.” Manueto Ventures, LLC. Accessed January 22, 2020. http://www.fastcodesign.com/3054090/why-content-reigns-supreme-in-ux-design?
  7. Hawkins, Sara. “Copyright Fair Use and How It Works for Online Images.”  Social Media Examiner.  Last modified November 23, 2011. https://www.socialmediaexaminer.com/copyright-fair-use-and-how-it-works-for-online-images/.
  8. DeMers, Jayson. “Local Search: Responsive Design & Mobile SEO Best Practices for 2013.”  Search Engine Journal.  Last modified February 11, 2013. http://www.searchenginejournal.com/responsive-design-mobile-seo-best-practices-for-2013/58158/.
  9. “Desktop Search Engine Market Share.”  NetApplications.com. Accessed January 22, 2020.  http://www.netmarketshare.com/search-engine-market-share.aspx?qprid=4&qpcustomd=0.
  10. Kyrnin, Jennifer.  “Top 10 Tips to a Great Web Page.”  About.com. Last modified January 15, 2018.  http://webdesign.about.com/od/webdesignbasics/tp/aa112497.htm.
  11. “Test a Website’s Performance.”  Webpagetest.org. Accessed January 22, 2020. http://www.webpagetest.org/.
  12. Thomas, Anthony. “Hidden costs of A/B Testing.”  Sticker Mule (blog). Last modified March 28, 2016. https://www.stickermule.com/blog/hidden-costs-of-AB-testing
  13. “Thomas, Giles. “55 A/B Testing Best Practices Every Marketer Should Know.” AquireConvert. Last modified February 8, 2016. http://acquireconvert.com/ab-testing-best-practices/.
  14. “Web Site Legal Issues.” Daniel A. Tysver (Beck & Tysver). Accessed January 22, 2020. http://www.bitlaw.com/internet/webpage.html.
Sources:
1 Karri Stover, “Single-Page Vs. Traditional Site Design: How Many Pages Does Your Website Need?” Business 2 Community, last modified June 5, 2014, http://www.business2community.com/online-marketing/single-page-vs-traditional-site-design-many-pages-website-need-0904998.
2 U.S. Department of Justice, Civil Rights Division Disability Rights Section. “ADA Update: A Primer for Small Business,” (Guide, Washington D.C., last modified March 2011),  http://www.ada.gov/regs2010/smallbusiness/smallbusprimer2010.pdf.
3 “ADA Update: A Primer for Small Business.”
4  “Browser Market Share,” NetApplications.com, accessed January 22, 2020, https://netmarketshare.com/.
Note: All other trademarks are the property of their respective owners.