<?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>Usability Thoughts &#187; VS</title>
	<atom:link href="http://usabilitythoughts.com/category/vs/feed" rel="self" type="application/rss+xml" />
	<link>http://usabilitythoughts.com</link>
	<description>content meets user</description>
	<lastBuildDate>Tue, 08 Jun 2010 14:07:20 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Collapsible panels vs. Tabs</title>
		<link>http://usabilitythoughts.com/collapsible-panels-vs-tabs.html</link>
		<comments>http://usabilitythoughts.com/collapsible-panels-vs-tabs.html#comments</comments>
		<pubDate>Mon, 18 May 2009 07:25:35 +0000</pubDate>
		<dc:creator>Adrian</dc:creator>
				<category><![CDATA[Patterns]]></category>
		<category><![CDATA[VS]]></category>
		<category><![CDATA[collapsible]]></category>
		<category><![CDATA[pannels]]></category>
		<category><![CDATA[tabs]]></category>

		<guid isPermaLink="false">http://usabilitythoughts.com/?p=144</guid>
		<description><![CDATA[Both of these patterns are used for the same thing: squeezing a lot of content into a limited area of a (web) page. Although they can save a lot of space, the content you insert using them is limited  to an amount by the size of the area you&#8217;re filling. Which is better? The [...]]]></description>
			<content:encoded><![CDATA[<p>Both of these patterns are used for the same thing: squeezing a lot of content into a limited area of a (web) page. Although they can save a lot of space, the content you insert using them is limited  to an amount by the size of the area you&#8217;re filling. Which is better? The one which suits your needs, let&#8217;s take them one by one:</p>
<h2>TABS:</h2>
<p>Tabs are one of the patterns known by about everyone. Designed well, they don&#8217;t make any problems to the user. The first use of tabs (I think) was the paper folders filing systems used in cabinets. </p>
<p><img src="http://usabilitythoughts.com/wp-content/uploads/2009/05/yui_tabs.png" alt="yui_tabs" title="yui_tabs" width="423" height="172" class="alignnone size-full wp-image-145" /></p>
<p><strong>Advantages:</strong><br />
- very familiar to users<br />
- easy to use<br />
- the height of the tabs area can be unlimited</p>
<p><img src="http://usabilitythoughts.com/wp-content/uploads/2009/05/yahoo_home.png" alt="yahoo_home" title="yahoo_home" width="305" height="225" class="alignnone size-full wp-image-147" /></p>
<p><strong>Disadvantages:</strong><br />
- tabs don&#8217;t work with long tab names<br />
- they don&#8217;t do well in tight spaces either<br />
- 2 tab bars is not an option so you are limited to a relatively small number of tabs</p>
<h2>COLLAPSIBLE PANELS:</h2>
<p><img src="http://usabilitythoughts.com/wp-content/uploads/2009/05/collapsible_dojo.png" alt="collapsible_dojo" title="collapsible_dojo" width="237" height="176" class="alignnone size-full wp-image-149" /></p>
<p>A little tricky to use for beginner users, but still quite intuitive and sort of familiar (used in desktop applications and operating systems). Make sure they have a &#8220;collapsible hint&#8221; like &#8220;+/-&#8221; or a down arrow like this:</p>
<p><img src="http://usabilitythoughts.com/wp-content/uploads/2009/05/vista_collapse.png" alt="vista_collapse" title="vista_collapse" width="113" height="94" class="alignnone size-full wp-image-148" /></p>
<p><strong>Advantages:</strong><br />
- work well long names (as long as the width of the area)<br />
- you can open two at the same time (if they are build that way and you afford the space)<br />
- work well in tight spaces</p>
<p><img src="http://usabilitythoughts.com/wp-content/uploads/2009/05/adobe_collapse.png" alt="adobe_collapse" title="adobe_collapse" width="312" height="351" class="alignnone size-full wp-image-150" /></p>
<p><strong>Disadvantages:</strong><br />
- height consuming<br />
- less obvious than tabs<br />
- they look silly if used on full width<br />
- it&#8217;s easier to mess their design and get a usability fail</p>
]]></content:encoded>
			<wfw:commentRss>http://usabilitythoughts.com/collapsible-panels-vs-tabs.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Links vs. buttons</title>
		<link>http://usabilitythoughts.com/links-vs-buttons.html</link>
		<comments>http://usabilitythoughts.com/links-vs-buttons.html#comments</comments>
		<pubDate>Sun, 26 Apr 2009 19:48:55 +0000</pubDate>
		<dc:creator>Adrian</dc:creator>
				<category><![CDATA[Good practices]]></category>
		<category><![CDATA[VS]]></category>
		<category><![CDATA[actions]]></category>
		<category><![CDATA[buttons]]></category>
		<category><![CDATA[links]]></category>
		<category><![CDATA[submit]]></category>

		<guid isPermaLink="false">http://usabilitythoughts.com/?p=40</guid>
		<description><![CDATA[When dealing with webpages, some usability experts say we should use links when the user is gonna get on a different page and buttons when the user makes an action.

Link to another page &#187; &#160; vs. &#160; Submit

I don&#8217;t really care. I don&#8217;t care because users don&#8217;t care. 
Let&#8217;s get things a little further, what&#8217;s [...]]]></description>
			<content:encoded><![CDATA[<p>When dealing with webpages, some usability experts say we should use links when the user is gonna get on a different page and buttons when the user makes an action.</p>
<div style="border: 1px solid #eaeaea; text-align: center; padding: 20px; margin-top:10px; margin-bottom:10px;">
<a href="#" style="font-weight: bold; color: #009966;">Link to another page &raquo;</a> &nbsp; vs. &nbsp; <button>Submit</button>
</div>
<p>I don&#8217;t really care. I don&#8217;t care because <strong>users don&#8217;t care</strong>. </p>
<p>Let&#8217;s get things a little further, what&#8217;s a button? Does it have to have borders? Different color? </p>
<p>Is a icon followed by a link really a link or a button? I see those things like buttons, others see it like &#8220;fancy links&#8221; or &#8220;descriptive links&#8221; or &#8220;visual links&#8221;. </p>
<p>One thing i agree with, though: forms should have <strong>&#8220;hard to miss&#8221; primary action button</strong>, you cannot put a link there mainly because it will not be a &#8220;primary action&#8221;, there are other links on a page so the weight of a &#8220;submit link&#8221; won&#8217;t be so different.</p>
]]></content:encoded>
			<wfw:commentRss>http://usabilitythoughts.com/links-vs-buttons.html/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
	</channel>
</rss>
