Make it fast!
It’s a known fact that Internet users don’t like to wait. If your website fails to load quickly enough, most potential visitors will close the page and visit another site instead. Adding to that, Google announced last year that loading time has a huge impact on how they rank websites.
So if you want your website to be better in 2016, speed is among the most crucial things to consider. Get a fast host, use caching, minify HTML, JavaScript and CSS, use a CDN, minimize HTTP requests. Everything you need to know is explained in the article linked below.
optimize your images
Images are always an important part of a website. Images also tend to be huge and consequently take forever to load and use a lot of bandwidth. Did you know that with a few tools and a little of knowledge you can make your website way faster to load and save some precious bandwidth?
Image optimization can be summed up in the following: choosing the right format and size, using images only when needed, and find the right balance between quality and weight. Everything you need to know is explained in detail below.
Be mobile friendly
In recent years, mobile browsing has supplanted desktop browsing. In other words, it is now extremely important that you make sure that your website is 100% mobile ready.
A good example of mobile friendly web design is the Monte WordPress theme, created by WPzoom. Check it and resize your browser to see how well it displays under different resolutions.
Making a website responsive (i.e. fitting perfectly different screen resolutions) is easier than it seems, thanks to CSS media queries.
Use webfonts instead of icons
Using icon webfonts is super easy. The first thing to do is to download a font. In this example I’m using the amazing MFG Labs font that you can download for free here. Feel free to browse the collection linked below if you prefer to use another font.
Once done, upload the files on your webserver and add the downloaded stylesheet to your website. For better performance, I recommand that you copy/paste the content of the stylesheet into your website’s main style.css file.
And finally, you simply have to drop the markup in your html file. Below is an example of creating two icons with links to my Twitter and Facebook profiles.
<a href="https://twitter.com/catswhocode"><i class="icon-twitter_circle icon2x"></i></a> <a href="https://www.facebook.com/catswhocode"><i class="icon-facebook_cricle icon2x"></i></a>
Switch to a quality host
There’s no quality website without a quality server. If you want your website to be fast and available 24/7, you have to consider using the services of a quality hosting provider. Below is the list of my three personal favorites:
Vidahost: this company has been hosting CatsWhoCode since 2012. The speed and availability are amazing and the support service always responds fast, even on Sundays or in the middle of the night. The only downpoint is the somewhat expensive price, but just like cheap hosting isn’t good, good hosting isn’t cheap.
Good news: by using the coupon CATSWHOCODE when checking out, you’ll get 10% off any hosting plan.
A Small Orange: A company I work with, as well as many of my partners. A Small Orange is offering an exclusive discount to CWC readers consisting of one year of hosting + a domain name for only $40. Definitely a great deal for serious websites owners.
In Motion Hosting: I haven’t worked with them directly yet, but I’ve been fixing quite a lot of websites hosted on their servers and everything was smooth. Definitely worth checking!
That’s all for today! I wish you all a super happy 2016 and a lot of fun making/enhancing websites!