How Does Your Website Perform?

poster of "ask more questions" when planning your website design elementsThis is a question that is often overlooked in website design. Many people focus heavily on the design elements to suit the look and feel of the website that they prefer. This can be a mistake if you do not factor in the performance elements of a website. What are performance elements? These are on page factors that influence the user of the site to take a certain action or interact with the page in a certain way. Where these elements are placed within the overall design can make or break the user experience of the site. These page characteristics are often overlooked because of the owner's preference to showcase certain products or services in a way that does not grab and engage the user. To really understand what is needed to strike a balance, there must be a conversation about the overall goal of the website. Many people know they need a website, but have less clarity on what the website should produce. 

In a recent article for css-tricks.com - https://css-tricks.com/right-time-think-web-performance/

The author - Robin Rendle discusses the importance of this conversation. The author says:

"So what sort of design topics impact performance? Well, any question that a designer might ask themselves. Like these:

  • How many fonts should we use?
  • What sort of imagery should we apply?
  • What kind of analytics scripts do we need?
  • How does a user scroll through our app?
  • How does this complex component affect our CSS?
  • How should we even write CSS?
  • What kind of frameworks should we choose?

More often than not, these questions will lead to more code, more complexity and more bloat in a design system since…

  • The more fonts we add the longer we ask our users to wait.
  • The type of imagery we choose for a project will impact what image formats we use.
  • If we pick a crazy number of analytics tools then that can slow the whole app down, too.
  • Adding a complex component in CSS, that will only be used once in the app, will lead to code bloat and it’ll further slow down the time to first render (if only marginally).
  • Deciding which framework we use will have an enormous impact on the critical path.

In short, design teams should measure their success against key web performance metrics because every decision they make will eventually lead to drastic changes in what gets sent down the pipe to the end user."

These types questions help focus the development of a great goal oriented website that will produce the desired results. Some more specific and common examples of performance producing elements are:

  • Contact Forms
  • Expandable Content Boxes (FAQ's)
  • Contact Information Placement
  • Video and Image Placement/Content
  • Popular Products
  • Related Products
  • Coupons and Special Offers

All of these elements allow the user to engage in different ways that can lead to or produce are result, in most cases the desired result is the purchase of a product, or a phone call to the business. 

On a great hubspot.com article - http://blog.hubspot.com/marketing/landing-page-examples-list#sm.00153pzag1ac8f3i1025nri5sudsi

The Author - Ginny MIneo Talks about many different conversion factors on many different websites, here is one that I really like. 

Image Credit
Partial image of unbouce's website landing page template

"2) Unbounce

It's no surprise Unbounce is near the top of this list -- they've actually written the book on creating high-converting landing pages. Although there are lots of amazing things about this landing page, the two that I absolutely love are: 1) The directional cue from the supporting images to the CTA button, and 2) the detailed -- but well packaged -- information below the form. 

The first helps direct attention to the goal of the page -- for you to fill out the form -- in a way that's unobtrusive. The second gives this page an SEO boost (search engines will have more content to crawl) and assuages any worry from folks who need to know more about a piece of content before handing over their information, all while not distracting people from the form. "

She has captured the essence of marking online. In my opinion, getting users to interact in a specific way involves drawing focus and narrowing the immediate decisions people can make on the page. This creates space in the users mind to understand and comprehend what they are seeing. It is easy to understand and they can immediately gauge their own interest in the content of the page. 

Here is another great source of information to help you answer these questions before you commit to an over design. 

If you have looked through all this information, and you still feel like you need some help, please feel free to reach out to us, we are happy to help you identify the goals of your website, as well as incorporate your ideal look and feel.