How To Speed Up Your WordPress Blog - Jack Karter
Upcoming SlideShare
Loading in...5
×
 

How To Speed Up Your WordPress Blog - Jack Karter

on

  • 106 views

WordPress sites that are slow tend to have a lower conversion rate than WordPress sites who load under two seconds. It’s a simple fact. The more information thats displayed on a webpage, the longer ...

WordPress sites that are slow tend to have a lower conversion rate than WordPress sites who load under two seconds. It’s a simple fact. The more information thats displayed on a webpage, the longer it takes for that page to load. Things like graphics can greatly enhance a users experience but they do come at a cost. While the time it takes for a webpage to load
has been a ranking factor for some time, the real benefit in having a webpage that
loads quickly is the improved user experience it generates. As you can see in the
graph below.

Statistics

Views

Total Views
106
Views on SlideShare
106
Embed Views
0

Actions

Likes
0
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

How To Speed Up Your WordPress Blog - Jack Karter How To Speed Up Your WordPress Blog - Jack Karter Document Transcript

  • jackkarter.com http://jackkarter.com/how-to-speed-up-your-wordpress-site/ How To Speed Up Your WordPress Site It’s a simple fact. The more information thats displayed on a webpage, the longer it takes for that page to load. Things like graphics can greatly enhance a users experience but they do come at a cost.While the time it takes for a webpage to load has been a ranking factor for some time, the real benefit in having a webpage that loads quickly is the improved user experience it generates. As you can see in the graph below. 7.7% of people abandon a website of it takes longer than between 2 to 4 seconds to load. 24% of people abandon a website of it takes longer than between 4 to 6 seconds to load. 31.7% of people abandon a website of it takes longer than between 6 to 8 seconds to load. 36.5% of people abandon a website of it takes longer than between 8 to 10 seconds to load. Website abandonment has a direct effect on your conversion rates. Lets assume you have a website thats making you an average of $200 a day, which is about $73,000 per year and we use the amount of traffic that abandons your webpage as a percentage loss of your income on an annual basis. A webpage that takes 8 to 10 seconds to load is costing you, $26,645 per year A webpage that takes 6 to 8 seconds to load is costing you $23,141 per year A webpage that takes 4 to 6 seconds to load is costing $17,520 per year A webpage that takes 2 to 4 seconds to load is costing you $5,621 per year You don’t have to be a rocket scientist to realise that any increase in speed will reduce this abandonment and hence increase your bottom line. In this article, I’m going to show you three easy methods for increasing the speed of your website. Share To Download Bonus Materials! Just click your favourite social media site to reveal Goodies! +1 us tweet like Three Ways To Improve Your Websites Speed There are a few different ways you can increase the speed of your website. Change hosting, use a CDN hosting service along with the W3 Total cache plugin and you can tweak your site manually, which will improve your sites speed but not dramatically.
  • 1. Move To A Specialist WordPress Host The easiest and most effective way is to move your hosting to WP Engine . The three main reasons you should consider using them are, speed, security and scalability. Speed: Their hosting system is specifically setup for WordPress users and pretty much any site being hosted on their servers will load in under two seconds. They are quite strict about what plugins can and can’t be used as they would have an impact of the pages load time. Even if you don’t want to use their service, it’s a good idea to see what plugins they believe have an impact on a WordPress site’s load time and avoid using them. Check out the list in the support section. Security: They are also very security conscious and believe their system is so secure, they will repair any website thats been hacked for free. In addition, they also do daily backups so you never have to worry about losing your data. One of my favourite features offered by WP Engine is the staging facility. This allows you to have a “test” website where you can modify a site and see exactly what it looks like before it goes live. Scalability: For a variety of reasons, website can get spikes in activity. This could be a particularly popular post or any other reason. Unlike shared hosting, your site will never go down because of this. WP Engine will simply give your website the resources it needs as it needs them. Visit the WP Engine website here for more information 2. Use A Content Delivery Network Service If you are wondering what a content delivery network is, it’s basically a list of servers worldwide that hold a cached version of your website. So, say for example, your website is being hosted in the USA and someone in Australia visits your site. All the data from the servers in the USA has to be sent to be rendered on the Australian users browser. This can take several seconds and if you remember the chart above, this can lead to a very high rate of abandonment. When you use a content delivery network, you site is “copied” to an Australian server and held there, so when an Australian user visits your site, the data is drawn down locally and so is significantly faster. Using MaxCDN in conjuction with the W3 Total cache plugin can have a dramatic effect on the speed… Click To Tweet If your website is a local business website then this is not so important but if you depend users visiting your site on a global level, then a CDN is vital. There are quite a few CDN services out there but the biggest is Max CDN and I use them for all my projects as they have servers in over 90 countries. Get Free Internet Marketing Tutorials By Email For more information on MaxCDN, visit the website here. How To Configure MaxCDN For WordPress 1. Create your MaxCDN account and log into it.
  • 2. After you have logged in, at the top of screen will be your navigation bar. Click on the tab marked Zones. 3. Under the summary tab, find the Pull Zones header. Click on Create Pull Zone. 4. Here you enter the details of the MaxCDN zone you are creating. A. Pull Zone Name: Enter the name of your pull zone using a minimum of 3 characters, no spaces, numbers or special characters. B. Origin Server URL: Enter the URL of the website you wish to increase the speed of. Include the http:// View slide
  • C. Label: Enter a short description of zone D. Compression: Click and enable the compression box. E Custom CDN Domain: Here you simply add CDN followed by your domain name excluding the http:// (see paragraph below) 5. Click the create MaxCDN zone button. Once it has created the pull zone, take note of the CDN URL if you have created a Custom CDN Domain. You will View slide
  • need this when creating a custom CNAME in cPanel. (See below). Thats it! You have no setup your MaxCDN account with a Pull Zone. If you have any questions about this tutorial, please head over to the topic on the forum here and I will be happy to help you answer them. Creating Your Custom CNAME in cPanel 1. Head over to your cPanel and click the “Simple DNS Zone Editor” 2. Once thats opened, choose your domain name from the drop down list. Name: Insert the name you used when creating your pull zone such as CDN (as in the above example). ONLY insert CDN. The rest will be auto filled for you. CNAME: This is where you add the CDN URL you took note of when creating your custom CDN Domain. If you don’t have it, simply return to MacCDN and click Zones at the top of the dashboard, then click the “Manage” tab beside the zone you are installing, finally click the “Settings” tab. Your CDN URL will be the URL beside “
  • Seven easy changes you can do to improve your WordPress site’s loading speed. Click To Tweet How To Configure W3 Total Cache For MaxCDN To install and configure W3 Total cache to work in conjunction with MaxCDN, simply click the link that applies to your platform and follow the instruction you find. If you have any questions about this tutorial, please head over to the topic on the forum here and I will be happy to help you answer them. WordPress Magento Drupal Joomla OpenCart X-Cart Prestashop vBulletin Invision Power Board Social Engine b2Evolution Custom 3. Seven Manual Changes To Improve Your Websites Speed If none of the above options suit you, the third option is to tweak your WordPress site manually. The changes you make to the settings of your site will almost certainly improve the speed of your site but they are not as effective as the ones used above. Before you apply the following changes, check your websites loading speed with any of these. Google’s PageSpeed Tool, GTMetrix, Pingdom and Webpagetest. Test it three times. Add all the times up and divide by three to give an average. As you implement the changes one by one, test again each time and look for improvements in speed. If any of the plugins listed below break your theme and you can no longer access your WordPress dashboard, you can also remove it manually via cPanel. Go to File manager, your theme, wp-content and plugins. Thene delete the plugin. Make a backup of any files you are going to modify. You can do this in a number of ways. In cPanel, simply double click the file and it will download a copy for safe keeping. Or you can simply right click the file and compress it. This will leave a compressed copy and the original copy should you need it. A Note With Regard To This Section: Don’t mix these options with the ones above or you may break your theme. Either use these options or the ones above but NOT both. Add Expired Headers Expires headers tell the browser whether they should request a specific file from the server or whether they should grab it from the browser’s cache. In other words, if someone has previously visited your website, there is no need for their browser to reload everything from your server when the data is already stored in their browser. This code tells browsers to load the page from their browser and NOT the server for a period of time set by you. Add this code to your .httaccess file. You can find this file in your cPanel. Go to cPanel, file manager, choose your
  • domain and you should then find it there. Ensure “Show Hidden Files (dotfiles).” is ticked. If you can’t find one, you will need to create one. To do so, watch this video here <IfModule mod_expires.c> ExpiresActive on # Perhaps better to whitelist expires rules? Perhaps. ExpiresDefault "access plus 1 month" # cache.appcache needs re-requests # in FF 3.6 (thx Remy ~Introducing HTML5) ExpiresByType text/cache-manifest "access plus 0 seconds" # Your document html ExpiresByType text/html "access plus 0 seconds" # Data ExpiresByType text/xml "access plus 0 seconds" ExpiresByType application/xml "access plus 0 seconds" ExpiresByType application/json "access plus 0 seconds" # RSS feed ExpiresByType application/rss+xml "access plus 1 hour" # Favicon (cannot be renamed) ExpiresByType image/x-icon "access plus 1 week" # Media: images, video, audio ExpiresByType image/gif "access plus 1 month" ExpiresByType image/png "access plus 1 month" ExpiresByType image/jpg "access plus 1 month" ExpiresByType image/jpeg "access plus 1 month" ExpiresByType video/ogg "access plus 1 month" ExpiresByType audio/ogg "access plus 1 month" ExpiresByType video/mp4 "access plus 1 month" ExpiresByType video/webm "access plus 1 month" # HTC files (css3pie) ExpiresByType text/x-component "access plus 1 month" # Webfonts ExpiresByType font/truetype "access plus 1 month" ExpiresByType font/opentype "access plus 1 month" ExpiresByType application/x-font-woff "access plus 1 month" ExpiresByType image/svg+xml "access plus 1 month" ExpiresByType application/vnd.ms-fontobject "access plus 1 month" # CSS and JavaScript ExpiresByType text/css "access plus 1 year" ExpiresByType application/javascript "access plus 1 year" ExpiresByType text/javascript "access plus 1 year" <IfModule mod_headers.c> Header append Cache-Control "public" </IfModule> </IfModule>
  • Optimize Your Database Download and install WP Optimize Caching Your Website Download and install Hyper Cache Minify Your Files Download and install WP Minify Compress Your Images Download and inatall Smush.it Compress Your Static Content With Gzip Copy and insert the code below into your .htaccess file.
  • <IfModule mod_deflate.c> # force deflate for mangled headers # developer.yahoo.com/blogs/ydn/posts/2010/12/pushing-beyond-gzipping/ <IfModule mod_setenvif.c> <IfModule mod_headers.c> SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)s*,?s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding </IfModule> </IfModule> # HTML, TXT, CSS, JavaScript, JSON, XML, HTC: <IfModule filter_module> FilterDeclare COMPRESS FilterProvider COMPRESS DEFLATE resp=Content-Type $text/html FilterProvider COMPRESS DEFLATE resp=Content-Type $text/css FilterProvider COMPRESS DEFLATE resp=Content-Type $text/plain FilterProvider COMPRESS DEFLATE resp=Content-Type $text/xml FilterProvider COMPRESS DEFLATE resp=Content-Type $text/x-component FilterProvider COMPRESS DEFLATE resp=Content-Type $application/javascript FilterProvider COMPRESS DEFLATE resp=Content-Type $application/json FilterProvider COMPRESS DEFLATE resp=Content-Type $application/xml FilterProvider COMPRESS DEFLATE resp=Content-Type $application/xhtml+xml FilterProvider COMPRESS DEFLATE resp=Content-Type $application/rss+xml FilterProvider COMPRESS DEFLATE resp=Content-Type $application/atom+xml FilterProvider COMPRESS DEFLATE resp=Content-Type $application/vnd.ms- fontobject FilterProvider COMPRESS DEFLATE resp=Content-Type $image/svg+xml FilterProvider COMPRESS DEFLATE resp=Content-Type $application/x-font-ttf FilterProvider COMPRESS DEFLATE resp=Content-Type $font/opentype FilterChain COMPRESS FilterProtocol COMPRESS DEFLATE change=yes;byteranges=no </IfModule> <IfModule !mod_filter.c> # Legacy versions of Apache AddOutputFilterByType DEFLATE text/html text/plain text/css application/json AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE text/xml application/xml text/x-component AddOutputFilterByType DEFLATE application/xhtml+xml application/rss+xml application/atom+xml AddOutputFilterByType DEFLATE image/svg+xml application/vnd.ms-fontobject application/x-font-ttf font/opentype </IfModule> </IfModule><span style="font-family: 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif; font-size: 14px; line-height: 24px;"> </span> Prevent Image Hotlinking
  • Image scraping is quite prolific on the web and if yours are being scraped, it can use up your resources, particularly if it’s happening a lot to your site. Add the code below to your .httaccess file. If you want a particular image image to appear on the offenders website instead of the hot-linked one (like the one to the left), add it to the fourth line. Obviously when inserting the code, where you see “YOURDOMAIN.com” replace it with your own. RewriteEngine on RewriteCond %{HTTP_REFERER} !^$ RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?YOURDOMAIN.com [NC] RewriteRule .(jpg|jpeg|png|gif|bmp)$ http://YOURDOMAIN.com/hotlinking-image.gif [NC,R,L] The following code will produce a 403 forbidden response when the image is loaded on the offenders website. I prefer the first option. Use your imagination! RewriteEngine on RewriteCond %{HTTP_REFERER} !^$ RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?YOURDOMAIN.com [NC] RewriteRule .(jpg|jpeg|png|gif|bmp)$ - [F] Get Free Internet Marketing Tutorials By Email Additional Plugins You Can Use Theme-Check - This plugin will check your theme for any errors. You can find this in the “Appearance” menu of the WordPress sidebar. P3 (Plugin Performance Profiler) - Plugins can significantly slow down a site. Use this to analyse your plugins and see which ones might be causing problems. Async JS and CSS - This plugin allows for Asynchronous loading of scripts. Basically, features such as Google analytics or social sharing can slow down a pages speed while it waits for these to load. This plugin will move these files to the end so the page will load the important visuals first. If you have any questions about this tutorial, please head over to the topic on the forum here and I will be happy to help you answer them. Share This On Google+!