How To Optimise Images For Your WordPress Website

by callmemellowyellow | Mar 12, 2020 | Tools

Optimising your images is paramount for your website’s page loading times. Optimising images for the web can reduce your total page load size by up to 80%.
Increased page speeds can result in better search engine rankings, improve your visitors’ browsing experience, hence your conversion rates (increased sales and signups), and save you storage space and bandwidth.

So, is that enough of good reasons for you to do the little bit of extra work?

We’ll show you how.

First a quick note about File Formats

The most commonly used file formats online are JPEG and PNG.

JPEGsJPEG’s are good for most situations because of its compatibility, use of color, and small file size. JPEG’s should be used for all of your full
color photographs like featured images and background images.
PNGs best for screenshots and website design images. It uses lossless compression techniques so quality is higher, however this also means larger file sizes. PNG’s are great for smaller images with a lot of detail. The PNG format also supports transparent background capability which is perfect for logos and graphical elements.
GIFs best suited for low quality images with just a few colours. GIF format is widely used for animated files.

Optimizing Your Images Before Uploading To Your Website

It is best practice to optimise images before uploading them to your website.

In Photoshop CC you will find this option in >File >Export >Save for Web

photoshop save for web

Guideline: Quality slider to around 20. Try to get your filesize to max 200KB.

If you don’t use Photoshop don’t fret, there are many free graphic editing applications:

GIMP. GIMP is a cross-platform image editor available for GNU/Linux, OS X, Windows and more operating systems. It is free software, you can change its source code and distribute your changes.
Whether you are a graphic designer, photographer, illustrator, or scientist, GIMP provides you with sophisticated tools to get your job done. You can further enhance your productivity with GIMP thanks to many customization options and 3rd party plugins.
ImageOptim (MAC) ImageOptim makes images load faster. Removes bloated metadata. Saves disk space & bandwidth by compressing images without losing quality.
RIOT(Windows) Radical Image Optimization Tool (RIOT for short) is a free image optimizer that will let you to visually adjust compression parameters while keeping minimum filesize.
PNGGauntlet (Windows) PNG compression app for Windows. Uses PNGOUT, OptiPNG, and DeflOpt to create the smallest PNGs, without sacrificing any image quality. Converts JPG, GIF, TIFF, and BMP files to PNG
Trimage (Linux) A cross-platform tool for losslessly optimizing PNG and JPG files for web. It was inspired by imageoptim. All image files are losslessly compressed on the highest available compression levels, and EXIF and other metadata is removed.
TinyJPG reduces the file size of your JPEG images. Every uploaded image is analyzed to apply the best possible JPEG encoding. Based on the content of your image an optimal strategy is chosen. The result is a quality image without wasting storage or bandwidth.

Optimizing Your Images After Uploading To Your Website

As we said before it is best practice to optimise images before you upload them, however, if you need to save time there are many plugins available that can optimise your images after you have uploaded them to your website.

One of the most well-known optimisation plugins for WordPress is WP Smush – Compress, Optimize and Lazy Load Images
By WPMU DEV

Smush meticulously scans every image you upload – or have already added to your site – cuts all the unnecessary data and scales it for you before adding it to your media library.

Best to run the application when your website traffic is low e.g. overnight as the plugin can be a CPU hog when it is optimising images.

Alternatives to WP Smush include EWWW Image Optimizer, CW Image Optimizer, Imsanity and Hammy. Many WordPress users prefer using these plugins as they do not rely on an external server to process your images.

Please note that compressing an image will reduce file size, but can compromise quality if you compress an image too much. It is therefore important to get the balance between image quality and image file size right.

If image quality is your highest priority (e.g. for photographers), try out Lazy Load. This greatly improves page load time as images will only load when they are visible in the viewport.

Yes but what size?

Choosing the Image Sizes

Match the image size to the space where it will display.

If the image will display as a full-screen header it will need to be much larger than if it were an image for a blurb in a 1/6 column. Only use 1920 x 1080 where that size is needed.

Most of the time, a 1280 image will work just fine in place of a 1920 image. If the space calls for a 200 x 200, then resize your images to that size.

Image Dimension Guidelines Based on Divi’s Column Layouts

Click here for Divi’s ultimate guide to correct image size

Next: Download your free ebook –

5 things you can fix on your website in the next week to improve your business

Calling all yoga teachers and holistic practitioners who want a website that actually works for their business

by callmemellowyellow | Sep 21, 2019 | Business, Business Growth, Online Course, Tools, Websites

I love helping yoga teachers, retreat leaders, holistic practitioners!

That’s how it all started for me: in 2010 I decided to organise a yoga retreat. So I needed a website.

My friend said, why don’t you do it yourself? It was a daunting idea at the time, but I gave it a go … with one platform first, but didn’t like it, then with another one and another one. Until I got the hang of it. I got into it so much I was still up at 4 and 5 in the morning working away!

Over the years I put a lot of time and passion into my yoga retreat business and website and people started asking me if I could do their website. They were all yoga teachers or therapists. I loved doing every single one of them, it came easy to me as I understood their business and their clientele and had done so much ground work on my own website. What works, what doesn’t work, what needs to be better etc.

When I moved to Tuscany definitely in 2016 (after a few years of back and forth between here and London and Greece) I decided to change my business focus from photography and retreats to website consulting and invested in some powerful education to make sure I would be able to offer the highest standard of services to my clients. The learning curve was steep and there is still and always a lot more to learn.

One of the things I became really passionate about as I dived deeper into everything to do with building a successful website was what I’d call “how to capture your ideal client at first sight”.

Think about yourself: How often do you abandon a website just seconds after finding it? And how often do you stay and really get into the content? What makes the difference between those that you abandon and those that you don’t? Are you aware of what it is that keeps you there?

Now try this – find a subject you are interested in and google it. Or go look at your competitors’ websites. Find a website that you like and one that you don’t.

How does the website make you feel at first sight?
How does it do this?
Does it inspire trust?
Are the messages clear?
Are the offers clear?
Is it clear how they work?
Are you being led through to the information you wanted to find in the first place or is it difficult to find what you wanted to know?
Does it solve your problem?
Do you know what to do next?
Does it make you want to do something next?

How was that? Did it give you some new insight?

Maybe you have a few new ideas on how your own website should look and work.

I’ve put together a virtual workshop to help you prepare your website project.
In this online course I’ve collated various teachings of my favourite coaches.
It will help you get crystal clear on what you offer, what your goals are, who you can help best, and how to get your message across to your ideal client so you can build trust and a tribe that will want to buy your services.

You can access this now for free – the only thing I ask you is to give feedback, so that I can continuously improve and help others to their success.

Cause I believe in a world where people are free to do what they LOVE doing, as this is their gift from heaven, and I believe that people who successfully do what they love doing make the world a better place!

Websites are a great vehicle for that. They make it possible for you to share your talents, offers and services with the world. And there is someone out there who needs exactly what You‘ve got to offer. So don’t delay. Start now!

Your Talent. Your Calling. Your Business.

GET READY TO CREATE YOUR WEBSITE THAT ACTUALLY WORKS FOR YOU AND HELPS YOUR IDEAL CLIENTS FIND YOU SO YOU CAN HELP THEM

Build Your Online Success – Step By Step

Need a website, want to build your own, but ….

by callmemellowyellow | Nov 21, 2018 | Business, Tools, Websites

You know that you really want and need a website but …

you haven’t got a clue where to start
you are not exactly clear what should be on it
you say to yourself you could build it yourself but it’s too complicated and you can’t dedicate all that time to building it yourself as you have a business to run
… fill in any other ‘buts’ in the comments below …

You can probably still do it anyway!

and I only say ‘probably’ because you might just not really want to just yet –
but if you know you do, you definitely can!

I show you how.

This is for you if you are a total newbie to website building, you want to do it yourself because you don’t have the budget for a designer/developer, but you have no inclination of going through the long process of learning how to build a website from scratch.

What you will need is

time
curiosity to play and explore, otherwise also called ‘patience’ 😉
a feel for design
just a little bit of money (a fraction of what it would cost you to hand your project over to a web designer)

And because I believe in Goethe’s wisdom up there, the first person to act will be rewarded with a huge discount!

Watch the short video below to see how it works. (about 5 minutes)

In brief: if you want to make your own website but don’t want to spend weeks just learning how to set it up to start with, a prototype is a good starting point. It’s a fully functioning version of your final website, without the design elements. You will learn (I’ll show you) how to add your content – text, images and design elements.

Why not just get a premade theme then? Isn’t that the same?

Well, not really. I started with pre-made themes on WordPress and it drove me nuts. I didn’t find it very intuitive and I’m not someone who likes to read a lot of instructions. So finally I invested in a WordPress developer course and sat through the lessons for 2 full months.

You could still do that, go through youtube videos or Udemy courses if you have the time, but we established before that this is for who wants to get results quickly, who wants to get straight to the point. With this offer, you get your custom made prototype AND the know-how to finish the website yourself. So then you are set up for life!

The Prototype is a custom-made website, built for your exact business needs and goals.

Your business needs and goals that we establish in the Discovery Session, beginning with the Website Worksheet that you would have filled in beforehand.

If you are ready to go for it - hit the button below.

The first one to act will get 50% off – which is €200 off!

What you will get

a business discovery session
a custom-made WordPress website based on your business goals and needs**
personal tutorials on how to upload your content and create your designs

for just €200 – (only for the first person to act)

or €400 (if you missed that first spot)

This is a limited trial offer. Expires on 30th December.

START HERE

** without the design elements, as you saw in the example video. You will learn how to add your content and design ideas.

What do WordPress websites cost?

A typical breakdown of expenses required to get up and running might look something like this:

Domain: $12/year
Hosting: $10/month – $30/month
Premium Theme: $50-$200
Premium Plugins: $15-$200 (each; some are one-time purchases, others are monthly/annual licenses.)
Rough Totals: $200-$1,000+

This is of course assuming no one already owns the domain you want (which could set you back hundreds or even thousands depending on the situation), that you can keep premium theme and plugins to a minimum, and that you personally have the time and experience to set everything up by yourself.

Read the full article to find out more.

How to create and organise content for your website that will speak to and attract your ideal client.

Join my 4 week coaching programme where we dive into the foundations you need to create a website that actually works for you!

Find out more