<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>
<meta name="keywords" content="thinkquest,web,toolkit,design,development,internet,websites,site,html,xhtml,css" />
<meta name="description" content="A web building guide for ThinkQuesters" />
<meta name="revised" content="ttk, 08/04/07" />

<title>TQ Toolkit - Design and Graphics</title>

<link rel="shortcut icon" href="images/favicon.ico" /> 
<link rel="stylesheet" href="styles/copy.css" media="print" />

</head>

<body><!-- tql_banner_head --><script type="text/javascript" src="/banner/banner.js"></script></script><script>tql_drawTop();</script>
<a id="top" style="display:block"></a>
<br />
<a class="external" href="#contentarea" onclick="ajaxpage('toolkit.html','content');ajaxpage('navigator002.html','Answer12');">Toolkit</a> &gt; Design and Graphics <br />
<img src="pictures/design.jpg" width="100%" height="150px" alt="design"/>
<p class="contenttext">
The design and graphics used on a site often shapes the first impression on the viewer. Stunning graphics are great, but should be used appropriately for the web. Let's explore how.
</p>

<h2 class="subtitle">Sub-Sections</h2>
<a class="showhide" id="Answer22" onclick="showHide(22);showHide(23);">Show</a>
<div id="Answer23">
<a class="showhide" onclick="showHide(22);showHide(23);">Hide</a>
<ul class="contenttext">
	<li><a class="external" href="#contentarea" onclick="ajaxpage('colors.html','content');ajaxpage('navigator014.html','Answer12');">Colors</a> - All about colors for the web</li>
	<li><a class="external" href="#contentarea" onclick="ajaxpage('typography.html','content');ajaxpage('navigator014.html','Answer12');">Typography</a> - Typeface, text size and color, white space and alignment for your website</li>
	<li><a class="external" href="#contentarea" onclick="ajaxpage('images.html','content');ajaxpage('navigator014.html','Answer12');">Images</a> - Graphics sources and formats</li>
	<li><a class="external" href="#contentarea" onclick="ajaxpage('layout.html','content');ajaxpage('navigator014.html','Answer12');">Layout</a> - Find a layout most suitable for your site</li>
	<li><a class="external" href="#contentarea" onclick="ajaxpage('designconclusion.html','content');ajaxpage('navigator014.html','Answer12');">Conclusion</a> - Check what you should have learnt from this section</li>
</ul>
</div>

<div id="references">Acknowledgments: <br />
<ol>
<li><a href="http://www.blistered.org" class="external" rel="external">Blistered.org</a> for Main Header Design</li>
<li><a href="http://Paulw.deviantart.com" class="external" rel="external">Paulw.deviantart.com</a> for Design & Graphics Header Design</li>

  </ol>
 </div>
<a href="#top"><span class="hidden" style="display:none;cursor:pointer;color:#FF6633;">TOP</span><img src="images/top.jpg" class="topbut" alt="Top" /></a>
<!-- tql_banner_foot --><script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-174705-4']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ga); })(); </script></body>
</html>