<?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>timecodestudios web design &#187; web design tips</title>
	<atom:link href="http://www.timecodestudios.com.au/blog/category/web-design-tips/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.timecodestudios.com.au/blog</link>
	<description>Web Design, CMS, E-commerce, SEO, SEM</description>
	<lastBuildDate>Tue, 06 Jul 2010 13:00:06 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Open Lightbox (slimbox) on Page Load</title>
		<link>http://www.timecodestudios.com.au/blog/open-lightbox-slimbox-on-page-load/</link>
		<comments>http://www.timecodestudios.com.au/blog/open-lightbox-slimbox-on-page-load/#comments</comments>
		<pubDate>Mon, 30 Nov 2009 01:46:51 +0000</pubDate>
		<dc:creator>Nicholas Morley</dc:creator>
				<category><![CDATA[web design tips]]></category>

		<guid isPermaLink="false">http://www.timecodestudios.com.au/blog/?p=88</guid>
		<description><![CDATA[Depending on what framework you are running slimbox under, you can easily allow slimbox open an image as soon as the page has loaded. Simply add the following code (based on your framework)  into your pages&#8217;s &#60;head&#62; tags.
Mootools:
window.addEvent(&#8220;domready&#8221;, function() {
   Slimbox.open(&#8220;image-to-load.jpg&#8221;, &#8220;image caption&#8221;);
});
jQuery:
jQuery(function($) {
   $.slimbox(&#8220;image-to-load.jpg&#8221;, &#8220;image caption&#8221;);
});
]]></description>
			<content:encoded><![CDATA[<p>Depending on what framework you are running <a href="http://www.digitalia.be/software/slimbox" target="_blank">slimbox</a> under, you can easily allow slimbox open an image as soon as the page has loaded. Simply add the following code (based on your framework)  into your pages&#8217;s &lt;head&gt; tags.</p>
<p><strong>Mootools:</strong><br />
window.addEvent(&#8220;domready&#8221;, function() {<br />
   Slimbox.open(&#8220;image-to-load.jpg&#8221;, &#8220;image caption&#8221;);<br />
});</p>
<p><strong>jQuery:</strong><br />
jQuery(function($) {<br />
   $.slimbox(&#8220;image-to-load.jpg&#8221;, &#8220;image caption&#8221;);<br />
});</p>
]]></content:encoded>
			<wfw:commentRss>http://www.timecodestudios.com.au/blog/open-lightbox-slimbox-on-page-load/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Online Cross Browser Screenshots &#8211; How does your website look on different computers?</title>
		<link>http://www.timecodestudios.com.au/blog/online-cross-browser-screenshots/</link>
		<comments>http://www.timecodestudios.com.au/blog/online-cross-browser-screenshots/#comments</comments>
		<pubDate>Fri, 14 Aug 2009 12:00:25 +0000</pubDate>
		<dc:creator>Nicholas Morley</dc:creator>
				<category><![CDATA[web design tips]]></category>

		<guid isPermaLink="false">http://www.timecodestudios.com.au/blog/?p=49</guid>
		<description><![CDATA[Try our recommended websites to check what your website looks like on different browsers, such as Google Chrome, Firefox, Internet Explore (all versions) as well as Safari on the Mac.
When designing websites, we recommend to have as many different browsers installed on your computer for testing purposes.
For example, we run Windows computers running various browsers [...]]]></description>
			<content:encoded><![CDATA[<p>Try our recommended websites to check what your website looks like on different browsers, such as Google Chrome, Firefox, Internet Explore (all versions) as well as Safari on the Mac.<br />
When designing websites, we recommend to have as many different browsers installed on your computer for testing purposes.</p>
<p>For example, we run Windows computers running various browsers &#8211; Firefox, IE, Safari and Google Chrome. It&#8217;s much easier to test an entire website using the installed browser as opposed to the screenshot websites listed below, however there are times when you are unable to install multiple versions of browsers (for example Internet Explore 6 and Internet Explorer 8 cannot run on the same machine), so this is where the following sites do come in handy!</p>
<p><strong>Browser Shots</strong><br />
<a href="http://www.browsershots.org" target="_blank">www.browsershots.org</a></p>
<p><strong>Supports:</strong> Linux, BSD, Windows and Mac OS Browsers.</p>
<p>Browsershots makes screenshots of your web design in different browsers. It is a free open-source online service created by Johann C. Rocholl. When you submit your web address, it will be added to the job queue. A number of distributed computers will open your website in their browser. Then they will make screenshots and upload them to the central server here.</p>
<p><strong>Net Renderer</strong><br />
<a href="http://www.ipinfo.info/netrenderer" target="_blank">www.ipinfo.info/netrenderer</a></p>
<p><strong>Supports:</strong> IE 5.5 &#8211; IE8<br />
Designed to easily check what your desired website looks like on a range of different Internet Explorer versions.</p>
<p><strong>What are some cons of the above methods?<br />
</strong>Screenshots are great, but one of the criticisms of screenshot based testing tools is that you can’t test functionality via a flat screenshot. You can test layout with screenshots, but what about cross browser and OS functionality of your Javascript or dynamic CSS elements? For that you need to actually interact with the page.</p>
<p>There are several paid methods, such as crossbrowsertesting.com, but we would recommend to dust one of your old PCs and install different versions of browsers to cut the costs down!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.timecodestudios.com.au/blog/online-cross-browser-screenshots/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Free Flags Icons of the World</title>
		<link>http://www.timecodestudios.com.au/blog/free-flags-icons-of-the-world/</link>
		<comments>http://www.timecodestudios.com.au/blog/free-flags-icons-of-the-world/#comments</comments>
		<pubDate>Wed, 01 Jul 2009 07:59:07 +0000</pubDate>
		<dc:creator>Nicholas Morley</dc:creator>
				<category><![CDATA[web design tips]]></category>

		<guid isPermaLink="false">http://www.timecodestudios.com.au/blog/?p=40</guid>
		<description><![CDATA[There are a number of websites out there offering free flag icons, but after about an hour of searching, we would like to share our top 2 favourites.
Flag icons are a great way to reach out to a broader audience. If you place some small flag icons on your website, and link them to the respective [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.timecodestudios.com.au/blog/wp-content/uploads/flag_icons.jpg" alt="Flag Icons" align="right" />There are a number of websites out there offering free flag icons, but after about an hour of searching, we would like to share our top 2 favourites.</p>
<p>Flag icons are a great way to reach out to a broader audience. If you place some small flag icons on your website, and link them to the respective <a href="http://translate.google.com/" target="_blank">Google translation</a>, you can present your website in many different languages!</p>
<p><strong>Icon Drawer&#8217;s Flag Icons</strong></p>
<p>243 free flag icons representing countries and unions all over the world presented in PNG format. The flags look quite modern.<br />
The supplied sizes : 16×16, 24×24, 32×32, 48×48.</p>
<p><a href="http://www.icondrawer.com/free.php" target="_blank">Click here</a> to get your copy of the flag icons<br />
(link to designer&#8217;s website required)</p>
<p><strong>FamFamFam Flag Icons</strong></p>
<p>“Flags” are 247 icons — in GIF and PNG formats</p>
<p>If you only need your flags to be pixel icons, you&#8217;ll find these to serve your purpose.<br />
<a href="http://www.famfamfam.com/lab/icons/flags/">http://www.famfamfam.com/lab/icons/flags/</a> <br />
(no credit or linkback required)</p>
]]></content:encoded>
			<wfw:commentRss>http://www.timecodestudios.com.au/blog/free-flags-icons-of-the-world/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Our Favourite Free Vectors Websites</title>
		<link>http://www.timecodestudios.com.au/blog/our-favourite-free-vectors-websites/</link>
		<comments>http://www.timecodestudios.com.au/blog/our-favourite-free-vectors-websites/#comments</comments>
		<pubDate>Sat, 27 Jun 2009 01:41:19 +0000</pubDate>
		<dc:creator>Nicholas Morley</dc:creator>
				<category><![CDATA[web design tips]]></category>

		<guid isPermaLink="false">http://www.timecodestudios.com.au/blog/?p=35</guid>
		<description><![CDATA[Vector graphics allow the designer to create artwork with no limitation on the quality within an image. Here are 7 of our favourite websites to get free vectors.]]></description>
			<content:encoded><![CDATA[<p><a href="http://en.wikipedia.org/wiki/Vector_graphics" target="_blank"><img src="http://upload.wikimedia.org/wikipedia/commons/thumb/b/b4/VectorBitmapExample.png/220px-VectorBitmapExample.png" alt="vector-img-01" width="220" height="283" align="right" />Vector graphics</a> allow the designer to create artwork with no limitation on the quality within an image. Once created in design software, such as <a href="http://www.adobe.com/products/illustrator/" target="_blank">Adobe Illustrator</a>, these vector graphics can be scaled up for billboards and beyond without distortion.</p>
<p>These graphics usually provide better quality over the traditional lossy image formats, such as Bitmap and JPEG. This means that if you were to view a vector and bitmap image next to each other, as you zoomed in you’ll be able to see that the bitmap image will suffer from pixelation while the vector graphic’s quality will remain intact.</p>
<p>Here are 7 of our favourite websites. Without registration you&#8217;ll be able to download free vector grpahics of various categories which will help you with your designs. the common formats you will find will be .eps, .ai, .ps and .pdf. We have chosen the following websites as they have a diverse range of different goodies to snatch up!</p>
<h3>7 of the best Free Vectors Websites</h3>
<p><strong><a href="http://www.vecteezy.com/">Vecteezy</a></strong></p>
<p><img src="http://www.timecodestudios.com.au/blog/wp-content/uploads/vector-img-01.jpg" alt="vector-img-01" width="500" height="260" /></p>
<p>Vecteezy is an index of Free Vector Graphics available for download by some of the best artists around the world</p>
<p><strong><a href="http://freevectorgraphics.net/">Free Vector Graphics.Net</a></strong></p>
<p><img src="http://www.timecodestudios.com.au/blog/wp-content/uploads/vector-img-04.jpg" alt="vector-img-04" width="500" height="260" /></p>
<p>Contains a select collection of vectors through categories such as Icon, Nature, Abstract and more. It also allows you to leave comments, tips, and hints on their vectors.</p>
<p><strong><a href="http://qvectors.com/">QVectors</a></strong></p>
<p><img src="http://www.timecodestudios.com.au/blog/wp-content/uploads/vector-img-02.jpg" alt="vector-img-02" width="500" height="260" /></p>
<p>Similar to Vecteezy, on this site you’re also able to submit your own vector graphics allowing you to gain exposure and recognition. Most of the files are in EPS format and licensed under <a href="http://en.wikipedia.org/wiki/Creative_Commons">Creative Commons</a>.</p>
<p><strong><a href="http://123freevectors.com/">123 Free Vectors</a></strong></p>
<p><img src="http://www.timecodestudios.com.au/blog/wp-content/uploads/vector-img-03.jpg" alt="vector-img-03" width="500" height="260" /></p>
<p>This site offers a high quality stock of vectors with categories ranging from animal to vintage. You’ll find 72 pages of creative graphics carrying over 840+ free vectors.</p>
<p><strong><a href="http://www.vectorart.org/">Vector Art.Org</a></strong></p>
<p><img src="http://www.timecodestudios.com.au/blog/wp-content/uploads/vector-img-09.jpg" alt="vector-img-09" width="500" height="260" /></p>
<p>VectorArt.org houses a great selection of free vector graphics downloadable in several file formats including EPS, AI and PDF. You’re easily able to scan for graphics while similar to FreeVectorGraphics.net you can vote for your favourites.</p>
<p><strong><a href="http://www.vectorvalley.com/">Vector Valley</a></strong></p>
<p><img src="http://www.timecodestudios.com.au/blog/wp-content/uploads/vector-img-05.jpg" alt="vector-img-05" width="500" height="260" /></p>
<p>Vector Valley is a vectorial gallery showcasing quality graphics and artworks in various formats such as EPS, AI, CDR, and SVG. Vector Valley also offers additional tools such as Vector Tutorials, Illustrators Profiles, and more.</p>
<p><strong><a href="http://www.freevectors.net/">Free Vectors.Net</a></strong></p>
<p><img src="http://www.timecodestudios.com.au/blog/wp-content/uploads/vector-img-07.jpg" alt="vector-img-07" width="500" height="260" /></p>
<p>Their goal is to make the vectors as easy to search as possible. You can also participate on the site by submitting any possible vectors you’ve created or links to vectors you haven’t seen stocked on the site.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.timecodestudios.com.au/blog/our-favourite-free-vectors-websites/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>
