<?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>CSSAddict &#187; Web Standards</title>
	<atom:link href="http://www.cssaddict.com/topics/blog/web-standards-blog/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.cssaddict.com</link>
	<description>Web Design Concepts</description>
	<lastBuildDate>Fri, 23 Jul 2010 19:06:29 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Web 2.0 design secrets</title>
		<link>http://www.cssaddict.com/blog/web-20-design-secrets/</link>
		<comments>http://www.cssaddict.com/blog/web-20-design-secrets/#comments</comments>
		<pubDate>Mon, 07 Apr 2008 09:23:16 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Blog]]></category>
		<category><![CDATA[General Discussion]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Web Standards]]></category>

		<guid isPermaLink="false">http://www.cssaddict.com/blog/web-20-design-secrets/</guid>
		<description><![CDATA[The common use of visual design elements, have some way or another created a new wave in web design that many of us would refer to as a &#8220;web 2.0 design&#8220;. It just so happened that by the time web 2.0 was happening, this new trend in web design was leaving its mark on the [...]]]></description>
			<content:encoded><![CDATA[<p>The common use of visual design elements, have some way or another created a <em>new wave</em> in web design that many of us would refer to as a &#8220;<strong>web 2.0 design</strong>&#8220;. It just so happened that by the time web 2.0 was happening, this new trend in web design was leaving its mark on the web. The main features of a &#8220;<strong>web 2.0 design</strong>&#8221; are development with web standards, particularly CSS and XHTML, as well as dynamic content and participation of the end-users. But, what about the design, the visual part of it?</p>
<p><span id="more-44"></span></p>
<p>Most web 2.0 websites or online applications do share some visual characteristics that make their interface more user-friendly compared to the web 1.0 websites.</p>
<h3>So what are the secrets of a web 2.0 design?</h3>
<p><strong>A clean and simple layout that focuses mostly on the content design other than the whole page environment in itself,</strong></p>
<p><a href="http://omniti.com/"><img src="http://www.cssaddict.com/wp-content/uploads/2008/04/layout.jpg" alt="layout.jpg" /></a></p>
<p><strong>Bigger fonts on text,</strong></p>
<p><a href="http://donttrustthisguy.com/"><img src="http://www.cssaddict.com/wp-content/uploads/2008/04/typo2.jpg" alt="typo2.jpg" /><br />
</a></p>
<p><strong>White space, allows for easier read of the content</strong></p>
<p><a href="http://www.wishlistr.com/"><img src="http://www.cssaddict.com/wp-content/uploads/2008/04/whitespace.jpg" alt="whitespace.jpg" /></a></p>
<p><strong>Use of illustrations, either in logos or in icons</strong></p>
<p><a href="http://www.culturedcode.com/"><img src="http://www.cssaddict.com/wp-content/uploads/2008/04/e3d.jpg" alt="e3d.jpg" /></a><br />
<strong> 3D effects on buttons and badges</strong></p>
<p><a href="http://eden.cc/"><img src="http://www.cssaddict.com/wp-content/uploads/2008/04/logos.jpg" alt="logos.jpg" /></a><br />
<strong> Neutral background colours</strong></p>
<p><a href="http://www.springloops.com/"><img src="http://www.cssaddict.com/wp-content/uploads/2008/04/neutral.jpg" alt="neutral.jpg" /></a></p>
<p>If there&#8217;s any other web 2.0 feature that you know of, please do share it with us.</p>
<p>Any great web 2.0 designs are more than welcome for listing!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.cssaddict.com/blog/web-20-design-secrets/feed/</wfw:commentRss>
		<slash:comments>14</slash:comments>
		</item>
		<item>
		<title>Convert Pixels to relative Em units</title>
		<link>http://www.cssaddict.com/blog/convert-pixels-to-relative-em-units/</link>
		<comments>http://www.cssaddict.com/blog/convert-pixels-to-relative-em-units/#comments</comments>
		<pubDate>Thu, 20 Mar 2008 13:32:00 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Blog]]></category>
		<category><![CDATA[Tools & Resources]]></category>
		<category><![CDATA[Web Standards]]></category>

		<guid isPermaLink="false">http://www.cssaddict.com/blog/convert-pixels-to-relative-em-units/</guid>
		<description><![CDATA[Em is generally known as the most effective font unit in CSS content development, because it is relative to the body text size of the page. So, each of your elements is sized relatively according to your current font size. Adding these units to margin and heights of divs will allow a proportional sizing, again [...]]]></description>
			<content:encoded><![CDATA[<p>Em is generally known as the most effective font unit in CSS content development, because it is relative to the body text size of the page. So, each of your elements is sized relatively according to your current font size. Adding these units to margin and heights of divs will allow a proportional sizing, again according to the text size. In extend, this method will promote accessibility in your page.</p>
<p><span id="more-37"></span>A pixel unit on the other hand, is a pixel unit. It is easy to use and remain constant in value, regardless of your body text size. It does require some accurate calculations though (which does make it a bit of pain sometimes). Not to mention that not all users see it the same way. There are many articles online regarding the advantages of em and disadvantages of using pixel units.</p>
<p>Now, the question is how do I proceed to changing my pixel units to relative em units? There&#8217;s a great article at <a title="Em units - how to" href="http://www.clagnut.com/blog/348/">clagnut&#8217;s blog</a> that will guide you through this process. Again, if you&#8217;re new to this (like I am), it can be painful and you might just feel like going back to pixels, since it is much more familiar.</p>
<p>Or, you can just get an online em calculator that will calculate your pixels to em units. I think the most know is <a href="http://riddle.pl/emcalc/">Riddle&#8217;s Em Calculator</a>.</p>
<p>Recently, I&#8217;ve come accross James Whittaker&#8217;s calculator that also provides the line height of your text. It gives you the full CSS rule for your element, ready to copy and paste on your stylesheet. You can check it out <a href="http://www.jameswhittaker.com/blog/article/em-based-layouts-vertical-rhythm-calculator/">here</a>. You can also install on your hard drive and have easier access on it. I love it!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.cssaddict.com/blog/convert-pixels-to-relative-em-units/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Web Standards &amp; Open Source</title>
		<link>http://www.cssaddict.com/blog/web-standards-open-source/</link>
		<comments>http://www.cssaddict.com/blog/web-standards-open-source/#comments</comments>
		<pubDate>Tue, 18 Dec 2007 14:53:52 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Blog]]></category>
		<category><![CDATA[Web Standards]]></category>
		<category><![CDATA[open source]]></category>
		<category><![CDATA[web standards]]></category>

		<guid isPermaLink="false">http://www.cssaddict.com/blog/web-standards-open-source/</guid>
		<description><![CDATA[It seems that more and more open source projects are taking interest in Web Standards and clean validated code. Very few CMS projects out there are 100% XHTML and CSS valid, therefore the need to come up with quality code has been emerging even more. We are talking about future compatibility and accessibility, something that [...]]]></description>
			<content:encoded><![CDATA[<p>It seems that more and more open source projects are taking interest in Web Standards and clean validated code. Very few CMS projects out there are 100% XHTML and CSS valid, therefore the need to come up with quality code has been emerging even more. We are talking about future compatibility and accessibility, something that is of everyone’s best interest. One of the main problems regarding these projects is laying on the output of editors.</p>
<p><span id="more-22"></span></p>
<p>If we are to develop a website for a client that needs to update a website on his own, an editor that outputs valid XHTML code is a must. Such editors are certainly not for free. One of the best I’ve come across is <a onclick="javascript:urchinTracker ('/outbound/www.xstandard.com');" href="http://www.xstandard.com/">xstandard</a> that recently has developed a free light version for commercial use. Mind you, I haven’t seen it integrated in any open source project just yet.<br />
Open source is a big hit on ecommerce projects, too. There are a few noteworthy effords on this, such as the so-talked-about <a onclick="javascript:urchinTracker ('/outbound/www.freecsscart.com');" href="http://www.freecsscart.com/index.php/feature-list/">freecsscart</a>, that, unfortunately, is still under development and no-one really knows if they’ll ever release it. A similar idea comes from <a onclick="javascript:urchinTracker ('/outbound/www.tradingeye.com');" href="http://www.tradingeye.com/">tradingeye</a>, although is not free, something that is totally understandable, as valid code in such projects is definitely not an easy task.</p>
<p>People that contribute on open source projects, cannot afford to invest much time on it as noone is really paying them to do it. It seems that we get what we paid for and that’s only fair.</p>
<p>UPDATE: Movable Type&#8217;s publishing platform in now an Open Source project and is available for <a title="MovableType Open Source" href="http://www.movabletype.org/">download.</a> This is definitely something worth looking at, since Movable Type has been a paid project for quite a while.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.cssaddict.com/blog/web-standards-open-source/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Accessible Search</title>
		<link>http://www.cssaddict.com/blog/accessible-search/</link>
		<comments>http://www.cssaddict.com/blog/accessible-search/#comments</comments>
		<pubDate>Fri, 07 Dec 2007 19:52:56 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Blog]]></category>
		<category><![CDATA[Web Standards]]></category>
		<category><![CDATA[accesibility]]></category>

		<guid isPermaLink="false">http://www.cssaddict.com/blog/accessible-search/</guid>
		<description><![CDATA[Google accessible Search is a totally new introduction of a search engine that displays results by accessibility of websites and then SEO optimization. As Google explains: “Accessible Search is an early Google Labs product designed to identify and prioritize search results that are more easily usable by blind and visually impaired users. Regular Google search [...]]]></description>
			<content:encoded><![CDATA[<p class="entrybody">Google accessible Search is a totally new introduction of a search engine that displays results by accessibility of websites and then SEO optimization. As Google explains: “Accessible Search is an early Google Labs product designed to identify and prioritize search results that are more easily usable by blind and visually impaired users.</p>
<p class="entrybody"><span id="more-21"></span></p>
<p>Regular Google search helps you find a set of documents that is most relevant to your tasks. Accessible Search goes one step further by helping you find the most accessible pages in that result set.” We are still expecting to see the results of this new product by Google. The company’s target is to make web design companies create more accessible and usable websites for all and ultimately attract a higher number of internet users.</p>
<p>Google once again presents innovation that other search engines will be bound to follow.</p>
<p>A demonstration can be found <a onclick="javascript:urchinTracker ('/outbound/labs.google.com');" href="http://labs.google.com/accessible">here </a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.cssaddict.com/blog/accessible-search/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>
