<?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>Alt Tags &#187; Tips &amp; Tutorials</title>
	<atom:link href="http://alttags.org/category/tips-tutorials/feed/" rel="self" type="application/rss+xml" />
	<link>http://alttags.org</link>
	<description></description>
	<lastBuildDate>Sun, 27 Nov 2011 01:47:59 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Five Steps To A Better Website In The New Year</title>
		<link>http://alttags.org/content-management/five-steps-to-a-better-website-in-the-new-year/</link>
		<comments>http://alttags.org/content-management/five-steps-to-a-better-website-in-the-new-year/#comments</comments>
		<pubDate>Mon, 09 Jan 2006 03:11:34 +0000</pubDate>
		<dc:creator>kirkb</dc:creator>
				<category><![CDATA[Content Management]]></category>
		<category><![CDATA[Tips & Tutorials]]></category>

		<guid isPermaLink="false">http://www.alttags.org/archives/2006/01/08/48/</guid>
		<description><![CDATA[The New Year is the perfect time to bring a fresh perspective to your website. Whether you&#8217;re planning a major site redesign in the coming year, or you&#8217;ve just finished one in the old year, there are a number of things you can do to improve the quality of your site. Give Your Content Some [...]]]></description>
			<content:encoded><![CDATA[<p>The New Year is the perfect time to bring a fresh perspective to your website. Whether you&#8217;re planning a major site redesign in the coming year, or you&#8217;ve just finished one in the old year, there are a number of things you can do to improve the quality of your site.</p>
<p><strong>Give Your Content Some Attention</strong></p>
<p>If you&#8217;re using a content management system (CMS) there&#8217;s always the temptation to assume that your content is fine.  It&#8217;s being &#8220;managed&#8221; right?  So what could possibly go wrong?</p>
<p>Plenty.</p>
<p>Use the New Year as an opportunity to review the quality of your content.  While most CMS systems include some form of workflow, you might be surprised by some of the things that slip onto your website. Be on the lookout for content that is outdated, inaccurate, irrelevant, or just plain incoherent.<br />
<span id="more-48"></span><br />
<strong>Validate Your Website&#8217;s Relevance</strong></p>
<p>This is a different sort of validation than you&#8217;re probably used to, and one that definitely can&#8217;t be performed by an automated testing tool.</p>
<p>Website&#8217;s have a tendency to veer of course (some more rapidly than others).  If it&#8217;s been a while since your organization launched its website now may be the time to verify that your site is still an accurate representation of your business.</p>
<p>If it&#8217;s been more than a year since you developed your current site you might be surprised to find out that many of the goals and assumptions that drove the initial development have changed.</p>
<p>Keep in mind that the following things have probably occurred since your website launched:</p>
<ul>
<li>Your understanding of the web has changed</li>
<li>Your understanding of your customers has changed</li>
<li>Your customers have changed</li>
<li>The web has changed</li>
</ul>
<p><strong>Think About Your Customers</strong></p>
<p>And by extension, stop thinking about your organization.  Too many websites are still organization centric with an emphasis on departments and divisions.  Most customers don&#8217;t have a clue what department they need to contact.  Instead, they typically come to your website with a specific task in mind.</p>
<p>Have you identified the most common tasks that your customers have in mind when they come to your website?  Does your website support your customers in completing these tasks?</p>
<p>If you&#8217;re not sure what your customers are trying to accomplish, and whether or not your website is actually helping them achieve their goals, there&#8217;s a pretty good chance that your website could use some improvement in this area. It might be time for a <a href="http://www.surveymonkey.com">user survey</a>.</p>
<p><strong>Review Your Site Navigation</strong></p>
<p>Site navigation is another area where a CMS can lull webmasters into a false sense of confidence. If your CMS allows multiple users to make modification to your global navigation and your site has been online for more than, say, a week, you probably have some review and cleanup to do in this area.</p>
<p>As sites grow navigation items has a tendency to sprawl.  Without regular attention your site navigation will grow out of control and turn into an unusable mess of unrelated links.</p>
<p>Don&#8217;t assume that all of your site users immediately head for the search engine (although they might eventually end up there if they can&#8217;t easily navigate to what they&#8217;re looking for).</p>
<p>Take some time to review your navigation structure and ensure that it&#8217;s still coherent. Conduct ad hoc user testing to ensure that others can use your navigation as well. Just because something make sense to your web team doesn&#8217;t mean that it will make sense to your customers.</p>
<p>Be on the look out for:</p>
<ul>
<li>Navigation labels that use jargon.</li>
<li>Sub-navigation items that may be misfiled.</li>
<li>Navigation that leads to areas that have no content.</li>
<li>Missing navigation items (hard to look for, but you&#8217;ll know them when you don&#8217;t see them).</li>
<li>Misfiled content (the result of authors who quickly add content but aren&#8217;t sure where to put it).</li>
</ul>
<p><strong>Identify Accessibility Problems</strong></p>
<p>Even if your site was developed to be WCAG or 508 compliant, accessibility issues can still creep into your site over time. Unless accessibility review is part of your ongoing workflow, chances are your site has at least a few accessibility issues that require your attention.</p>
<p>This is another area where CMS systems and distributed authoring can create problems. In a perfect world every contributor would be knowledgeable about accessibility and would work diligently to ensure that their content is fully accessible. Since we don&#8217;t live in a perfect world you&#8217;ll want to review your site for any issues that may exist.</p>
<p>While accessibility scanning tools are no replacement for manual review, they can be a good starting point for reviewing a large number of pages.</p>
<p>Be sure to document any accessibility issues you uncover for future reference. Also, make it a point to meet with any authors who are contributing non-accessible content. Use your accessibility review as an opportunity to educate your web contributors.</p>
<p>This is by no means a comprehensive list, but it should be enough to keep you busy in the coming months.  If you can think of similar suggestions that we&#8217;ve left out, please let us know in the comments.  Also, if you&#8217;d like us to expand on any of these suggestions in more detail, please let us know.</p>
]]></content:encoded>
			<wfw:commentRss>http://alttags.org/content-management/five-steps-to-a-better-website-in-the-new-year/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Accessible Folksonomies</title>
		<link>http://alttags.org/accessibility/accessible-folksonomies/</link>
		<comments>http://alttags.org/accessibility/accessible-folksonomies/#comments</comments>
		<pubDate>Mon, 28 Feb 2005 05:51:11 +0000</pubDate>
		<dc:creator>kirkb</dc:creator>
				<category><![CDATA[Accessibility]]></category>
		<category><![CDATA[Tips & Tutorials]]></category>

		<guid isPermaLink="false">http://www.alttags.org/archives/2005/02/27/42/</guid>
		<description><![CDATA[I&#8217;ve been working with web technology for over a decade now and I don&#8217;t think I&#8217;ve ever witnessed an idea gain mindshare as rapidly as the Folksonomy has. It seems like everywhere I turn someone is discussing this new categorization system. For those of you who aren&#8217;t familiar with the term, a folksonomy is basically [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;ve been working with web technology for over a decade now and I don&#8217;t think I&#8217;ve ever witnessed an idea gain mindshare as rapidly as the <a href="http://en.wikipedia.org/wiki/Folksonomy"><strong>Folksonomy</strong></a> has.  It seems like everywhere I turn someone is discussing this new categorization system.</p>
<p>For those of you who aren&#8217;t familiar with the term, a folksonomy is basically a taxonomy created by the people and for the people.  A community of users collaborates by &#8220;tagging&#8221; various types of content with user created keywords.  This concept is flourishing on a handful of community driven sites that all seem to have a certain addictive quality.  I think the best way to fully grasp how folksonomies work is to dive into one of the sites that makes use of the concept.  <a href="http://www.flickr.com">Flickr</a>, <a href="http://www.43things.com">43things</a>, and <a href="http://del.icio.us">del.icio.us</a> are good places to start.  Given the success of these early experiments in group tagging I have no doubt that we&#8217;ll be seeing folksonomies implemented on all sorts of sites in the very near future.</p>
<p>Lately I&#8217;ve been thinking about one particular artifact of the folksonomy phenomenon &#8212; the folksonomy menu that serves as a sort of buzz index providing users with a quick visualization of the most popular tags (technically I think it&#8217;s called a weighted list).  Popular tags are displayed in a larger font and it&#8217;s relatively easy to identify hot topics at a glance.  This visual representation of the popularity of any given tag is undeniably cool.  However, once the coolness factor wears off it becomes fairly obvious that these menus are also not very accessible.</p>
<p>I realize these sites are currently trail-blazers and they deserve to be recognized as such.  I have no intention of detracting from the innovative work that&#8217;s being done. My concern is that once folksonomies enter the mainstream, the next wave of sites implementing them will likely begin a wholesale copying of the work that&#8217;s being done by these innovators &#8212; markup and all.<br />
<span id="more-42"></span><br />
Also, I need to point out that folksonomies are community driven. A few minor changes to the existing markup would go a long way towards making these communities accessible to everyone.</p>
<p><strong>Analysis of the accessibility of weighted lists on five websites using group tagging and folksonomy</strong></p>
<p>I spent an afternoon looking under the hood of the folksonomy menus on following sites:</p>
<ul>
<li><a href="http://www.technorati.com/tag/">Technorati</a></li>
<li><a href="http://www.flickr.com/photos/tags/">Flickr</a></li>
<li><a href="http://www.43things.com/">43 Things</a></li>
<li><a href="http://del.icio.us/tag/">del.icio.us</a></li>
<li><a href="http://www.metafilter.com/tags.mefi">MetaFilter</a></li>
</ul>
<p>I was somewhat surprised to find that the markup on each of the folksonomy menu pages was entirely different.  While all sites were basically implementing the same type of menu they all arrived at their respective results in different ways.  Given this finding, I was even more surprised to note that each site shared most the same accessibility problems:</p>
<ul>
<li><strong>Unstructured Links:</strong>  With the exception of Technorati, each of these menus was rendered as an unstructured collection of links separated by only whitespace or a non-breaking space entity.  It seems fairly obvious that these links constitute a list.  Rendering these items as a list would provide visually disabled users with more feedback regarding the number of links as well as the ability to skip the list entirely.</li>
<li><strong>Extraneous Markup:</strong>  While not technically accessibility related, each of these pages uses a fair amount of extraneous markup to achieve its goal.  I encountered a startling number of span elements accompanied by inline style declarations.  And while Technorati wins points for realizing that these links are actually a list, they should also win an award for the most creative use of the EM element.</li>
<li><strong>Absolute Font Sizes:</strong>  Without exception fonts were defined in pixels.  As a result I was unable to resize type in Internet Explorer. This was somewhat puzzling given the fact that it would be fairly easy to implement the font size variations using em&#8217;s. del.icio.us actually went as far as defining the font size in fractional pixels extended to the 13th decimal place.  They must be using one of those 30 inch <a href="http://www.amazon.com/exec/obidos/ASIN/B0002ILKWM/alttags-20/">Cinema Displays</a> <img src='http://alttags.org/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> . </li>
<li><strong>Lack of Context:</strong> These menus currently require a user to actually view the page in order to discern the relative popularity of tags.  There is no additional context that could be used to determine popularity.  Given the fact that the difference in font size for any pair of tags can be as little as a single pixel, additional context would also be useful to those who are not visually impaired.</li>
</ul>
<p><strong>Recommendations:</strong></p>
<p>The good news is that these issues are all easily fixed.  Most of the solutions will be quite obvious.</p>
<ul>
<li><strong>Use Lists:</strong> Lists have become the standard way of rendering a collection of links.  Lists provide additional structure that can have a significant impact on accessibility.</li>
<li><strong>Avoid Inline Style Declarations:</strong> I&#8217;m sure there&#8217;s room for debate on this recommendation, but personally I would assign a class to each LI element.  There&#8217;s really no reason for extraneous elements or inline style definitions.</li>
<li><strong>User Relative Font Sizes:</strong> Defining font sizes in em&#8217;s would allow users to easily resize type in any browser.  Fractional em&#8217;s are easy to calculate, and they make more sense than fractional pixels.</li>
<li><strong>Add Context:</strong>  While it&#8217;s not a perfect solution, it might be a good idea to add each topic&#8217;s relative rank to the title attribute of the anchor.  Something like title=&#8221;Politics &#8211; Rank 3 or 10&#8243;.</li>
<li><strong>Consider Alternate Views:</strong>  There&#8217;s no reason that the current standard folksonomy menu has to be the only way of representing the relative popularity of tags.  An ordered list sorted by popularity would eliminate some of the need for visual clues.  Adding a link to such a list would provide users with more choice while addressing accessibility concerns.</li>
</ul>
<p>Here&#8217;s a <a href="http://www.alttags.org/folksonomy.html">page demonstrating my recommendations</a>.</p>
<p>I realize that it can be challenging to focus on these types of details while innovating in the way that each of these sites has.  While folksonomies are still relatively new, I think we&#8217;ve reached a point where it&#8217;s time to start thinking seriously about best practices.</p>
]]></content:encoded>
			<wfw:commentRss>http://alttags.org/accessibility/accessible-folksonomies/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		</item>
		<item>
		<title>The Crazy Alphabet on Your Website</title>
		<link>http://alttags.org/tips-tutorials/the-crazy-alphabet-on-your-website/</link>
		<comments>http://alttags.org/tips-tutorials/the-crazy-alphabet-on-your-website/#comments</comments>
		<pubDate>Wed, 28 Jan 2004 21:06:39 +0000</pubDate>
		<dc:creator>Kassia Krozser</dc:creator>
				<category><![CDATA[Tips & Tutorials]]></category>

		<guid isPermaLink="false">http://www.alttags.org/archives/2004/01/28/15/</guid>
		<description><![CDATA[<p>Having thoroughly beat up the <code>abbr</code> element, it's time to turn our attention to its close sibling (but definitely not twin) <code>acronym</code>. First, a quick note about the differences between abbreviations and acronyms. Yes, I know. We learned this in elementary school. But even the most brilliant of us sometimes forget -- it's a busy world out there, and we can't always remember every little detail of every little thing.</p>]]></description>
			<content:encoded><![CDATA[<p>Having thoroughly beat up the <code>abbr</code> element, it&#8217;s time to turn our attention to its close sibling (but definitely not twin) <code>acronym</code>. First, a quick note about the differences between abbreviations and acronyms. Yes, I know. We learned this in elementary school. But even the most brilliant of us sometimes forget &#8212; it&#8217;s a busy world out there, and we can&#8217;t always remember every little detail of every little thing. So:</p>
<p><strong>Abbreviation</strong>: Making a word shorter by removing lots of letters. Some examples: <abbr title="etcetera">etc</abbr>, <abbr title="required">req&#8217;d</abbr>, <abbr title="continued">cont&#8217;d</abbr>, or <abbr title="manuscript">ms</abbr>.</p>
<p><span id="more-15"></span></p>
<p><strong>Acronym</strong>: Where a series of letters (usually the first letter of each word, which is why we get some pretty strangely named laws in the United States) takes the place of a word. Examples include: <acronym title="National Broadcasting Company">NBC</acronym>, <acronym title="United States Postal Service">USPS</acronym>, <acronym title="HyperText Markup Language">HTML</acronym>.</p>
<p>In this day and age, you&#8217;re more likely to encounter an acronym than a million bucks, and figuring them out can be a full-time occupation. Using <code>acronym</code> is the best type of accessibility &#8212; it opens up the crazy world of acronyms to everyone. No longer will people be reading your website and scratching their heads over the crazy alphabet of non-words on your site.</p>
<p>Adding <code>acronym</code> to your documents is fun and easy. The basic code is:</p>
<p><code>&lt;acronym title="United States Postal Service"&gt;USPS&lt;/acronym&gt;</code></p>
<p>I know, I know &#8212; so little work for so much good.</p>
<p>Okay, here&#8217;s where things get a little tricky. It is considered good writing to spell out the meaning of an acronym the first time it is encountered in a document. Thereafter, it is presumed the reader can a) remember the meaning, or b) return to the original definition if their brains can&#8217;t retain the information. It is my belief that you only need to spell out abbreviations and acronyms on first usage &#8212; it is your call as to whether you wish to code each instance. As far as I can tell, the guidelines are flexible on this point (please correct me if I&#8217;m wrong), and I think most readers are accustomed to the long-established usage rules. That being said, it won&#8217;t hurt anything if you decide to go overboard.</p>
<p><strong>Update</strong>: It&#8217;s possible the <code>acronym</code> element may become deprecated, the theory being that acronyms are a subset of abbreviations. Hmm. I guess I can buy that. Of course, standardizing on <code>abbr</code> won&#8217;t help when it come to Internet Explorer, because, unless a miracle happens and everyone upgrades to a new, magically compliant browser, it still won&#8217;t read <code>abbr</code>. </p>
<p><strong>Update 2</strong>: The current draft for Web Content Accessibility Guidelines 2.0 offers specific advice about the use of <code>abbr</code> and <code>acronym</code>: first appearance. This conforms with standard writing rules, so should make things standard for everyone.</p>
]]></content:encoded>
			<wfw:commentRss>http://alttags.org/tips-tutorials/the-crazy-alphabet-on-your-website/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Spelling It Out</title>
		<link>http://alttags.org/tips-tutorials/spelling-it-out/</link>
		<comments>http://alttags.org/tips-tutorials/spelling-it-out/#comments</comments>
		<pubDate>Fri, 23 Jan 2004 04:39:00 +0000</pubDate>
		<dc:creator>Kassia Krozser</dc:creator>
				<category><![CDATA[Tips & Tutorials]]></category>

		<guid isPermaLink="false">http://www.alttags.org/archives/2004/01/22/14/</guid>
		<description><![CDATA[Usually, the abbr and acronym elements are discussed in the same section, but I&#8217;ve never liked doing things the same old way. So, let&#8217;s start with abbr, and we&#8217;ll discuss acronym separately. abbr is the abbreviation element. This inline item allow you to spell out the meanings of abbreviations. But why? Everyone knows what I [...]]]></description>
			<content:encoded><![CDATA[<p>Usually, the <code>abbr</code> and <code>acronym</code> elements are discussed in the same section, but I&#8217;ve never liked doing things the same old way. So, let&#8217;s start with <code>abbr</code>, and we&#8217;ll discuss <code>acronym</code> separately. <code>abbr</code> is the abbreviation element. This inline item allow you to spell out the meanings of abbreviations.</p>
<p>But why? Everyone knows what I mean when I say req&#8217;d. It means required. No, it means requested. No&#8230;I&#8217;m absolutely, positively certain it means requisitioned. Or maybe not.</p>
<p>You could argue that the meaning of the abbreviation will be made clear from context. And your tax return forms are a breeze to complete, right? For example, in the following sentence, my meaning is perfectly clear:</p>
<p><strong>What was req&#8217;d?</strong></p>
<p>Silly example, and I&#8217;m sure nobody writes that way, right? But can you be so sure that your meaning is perfectly clear to every person reading your website (and every person <em>listening</em> to your website)?</p>
<p>Why not make it easy on everyone and expand your abbreviation. The markup is ridiculously simple (even more so if you have an HTML editor that reduces most of the work to a mouseclick or two. To expand an abbreviation, simply do the following:</p>
<p><code>&lt;abbr title="requested"&gt;req'd&lt;/abbr&gt;</code></p>
<p>Yes, I know. Too simple. So simple you don&#8217;t know why you haven&#8217;t always done it (probably that&#8217;s because it hasn&#8217;t always been an option). Now when your abbreviation is encountered, screen readers will spell out what you mean and a tooltip will appear when other users mouse over the item. Yes, I&#8217;m perfectly aware that this wonderful feature isn&#8217;t fully supported by browsers everywhere (but, frankly, isn&#8217;t it time we forced Microsoft and others to comply with the standards?), but <code>abbr</code> is a wonderful invention. Use it!</p>
]]></content:encoded>
			<wfw:commentRss>http://alttags.org/tips-tutorials/spelling-it-out/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

