<?xml version="1.0" encoding="UTF-8"?> <rss
version="2.0"
xmlns:content="http://purl.org/rss/1.0/modules/content/"
xmlns:wfw="http://wellformedweb.org/CommentAPI/"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:atom="http://www.w3.org/2005/Atom"
xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
><channel><title>Lee Munroe &#187; javascript</title> <atom:link href="http://www.leemunroe.com/tags/javascript/feed/" rel="self" type="application/rss+xml" /><link>http://www.leemunroe.com</link> <description>User Experience and Web Interface Designer Lee Munroe</description> <lastBuildDate>Thu, 09 Feb 2012 02:44:16 +0000</lastBuildDate> <language>en</language> <sy:updatePeriod>hourly</sy:updatePeriod> <sy:updateFrequency>1</sy:updateFrequency> <generator>http://wordpress.org/?v=3.3</generator> <item><title>5 Quick and Easy Ways to Optimise Your Website</title><link>http://www.leemunroe.com/optimise-website/</link> <comments>http://www.leemunroe.com/optimise-website/#comments</comments> <pubDate>Mon, 16 Mar 2009 09:00:30 +0000</pubDate> <dc:creator>Lee</dc:creator> <category><![CDATA[Web Design]]></category> <category><![CDATA[css]]></category> <category><![CDATA[javascript]]></category> <category><![CDATA[optimisation]]></category> <category><![CDATA[optimization]]></category> <category><![CDATA[web]]></category><guid
isPermaLink="false">http://www.leemunroe.com/?p=1154</guid> <description><![CDATA[Performance is something you don&#8217;t often think about. You assume that if it loads quickly enough for you then everyone&#8217;s happy. Someone commented a while back saying that it takes&#8230;<html><body><h1>400 Bad request</h1> Your browser sent an invalid request.</body></html> ]]></description> <content:encoded><![CDATA[<p>Performance is something you don&#8217;t often think about. You assume that if it loads quickly enough for you then everyone&#8217;s happy. Someone commented a while back saying that it takes quite long for my pages to load so I optimised it a tad and thought I&#8217;d share a few quick tips with you.</p><p><span
id="more-1154"></span></p><h4>1. Use CSS sprites</h4><p>Rather than having multiple CSS background images for your page, you can use CSS sprites to <strong>combine multiple images into one graphic</strong>. This <strong>reduces overall filesize</strong> and the amount of <strong>HTTP requests</strong>.</p><p>Once you do this you can use CSS to control the background images.</p><pre><code>#services ol li{
background:url(images/homeicons.gif) no-repeat;
}

#services ol li.design{
background-position:0px -460px;
}</code></pre><p>And as you can see the size and http requests are reduced considerably.</p><div
class="blog-img"><img
src="http://www.leemunroe.com/wp-content/uploads/sprites.gif" alt="Sprites" border="0" width="540" height="250" /></div><h4>2. Use an external CDN</h4><p>A CDN is a content delivery network and it basically means <strong>use scripts that are hosted on other sites</strong>. Why? Because users might not have to download the script when they visit your site as it&#8217;s already cached.</p><p>Google has an <a
href="http://code.google.com/apis/ajaxlibs/documentation/index.html">AJAX Libraries API</a> that you can use.</p><pre><code>&lt;script src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.3/prototype.js" type="text/javascript"&gt;&lt;/script&gt;</code></pre><h4>3. Install YSlow</h4><p>YSlow is a very <strong>useful optimisation tool for Firefox</strong>. YSlow will report on any page you load up and will give you information about the amount of HTTP requests, CDNs used, CSS and JS compression and will give you a grade for each and tell you how to improve the page so it loads quicker.</p><ul><li>First you need to <a
href="https://addons.mozilla.org/en-US/firefox/addon/1843">install Firebug</a>. YSlow runs alongside this add-on.</li><li>Now <a
href="https://addons.mozilla.org/en-US/firefox/addon/5369">install YSlow</a>.</li><li><a
href="http://developer.yahoo.net/blog/archives/2007/08/yslow-podcast-screencast.html">Watch this screencast</a> on how to use YSlow</li></ul><div
class="blog-img"><img
src="http://www.leemunroe.com/wp-content/uploads/yslow.gif" alt="YSlow" border="0" width="409" height="201" /></div><h4>4. Put JavaScript at the bottom</h4><p>Put any JS requests that you can at the bottom of your code, <strong>allowing your content to load first</strong>. This includes any <strong>Twitter</strong> or <strong>Analytics</strong> requests. This way your site content can load before trying to load external JS files.</p><h4>5. Optimise graphics for web</h4><p><strong>Save your images for the web in Photoshop</strong> and you can alter the image quality, reducing the file size considerably. Of course I&#8217;d like to think you were doing this already ;-)</p><p>In Photoshop, File &gt; Save for web &amp; devices</p><div
class="blog-img"><img
src="http://www.leemunroe.com/wp-content/uploads/saveforweb.jpg" alt="Save for web" border="0" width="540" height="200" /></div><h4>More tips</h4><ul><li>Cache your pages &#8211; <a
href="http://wordpress.org/extend/plugins/wp-cache/installation/">WordPress cache plugin</a></li><li>Make sure all your Javascript and CSS is external (not inline)</li><li><a
href="http://www.cssdrive.com/index.php/main/csscompressor/">Compress your CSS</a></li><li><a
href="http://javascriptcompressor.com/">Compress your Javascript</a></li></ul><p><strong><em>How else can you optimise your website?</em></strong></p> ]]></content:encoded> <wfw:commentRss>http://www.leemunroe.com/optimise-website/feed/</wfw:commentRss> <slash:comments>27</slash:comments> </item> </channel> </rss>
<!-- Performance optimized by W3 Total Cache. Learn more: http://www.w3-edge.com/wordpress-plugins/

Minified using disk: basic
Page Caching using disk: basic (User agent is rejected)
Database Caching 22/30 queries in 0.188 seconds using disk: basic

Served from: www.leemunroe.com @ 2012-02-09 14:34:54 -->
