How to make your website a winner!

Usually, your homepage is the first thing someone sees when they land on your website. It is your first chance to draw your viewer in and sell your product or service. You have a matter of seconds to leave a lasting impression. Below are key sections that might be affecting your visitors’ experience of your website.

Give users an optimized experience with clear branded messages to help drive conversions.

‍

Performance

Right off the bat did your website load fast? If it took more than 2.0 seconds load, they’ve already left! Most users won’t wait for your website to load. 

Images: Compress images on the website so they are optimized for the web. Adobe Photoshop has built-in export features to compress images for the web. 

Another tool to compress images that you should consider using is TinyPNG.

WordPress: If you're using WordPress for your website platform keep a watchful eye on the theme and plugins. Some drag and drop themes give you bloated code which affects the page load speed. Some plugins can also slow down the website due to bad code.

Another issue with a WordPress site is not serving cached pages. It will overload your server thus causing your website to be slow or to crash.

Animation & Transitions: Everyone likes motion on the screen. This creates a more dynamic and modern website. However, if not done right it will perform badly and frustrate the user. Keep animations short and sweet.

Curious how fast your website performs? Run it through Google PageSpeed Insights. Watch how HTML, CSS, images, and scripts can affect the page load times.

‍

User Experience

Avoid making the user think! Give them a clear call to action. 

Visual Hierarchy: For usable web pages the visual design should guide the eye through the most important parts of the page. Users generally do not read every word on the page. Most scan the page looking for relevant information. Generally, the title of the page should be the largest heading. Other headings, subheadings, and paragraph copy should have less visual weight according to their importance.

Navigation: The content needs to be navigable and locatable. Don't confuse the user with too many navigation items. Limit the number of menu items to seven on the desktop.

Accessible: Content needs to be accessible to people with disabilities. Take a look at w3.org for best practice.

‍

User Interface

Google has written a bible on the best practices. I recommend reading Google Material Design documentation. They've spent a great amount of energy to find the best practices. They cover everything from color, typography, iconography to interaction and communication.

"Material Design is a visual language that synthesizes the classic principles of good design with the innovation of technology and science." -Google

Colors: When selecting colors for the web make sure they have a solid contrast ratio. Provide high color contrast between the text and background. You can use the WebAIM Tool to check the foreground and background combinations. With the right mix, visitors will be able to read your content with ease. 

Typography: Avoid small paragraph type. Aim for 16px+. This will help improve the readability. Nobody likes reading paragraphs with tiny fonts on the screen. 

Customer Experience

How easy is it for the user to understand what you're offering? The title should inform the visitor what they are getting! Studies show that we should aim for 6 words that invoke curiosity in the title. Headline Analyzer gives you the ability to refine the title to maximize results. Capitalize My Title also provides great insight selecting the perfect headline.

Mobile-Friendly: Making sure you have a Responsive website is essential. This can avoid lots of issues with your visitors. It will make your site mobile-friendly, improve the way it looks on devices with both large and small screens and increase the amount of time that visitors spend on your site. It can also help you improve your rankings in search engines.

‍

‍Branding

Brand and other design elements are used to evoke emotion and appreciation. 

Color: Selecting and using the right brand color can elicit emotions and behaviors.

Typography: This plays a crucial part in branding. If you're a professional service avoid fonts that are too playful. Know your audience well and use the right fonts. If you need help choosing the right set of fonts use FontPair to decide on the right typography.

Images: Select great images that complement your message. Don't use pixilated images, they appear unprofessional.

Overall be consistent with your brand style. This helps tell everyone you're serious about your brand.

‍

Conclusion

There are five fundamentals you should keep in mind to get the best possible results:

• Performance: Nobody likes slow websites! Focus on optimizing for speed. Start by compressing your images.

• User Experience: Provide a clear message with an easy call to action. The easier your site is to browse; the more likely users are to engage.

• User Interface: Your interface should be easy to read so that it doesn’t confuse or frustrate. Read up on Google Material Design best practices.

• Customer Experience: Mobile traffic is more important than ever. Make sure your website is responsive.

• Branding: Make sure to include your branding in the design. Your goal is to build lasting impressions. Think of Coca-Cola, and be just as consistent.
  
  

Bonus:

If you want to outperform the competition. Start user testing your website. Find what users have to say about your website. With the right type of testing, you can see where they have problems. Make sure to install Google Analytics so you can keep track of your users’ behavior. This type of data can help you make informed decisions.

Once you have the data and user test results use them to make decisions about refining your website. Then continue testing to find opportunities for further improvement.