Lesson 5: User Experience

Like the layout of a store, a website needs to deliver a positive user experience, or the visitor will never return. Here we’ll cover some of the secrets of creating a stellar user experience that will have your target audience coming back time and time again.


User Experience (continued)

Design for speed and mobility

Internet is faster than ever, but don’t let that cloud your judgment when it comes to optimizing your website. Everyone doesn’t have the latest and greatest devices, and there are still large pockets of the U.S. where the Internet is maddeningly slow.

How quickly your site loads can significantly impact a user’s experience and test their patience. Long load times also affect your search engine rankings. There are several ways to design a site for speed. A few of the easiest and most effective methods include reducing the number of plugins you’re using, compressing photos to a smaller size so they take less time to load, and using a limited number of redirects (a link that sends a visitor from an old page to a newer one). A web speed tester can help you see the predicted load times for a specific location or country.

Pro Tip: All photos on the web are sized at 72 dots per inch, or dpi, as it is known. If you are working with photo editing software, always ensure the image is down-sampled to 72 dpi. Also, try to make the photo’s final measurements match the size it is supposed to be on the page. Otherwise, your load times will lag as a photo that’s 8×10 is trying to resize itself to 3×5 on the page.

Basic sizes to work with:

      • A full-width image is 1080 pixels
      • ¾ across a page, 795 pixels
      • Across half a page, 510 pixels
      • ¼ of a page, 225 pixels

Remember that many people are mobile these days, so it’s crucial that your site works correctly on a smartphone or tablet. WordPress and other CMS products will do this automatically, including resizing photos to match the device it is loading on. Themes like Divi allow you to toggle features and content on and off for specific devices, allowing you, for instance, to post a wide photo on a PC and a vertical photo on a tablet or phone.

Make it accessible

As you design your website, think about accessibility. Certain design decisions are roadblocks to finding new customers, especially those who speak a language that is not English or have visual, auditory or motor challenges, such as dyslexia, poor vision, color blindness, paralysis or other issues that will make your site hard, if not impossible to use.

Many plug-ins are available to improve the site’s use by those with these types of challenges, either by translating your content into different languages or bypassing some of your site’s built-in features by adding a layer of interactivity that addresses some of the challenges mentioned above.

Nothing beats having a site translated by someone who understands, writes and speaks the language. But many of these plug-ins do a sufficient job of translating on the fly. Native translation services can get very expensive. If you update your site a lot, a plug-in is really the only way to go since you only have to update the English version. If you have multiple languages of your site natively translated into five languages, you will need to change the information on five separate pages.

If you have the funds, a service like UserWay can do many things simultaneously. It can translate your site into dozens of languages dynamically and compensate for the challenges users face, such as activating your tab key to serve as a mouse, making type bigger, increasing the contrast of the site, or even using a speech modulator to read the page out loud in the language of the user’s choice.

We use it on this site. Feel free to try it out by clicking on the red circle with the person in it in the lower right of any page. It costs a small business less than $500/year.

Don’t set it, then forget it

A website needs love. You can’t build it and then leave it to do the work for you. Like any advertising or marketing material, it needs to be refreshed and updated regularly. You will also want to redesign it every few years to keep visitors interested. With themes, this is relatively easy. You can change colors and fonts, add and delete pages, change the navigation for the entire site and change the look of just about anything with just a few clicks on a rainy weekend. Compared to the old days when each page had to be coded manually, modern web tools are nothing short of a miracle.


Web Academy

Main Office


Academy Staff