<?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/"
	xmlns:georss="http://www.georss.org/georss" xmlns:geo="http://www.w3.org/2003/01/geo/wgs84_pos#" xmlns:media="http://search.yahoo.com/mrss/"
	>

<channel>
	<title>UX Centered Blog</title>
	<atom:link href="http://uxcentered.wordpress.com/feed/" rel="self" type="application/rss+xml" />
	<link>http://uxcentered.wordpress.com</link>
	<description>Just another WordPress.com weblog</description>
	<lastBuildDate>Tue, 02 Feb 2010 22:13:26 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.com/</generator>
<cloud domain='uxcentered.wordpress.com' port='80' path='/?rsscloud=notify' registerProcedure='' protocol='http-post' />
<image>
		<url>http://s2.wp.com/i/buttonw-com.png</url>
		<title>UX Centered Blog</title>
		<link>http://uxcentered.wordpress.com</link>
	</image>
	<atom:link rel="search" type="application/opensearchdescription+xml" href="http://uxcentered.wordpress.com/osd.xml" title="UX Centered Blog" />
	<atom:link rel='hub' href='http://uxcentered.wordpress.com/?pushpress=hub'/>
		<item>
		<title>Usability Guidelines for Heuristic Evaluation</title>
		<link>http://uxcentered.wordpress.com/2009/12/27/hello-world/</link>
		<comments>http://uxcentered.wordpress.com/2009/12/27/hello-world/#comments</comments>
		<pubDate>Sun, 27 Dec 2009 06:40:13 +0000</pubDate>
		<dc:creator>uxcentered</dc:creator>
				<category><![CDATA[Content Evaluation]]></category>
		<category><![CDATA[Information Architecture]]></category>
		<category><![CDATA[404 page]]></category>
		<category><![CDATA[error tolerance]]></category>
		<category><![CDATA[evaluation]]></category>
		<category><![CDATA[guidelines]]></category>
		<category><![CDATA[heuristic evaluation]]></category>
		<category><![CDATA[heuristics]]></category>
		<category><![CDATA[IA]]></category>
		<category><![CDATA[minesweep]]></category>
		<category><![CDATA[navigation]]></category>
		<category><![CDATA[scrolling]]></category>
		<category><![CDATA[site log]]></category>
		<category><![CDATA[site map]]></category>
		<category><![CDATA[task analysis]]></category>
		<category><![CDATA[usability]]></category>
		<category><![CDATA[UX]]></category>
		<category><![CDATA[webdesign]]></category>
		<category><![CDATA[website]]></category>

		<guid isPermaLink="false"></guid>
		<description><![CDATA[I have read quite a few blogs and articles on Heuristic Evaluation and learnt about the theory-based approach for performing it but failed to find detailed heuristics for evaluating a website. The Heuristics I have read so far are more on evaluating a system/web application than for a website. So this post walks through the process for conducting Heuristic Evaluation and lists various usability guidelines (heuristics) for evaluating a website.<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=uxcentered.wordpress.com&amp;blog=11121284&amp;post=1&amp;subd=uxcentered&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
			<content:encoded><![CDATA[<p>I have read quite a few blogs and articles on Heuristic Evaluation and learnt about the theory-based approach for performing it but failed to find detailed heuristics for evaluating a website. The Heuristics I have read so far are more on evaluating a system/web application than for a website. So this post walks through the process for conducting Heuristic Evaluation and lists various usability guidelines (heuristics) for evaluating a website.</p>
<p>Heuristic Evaluation is evaluating the website based on usability principles (heuristics) and identifying the major usability problems with the website as well as evaluating the things which need to be retained from the existing website. One very important point to note here (which is missed by most of us) is the output of the Heuristic Evaluation should also consist of features/things which should be retained from the existing website.  Heuristic Evaluation is a very important and necessary step, which should be conducted in the early stages of re-designing a website.</p>
<p>Heuristic Evaluation is best if performed by someone outside of the organization, to get a third person and a fresh perspective about the website. So it is necessary to conduct it before reviewing any of the existing materials to avoid any bias evaluations.</p>
<p><span style="font-weight:bold;"><span style="text-decoration:underline;">Process for conducting the Heuristic Evaluation</span></span> (example is presented along with the steps)</p>
<p style="text-align:center;"><a href="http://uxcentered.files.wordpress.com/2009/12/heuristics1.png"><img class="aligncenter size-full wp-image-29" title="Heuristics evaluation process (click to enlarge)" src="http://uxcentered.files.wordpress.com/2009/12/heuristics1.png?w=510" alt=""   /></a></p>
<p style="text-align:center;">
<p style="text-align:center;">
<p><span style="font-weight:bold;">Choose number of Evaluators</span></p>
<p>As per Jakob Nielsen&#8217;s study, it is difficult for one evaluator to point out all the usability problems. So he recommends, 3 to 5 evaluators can typically point out 80% &#8211; 90% of the usability problems. Although if you can’t arrange for more evaluators remember one evaluator is better than none!</p>
<p><span style="font-weight:bold;">Identify and define the goals of the website</span></p>
<p>For e.g.:</p>
<ul>
<li>Educate      people about Cancer Prevention and early detection</li>
<li>Users      should find the information easily</li>
<li>Get      people involved</li>
<li>Get      more donations</li>
<li>Attract      more sponsors and grant funders</li>
</ul>
<p><span style="font-weight:bold;">Define a set of tasks to be performed on the website</span></p>
<p>Consider the above mentioned goals of the website and define the tasks that are critical to the site&#8217;s success. The tasks should be clear and precise.</p>
<p>For e.g.:</p>
<ul>
<li>Navigate      the website to find information about how to prevent cancer.</li>
<li>Look      for information about upcoming events being organized.</li>
<li>Make      a contribution to the organization (stop the process when they ask for      card details).</li>
</ul>
<p><span style="font-weight:bold;">Perform the tasks and evaluate the website</span></p>
<p>Perform the defined tasks on the website and based on the following Heuristics and usability guidelines evaluate the website (all the usability guidelines might not be relevant to your site).</p>
<p style="text-align:center;"><a href="http://uxcentered.files.wordpress.com/2009/12/heuristics_points2.png"><img class="aligncenter size-full wp-image-26" title="Website usability heuristics " src="http://uxcentered.files.wordpress.com/2009/12/heuristics_points2.png?w=510" alt=""   /></a></p>
<table>
<tbody>
<tr>
<td><img class="alignleft size-thumbnail wp-image-34" title="home" src="http://uxcentered.files.wordpress.com/2009/12/home2.jpg?w=33&#038;h=34" alt="" width="33" height="34" /></td>
<td><strong> Home Page Usability</strong></td>
</tr>
</tbody>
</table>
<p style="text-align:center;">
<ul>
<li>The      items on the homepage are clearly focused on user&#8217;s key tasks</li>
<li>Useful      content is presented on the homepage or within one click of the homepage</li>
<li>All      corporate information is grouped in one distinct area (e.g. &#8220;About      Us&#8221;).</li>
<li>There      is a short list of items recently featured on the homepage, supplemented      with a link to archival content.</li>
<li>The      value proposition is clearly stated on the home page</li>
<li>The      home page looks like a home page; pages lower in the site will not be      confused with it.</li>
</ul>
<table>
<tbody>
<tr>
<td><img class="alignleft size-thumbnail wp-image-38" title="target" src="http://uxcentered.files.wordpress.com/2009/12/target.png?w=43&#038;h=30" alt="" width="43" height="30" /></td>
<td><strong>Task Orientation</strong></td>
</tr>
</tbody>
</table>
<ul>
<li>The      site avoids unnecessary registration.</li>
<li>The      critical path (e.g. purchase, subscription) is clear, with no distractions      on route.</li>
<li>The      site correctly anticipates and prompts for the user’s probable next      activity.</li>
<li>Users      can complete common tasks quickly.</li>
<li>Items      can be compared easily when this is necessary for the task (e.g. product      comparisons).</li>
<li>The      most important and frequently used topics, features and functions are      close to the centre of the page, not in the far left or right margins.</li>
<li>Typing      (e.g. during purchase) is kept to an absolute minimum, with accelerators      (&#8220;one-click&#8221;) for return users.</li>
<li>When      there are multiple steps in a task, the site displays all the steps that      need to be completed and provides feedback on the user’s current position      in the workflow.</li>
<li>On      the basket page, there is a highly visible ‘Proceed to checkout’ button at      the top and bottom of the page.</li>
<li>The      site supports novice and expert users by providing different levels of      explanation (e.g. in help and error messages).</li>
</ul>
<table>
<tbody>
<tr>
<td><img class="alignleft size-thumbnail wp-image-39" title="nav" src="http://uxcentered.files.wordpress.com/2009/12/nav.png?w=31&#038;h=31" alt="" width="31" height="31" /></td>
<td><strong>Navigation &amp; IA</strong></td>
</tr>
</tbody>
</table>
<ul>
<li>There      is a convenient and obvious way to move between related pages and sections      and it is easy to return to the home page.</li>
<li>The      information that users are most likely to need is easy to navigate to from      most pages.</li>
<li>Navigation      choices are ordered in the most logical or task-oriented manner.</li>
<li>The      major sections of the site are available from every page (persistent      navigation) and there are no dead ends.</li>
<li>There      is a site map that provides an overview of the site&#8217;s content and it is      linked from every page.</li>
<li>Good      navigational feedback is provided (e.g. showing where you are in the      site).</li>
<li>Category      labels accurately describe the information in the category.</li>
<li>Links      and navigation labels contain the &#8220;trigger words&#8221; that users      will look for to achieve their goal.</li>
<li>Product      pages contain links to similar and complementary products to support      cross-selling.</li>
<li>There      are clearly marked exits on every page allowing the user to bale out of      the current task without having to go through an extended dialog.</li>
</ul>
<table>
<tbody>
<tr>
<td><img class="alignleft size-thumbnail wp-image-40" title="form" src="http://uxcentered.files.wordpress.com/2009/12/form.png?w=28&#038;h=38" alt="" width="28" height="38" /></td>
<td><strong>Forms &amp; Data Entry</strong></td>
</tr>
</tbody>
</table>
<ul>
<li>Fields      in data entry screens contain default values when appropriate and show the      structure of the data and the field length.</li>
<li>Field      labels on forms clearly explain what entries are desired.</li>
<li>There      is a clear distinction between &#8220;required&#8221; and      &#8220;optional&#8221; fields on forms.</li>
<li>Questions      on forms are grouped logically, and each group has a heading.</li>
<li>Fields      on forms contain hints, examples or model answers to demonstrate the      expected input.</li>
<li>Pull-down      menus, radio buttons and check boxes are used in preference to text entry      fields on forms (i.e. text entry fields are not overused).</li>
<li>The      site makes it easy to correct errors (e.g. when a form is incomplete,      positioning the cursor at the location where correction is required).</li>
</ul>
<table>
<tbody>
<tr>
<td><img class="alignleft size-thumbnail wp-image-41" title="layout" src="http://uxcentered.files.wordpress.com/2009/12/layout.png?w=43&#038;h=52" alt="" width="43" height="52" /></td>
<td><strong>Page Layout &amp; Visual Design</strong></td>
</tr>
</tbody>
</table>
<ul>
<li>On      all pages, the most important information (such as frequently used topics,      features and functions) is presented on the first screenful of information      (&#8220;above the fold&#8221;).</li>
<li>The      site can be used without scrolling horizontally.</li>
<li>Hypertext      links are easy to identify (e.g. underlined) without needing to      &#8216;minesweep&#8217;.</li>
<li>Each      page on the site shares a consistent layout.</li>
<li>Pages      on the site are formatted for printing, or there is a printer-friendly      version.</li>
<li>The      site has a consistent, clearly recognizable look and feel that will engage      users.</li>
</ul>
<table>
<tbody>
<tr>
<td><img class="alignleft size-thumbnail wp-image-43" title="search" src="http://uxcentered.files.wordpress.com/2009/12/search.png?w=45&#038;h=35" alt="" width="45" height="35" /></td>
<td><strong>Search Usability</strong></td>
</tr>
</tbody>
</table>
<ul>
<li>The default search is intuitive to configure (no Boolean operators).</li>
<li>The search results page shows the user what was searched for and it is easy to edit and resubmit the search.</li>
<li>Search results are clear, useful and ranked by relevance.</li>
<li>The search results page makes it clear how many results were retrieved, and the number of results per page can be configured by the user.</li>
<li>If no results are returned, the system offers ideas or options for improving the query based on identifiable problems with the user&#8217;s input.</li>
<li>The most common queries (as reflected in the site log) produce useful results.</li>
<li>The search results page does not show duplicate results (either perceived duplicates or actual duplicates).</li>
<li>The search box is long enough to handle common query lengths.</li>
<li>Searches cover the entire web site, not a portion of it.</li>
<li>The search engine provides an option for similarity search (&#8220;more like this&#8221;).</li>
<li>The search engine provides automatic spell checking and looks for plurals and synonyms.</li>
<li>The search results page displays useful meta-information, such as the size of the document, the date that the document was created and the file type (Word, pdf etc.).</li>
</ul>
<table>
<tbody>
<tr>
<td><img class="alignleft size-thumbnail wp-image-44" title="write" src="http://uxcentered.files.wordpress.com/2009/12/write.png?w=39&#038;h=38" alt="" width="39" height="38" /></td>
<td><strong>Writing &amp; Content Quality</strong></td>
</tr>
</tbody>
</table>
<ul>
<li>The site has compelling and unique content.</li>
<li>Pages use bulleted and numbered lists in preference to narrative text.</li>
<li>Information is organized hierarchically, from the general to the specific, and the organization is clear and logical.</li>
<li>Content has been specifically created for the web (web pages do not comprise repurposed material from print publications such as brochures).</li>
<li>Product pages contain the detail necessary to make a purchase, and users can zoom in on product images.</li>
<li>Hypertext has been appropriately used to structure content.</li>
<li>Pages are quick to scan, with ample headings and sub-headings and short paragraphs.</li>
<li>The site uses maps, diagrams, graphs, flow charts and other visuals in preference to wordy blocks of text.</li>
<li>Each page is clearly labeled with a descriptive and useful title that makes sense as a bookmark.</li>
<li>Links and link titles are descriptive and predictive, and there are no &#8220;Click here!&#8221; links.</li>
<li>Link names match the title of destination pages, so users will know when they have reached the intended page.</li>
<li>Button labels and link labels start with action words.</li>
</ul>
<table>
<tbody>
<tr>
<td><img class="alignleft size-thumbnail wp-image-45" title="trust" src="http://uxcentered.files.wordpress.com/2009/12/trust.png?w=34&#038;h=30" alt="" width="34" height="30" /></td>
<td><strong>Trust &amp; Credibility</strong></td>
</tr>
</tbody>
</table>
<ul>
<li>The content is up-to-date, authoritative and trustworthy.</li>
<li>The site contains third-party support (e.g. citations, testimonials) to verify the accuracy of information.</li>
<li>The site avoids advertisements, especially pop-ups.</li>
<li>Each page is clearly branded so that the user knows he is still in the same site.</li>
<li>The content is fresh: it is updated frequently and the site includes recent content.</li>
<li>There are real people behind the organization and they are honest and trustworthy (look for bios).</li>
</ul>
<table>
<tbody>
<tr>
<td><img class="alignleft size-thumbnail wp-image-46" title="error" src="http://uxcentered.files.wordpress.com/2009/12/error.png?w=52&#038;h=38" alt="" width="52" height="38" /></td>
<td><strong> Help, Feedback &amp; Error Tolerance</strong></td>
</tr>
</tbody>
</table>
<ul>
<li>The FAQ or on-line help provides step-by-step instructions to help users carry out the most important tasks.</li>
<li>It is easy to get help in the right form and at the right time.</li>
<li>The site does a good job of preventing the user from making errors.</li>
<li>The user does not need to consult user manuals or other external information to use the site.</li>
<li>The site uses a customized 404 page, which includes tips on how to find the missing page and links to &#8220;Home&#8221; and Search.</li>
<li>The site provides good feedback (e.g. progress indicators or messages) when needed (e.g. during checkout).</li>
<li>User confirmation is required before carrying out potentially &#8220;dangerous&#8221; actions (e.g. deleting something).</li>
<li>Error messages contain clear instructions on what to do next.</li>
<li>Error messages are written in a non-derisory tone and do not blame the user for the error.</li>
<li>Where tool tips are used, they provide useful additional help and do not simply duplicate text in the icon, link or field label.</li>
<li>Important instructions remain on the screen while needed, and there are no hasty time outs requiring the user to write down information.</li>
</ul>
<p><strong>References</strong></p>
<p>Morville, P., &amp; Rosenfeld, L. (2007). Information Architecture for the World Wide Web (3rd ed.). Sebastopol, CA: O’Reilly Media, Inc.</p>
<p>Kalbach, J. (2007). Designing Web Navigation: Optimizing the User Experience (1sted.). Sebastopol, CA: O’Reilly Media, Inc.</p>
<p>Neilsen, J., &amp; Loranger, H. (2007). Prioritizing Web Usability. Berkeley CA: New Riders Press.</p>
<p>Travis, D. (2009). Web Usability Guidelines. USERFOCUS.</p>
<br />  <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/uxcentered.wordpress.com/1/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/uxcentered.wordpress.com/1/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/uxcentered.wordpress.com/1/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/uxcentered.wordpress.com/1/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gofacebook/uxcentered.wordpress.com/1/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/facebook/uxcentered.wordpress.com/1/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gotwitter/uxcentered.wordpress.com/1/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/twitter/uxcentered.wordpress.com/1/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/uxcentered.wordpress.com/1/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/uxcentered.wordpress.com/1/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/uxcentered.wordpress.com/1/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/uxcentered.wordpress.com/1/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/uxcentered.wordpress.com/1/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/uxcentered.wordpress.com/1/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=uxcentered.wordpress.com&amp;blog=11121284&amp;post=1&amp;subd=uxcentered&amp;ref=&amp;feed=1" width="1" height="1" />]]></content:encoded>
			<wfw:commentRss>http://uxcentered.wordpress.com/2009/12/27/hello-world/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/5c039fca3fa1f68cf11316901ac89ceb?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">uxcentered</media:title>
		</media:content>

		<media:content url="http://uxcentered.files.wordpress.com/2009/12/heuristics1.png" medium="image">
			<media:title type="html">Heuristics evaluation process (click to enlarge)</media:title>
		</media:content>

		<media:content url="http://uxcentered.files.wordpress.com/2009/12/heuristics_points2.png" medium="image">
			<media:title type="html">Website usability heuristics </media:title>
		</media:content>

		<media:content url="http://uxcentered.files.wordpress.com/2009/12/home2.jpg?w=142" medium="image">
			<media:title type="html">home</media:title>
		</media:content>

		<media:content url="http://uxcentered.files.wordpress.com/2009/12/target.png?w=150" medium="image">
			<media:title type="html">target</media:title>
		</media:content>

		<media:content url="http://uxcentered.files.wordpress.com/2009/12/nav.png?w=149" medium="image">
			<media:title type="html">nav</media:title>
		</media:content>

		<media:content url="http://uxcentered.files.wordpress.com/2009/12/form.png?w=112" medium="image">
			<media:title type="html">form</media:title>
		</media:content>

		<media:content url="http://uxcentered.files.wordpress.com/2009/12/layout.png?w=125" medium="image">
			<media:title type="html">layout</media:title>
		</media:content>

		<media:content url="http://uxcentered.files.wordpress.com/2009/12/search.png?w=150" medium="image">
			<media:title type="html">search</media:title>
		</media:content>

		<media:content url="http://uxcentered.files.wordpress.com/2009/12/write.png?w=150" medium="image">
			<media:title type="html">write</media:title>
		</media:content>

		<media:content url="http://uxcentered.files.wordpress.com/2009/12/trust.png?w=150" medium="image">
			<media:title type="html">trust</media:title>
		</media:content>

		<media:content url="http://uxcentered.files.wordpress.com/2009/12/error.png?w=150" medium="image">
			<media:title type="html">error</media:title>
		</media:content>
	</item>
	</channel>
</rss>
