Originally Posted by IamGears
Thank you, been quite a while since I coded anything, great tips and I will try to put them o use.
|
No problem!
Remember, visitors are picky and will leave your website if it loads too slow. You want your blog to load quick and not scare away potential readers and customers. I'm on a 25+ mbps connection (that's over 3 megabytes per second, download) and the website takes about 6-7 seconds to fully load. This isn't because you have huge image files, but because you have so many image, css and javascript files.
Think about it like this
When my browser views your website it connects to your server, pulls down the HTML, and starts downloading 4-8 images, css and javascript files at a time (depending on the visitor browser!) Each and every one of those connections has to be negotiated by the web server; also, my browser can't download the next batch of images, css and js until the previous batch has finished loading.
I'm seeing 40+ images, 20+ .css files and 60+ .js files on your main page! In other words, I have to make 100+ connections to your main page on each page load. This not only means your site is slow, but you could also end up overwhelming the server!
Thankfully, easy solutions
This actually isn't your design's fault. A lot of this loading is due to those social plugins. I would recommend only showing the social plugins on the post/article pages and removing them from the home page. Some other things you can do are...
- Use CSS sprites, combine the background images, etc.
- Combine your css files
- Combine your js files (and put them at the bottom of the HTML)
You can really speed up your site with these two WordPress plugins:
- AutoOptimize: http://wordpress.org/extend/plugins/autoptimize/
- WP Super Cache: http://wordpress.org/extend/plugins/wp-super-cache/
Start with AutoOptimize, which will do the following:
- Combine your CSS files into one larger file
- Compress the combined CSS file
- Combine your JS files into one larger file
- Compress the JS file
- Trim white space in your HTML code
WP Super Cache is great too, but I wouldn't enable it until you're done coding your design. This plugin does a lot of fancy stuff behind the scenes like sending 304 Not Modified, gzip compression for pages, etc. However, since it caches your website as it is viewed you would need to clear the cache each time you made design changes to the site. So, hold off on this plugin until you're finished designing.
So three easy changes and your blog will load a ton faster:
- Only have social plugins on post/article pages, not homepage
- Install AutoOptimize WP plugin
- Make CSS sprites for your design
This should bring the website to load very quickly.
Finally, food for thought
Consider only using the social plugins YOU use. Don't include Google+ if you don't use it and can't +1 your own stuff! Do you really want every article to be tweet-able? Is it worth the extra page load time? If you consistently have 0-1 tweets and +1's on articles they should be removed until you have more visitors.
You can always add a follow me and a +1 button to your homepage until then!