Learn All About SEO Friendly Website Design

SEO is one of the most important sources of any website’s traffic (if not the only!) and to make SEO friendly website design can be very helpful. Optimizing for search engines has gotten significantly harder in the past few years, and 2014 looks to be the year when SEO is completely assimilated into online marketing – blending in with paid advertisements, brand awareness, public relations, customer care and other things that, until recently, only mattered for “real” businesses.

And because of that, a website’s design becomes much more important than it already was. Since it’s pretty much the face of your business, you have to pay close attention to details and optimize for the search engines, and more importantly, the people that come from said search engines.

Why SEO friendly website design matters?

You already know that Google takes into account website speed, its coding and page visit time when deciding the ranking, which is why it’s important to optimize everything you can. Furthermore, you don’t want to waste any visits – the more people you convert into subscribers or buyers, the better, which makes design doubly important.

With that in mind, I’ve put together a short list of the best tips for optimizing a website’s design (both visual and internal) for the best rankings and the best user retention and conversion.

Factors that influence SEO friendly website design

Let’s start with the search engine rankings: the goal here is rather simple – make sure the website loads fast, is as spider-friendly as possible, while still maintaining a good visual look and functionality for the users.

Use HTML and CSS instead of JavaScript and AJAX. Despite Google’s spiders being very adept at crawling through JavaScript and AJAX (which is basically dynamically loaded JavaScript) code, they are not perfect and nowhere close to the ease with which HTML and CSS are crawled.

Furthermore, JavaScript slows down a website, sometimes considerably – which is bad for both the rankings and the users. That’s why you should use HTML/CSS instead of JavaScript code wherever possible. With HTML5 and CSS3, you can technically have the whole site JavaScript-free, although there’s a lot of functionality that is only possible with it.

AJAX is even worse – since it’s executed asynchronously and independently of the web page, it is often not indexable at all. And for the love of all things SEO, do not use Flash, ever – it’s not even supported by the company that created it anymore!

Write seo-friendly alt-text for your images. This one seems like a no-brainer, but a lot of people still ignore the ALT attributes on their images. The attribute is very important for SEO, as it basically allows your images to show up high in the SERPs for image search – which accounts for a quarter of all searches on Google.

Image search doesn’t give you as many visitors as normal search, but it’s still a good source of traffic and a good way of getting your pages higher in the normal SERPs (high image ranking has long been thought to influence main SERP rankings, at least slightly).

Use CSS/JS aggregation and compression plugins. CSS and JavaScript aggregation and compression is an easy technique to increase the load speed of any website. The way it works is simple – your theme’s CSS and JavaScript files are aggregated into a single file and compressed, then sent to the client.

This slightly increases the load on the server’s processor, but it makes the load speed faster, sometimes noticeably so. There are plenty of plugins for the various CMS out there – Autoptimize and WP Minify are the most popular for WordPress, for example.

Use hard coding in themes if possible. Another trick to increase page load speed is to use hard coding in your site’s template. This means coding the various page elements by hand instead of leaving them to load dynamically. This reduces the number of queries the site makes to the database, which increases load speed. This may not be an option for many websites, though – use it only if your website is relatively static and you don’t plan on making changes to the theme layout anytime soon.

Use friendly URLs. Friendly URLs are a must for SEO friendly website design – they are an important factor for letting people know exactly what’s on the page they are visiting. It’s actually rare to see non-friendly URLs (i.e. URLs with a bunch of characters and numbers instead of normal words), but if you do have them, make sure to switch to friendly URLs as soon as possible (also don’t forget about setting up redirects for existing pages).

Note: At Firstsiteguide, for example, you can find helpful online and PDF guides – including a website creation guide for using HTML and CSS. Video tutorials and other web design tools can help all web beginners  determined to start an online presence on their own.

Design factors that influence user retention and conversion rates

That about covers it for the design factors that influence SEO. Now let’s see what you can do to increase user retention and conversion, which is arguably more important than SEO – after all, if you get a ton of traffic but can’t do anything with it, what’s the point of having a website?

Responsive design is one of the key pillars for SEO friendly website design. Responsive design is not only the best option for mobile websites (see our article on mobile SEO), but it’s also a great way to adapt your website to different display resolutions and densities and make sure that the main elements are visible to the user no matter what hardware he’s using.

A responsive theme can be designed to adapt based on:

–      the browser window size – you’d be surprised how many people don’t surf with maximized windows;

–      display resolution – 1366×768 fits way less content than 1920×1080, for example;

–      display density – you don’t really want to show the full version of a website to someone using the Microsoft Surface Pro, which has a 1920×1080 resolution on a 10.6 inch display, which means that the full size website will be too small to be viewed comfortably;

You can see how using a responsive design can help in these cases – showing the content in different ways for different displays and devices can help you maximize conversions. By adapting your site for each and every user, you can ensure that they always see your content and of course, your Call To Action (CTA), which is key for getting that click-through, lead or sale.

Keep the important stuff above the fold. This is one of the oldest tips out there and it still holds true – you should always have the important stuff above the fold. This means that you need to size the website header and sidebars appropriately, so that the content, the ads, the subscription form or anything else that’s important for your business is clearly visible as soon as your page loads. Smaller headers, responsive design and sticky sidebars can help with this most of the time, so use them.

Open non-essential pages in a pop-up instead of a new tab/window. Pop-ups have made a comeback lately, although many people still hate them – they are indeed pretty annoying when it comes to displaying signup forms and any advertisements.

Which is why I recommend using them for something else – non-essential pages. For example, your website most likely has About, Contact, Privacy, Terms of Service and other similar pages – well, instead of opening them in a new tab or page, you can load them up in a nice Lightbox pop-up (using Magnific Popup, for example). This will allow you to show the visitors these pages without having them leave the current page – so the chance of lost leads can go down significantly. It will also increase the page visit time, which is important for SEO.

Lightbox pop-ups are also perfect for loading up testimonials, videos, usage cases and anything else on a sales/squeeze page – because as soon as the user clicks on “Close” or anywhere in the grayed out area, they are back to seeing your Call To Action.

Use contrasting colors for your CTA forms/buttons. Contrasting colors (also known as complementary colors) are a simple, but great way of making your Call To Action buttons, links and forms more noticeable to your visitors. Complementary colors are colors that have the highest contrast between each other – so for example, if your website is predominantly blue, you should use red to highlight your CTA items.

Create a sense of urgency. A sense of urgency can increase the conversion rate, especially if you’re offering a free product in exchange for a name and email address to build your email list. You can offer a limited number of copies for an eBook, a limited number of days for a signup or even a countdown timer with less than 24 hours left that would start on a user’s first visit (so the countdown would be different for everyone).

Display a phone number and/or live chat support. And last but not the least, it’s been proven that displaying a phone number and/or a live chat (which can be automated) support link/popup can increase conversions. People see your website as more legit when you have a real contact method or the ability to answer any questions right away. Of course, you should only use a real phone number.

It’s actually not that difficult to create a website that is optimized for the search engines and users nowadays, so be sure to do it properly right away. Whether you are starting a new website or already have one, the above tips can help you get the most out of it.

Related posts:

Leave a Reply

Your email address will not be published. Required fields are marked *