<?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>athe.la blog &#187; usability</title>
	<atom:link href="http://blog.athe.la/category/usability/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.athe.la</link>
	<description>how to internets with style</description>
	<lastBuildDate>Mon, 30 Jan 2012 20:37:35 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>Weird iOS App Store Parsing Error</title>
		<link>http://blog.athe.la/weird-ios-app-store-parsing-error/</link>
		<comments>http://blog.athe.la/weird-ios-app-store-parsing-error/#comments</comments>
		<pubDate>Tue, 13 Dec 2011 10:05:35 +0000</pubDate>
		<dc:creator>Dan Cooper</dc:creator>
				<category><![CDATA[bug]]></category>
		<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://blog.athe.la/?p=422</guid>
		<description><![CDATA[Every so often I get this bit of text that says &#8220;K2.HTML.Lockup.Updated&#8221; below the apps in the app store.  Anyone know what it means? I tweeted about it and didn&#8217;t get any tweets back but I got a lot of hits on this website when that phrase came up in my twitter feed. Looks like <a href='http://blog.athe.la/weird-ios-app-store-parsing-error/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>Every so often I get this bit of text that says &#8220;K2.HTML.Lockup.Updated&#8221; below the apps in the app store.  Anyone know what it means?</p>
<div id="attachment_423" class="wp-caption aligncenter" style="width: 310px"><a href="http://blog.athe.la/wp-content/uploads/2011/12/K2.HTML.Lockup.Updated.jpg"><img class="size-medium wp-image-423" title="K2.HTML.Lockup.Updated" src="http://blog.athe.la/wp-content/uploads/2011/12/K2.HTML.Lockup.Updated-300x225.jpg" alt="" width="300" height="225" /></a><p class="wp-caption-text">Sometimes it says &quot;K2.HTML.Lockup.Updated&quot; and sometimes it says &quot;K2.HTML.Lockup.Upd...&quot;</p></div>
<p>I tweeted about it and didn&#8217;t get any tweets back but I got a lot of hits on this website when that phrase came up in my twitter feed.  Looks like many other people are getting it to.</p>
<!-- tweet id : 144543253205757954 --><style type='text/css'>#bbpBox_144543253205757954 a { text-decoration:none; color:#CC3366; }#bbpBox_144543253205757954 a:hover { text-decoration:underline; }</style><div id='bbpBox_144543253205757954' class='bbpBox' style='padding:20px; margin:5px 0; background-color:#DBE9ED; background-image:url(http://a1.twimg.com/images/themes/theme17/bg.gif); background-repeat:no-repeat'><div style='background:#fff; padding:10px; margin:0; min-height:48px; color:#333333; -moz-border-radius:5px; -webkit-border-radius:5px;'><span style='width:100%; font-size:18px; line-height:22px;'>iOS App store parsing error :) K2.HTML.LOCKUP.UPDATED <a href="http://t.co/NSUW5TU4" rel="nofollow">http://t.co/NSUW5TU4</a></span><div class='bbp-actions' style='font-size:12px; width:100%; padding:5px 0; margin:0 0 10px 0; border-bottom:1px solid #e6e6e6;'><img align='middle' src='http://blog.athe.la/wp-content/plugins/twitter-blackbird-pie//images/bird.png' /><a title='tweeted on December 7, 2011 10:26 pm' href='http://twitter.com/#!/soniiic/status/144543253205757954' target='_blank'>December 7, 2011 10:26 pm</a> via <a href="http://twitter.com/#!/download/ipad" rel="nofollow" target="blank">Twitter for iPad</a><a href='https://twitter.com/intent/tweet?in_reply_to=144543253205757954' class='bbp-action bbp-reply-action' title='Reply'><span><em style='margin-left: 1em;'></em><strong>Reply</strong></span></a><a href='https://twitter.com/intent/retweet?tweet_id=144543253205757954' class='bbp-action bbp-retweet-action' title='Retweet'><span><em style='margin-left: 1em;'></em><strong>Retweet</strong></span></a><a href='https://twitter.com/intent/favorite?tweet_id=144543253205757954' class='bbp-action bbp-favorite-action' title='Favorite'><span><em style='margin-left: 1em;'></em><strong>Favorite</strong></span></a></div><div style='float:left; padding:0; margin:0'><a href='http://twitter.com/intent/user?screen_name=soniiic'><img style='width:48px; height:48px; padding-right:7px; border:none; background:none; margin:0' src='http://a2.twimg.com/profile_images/1521812487/image_normal.jpg' /></a></div><div style='float:left; padding:0; margin:0'><a style='font-weight:bold' href='http://twitter.com/intent/user?screen_name=soniiic'>@soniiic</a><div style='margin:0; padding-top:2px'>Dan Cooper</div></div><div style='clear:both'></div></div></div><!-- end of tweet -->
<p>I&#8217;m guessing it&#8217;s a parsing error and it&#8217;s what Apple use to display that particular app&#8217;s last updated date.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.athe.la/weird-ios-app-store-parsing-error/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Fixing the flyout delay in the Sharepoint dynamic navigation</title>
		<link>http://blog.athe.la/fixing-the-flyout-delay-in-the-sharepoint-dynamic-navigation/</link>
		<comments>http://blog.athe.la/fixing-the-flyout-delay-in-the-sharepoint-dynamic-navigation/#comments</comments>
		<pubDate>Thu, 19 Aug 2010 15:37:34 +0000</pubDate>
		<dc:creator>Dan Cooper</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[SharePoint]]></category>
		<category><![CDATA[usability]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[navigation]]></category>

		<guid isPermaLink="false">http://blog.athe.la/?p=317</guid>
		<description><![CDATA[Sharepoint has a nasty habbit of keep navigation flyouts on the screen for a good second before they hide.  This is probably to aid accessibility where a user might not have precise mouse control.  However if you&#8217;re a good designer then you should have plenty of large clickable navigation menu items and plenty of white <a href='http://blog.athe.la/fixing-the-flyout-delay-in-the-sharepoint-dynamic-navigation/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>Sharepoint has a nasty habbit of keep navigation flyouts on the screen for a good second before they hide.  This is probably to aid accessibility where a user might not have precise mouse control.  However if you&#8217;re a good designer then you should have plenty of large clickable navigation menu items and plenty of white space.</p>
<p>When rolling over a number of flyouts quickly, the user sees all the flyouts shown on the screen at once which looks rubbish.  To remove the delay altogether use this css in your page somewhere:</p>
<pre class="brush: css; title: ; notranslate">
li.hover-off&gt;ul
{
    display:none;
}
</pre>
<p>The way it works is when you hover over an item in the nav the built in sharepoint javascript adds a css class called &#8220;hover&#8221; and as soon as your mouse leaves the area it changes the class to &#8220;hover-off&#8221; for 1 second before removing it completely. This CSS will hide the unordered list directly below the list item that has the class &#8220;hover-off&#8221; thus hiding the flyout as soon as your mouse leaves the parent.</p>
<p>(P.s. this kind of flyout navigation can be set up by setting the &#8216;MaximumDynamicDisplayLevels&#8217; attribute of the SharePoint:AspMenu control)</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.athe.la/fixing-the-flyout-delay-in-the-sharepoint-dynamic-navigation/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Emphasising Primary Actions on User Input Forms</title>
		<link>http://blog.athe.la/emphasising-primary-actions-on-user-input-forms/</link>
		<comments>http://blog.athe.la/emphasising-primary-actions-on-user-input-forms/#comments</comments>
		<pubDate>Thu, 04 Feb 2010 22:43:22 +0000</pubDate>
		<dc:creator>Dan Cooper</dc:creator>
				<category><![CDATA[HTML]]></category>
		<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://atheladev.wordpress.com/?p=169</guid>
		<description><![CDATA[A pretty simple philosophy: If you make the primary action on a form or web page stand out, users will be more likely to click it. By emphasising these buttons or actions you are attempting to draw the user&#8217;s focus toward it.  And by primary action, I mean the submit, send, save etc buttons; actions <a href='http://blog.athe.la/emphasising-primary-actions-on-user-input-forms/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>A pretty simple philosophy: If you make the primary action on a form or web page stand out, users will be more likely to click it. By emphasising these buttons or actions you are attempting to draw the user&#8217;s focus toward it.  And by primary action, I mean the submit, send, save etc buttons; actions where the user is making progress. Secondary actions could be buttons like back, undo or cancel</p>
<p>There are a number of ways to emphasise the primary action. One of the easiest and yet still effective methods is to colour the button brightly to draw attention. Similarly you could reduce the saturation of the cancel button. The human eye is drawn to areas of colour which stand out from the page. Also culturally the colour green is associated with a positive action and so if the user is in a hurry or just speedily going through the form, when they see the green button they will know it&#8217;s the button that submits the information. Chances are that they won&#8217;t actually read the text of the button!</p>
<p><a rel="attachment  wp-att-203" href="http://blog.athe.la/2010/02/emphasising-primary-actions-on-user-input-forms/omg-aliens/"><img class="aligncenter size-full  wp-image-203" title="facebook blue send" src="http://blog.athe.la/wp-content/uploads/2010/01/omg-aliens.png" alt="" width="618" height="360" /></a></p>
<p><span id="more-169"></span>Notice how the send button is all bright and cheery in the facebook-blue colour whereas the cancel button is grey and boring.  Other methods are also just as effective such as using a text link for the cancel action instead of a button.  This is the one I much prefer as it informs the user that by pressing the link, it&#8217;s not going to post anything they&#8217;ve typed in on the form.  Perhaps less tech-savvy users might think the cancel button would perform some function if they typed in their order details and requested to &#8216;Cancel&#8217; the order.  A link would completely resolve any issues as a normal web user knows that a link just redirects to a different page (in most cases).</p>
<p>Below we see a text link being used to give the user the opportunity to cancel the submission and return to where they came from.</p>
<p><a rel="attachment  wp-att-204" href="http://blog.athe.la/2010/02/emphasising-primary-actions-on-user-input-forms/omg-watches/"><img class="aligncenter size-full wp-image-204" title="omg-watches" src="http://blog.athe.la/wp-content/uploads/2010/01/omg-watches.png" alt="" width="433" height="490" /></a></p>
<p>Also it might be worth noting that rarely is the &#8216;reset&#8217; button used on forms now.  I don&#8217;t know why it ever caught on in the first place anyway&#8230; Who wants to fill out an entire form and then scroll to the bottom and press reset?  It provides functionality that I&#8217;m sure was never used and when it was used it was never intended(!)</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.athe.la/emphasising-primary-actions-on-user-input-forms/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

