Website Best Practices

Quick Tips for Creating Effective Websites and Web Pages in 2022

If your website isn’t performing the way it should, you may need to reevaluate your web practices. Is your layout user-friendly? Do pages load slowly? Are your call to actions clear and concise? It’s important to make it as easy as possible for your users to get the information they need. Improve your website’s performance, usability, and accessibility by keeping design, content, user experience, and optimization in mind.

Design

Websites with bad design immediately put digital efforts in jeopardy. Users can lose trust in your brand and be less likely to interact with your content. Follow these simple tips to get started on the right foot.

• Think mobile-first: Mobile devices are often treated as an afterthought since most people work on laptops and desktops. But the reality of the digital world is that there is a 50/50 split between desktop and mobile users right now. And depending on the content of your website, your mobile traffic could be even higher. Adopt a philosophy of progressive enhancement rather than graceful degradation.
• Less is more: Web design should follow the “less is more” rule. The fewer font families, font styles, and animations—the faster your site will be. It’s important to weigh the pros and cons of adding more elements and functions to a page against performance.
• Break up content with visuals: Breaking up content with visual elements makes content more interesting, enticing, and easier to digest. This makes it more likely that your users will actually interact with your content. Here’s a great example of this practice.
• Utilize text formatting: Consider how you can break up content and lay it out to give more prominence to certain elements. Maybe the text is highlighted with a background color, the text has a vertical line next to it to annotate a pull quote, one paragraph has a background color and the next doesn’t, etc. Anything helps to try to keep the user engaged on the page—large chunks of plain body copy won’t do that.
• Stick to web brand standards: Brands often have a different set of web fonts than print fonts. If they don’t, search Google Fonts and provide a comparable recommendation. Any item being used for the web also needs to be saved using the correct HEX color (or RGB build) and web settings.
• Ditch sliders and carousels: These types of modules are always rotating, so they actually reduce the chances of people seeing important content. Very few users sit and watch a rotating slider. They also tend to slow down page speed and, in general, should be avoided.
• Ignore runts, widows, and orphans: Don’t get too hung up on how text is flowing when you view a web page. Text will shift based on browser size and device—it’s not worth the effort to chase down one word for one browser size. Avoid adding soft returns to text to try to force content to reflow—this very rarely works out well on all device sizes.

Content

What you put on a page is just as important as how it’s designed. Some of this will sound familiar, as many content-related best practices overlap with design and SEO best practices.

• Write effective headers: There’s an art to writing headers that are meaningful to both humans and search engine crawlers. Follow these tips:
  • Limit yourself to one H1 per page
  • All the content that follows the H1 should be organized and have a styled hierarchy as you scroll down the page (H1, H2, H3, etc.)
  • Use keywords and avoid common headers like “About Us” Or “Contact Us”
  • Stick to 20-70 characters
• Make call to actions (CTAs) concise and actionable: CTAs should always be clear and descriptive of what action should be taken and/or what the user is going to achieve by clicking. For example, a button should say “Download Parent Guidebook” or “Get Your Guidebook” NOT just “Parent Guidebook”. Some other best practices are:
  • A site’s primary CTA should be able to be spotted in less than three seconds (here’s a great example)
  • Keep CTAs to four words or less
  • Use consistent language—no need to rephrase the same CTA. The goal is to deliver familiarity by reinforcing the same action repeatedly
  • Create urgency— i.e. “Buy Now” or “Donate Today“
  • Use words like “limited” or “last chance” and “reserve your spot”
• Utilize text formatting: Use headers, shorter chunks of text, pull quotes, and formatting to make content easy to skim. The easier your page is to digest at a glance, the more likely it is that your users will read it.
• Watch your word count: Web pages need to include the right amount of text—not too much, not too little. A low word count will hurt your SEO, but a high word count will overwhelm your users. The sweet spot is typically around 600-700 words.
• Be consistent with language: Consistency is key. Document standards such as whether you use “and” vs. an ampersand (&), or write in first person vs. third person (ex: “your account” vs. “my details”), etc.
• Eliminate outdated language: “Click here” is an antiquated phrase that should be avoided completely. This puts too much emphasis on mouse mechanics; you don’t click with a phone or assistive devices. It also conceals the purpose of the click, and you lose opportunity for keywords—what is “here”?
• Look for cross-linking and other UX/SEO improvements: We’ll get into this more in the optimization section, but you should almost always be looking for opportunities to link text to other pages on the website (and external websites).
• Don’t forget about microcopy: The term microcopy refers to the tiny tidbits of copy found on websites, applications, and products. These short sentences tell a user what to do, address user concerns, provide context to a situation, and help tell the greater story about your brand, product, and the way you do business.

User Experience

Make your website easy to use. If you don’t keep user experience in mind, your users won’t spend much time on your website. These tips can help:

• Simplify your menu: Your navigation menu should have no more than five to seven parent items. The fewer options, the better. Otherwise, people will find it too hard to navigate.
  • Here’s a good example of this concept in action.
• Don’t make your users search for default information: Include helpful, recognizable pages (such as “About Us”, “Contact”, “Privacy Policy”, etc.).
• Style elements in recognizable ways: Make text links in your body copy underlined and blue. Put thought into the intuitive use of color (green = good, red = error).
• Remember device nuances: Hover states don’t appear on mobile, so ensure that you are following the theory of progressive enhancement and serving any essential information properly on mobile.
• Avoid limiting your viewport: Fixed headers and footers don’t benefit mobile users. Eliminate these and instead use auto-scroll options like a “back to top” button.

Optimization

Optimization will help both you and your users, improving your website’s efficiency, security, and usability.

• The faster the page speed, the better: 25% of people abandon websites that take more than four seconds to load, and Google punishes poorly optimized websites by pushing them lower on search engine result pages. Page speed is affected by your hosting plan, server size and location, traffic to your site, etc. But design also affects page speed, as we touched on earlier. Images, videos, font families, font weights, animations, etc. can slow down your page.
• Forms > Email addresses: Including plain text email addresses can leave inboxes and mail servers vulnerable to attack. It’s always a best practice to send people to forms on your website instead of emails. If an email must be included, then make sure that it’s encoded properly.
• Security: All websites need security certificates (also known as SSLs)—this is the “s” in “https” in URLs. SSLs used to be less common and were only used on sites where there was a payment form. But now, this is a standard necessity. Google punishes any site that doesn’t have a valid SSL, and most importantly, it also leaves your website more vulnerable to malicious attacks. If you ever see a site without the lock icon—wave a red flag.
• Follow general SEO best practices
  • Cross-link to internal pages—ideally two to four times per page
  • Include outbound links to reliable domains—these should always open in a new tab!
  • Try to post content and make connections that promote backlinking (other quality websites linking back to your site)
  • Optimize content for keywords (words and phrases you want to rank for)
  • Use headers (H1-H6) with meaningful content
  • Always include meta descriptions, titles, and keywords for any web page
  • Always include alt text on any image
  • Utilize structured data such as schema.org
  • Don’t forget about microcopy!

Final Thoughts

By following these practices, you can help your website perform like it’s intended to—successfully. And your users will thank you for it!

If you still need help, don’t worry. Our team of web developers can help you with every step of the website building process.