paint-brush
Experience Vs. Browsing: Beginners Guide to Optimizing Your WordPress Websiteby@avalonhost

Experience Vs. Browsing: Beginners Guide to Optimizing Your WordPress Website

by Damir MujicMay 16th, 2016
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

<span>If</span> you’ve read one of my last three blogs, you probably know more about <a href="https://hackernoon.com/tagged/wordpress" target="_blank">WordPress</a> now, and you are willing to go ahead with creating a stunning website for your small business.

Company Mentioned

Mention Thumbnail
featured image - Experience Vs. Browsing: Beginners Guide to Optimizing Your WordPress Website
Damir Mujic HackerNoon profile picture

If you’ve read one of my last three blogs, you probably know more about WordPress now, and you are willing to go ahead with creating a stunning website for your small business.

These are the subjects I have recently written about:

WordPress is the perfect solution for your small business

Why to choose WordPress over free DIY website builder platforms

How WordPress is a multifunctional platform for any type of business

Today, I’d like to explain to you how to use images for your WordPress website in order to present your business in the most beautiful way.

Why Do High-Quality Images Matter Today?

Nowadays, new smartphones, laptops, and tablets are optimised for high pixel images that present sharp and clear visibility without any sight of blurriness. Believe it or not, you are indeed judged by the kind of images you display on your website, so one of the things to consider when building a website is how to include optimised images.

Blurry and pixelated images simply don’t do good for anyone. If you invest in your website without taking images into consideration, the hard work and money you invested won’t bring much success. Using properly optimised photos definitely help with conversion. Remember one very important thing:

PEOPLE WANT TO SPEND THEIR TIME EXPERIENCING RATHER THAN BROWSING!

They react on emotional, fun, creative, and interesting images. But all that goes down the drain if your super cool image is not optimised for today’s responsive smartphones, laptops and tablets.

So, how do you create an experience on your website?

First, give your images a human touch. Being a robot is no longer welcome. Furthermore, you can start thinking out of the box, but before you do so, there are other things to consider.

How To Prepare Your Images?

There are 3 types of images you can use on WordPress:

If you save photos in JPG, they will be saved with the removed details (compressed), but you can use some photo editors to control how much details is removed. If you do this carefully, and check the final results before using these photos on your webpage, this can provide you with fine photos and small files sizes.

PNG

My favourite is PNG because it allows you to use a high res photo without losing any details. However, the downside of PNG is that it contains a larger file size, and it can be seen on new browsers, but not old ones.

GIF

Suitable for sharp-edged line art (logos) with a limited number of colours, GIF will look lovely on your webpage, and it will give it a sort of a breathing energy. However, its maximum colour palette is 256 colours, so in most cases gif looks like a low res, pixelated photo.

VECTORS

Vector images are easily editable upon required resolution for a variety of devices. Furthermore, other, individual elements can be added or removed without disturbing already present objects in the image. Not to mention the file size, which is extremely small. However, you can’t photograph vectors, they have to be created by artists and illustrators.

Which Image Optimisers to Use?

To avoid slow downing your website, it’s best to compress images before uploading them to WordPress. There are several different online tools that can help you do that in no time. I chose 8 for you today:

iPiccy — A fantastic picture editor with options for customising your images, but also for editing, filtering, and designing. Similar to Photoshop, but without important Photoshop features. It’s great for daily editing.

jpeg-optimizier — This tool can easily compress your image, but don’t count on any editing there

Riot — A free diting program which you need to download to your comp. It helps you visually adjust compression parameters and keep minimum file size. Not bad at all.


TinyPng — A smart solution for making your own website run faster by easily compressing huge png files. Also, try a similar one,WordPress Image Shrinker.Compressor.io — An online tool for compressing large images without loosing the high quality.

Best WordPress Plugins in 2016

Now that you are all set and ready to go, having additional features on your WordPress website is a must. Therefore, you might be looking into several plugin options for your website. While there are tons of them to choose, it’s good to understand what you might need yours.

For creating stunning responsive images and video galleries, one of my recommendation would be Envira Gallery. It will help you integrate social media buttons into your WordPress website, easily organise photos and make your image gallery SEO-friendly.

I assume you would like your website to generate comments around the discussion community. Therefore Disqus Comment System is the one for you. It’s a user-friendly content plugin for enabling commenting on your WordPress website. It will help you connect with commenters across the discussion community, and make commenting more interactive.

For e-mail marketing though, one of the recommended plugin for your WordPress website is definitely Rapidology. It’s free of charge and it helps you create beautiful e-mail opt-in forms, popups and widgets without you needing any coding skills.

Check out the best WordPress plugins in 2016 here, as well as the most important web design trends in 2016, written by the Avalon staff. Now that you are ready to go, all you need to do is contact us to help you set up the best possible hosting service in town!

This article was originally published at Avalon blog.