10 Ways to Make Your WordPress Site Load Faster

10-ways-to-make-wordpress-blog-load-faster---designerblogsSlow and steady definitely does not win the race when it comes to blogs and websites. A slow site can be frustrating for readers and can kill you in search engine rankings. Today we are going to take a look at ten tips that will dramatically speed up your WordPress site. If you are on Blogger, take a look at this post for tips that apply to you.


Testing Site Speed

Before you start tinkering around with your site speed, it’s best to have a starting point so you can see how your site performs before and after making changes. GT Metrix is a great tool for analyzing the performance of your site.

Using GT Metrix, here’s a look at how Designer Blogs performed before applying these tips:

performance-report-beforeOur page speed score had a grade A (91%), which is great, but our YSlow score (a measurement for site performance) was looking pretty lousy with a C grade (77%). Actually a 77% is respectable considering that the average YSlow score is 69%, but we still wanted to get that score up. Page load time was 2.5 seconds with a total of 44 requests.

Here’s a look at how our scores improved after applying the tips in this post:

performance-report-afterIt was fun to see that improvements were made pretty much all across the board, especially with the YSlow score. So let’s jump into these tips so you can start seeing amazing improvements in your site speed as well!


Tip #1: Use a Great WebHost

7The hosting provider you choose plays a huge role in website speed. Of course we are huge fans of BlueHost around here (learn how to set up a site on BlueHost here). If you are currently using another webhost, click here for instructions on how to get moved over to BlueHost. If you find that your site gets more traffic than a shared server can handle, you can always upgrade in the future to a dedicated server for faster speed and even better site performance.


Tip #2: Use a Solid Framework & Theme

7We use the Genesis framework in all of our WordPress designs because of its speed and customizability. Genesis comes free with our WordPress designs and is one of the most solid frameworks out there. We also use Premium StudioPress themes in our custom designs because they are light, fast, and cleanly coded. Some frameworks and themes come with far more features than you’ll ever need or use. Sticking with the simplicity of Genesis and StudioPress is the best way to keep things clean and running lightning quick.


Tip #3: Delete Post Revisions

6There is nothing worse than a site cluttered with too many copies of post revisions, trashed items, and spam comments. Who needs all of that? I love the WP-Optimize plugin because you can set it to routinely clean up your database so it’s not weighed down by all that garbage. Once it’s installed, just go to Settings > Optimize Database to configure the settings you want. You’ll love how tidy your site feels after using this amazing plugin.


Tip #4: Optimize Images

11We’ve been talking a lot lately about how important it is to optimize and resize your images before uploading them to your blog. Uploading images in their original size is a surefire way to slow your site down. The larger the images you upload, the longer your site will take to load, so remember to resize, resize, resize! For detailed instructions on how to resize images before uploading them to your site, review tip #3 in this post.

If you haven’t been resizing your images prior to now and you don’t want to take the time to go back through and resize every single image, you can use an amazing plugin called WP-SmushIt which will reduce the file sizes of your images automatically. It’s great because you can run all of your images through the plugin and it will compress them all into smaller file sizes. Best of all, your images will still retain their same quality.


Tip #5: Identify Plugins that are Slowing Your Site Down

8An easy way to determine which plugins may be slowing your site down is to install and run the P3 (Plugin Performance Profiler). It shows you exactly which plugins are impacting your page load time. Once you determine which plugins are slowing down your website, you can then decide whether or not those plugins are worth keeping. If not, get rid of them. Be sure to delete the P3 plugin after you are finished with it, because leaving it activated will slow your site down. As a general rule it’s best to keep the number of plugins on your site to under 20. Remember that less is more when it comes to plugins and to choose plugins wisely.


Tip #6: Compress Your Site

9
Compressing your site using Gzip is a great way to speed up your site. Gzip zips up all of your website files so they are easier for your server to transmit them to your readers browsers, hence decreasing page load time. There’s really no drawback to installing Gzip and the increase in speed can be pretty significant. You can install Gzip using one of two methods:

1. Install using the GZip Ninja Speed Compression plugin. Install it and then make sure you have the check mark checked to activate it.

2. If you are comfortable digging into the backend of your site, then log into your hosting account and go to your file manager. Find the .htaccess file in the root directory of your server and simply add this code to it:

AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript

Make sure that after you install Gzip in one of the above two ways that you check to make sure it’s working by running Check Gzip Compression.


Tip #7: Use a Good Caching Plugin

Every time your website is loaded by a user, all sorts of mechanisms are taking place on the back end to allow your user to view it. Caching is essentially like taking a picture of your site when your visitors land on it so that when they return, your website can simply load the “picture” of the website instead of having to load everything on the back end again, which makes your site load time lightning fast for returning visitors.

It’s essential when installing a caching plugin that you follow the installation instructions exactly or you’ll end up doing your site far more harm than good. WP Total Cache is one of the best caching plugins out there, but again, please be certain to follow the installation instructions carefully. If you find you need to uninstall the W3 Total Cache plugin, this tutorial can help you uninstall it successfully without crashing your site. You’ll be amazed at the dramatic improvements you’ll see in site speed and YSlow score after installing this plugin…but again I cannot stress enough how important it is to install it correctly. WP Total Cache is a very powerful and advanced plugin, so if you are a novice, it would probably be best to skip this tip. You’ll still see dramatic improvements in site speed by following the other 9 tips.


Tip #8: Optimize Your Database

WordPress uses a database to store everything about your site–posts, pages, comments, plugins, settings, etc. It’s all there in your database. Every time someone loads your site, the database has to be read. If the database is packed to the brim then the information can take a long time to load causing a slow loading site. WP-DBManager plugin is a great plugin that will help you easily back up, repair, and optimize your database, which in turn will speed up your site.


Tip #9: Use a Content Delivery Network (CDN)

12Image Source: KeyCDN

Using a CDN helps to speed up your site because it takes all of your static files like images, CSS, Javascript, etc. and it serves them on servers as close to your users as possible. CloudFlare is a CDN I recommend. It’s free and you can get a CDN set up for your site in less than five minutes. Once you get this set up, you’ll see dramatic improvements in your site speed as well as your YSlow score.


Tip #10: Declutter Your Site

Remember that less is always more when it comes to your site. Rid your site of anything that isn’t absolutely essential. Some final ways to declutter and speed up your site:

  • remove any inactive plugins and widgets that you don’t need/use
  • limit the number of posts shown on your blog
  • show post excerpts/summaries instead of the full post
  • simplify your sidebar by removing widgets that aren’t absolutely necessary
  • limit the number of ads, pop-ups, etc.
  • remember that your users visit your site for content and/or products, not for the millions of widgets and ads you have on your sidebar. Don’t let your widgets and ads overshadow your content.

 
Keep it simple!

We’d love to hear about the improvements you’ve seen on your site after applying these tips. Share them with us in the comments!
 
Posted by: Erin

Free Monthly Blogger Template | July

free-monthly-blogger-templatesWe hope you are having a fantastic, fun-filled Summer! This months free Blogger template features a vibrant blue-green header design. When installed to your blog, you’ll be able to edit the title, tagline, and menu link titles. All font colors are customizable in this template. Everything else comes as shown in the preview. This design is NOT mobile responsive and is for Blogger only. Remember that by downloading this template you are agreeing to these terms. Enjoy!

examples

For personal use only.

 
FOR-MORE-TEMPLATE-DESIGNS

Posted by: Erin

Color Love | Gold & Robin’s Egg Blue

Gold-&-Robins-Eggimage source: the alternative bride

This gold & robin’s egg blue color palette evokes grace with a hint of luxury. Robin’s egg blue is a soft and subtle color that exudes and air of freshness. Pairing it with a glittery gold will bring the perfect touch of elegance to any blog design. You certainly can’t go wrong with this pretty color duo.

If you are going gaga over this stunning palette, then you’ll fall head over heals in love with our Mathilda and Carolina designs. Both use this color scheme beautifully and are found in our $15 Blogger template shop.

mathilda

CAROLINA

Posted by: Erin

Eight Great Font Pairs

8-GREAT-FONT-PAIRSPairing fonts properly can often be a struggle. The key to aesthetically pleasing font pairing is to use fonts that complement, not conflict with one another. Opposites attract when it comes to combining fonts. Too similar of fonts paired with each other compete for attention, while contrasting fonts create a harmonious look. Contrast in font pairing can be created by: 1) combining lowercase fonts with uppercase fonts, 2) experimenting with letter spacing and font size, and 3) using a distinctive font (often referred to as a display font) in conjunction with a simple, conservative font.

In blog design it’s best to keep the fonts used in your design to only two or three. Allow one font to be the star of the show and use the others as accent fonts throughout the design. Because font pairing can be a little tricky, I thought I’d bring you today eight of my favorite font pairs to help give your next project a little font duo inspiration.

sudestadaSUDESTADA | BELL MT

voyageFUTURA PT | VOYAGE

MODERNMODERN NO. 20 | CORBEL

asterismASTERISM CLEAN | SWEET SANS

NIAGRANIAGRA SOLID | CALIBRI

strange-loveLA CARTE | STRANGELOVE

MANHATTANMANHATTAN DARLING | NEVIS BOLD

LAVERONIQUELA VERONIQUE | KAPRA

Posted by: Erin

5 Ways to Make Your Blogger Blog Load Faster

5-ways-to-make-blogger-blog-load-faster
You only have just a few seconds to make an awesome first impression with your blog. You might have a gorgeous blog design and out-of-this-world content, but if your site takes FOREVER to load, people are going to be looking for the “back” (aka: “get me outta here”) button before they even have the chance to enjoy your blog in all of its glory. If your blog takes longer than 3 seconds to load it is loading TOO SLOW and is costing you visitors. Every second counts! So today I want to share with you a few tips that will help to speed up your blog. The tips listed below are specifically for Blogger sites, but if you are on WordPress, stay tuned because next week I’ll share some speed up tips specially designed for you WordPress users.


Tip #1: Limit the number of posts on the front home page of your blog

The more posts you show on your front page the longer your blog will take to load. I recommend showing no more than 10 posts on the front page. However, if your posts are long and/or they have a lot of images, then it would be wise to show even fewer posts. To change the number of posts your home page shows, go to “Layout” > “Blog Posts” > “Edit.”

2

Under “Main Page Options,” switch the number of posts shown on the main page to a number less than 10. Then click the “Save” button. View your blog and it will now only show the number of posts you have set it to show.

3


Tip #2: Display Expandable Post Summaries on the Home Page

If you would prefer to show a lot of posts on your main page, using expandable post summaries is a great alternative to tip #1. Expandable post summaries is a feature that shows a short paragraph for each post and then allows your users to click on a “read more” link to view the full content of each post. Using expandable post summaries on your home page dramatically decreases load time because only a small snippet of each post on the homepage has to load. View a great Blogger Help tutorial that explains how to set this feature up here.


Tip #3: Resize images before uploading them to your blog

Uploading images in their original size is a surefire way to slow your site down. The larger the images you upload, the longer your site will take to load those images. The goal is to size your images no wider than your post area width, so it’s important to know that width. If you are using a Designer Blogs design, we state the post area width on each of our designs so you’ll know the exact width to use when resizing your images. If you don’t have one of our designs and/or don’t know the width of your post area, then shoot us an email and we’ll be happy to take a look at your site so you’ll know the exact width of your post area. Most post area widths are between 600-800px wide.

Photoshop is the best tool for resizing images, but if you don’t have Photoshop, Pixlr is a free service you can use to do this. Here’s how to easily resize a photo using Pixlr:

1) Hop over to Pixlr, scroll down and click “Launch Web App” under the Pixlr Editor option.

2

2) Click “Open Image from Computer” and find the image you want to use from your computer.

3

3) Your image will appear and will be ready for editing. At the bottom of the image you’ll see the current image size. My sample image is currently 4000px wide, which is WAY too large to be uploaded to a blog. So I’m going to change it to the width of my post area, which is 800px wide. In the top navigation bar, click “Image” and then “Image size…”

4

4) Change the image width to the width of your post area. The height of the image will automatically adjust to keep the proper proportions. Click “OK.”

5

5) Now you just need to save the resized image, so go to “File” and then “Save.” Rename the file (if needed) and then click “OK.” Find the folder on your computer where you’d like to save the image and click “Save.” You’re now ready to upload your resized image to your blog.

6


Tip #4: Get Rid of Clutter

Keep the number of gadgets you use on your site to a bare minimum. Ask yourself, “do I really NEED this gadget?” If not, get rid of it. Keep the essentials. Lose the non-essentials. You don’t want your users getting distracted from your amazing content by an overly cluttered sidebar. Less is more when it comes to sidebar gadgets. Keeping your sidebar gadgets to a minimum will allow your content to shine and will help keep your site load time lightening fast!


Tip #5: Minimize the number of HTML/JavaScript gadgets and/or Move them to the bottom of the blog

Adding your own HTML/JavaScript gadgets can be a great way to customize your blog, but adding too many can slow your site down, so use them sparingly. Your blog loads from the top down, so if you do decide to use them, it is best to position them at the bottom of the sidebar or blog so that your users can still read your content while the javascripts are loading.

4

If you are using them within the main code of the site, it’s best to position them at the end of the body tag (right before </body>).

5Remember to use javascripts sparingly and, when used, to position them at the bottom.


Next week we’ll discuss some key ways to speed up your site if you are on WordPress so stay tuned for that!

Posted by: Erin