How to Speed up Your WordPress Website

the subject of this masterclass is one
that we’ve been excited about for some
time and for two reasons first this is
something that many of you have been
asking for and as if that wasn’t
important enough this week we’re dealing
with a fascinating subject that is
connected to almost every aspect of
designing building and managing a
website so buckle up and start your
engine because this master class we’re
taking on issues of speed
no matter whether we’re selling products
services ideas or generating awareness
the speed of our website is the speed of
our business speed is something that is
always on our minds not just when we’re
designing and building sites but when
we’re maintaining and managing our sites
to speed concerns each and every one of
us no matter what our level of
experience is and we would sincerely
love nothing more than to cover as much
as possible in one fantastic master
class but you’ve got to admit that there
would be somewhat ironic if we published
a master class devoted to speed that
also ran several hours long
instead we’re setting aside what we
consider to be genuine expert material
for a future separate master class for
expert level developers and web builders
meanwhile we’re bringing you a two-part
master pass chock full of information
and insight with everything else which
is a lot in its own right we’ll
understand the journey that our site
data takes on route to the user will
examine the points along this route that
can potentially slow down our load time
and the solutions that we can adopt in
order to avoid these pitfalls and
accelerate our load speed and of course
the best ways to test our site speed
this week will be examining a breakdown
of the journey focusing on the
informations point of origin and explore
ways to speed up our load time server
side
because as individuals we don’t normally
have the capacity needed to serve data
to countless users simultaneously and
keep it all safe and secure
we usually entrust our website data to a
host now this host allocates a server
for our needs and the reason that we
call it a server is because it works
kind of like a server in a restaurant a
user wanting to see our site will use a
browser sometimes referred to as the
client in this sense to contact our
server and the moment that this happens
the whole process kicks into action what
the user sends through their client is a
request technically known as an HTTP
request in return our faithful server
replies with a responding message that
contains HTML that’s the information
telling the client how to organize and
display all the content of our site as
well as instructions for the client
issue further requests for content
assets that also belong to the website
that the client didn’t previously know
about hence we get a series of wrapping
requests and responses going back and
forth like a super fast game of ping
pong the amount of time that it takes
from the moment a client sends an
instance of data as a pink till the
moment pongas received back is the way
that we measure speed as web builders we
are responsible for the return journey
and the time that it takes for a user to
receive their reply along this return
journey we have a couple of stations
having received and processed the
request from the client our data sets
out from the server via the platform
which in our case is WordPress and all
the plugins installed on it then it
continues to the system where the client
is operating to be rendered into the
content that our user is curious to see
Google and their counterparts measure
the time it takes from that very first
ping until that very last piece of data
is rendered to complete the page on the
client side where the user can see it as
page load time page load time is an
important criteria for search
engines as their users look to them to
provide a list of sites with the best
user experience possible and we don’t
have to be googled to know how impatient
a user can get just waiting for a page
to load so it shouldn’t surprise us to
learn that the faster our page loads the
higher the ranking of that page will be
in the search results the higher the
potential we’ll have for traffic to come
flowing to our site so how do we make
this happen let’s look at the things
that can slow our site down and how to
fix them starting with our first station
along our journey this server the first
thing we need to address is the location
of the server as a rule keep your users
close and your data closer if you want
to start a fast food business and your
clients are predominantly from New York
establishing your restaurant in Los
Angeles will not be good business
instead you should move it as close as
possible to where your client base is
located the big hosting companies have
servers located on every continent and
it’s up to us to ask our hosts to be
located as close to our users as
possible another way to cut the travel
distance is by using content delivery
networks or CD ends
these are caches situated along the road
between the client and the server that
store static content assets such as text
graphics etc that we have no reason to
change so that the client doesn’t have
to wait too long to receive the data
that we’re shipping again this is
something that we need to ask from our
hosting service now once our server
receives a request for data it processes
it think of it our server placing an
order with a short-order cook in the
back kitchen if we want our order to be
out fast and with no hiccups we need a
fast reliable kitchen staff or an our
case effective and efficient server
software now there are many host
services that still run on software
stacks that include Apache MySQL and PHP
without going into too much technical
detail what we want to do is make sure
that the hosts
service that we work with is or can
upgrade our service tax software from
Apache to engine X from MySQL to Moorea
DB and make sure that our PHP version is
at least PHP 7 in some cases this alone
can reduce our page load time by up to
50% now generally speaking hosting
services keep our data on shared servers
in other words we’re sharing the storage
space and some of the service with other
web sites residing in the same storage
system as we are now
some experts maintain that this too is
something that can impair our page load
time and recommend opting for a virtual
private server or VPS the thing about
using a VPS is that it also means a lot
of work for us the moderators worse if
we’re not experts in such things we’re
putting our site and our business at an
unnecessary risk yes you could improve
your page load time using a VPS but as
many experts will tell you there are
several premium hosting service that our
WordPress dedicated like SiteGround
WP engine and flywheel already providing
great service so that we don’t have to
deal with the headache and the hassle
having grasped how users get our data
how the client communicates with our
server and the ways that we can improve
and speed up this communication next
master class will be pushing the pedal
to the metal and see how we can speed up
the flow of data even more by modifying
our WordPress platform and our content
footprint we’ll also be taking a site
that will audit to show how all of these
tips and advice work in practice if you
have any further advice tips or insight
that could help other users speed up
their websites please share it in the
comments below if you have any
criticisms we are equally interested in
your thoughts and if you’ve enjoyed this
masterclass and you found it helpful
insightful or inspiring make sure you
click the subscribe button and tap that
bell so that you don’t miss out and our
next
to class part two of our masterclass on
accelerating our page load speed after
all our goal is to be the best at
helping others excel at their craft
thanks for watching Cheers

les Mundi masterclass we examined ways
to speed up our website server-side and
this week we’re going to speed up our
site by reducing plugins and optimizing
content without losing quality or
quantity if we’re going to figure out
where and how to trim and streamline our
data we should first understand how our
site data is processed and deployed to
the user which is why we’re including an
in-depth explanation in the written
article that we publish with this video
and you can find links to this and more
in the show notes below now meanwhile as
promised for this hands-on masterclass
will audit a site and show just how all
of our theory works in practice and the
best way to learn how to get it right is
to work with an example of a website
done wrong at first glance this site
might seem familiar it does resemble our
recently released photography portfolio
template kit however we’ve deliberately
tinkered with it so that it’s far slower
and nothing like our final product so
let’s begin with step 1 and perform an
initial speed test using GT matrix or
Google’s PageSpeed insights
now this will show us how our site is
performing and also give us an idea of
where we can start to clean up our site
and shave time off of our page load time
now what we’ll be doing next is
reviewing why this site is so slow and
what we can do about it beginning with
speeding up our site platform side
[Music]
as we mentioned last masterclass the
server begins responding to a request by
creating an HTML file this acts as a
blueprint or construction manual for the
browser or clients to know how to render
or reconstruct the data we send into a
viewable site now to do this the server
has to read through all of WordPress’s
definitions and guidelines and the good
news is the wordpress are constantly
improving things on their site to help
speed up their part of the process the
bad news is what comes next when the
server has to read through the list of
definitions in the theme and then the
plugins and then the add-ons to retrieve
similar data for this HTML file and yes
we’re only talking in milliseconds but
this is where every millisecond counts
so we’ll move on to step 2 optimizing
our theme now you’re probably aware of
the growing no theme or theme less
movement among professional wordpress
web creators themes have a tendency not
only to limit design possibilities and
flexibility but also add unwanted time
to the service process and this is why
the hello theme became so popular so
fast it’s one of the lightest most
flexible themes out there if not the
most and the reason for that is that
it’s so light it’s practically invisible
next is step number three where we’ll
further optimize our platform by
reducing the number of plugins that we
have activated now remember the server
reads through each and every one whether
they are redundant or not now in our
example site we’ve got separate plugins
for a contact form and a pop-up menu
plugins and add-ons that are already
available on Elementor and available
because developers have gone through all
the trouble of creating these
customizable widgets precisely to allow
web creators to make their sites fast
and as efficient as possible now having
fine-tuned our site platform side we
want to make things easier for the
browser or client and the way that we do
that is by reducing not the quantity but
the weight of our content payload now
looking at the
breakdown of our speed test at what is
commonly known as a waterfall we can see
that the heaviest files are our images
up front you should know that WordPress
automatically reduces the density of any
JPEG assets that we upload to the media
folder which is great but still not
enough
now many designers prefer to use graphic
file types like PNG s for vector art and
images with transparency which WordPress
does not convert but as we’ve mentioned
in previous master classes there are a
couple of great apps and online sites
like tiny PNG that can help us scale
down images to a far more acceptable
weight and we’ll put links to these and
the show notes below now two more things
to consider while processing our graphic
assets are the dimensions and the
resolution now when it comes to size a
bigger picture will not give you better
quality if you have an asset that is
meant to fit in 400 by 400 pixel space
at 2400 by 2400 pixel image is a waste
of weight instead we’ll perform step
number 4 and make sure that the images
that we upload to WordPress have the
dimensions of the largest instance that
we will need and most likely that’s
going to be for the desktop view of our
site now WordPress automatically creates
several instances of our images so that
users don’t have to wait for huge files
to be scaled to fit their screen size
and it’s because of this that Elementor
relies on the WordPress media feature
for uploading and relaying images the
next thing that affects the weight of an
image is its resolution which is
measured in the density of pixels per
inch or PPI not to be confused with dpi
which is a similar concept but from the
world of printed graphics it used to be
the case that 72 PPI was sufficient
enough for all of our graphic assets but
these days we need to consider display
formats such as 4k and retina now so far
we have less to fear or worry
about from 4k however retina an Apple
display system is prevalent on iPhones
iPads IMAX and MacBooks and that’s a lot
of uses that we need to consider when
designing our sights the pixel density
of retina technology differs from one
device to another and continues to grow
with time currently many experts are
adamant that all of our assets should be
at least 300 PPI while gifts are very
popular assets to use in our design a
great tip is to use short videos instead
as they aren’t as heavy as gifts
especially when we’re using a linked
video widget moving on to step number 5
use caching or lazy loading plugins and
we’ve spoken about these in previous
master classes unlike the other plugins
that we have mentioned these plugins are
extremely useful for speeding up page
load time the way that they work in
layman’s terms is by using placeholders
on the pages instead of the heavier
images and as the user Scrolls down the
page the missing assets are transferred
as needed from the server without the
user having to waste any extra time
waiting as such google assumes that the
site loads much faster and clocks it and
a much better page load time now like
many of you we recommend WP rocket to
get this job done and you can find a
link to that in the show notes below on
to step number six remove redundant
structure elements there is a chance
that as elemental users you might be
overloading your page with redundant and
unnecessary elements now you’ll want to
use as few cons and sections and empty
widgets as you can personally I begin by
trying to keep an entire page in one
section and you’ll want to avoid using
external scripts for things like ads
font loaders etc that can have a huge
impact on your website’s performance and
we’ve spoken about this and more in our
masterclass on common mistakes among
Elementor users and there’ll be a link
to that in the show notes as well now
this brings us to another concept that
you’ve been bringing up in the community
and that is step number seven
minification minification refers to the
process of clearing up all of the
redundant content excessive code and
space which also takes up room apps like
kangas HTML minify or minify are tools
designed to identify and remove
redundant and convoluted HTML javascript
and CSS code significantly reducing the
weight of our site data and improving
the site’s functionality finally step
number eight once we’ve cleaned and
streamlined our site we’ll run another
speed test using GT metrics Google or
test my site to test our pages desktop
and responsive loading time alongside
industry benchmarks this will give us
scores based on real world data from
user experience now the speed we’re
looking for is four seconds or faster
based on extensive research by companies
like Google who have vested interest in
understanding what online users want
getting our page load time down to two
seconds would be wonderful but for
really big sites like online stores less
than four seconds is great
seven seconds or less is not brilliant
but still a pretty good speed another
great way to evaluate our site’s
performance is by using speed scorecard
to see how our mobile site speed
compares in different locations within
the geographic regions that we’re
targeting in countries around the world
another idea is to compare your page
load time with that of your competitors
sites even if you can’t get your load
time down dramatically you still want to
be faster and more reliable than the
competition beyond everything we’ve
examined it’s important to remember that
there is no perfect solution for speed
it all boils down to testing and
retesting and above all finding the
balance between what we need our site to
deliver and how fast we get it there now
as web creators sometimes our mission is
to blow our audiences
minds but sometimes we’re risking speed
but this is exactly where creativity and
ingenuity thrive within the limitation
now a great deal of what we’ve discussed
should be implemented or at least
discussed at the design stage as regular
viewers you probably recall us stressing
the importance of planning stage time
and again and planning for speed is
essential to a website’s design some of
you might have noticed that in this
masterclass there were some issues that
we haven’t discussed such as throttling
and other topics that we felt would be
better addressed in a later separate
expert level masterclass that we have
planned for the future and speaking of
which if you’ve enjoyed this masterclass
and you found it helpful insightful or
inspiring make sure that you click on
the subscribe button and tap that bell
so that you don’t miss out on our next
master class also since releasing part 1
of this masterclass on speed we’ve been
enjoying your comments and really great
insight so please if you have any
further advice or tips that could help
other users speed up their websites
please share it in the comments below
and if you have any criticisms we are
equally interested in your thoughts
because after all our goal is to be the
best and helping others excel at their
craft thanks for watching