<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0"
    xmlns:dc="http://purl.org/dc/elements/1.1/"
    xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
    xmlns:admin="http://webns.net/mvcb/"
    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
    xmlns:content="http://purl.org/rss/1.0/modules/content/">

    <channel>
    
    <title>PebbleRoad</title>
    <link>http://www.pebbleroad.com</link>
    <description></description>
    <dc:language>en</dc:language>
    <dc:creator>coleman@pebbleroad.com</dc:creator>
    <dc:rights>Copyright 2008</dc:rights>
    <dc:date>2008-05-16T09:16:00+08:00</dc:date>
    <admin:generatorAgent rdf:resource="http://www.pmachine.com/" />
    

    <item>
      <title>iPrepNS website is up</title>
      <link>http://www.pebbleroad.com/news/iprepns_website_is_up/</link>
      <description></description>
      <dc:subject></dc:subject>
      <content:encoded><![CDATA[<p>The brand new <a href="http://iprep.ns.sg">iPrepNS website</a> is now online. The website, owned by <abbr title="Central Manpower Base">CMPB</abbr> (<abbr title="Ministry of Defence">Mindef</abbr>) is primarily for Singaporean boys who are about to enter National Service (pre-enlistees).</p>

<p>This has been a tough 6 months of effort for us, including:
<br />
<ul><li>interviewing pre-enlistees, their parents, recruits</li>
<li>organizing the information</li>
<li>creating much of the content (storyboard, text, photos, video).</li>
</ul>
<br />
</p>
<p>We worked closely with <a href="http://logicalsteps.net/">Logical Steps</a> - they did the graphical design as well as the Flash implementation. </p>

<p>The official launch of the website will be on 28 May 2008.
</p>]]></content:encoded>
      <dc:date>2008-05-16T09:16:00+08:00</dc:date>
    </item>

    <item>
      <title>We have moved!</title>
      <link>http://www.pebbleroad.com/news/we_have_moved/</link>
      <description></description>
      <dc:subject></dc:subject>
      <content:encoded><![CDATA[<p>We've outgrown our old office, so we've had to move to a new office. </p>

<p>It's in the same building (iHub), but now we've moved 2 levels up. </p>

<p>Here's our new address:</p>

<div class="vcard">
<ul>
	<li class="org">PebbleRoad Pte Ltd</li>
	<li class="adr"><span class="street-address">9 Jurong Town Hall Road, iHub, #<strong>03-03</strong><br /></span><span class="country-name"> Singapore </span><span class="postal-code">609431</span></li>
</ul>

</div>

<p>Feel free to pop by for a visit!</p>]]></content:encoded>
      <dc:date>2008-04-14T02:41:00+08:00</dc:date>
    </item>

    <item>
      <title>IRAS website launches; we did the IA</title>
      <link>http://www.pebbleroad.com/news/iras_website_launches/</link>
      <description></description>
      <dc:subject></dc:subject>
      <content:encoded><![CDATA[<p>Yes, the new <a href="http://www.iras.gov.sg" title="IRAS website">IRAS website</a> is up. This was one of our most grueling information re-structuring work to date. The previous website was structured along tax types. We restructured it along taxpayer and tax types. We also redesigned the page structure and the overall navigation. Notice that we used the hub-spoke navigation model. This way users don't feel overwhelmed with the large amount of information available on the website. The big usability improvement is that now users don't have to go hunting for information they need to do a task; all the related information comes to them, and this includes all the guidelines, policies and the forms.</p>

<p>We did not do the markup or the visual design -- two areas we think we should own in the future.</p>]]></content:encoded>
      <dc:date>2008-03-14T05:42:00+08:00</dc:date>
    </item>

    <item>
      <title>Planning &amp;amp; Sustaining Wiki&#45;based Collaboration Projects</title>
      <link>http://www.pebbleroad.com/article/planning_sustaining_wiki_based_collaboration_projects/</link>
      <description>Many organizations are experimenting with wiki&#45;based collaboration projects. But only a small percentage of these projects make it past the initial excitement or pilot phase. One of the reasons for the drop&#45;off is that there’s not enough thought given to them other than deciding which wiki product to install. This article presents a framework that can help groups wanting to use wikis for internal projects better plan and sustain their collaboration efforts.</description>
      <dc:subject></dc:subject>
      <content:encoded><![CDATA[<p>Modern work is collaborative. It’s no longer about about few people having the answers and others depending on them for it. Now it’s all about many people having bits and pieces of the answers and each depending on the other for it. </p>

<p>There is desperate need for collaboration in the enterprise. And were it not for some humble technologies, this need would still be unmet. Wikis along with blogs, social bookmarking and the like are giving staff a reason to cheer. Not only is the technology readily available and largely cheap, but for the first time staff can focus on the work and not on working the technology.</p>

<p>There are many articles written on the <a href="http://www.boxesandarrows.com/view/a_web_2_0_tour_" title="A Web 2.0 Tour for the Enterprise">benefits of using such tools</a> - collectively referred to as Enterprise 2.0 - and on adopting them across the enterprise. In this article we’ll narrow our focus. We’ll target groups within the enterprise that are thinking about starting collaboration projects.</p>

<h3>Framework</h3>
<p>Since there is a strong tendency to start using a wiki, we’ll base the framework on this stage. There are two additional stages, one before the install stage and the other after the install stage. This is illustrated in the diagram below. Although adding the Plan and Sustain stages is plain commonsense, the trick is in asking the right kind of questions and getting the right kind of thinking going.</p>
<img src="http://www.pebbleroad.com/images/website/framework.jpg" alt="Framework" width="426" height="64" />

<h3>Plan</h3>
<p>It is the nature of wikis to inspire a freewheeling attitude, but this should not stop us from thinking and planning to use it right and use it well. Here are some questions that need answers:</p>
<ul><li>Why this project? Is there a real need or is it just an experiment?</li>
<li>What are current collaboration grievances the project is going to address? Focus on the collaboration aspect. The last thing we want is for the wiki to become a file server.</li>
<li>Will existing ways of doing things still be available? This is crucial. We don’t want an existing way of work to cannibalize the new way of work. That is why we need to pay attention to the collaboration processes. See the British Council example below.</li>
<li>Who are the members of the group? Do we have their support for this project? Have we managed their expectations? The last thing we want is for members to be taken by surprise.</li>
<li>Will members require training? This is not so much training on the wiki software as it is training on the nature of collaborative work and on accountabilities and responsibilities of being in such a group.</li>
<li>What is the budget? And can we get it?</li>
<li>What infrastructure will be required? Is it available or will it have to be purchased?</li>
<li>Who will be championing this project &amp; does he/she have the time for it? If the champion cannot provide dedicated time and effort to this initiative then it could easily loose momentum.</li>
<li>Do we have any senior management person on our side? If not, can we get someone’s attention? Having a senior manager's blessings can do wonders when when it comes to money and matters of influence.</li></ul>

<p>Next is to focus on the collaboration process itself.</p>
<p>This is an often neglected area, but it offers the most benefit in terms of sparking real collaboration. The basic question here is “can we tweak the certain processes to increase the energy of participation and collaboration?” An example is needed here.</p>
<p>The British Council in Singapore has been experimenting with wikis for many years. One of their long standing concerns was that people were not updating their profile pages on the wiki. These pages not only had their names and contact details but also had their project details. The past and current project information is something of value to others. The challenge thus was to have regularly updated profile pages. They found a solution by tweaking the induction process of new hires. New inductees now had to meet project members and find out about them and their projects. Fresh with this new understanding they were made to update the profile pages of each member they met. This way new hires got to know other members and the profile pages got updated.</p>

<p><em>Note: Looks like I've misinterpreted the above story. Mark Hamilton from the British Council has described the 'real' deal. See the comments section below.</em></p>

<p>Here are some questions that can help.</p>
<ul><li>What are the current process? List and flag out the ones that require collaboration and those that are merely administrative.</li>
<li>How many of them are now redundant, outdated or trivial (ROT)? If there are ROT processes, can we eliminate all of them?</li>
<li>What new processes will increase contribution and keep wiki pages updated?</li>
<li>Which traditional individual processes will benefit the most by opening up to collaboration?</li></ul>

<p>As you might guess, getting answers to the above questions itself requires collaborative effort. What better way to build a shared mindset than by agreeing on the rules of engagement.</p>

<h3>Use</h3>
<p>Many new wiki projects dive directly into this stage, and its easy to see why. This stage delivers the most in terms of excitement and satisfaction. But it pays to be a little prudent here.</p>
<p>If there’s no wiki system already in place, then this is the stage where one is selected and installed. Remember, a wiki is but a tool to enable collaboration. It makes sense, then, to base the selection of a particular wiki on the collaboration needs and requirements. This framework’s Plan stage can help in this regard by helping uncover current and future needs.</p>

<p>If there’s already a wiki system in place, then this is the stage where the system is evaluated and prepared based on the understanding gained from the Plan stage.</p>

<h3>Sustain</h3>
<p>This stage is about seeing the project through. They key to sustaining the collaboration effort is to realize that this cannot happen automatically. It requires considerable time and effort. </p>
<p>There are three factors that need attention:</p>
<ul><li>Support</li>
<li>Housekeeping</li>
<li>Improvement </li>
</ul>

<p><strong>Support</strong> efforts will be mostly around learning and training. Here are some points to consider.</p>
<ul><li>Help new members get up to speed with the wiki. There will be many who harbor fears, uncertainties and doubts (FUDs) on working the wiki way. The “Be bold and don’t worry about messing up” feeling takes time to rack up. The sandbox page does work wonders here, but it still needs some perseverance and creativity to remove the FUDs.</li>
<li>Help members understand collaboration and the behaviors that successful collaboration requires. Having one-hour "sparking collaboration" sessions where case studies, best practices and new thinking are discussed can do wonders in keeping the motivation going. If face-to-face sessions are not possible then make the materials available online.</li></ul>

<p><strong>Housekeeping</strong> is about being fresh &amp; tidy. Here are some points to consider.</p>
<ul><li>Pressure members to use their own names and not nicknames. Although a small requirement, this goes a long way in building trust.</li>
<li>If there are stub pages - pages with incomplete content - then give the owners a date by which to fix it or remove it.</li>
<li>If there are duplicate pages or pages focusing on the same topic, then its best to combine them.</li>
<li>Get the IT team to regularly take backups and update the wiki software when new versions come in.</li>
<li>Fix any lingering organization, labeling and navigation issues.</li></ul>

<p><strong>Improvement</strong> is about getting better and raising the bar. Here are some points to consider.</p>
<ul><li>Have an area to discuss new ideas and insights.</li>
<li>Have an area to review progress - what is working and what is not.</li>
<li>Have an area to document the learning. This is going to help others in your organization leverage the new knowledge.</li>
<li>Have an area to track the improvement initiatives so that members can actively monitor and discuss them.</li></ul>

<h3>Conclusion</h3>
<p>There are many who jump start wiki-based collaboration projects by directly setting up the wiki and inviting others to contribute. While this might work for groups where the wiki concept is already well-grounded, our experience tells us that this approach does not work for groups that are new to the concept of collaboration, let alone wiki-based collaboration. Hence the need for some guidance and structure. This article presents but one such approach to help groups plan to see a project through.  If you’ve come across a different approach, we’d like you to share it with us.</p>]]></content:encoded>
      <dc:date>2007-11-09T15:35:00+08:00</dc:date>
    </item>

    <item>
      <title>Evening talk at iKMS on Enterprise 2.0</title>
      <link>http://www.pebbleroad.com/news/evening_talk_at_ikms_on_enterprise20/</link>
      <description></description>
      <dc:subject></dc:subject>
      <content:encoded><![CDATA[Maish gave a short, informal talk on <a href="http://plambe.blip.tv/file/400147/" title="Web 2.0 in the enterprise">Web 2.0 in the enterprise</a> and what the stumbling blocks are. Thanks to Patrick Lambe from Straits Knowledge for hosting the video.]]></content:encoded>
      <dc:date>2007-10-20T02:18:00+08:00</dc:date>
    </item>

    <item>
      <title>Intranet Governance Guide</title>
      <link>http://www.pebbleroad.com/article/intranet_governance_guide/</link>
      <description>Getting an intranet is just a start, keeping it going is what matters most. Long term benefits and efficiencies can only be realised when the intranet is responsive to the needs and requirements of business and staff.  This guide gives pointers to creating a governance structure that can help sustain and manage the intranet for the long term.</description>
      <dc:subject></dc:subject>
      <content:encoded><![CDATA[<h3>About this guide</h3>
<p>This guide describes a set of processes that need to be in place and a set of actions that need to be taken to sustain and grow the intranet. Without these guides and checks, we risk diluting the very efficiencies and productivity gains that the intranet is designed to provide.
This guide is divided into 3 sections:</p>
<ol>
<li>Being prepared</li>
<li>Getting feedback</li>
<li>Making changes</li>
</ol>

<p>Each section is described in detail below.</p>

<h3>Being prepared</h3>
<p>Being prepared is about having the pre-requisite management mandate, the right people and the right processes in place to take on the responsibility of sustaining the intranet for the long term. Here are the factors to consider in being prepared.</p>

<h4>Getting senior management support</h4>
<p>Having senior management support is essential to the long-term sustainability of the intranet. This support is not only about pulling in the required resources and budgets to make the necessary changes. It is also about directing the cultural and mindset changes that are required to make the intranet an integral part of work.</p>
<p>Here are some checkpoints to keep in view:</p>
<ul>
<li>Keep the senior management involved in all intranet activities by providing regular bulletins on progress and changes.</li>
<li>Use their reach to market the intranet at every opportunity.</li>
<li>Use their influence to make strong policy changes  (e.g. all news first goes to the intranet)</li>
</ul>


<h4>Having a clear intranet charter</h4>
<p>Before you start, have an intranet charter. The charter should put everyone on the same page by stating the intent and the expectations upfront.
A charter spells out the objective and purpose of the intranet. It also describes behaviours that conform to the objectives and those that do not conform to the objectives. </p>
<p>Do not get too longwinded with the charter. Keep it to a single page. 
</p>


<h4>Having an intranet team</h4>
<p>The intranet requires dedicated time and effort to keep it in good shape. This requires a dedicated team. Do not scrimp on the time and resources given to this team. Get the top management to support this stance. 
Here are roles and job descriptions of a typical team:</p>

<p><strong>Intranet manager (Full-time preferred)</strong></p>
<ul>
<li>Manage day-to-day intranet related activities.</li>
<li>Be responsible for starting mini-redesign projects and finishing these projects on budget and on time.</li>
<li>Make sure that the intranet is running well, both in terms of system performance and in terms of usability.</li>
<li>Keep senior management in the loop. </li>
<li>Mentor and coach content authors on creating the right content.</li>
<li>Market the intranet.</li>
</ul>

<p><strong>Usability/IA specialist</strong></p>
<ul>
<li>Be in touch with intranet users.</li>
<li>Analyse search and access logs.</li>
<li>Recommend improvement projects.</li>
<li>Conduct usability tests, surveys, etc., to gather data on user needs and preferences.</li>
</ul>

<p><strong>Web designer/web developer</strong></p>

<ul>
<li>Create new templates when necessary.</li>
<li>Make code changes.</li>
<li>Recommend improvement projects.</li>
<li>Create new sections and sub-sites when necessary.</li>
</ul>


<h4>Educating &amp; training content authors</h4>
<p>Content authors are responsible for much content on the intranet. The way content is written and communicated affects the way content is consumed and acted upon. The content style has a direct impact on the usability of the content and hence on the usability of the entire intranet. </p>
Education and training should be provided to content authors to enable them to learn and practice the art of writing for the intranet. This training <p>should be held on a regular basis. Here are some additional items that can help in this regard:</p>

<ul>
<li>Provide examples of good and bad writing</li>
<li>Showcase examples of good writing on the intranet</li>
<li>Reward those who author well-written content</li>
<li>Provide external links to websites where one can pick up tips and tricks on good writing</li>
<li>Hold regular crash courses on online writing</li>
</ul>

<h4>Marketing the intranet</h4>
<p>Every available opportunity should be used to market the intranet. Active marketing not only makes people aware of the intranet but also maintains the excitement and opens a wider channel for discussion and feedback. Here some activities that can help:</p>
<ul>
<li>Have a intranet naming competition</li>
<li>Give prizes to best written copy, first fully completed staff directory entry and most valuable feedback</li>
<li>Print and pinup posters around the facilities that showcase what’s available on the intranet</li>
<li>Nurture intranet champions who can talk to common users and provide support as and when necessary</li>
<li>As mentioned earlier, get senior management to actively back and talk about the intranet when and where appropriate</li>
</ul>

<h3>Getting feedback</h3>
<p>Getting feedback is about seeking out or creating opportunities to get feedback on how the intranet is performing. Think of it as a medical check-up. There are several ways to conduct this check-up. These are given below.</p>

<h4>Conducting an intranet review</h4>
<p>An intranet review is a review of the intranet around aspects such as content, navigation, homepage, site structure and so on. An intranet review should be done on a regular basis. A review can give a good indication of the current state of affairs and will provide directions on what needs to be done next. </p>
<p>The <a href="http://www.intranetreviewtoolkit.org/" title="Intranet Review Toolkit">Intranet Review Toolkit Project</a> done by StepTwo Designs and funded by the IA Institute is a good place to start. The website contains a toolkit that can be downloaded and used for free.</p>



<h4>Analysing search logs</h4>
<p>Search logs collect search terms that users put into the search box to find information. Analysing search logs gives clues to the popular searches, what is being searched, whether that is available on the intranet, whether the patterns are seasonal, what vocabulary is being used and so on.</p>
<p>Search logs should be analysed on a regular basis, preferable on a weekly basis. The findings should be acted upon and these activities should be part of the regular intranet maintenance to-dos. For more information, check out Rosenfeld Media’s <a href="http://www.rosenfeldmedia.com/books/searchanalytics/" title="Search Analytics">upcoming book </a>on Search Analytics.</p>


<h4>Analysing access logs</h4>
<p>Access logs collect information on how the intranet is accessed. This includes attributes such as which pages are accessed, how often, what the user access paths are, which pages are giving the 404 errors, and so on.</p>
<p>Analysing access logs provides insights into how the intranet is accessed, which parts of the intranet are useful and which are not so useful, what are the access patterns and so on.</p>
<p>Access logs should be analysed on a regular basis, preferably weekly (along with the search logs). The findings should be acted upon and these activities should be part of the regular intranet maintenance to-dos.</p>

<h4>Analysing user feedback</h4>
<p>Intranet users have several opportunities to provide feedback to the intranet team. 
For example, a feedback form at the bottom of all intranet pages can be used to rate and send feedback to the intranet team. See a <a href="http://www.ibm.com/developerworks/library/us-progind/?n-us-812#rating" title="Page rating exmaple from IBM">rating example</a> from IBM.</p>
<p>The intranet team should pay attention to feedback that comes directly from the users. The team should not only acknowledge the feedback but also initiate a conversation and see how the feedback can be put to use. The conversations provide an opportunity to market the intranet through word-of-mouth.</p>



<h4>Analysing usability feedback</h4>
<p>Usability feedback is feedback gathered from usability sessions. The intranet team should conduct regular usability tests, especially on new content, new pages, new interactions or new systems. </p>
<p>The usability tests should be quick and simple otherwise you’ll end up frustrating staff instead of helping them. </p>
<p>Apart from keeping the intranet usable, the usability tests also tell staff that the team and the management are serious about the intranet. This increases the level of trust around the intranet.</p>

<h4>Gathering IT system feedback </h4>
<p>System feedback is feedback gathered from IT checks. These tests include load checks, performance tests, database query tests, etc., that are part-and-parcel of IT system maintenance. </p>
<p>Any non-conformance to accepted standards should be acted upon as soon as possible. 
</p>


<h3>Making changes</h3>
<p>This stage is about making changes to the intranet based on the feedback gathered from the previous stage. There are several types of changes that can be made. These are described below.</p>

<h4>Changing existing content</h4>
<p>Existing content may require a change initiated by either a request or by feedback. In any case, the new content must pass the accepted writing and usability benchmarks. A review and a signoff must be recorded before the new content is published.</p>
<h4>Adding new content</h4>
<p>The checks for adding new content are different from the checks for modifying existing content. </p>
<p>Firstly, new content must pass the usefulness test. This means that only that content that adds value is to be included. Avoid using the intranet as a web dumping ground for all and sundry.</p>
<p>Secondly new content must pass the accepted writing and usability benchmarks.
</p>
<p>Thirdly, new content should be used with the right template and be placed in the right position in the intranet structure. 
</p>
<p>A review and a signoff must be recorded before the new content is finally published.</p>



<h4>Removing ROT</h4>
<p>ROT is an acronym that stands for Redundant, Outdated and Trivial content. If feedback points to the existence of such content, then it should be marked for removal. An action should be set in motion that places the marked content in a standby mode and lets users know about the impending removal. If there is no objection to this content in a specific period of time, then it should be deleted. </p>
<p>Removing ROT is a crucial activity and leads to a healthier intranet, much like pruning leads to a healthier tree.</p>

<h4>Changing the IA</h4>
<p>IA refers to the information architecture of the intranet. Changes to the IA should be done only after much consideration as these changes affect well-established user expectations from the intranet.</p> 
<p>The need to change IA may come from the need to have a new and different sub-site or section. Or in circumstances where is it hard to fit the new content into the current IA.</p>
<p>If the structural changes are small, then it should be done in-house. But, if the structural changes are large then a professional information architect should be involved (unless you already have a full fledged team of IAs working for you).</p>

<h4>Changing the look &amp; feel</h4>
<p>Look and feel refers to the visual and layout elements of the intranet. Such changes may be required in several situations, for example, when the intranet branding takes a new direction, or when there is a significant corporate (50 year celebrations) or cultural event (Christmas, Chinese New Year, etc.).</p>
<p>Look and feel of the intranet is controlled by what is known as Cascading Style Sheets or CSS. Changes to the look and feel is done by changing the CSS codes and thus this activity must be done by the web designers who is familiar with professional level CSS.</p>
<p>Hard coding visual changes into the content or into the template should be avoided in all circumstances. This not only jeopardises the future scalability of the intranet but also makes it hard to maintain and control the visual part of the intranet.</p>
<h4>Changing business processes</h4>
<p>Most intranet improvements can be made by tweaking the current content or structure or by adding new content into the structure. At times, however, there will be issues that transcend the intranet and point towards a change in the underlying business process itself. Just because these are more organisational or management issues the opportunity to analyse them and possibly re-engineer them should not be wasted.</p>
<p>For example, if the team finds, either through feedback or through observations, that there are multiple requests forms that point to redundancy or multiple channels of approval that lead to a time-consuming activity, then they should mark this process for improvement and bring it to the attention of senior management.</p>
<p>Opportunities for changing underlying businesses processes present an opportunity to align business needs to staff needs, and as such, should not be missed.
</p>

<h3>Conclusion</h3>
<p>Governing an intranet needs time, dedication and effort. This guide gives you a framework to start thinking about putting processes in place to sustain and respond to the needs and requirements of the staff. It’s not too far-fetched to think about roles that have the intranet management as key performance indicators or KPIs. But before the metrics, a belief that the intranet matters, must first be in place. </p>
]]></content:encoded>
      <dc:date>2007-06-16T16:27:00+08:00</dc:date>
    </item>

    <item>
      <title>Improving the User Experience with In&#45;page Navigation</title>
      <link>http://www.pebbleroad.com/article/improving_the_user_experience_with_in_page_navigation/</link>
      <description>In&#45;page navigation techniques are used to layout web content on a page. When used properly they improve the user experience. But when misused they just add to the anxiety. This article chalks out the different in&#45;page navigation options available to us and offers some tips on using them effectively.</description>
      <dc:subject></dc:subject>
      <content:encoded><![CDATA[<h3>What is in-page navigation?</h3>
<p>In-page navigation is navigation to content that exits within the same page. The table of contents (<acronym title="table of contents">TOC</acronym>) links on a Wikipedia article is the most basic example of in-page navigation. The links take you to the relevant text on the same page.</p>

<p>Example: <a href="http://en.wikipedia.org/wiki/Market_research" title="Wikipedia entry for Market Research">Wikipedia entry for Market Research</a>.</p>


<p>In the example above, the <acronym title="table of contents">TOC</acronym> helps the reader to quickly make sense of the article. It aids scanning and encourages <a href="http://www.sensible.com/chapter.html" title="satisficing">satisficing</a>&mdash;both of which enhance the reading experience.</p>

<p>I will bring out the relationship between in-page navigation and Ajax a little later, but if you're in a hurry, you can <a href="#ajax" title="go to the Ajax section">read it now</a>!</p>

<h3>Same code, different layouts</h3>
<p>The <acronym title="table of contents">TOC</acronym>-based navigation is the most primitive form of in-page navigation and is still used extensively and in different variations&mdash;a frequently asked questions (<acronym title="frequently asked questions">FAQs</acronym>) list and an A-Z index are some common examples.</p>

<p>With the maturing of browsers, web standards and especially JavaScript, different layouts can be built on top of the basic <acronym title="table of contents">TOC</acronym> format. Here are some samples that use the same basic <acronym title="table of contents">TOC</acronym> markup but are styled and scripted differently.</p>

<img src="/images/website/inpage-layouts.jpg" width=337 height=270 title="in-page navigation layouts" alt="in-page navigation layouts"/>

<p>Examples:</p>

<ul><li><a href="http://www.microsoft.com/en/us/default.aspx" title="Microsoft home page">Microsoft home page</a>&mdash;vertical tabs</li>
<li><a href="http://www.hp.com/country/us/en/welcome.html" title="Hewlett Packard home page">Hewlett Packard</a>&mdash;vertical tabs</li>
<li><a href="http://www.adobe.com/education/hed/" title="Adobe Solutions for Higher Education">Adobe Solutions for Higher Education</a>&mdash;horizontal tabs</li>
<li><a href="http://www.jennaspevack.com/portfolio/index.html" title="Jenna Spevack Portfolio">Jenna Spevack Portfolio</a>&mdash;accordion style</li>
<li><a href="http://www.beginningjavascript.com/Chapter7/index.html" title="Examples from Christian Heilmann's book">Examples from Christian Heilmann's book</a>&mdash;many variations are shown and explained</li></ul>

<h3>When to use in-page navigation</h3>
<p>In-page navigation makes web pages shorter, however that should not be the sole reason for using it. </p>
<p>In-page navigation should be used in situations where it helps improve the readability and learnabilty of the text. Here is an example.
</p><p>Let's say you are designing a website for a business school that has the following setup:</p>
<img src="/images/website/inpage-ex1.jpg" width=334 height=282 title="in-page navigation setup" alt="in-page navigation setup"/>


<p>By interviewing students you gather that during the selection process they are not really interested in the details of a specialisation programme but just want to browse through broad applications of the programme&mdash;mainly to confirm their <em>pre-selections</em>. </p>
<p>In diagrammatical terms, this would be the following:</p>

<img src="/images/website/inpage-ex2.jpg" width=334 height=281 title="in-page navigation opportunities" alt="in-page navigation opportunities"/>


<p>The updated diagram shows more than some boxes without borders, it shows a more loosely knit, almost fleeting relationship, something that might not be picked up with linearly written text. In-page navigation can be used in such cases.</p>

<p>Let's consider the Adobe example. Here we have 3 facets of the core idea of &quot;Solutions for Higher Education&quot;. These 3 facets&mdash;Products, Solutions &amp; Resources&mdash;project a different meaning when presented in horizontal tabs than they do when presented in a linear manner. The tabs not only keep the facets in context and in view but also provide for easy glances across them, thus increasing readability and learnability.</p>

<p>In summary, although in-page navigation provides an attractive option for presenting large amounts of text on a page without overwhemlming the user, priority should be given to higher order user needs of readability, learnability and decision-making.</p>

<h3>Designing with progressive enhancement</h3>
<p>Once you've decided to use in-page navigation, there's another important implementation criteria that you need to master&mdash;designing with <a href="http://www.accessites.org/site/2007/02/graceful-degradation-progressive-enhancement" title="progressive enhancement">progressive enhancement</a>. </p>
<p>Progressive enhancement is a technique of designing web pages where you first design for the least capable browsers and then add layers of additional features that the more capable browsers can take advantage of. You do this to have your information accessible to all users and to all devices. </p>
<p>Many of the examples listed above are enhanced from the basic anchor-and-target form. (Turn off <acronym title="cascading style sheet">CSS</acronym> when viewing the examples to see the basic presentation.) This means that if a user is using an older browser or has turned off JavaScript he/she can still read the content in a usable way.</p>

<h3 id="ajax">In-page navigation &amp; Ajax</h3>
<p>In all the examples above, the target content is already present in the document markup&mdash;it may be hidden initially, but it is present nevertheless. With Ajax-powered pages, new content is pulled in from external sources and added to the markup on request, without a page reload. </p>
<p>Technically all the examples above can be Ajax-powered, but that brings us to this important caveat when using Ajax – never use Ajax for Ajax's sake. Much of the Ajax goodness that we see on the Internet is around web applications, not on vanilla content pages. 
For more on this issue, check out Shaun Inman's article, <a href="http://www.thinkvitamin.com/features/ajax/responsible-asynchronous-scripting" title="Responsible Asynchronous Scripting">Responsible Asynchronous Scripting</a>.</p>

<h3>In-page navigation &amp; <acronym title="content management systems">CMSs</acronym></h3>
<p>In-page navigation is about marking up, styling and scripting text a little differently to improve the user experience. Content authors by and large do not have this capability. This puts the onus on the content management systems (<acronym title="content management systems">CMSs</acronym>) to provide such functionality in their authoring environments. </p>
<p>Content management system authoring environments usually provide for both structured authoring and page authoring.  In structured authoring, the elements that make up the text are decided in advance, while in page authoring, the text is created on the fly. For example, all of Adobe's solution pages have the same repeatable structure (one structure, many instances), but Jenna Spevack portfolio page is a standalone page.</p>

<p>The limitation with <acronym title="content management system">CMS</acronym> authoring environments is that while it is possible to pre-define in-page navigation elements when using structured authoring, it is not that easy to do the same with freestanding page authoring.</p>

<h3>Conclusion</h3>
<p>When used appropriately in-page navigation can enhance the readability and learnabilty of the text. But as noted, although there are benefits, the lack of easy authoring environments makes this only a geek-add-on at best. </p>
<p>If you have come across techniques for easy authoring of in-page navigation elements do share your knowledge in the comments section.
</p>]]></content:encoded>
      <dc:date>2007-03-08T14:56:00+08:00</dc:date>
    </item>

    <item>
      <title>Mapping Your Website Redesign Strategy</title>
      <link>http://www.pebbleroad.com/article/mapping_your_website_redesign_strategy/</link>
      <description>So you&amp;rsquo;ve got a redesign project. Congrats. Where are you going to start? The goals mentioned in the request&#45;for&#45;proposal or tender aren&amp;rsquo;t going to get you far. You might plan for kick&#45;off sessions with key stakeholders, but again, you just get a clearer picture of the forest. Then you go and do a content inventory and that gives you a good look at the trees. You also get to see raging forest fires, unauthorised logging, and a few aliens. You feel shattered. Actually professionally empowered. So, again, where do you start? A plan? But you first need a strategy to contain the plan. This article is about one such strategy.</description>
      <dc:subject></dc:subject>
      <content:encoded><![CDATA[<h3>Eliminate, Reduce, Raise, Create</h3><p>The Eliminate, Reduce, Raise, Create framework by INSEAD professors W. Chan Kim and Ren&eacute;e Mauborgne is a popular technique for analysing business strategy. They have written an entire book&#8212;<a href="http://www.blueoceanstrategy.com/" title="Blue Ocean Strategy"><em>Blue Ocean Strategy</em></a>&#8212;on this technique. We&rsquo;re going to borrow a page from it to map our redesign strategy.</p><p>The framework embodies 4 actions:</p><ol><li><strong>Eliminate</strong> what is redundant, outdated or trivial and providing no value</li><li><strong>Reduce</strong> what isn&rsquo;t providing enough value</li><li><strong>Raise</strong> what has the potential to add more value</li><li><strong>Create</strong> what isn&rsquo;t available yet but can bring more value</li></ol><p>These 4 actions represent a reservoir of questions that can be asked about our content. But these questions need a direction. This is provided by the goals of the redesign. The stage is now set for using our background knowledge and research findings to provide answers to these questions</p><p>Here&rsquo;s the setup.</p><p><img src="/images/website/rssetup_405.jpg" alt="" title="Redesign strategy setup" width="405" height="289" />&nbsp;</p><p>As in any strategy building exercise, the magic is in asking the right questions. And the closer we are to the ground, the better the questions get. </p><p>Let&rsquo;s move forward with a scenario.</p><h3>A scenario</h3><p><strong>Background</strong>: A client wants you to redesign their executive education website. The website provides working adults access to short-term courses to bridge their learning gaps and make them more productive. You do a first-pass, lightweight research by talking to few customers, visiting competitor websites, doing a content audit and looking at search logs. You decide to focus on one of the business goals, which is to <strong>increase customer loyalty</strong>. Here&rsquo;s how you use the Eliminate, Reduce, Raise &amp; Create to take things ahead.&nbsp;</p><p><strong>Step 1</strong>: You facilitate a session with your team and ask the right questions around each action point. After a couple of hours you populate the grid. Here&rsquo;s what it looks like.</p><p><img src="/images/website/rserrc_298.jpg" alt="" title="Eliminate-Reduce-Raise-Create framework" width="286" height="298" />&nbsp;<br /><strong>Step 2</strong>: You repeat the process with other important business goals. You build a big list. Note that some of the items represent larger business issues. </p><p><strong>Step 3</strong>: You can&rsquo;t do all of what you&rsquo;ve outlined. You need to focus on what can be done in the short-term. You hold a prioritisation session to set the short-term directions.</p><p>And you&rsquo;re on your way, more focused and more confident than before this exercise.</p><h3>Conclusion</h3><p>There are many methods to map design strategy. I use this because it is simple to understand and execute. Although this is a quick technique to get you on your way, it&rsquo;s important to note that the success of this technique depends on the success of related skills and methods like user research, facilitation, prioritisation and knowledge of good design. The knowledge will always drive the method.
</p>]]></content:encoded>
      <dc:date>2007-01-26T16:23:00+08:00</dc:date>
    </item>

    <item>
      <title>CMSWatch gives its nod to the university websites article</title>
      <link>http://www.pebbleroad.com/news/cmswatch_gives_its_nod_to_the_university_websites_article/</link>
      <description></description>
      <dc:subject></dc:subject>
      <content:encoded><![CDATA[<p><a href="http://www.cmswatch.com" title="CMSWatch">CMSWatch</a>, the widely recognized authority in content management, has referenced The <a href="/article/the_changing_face_of_university_websites/" title="The Changing Face of University Websites">Changing Face of Univerisity Websites </a>article. In their article titled, <a href="http://www.cmswatch.com/Trends/741-Content-Management-heads-to-college" title="Content management heads to college">Content Management heads to college</a>, they also caution against those leaving a lot to technology.&nbsp;
</p>]]></content:encoded>
      <dc:date>2006-09-05T13:54:00+08:00</dc:date>
    </item>

    <item>
      <title>The Changing Face of University Websites</title>
      <link>http://www.pebbleroad.com/article/the_changing_face_of_university_websites/</link>
      <description>Many university websites are in redesign mode. And that&amp;rsquo;s good news for the web standards and user experience communities. It signifies not only that the community initiatives are bearing fruit, but also that we can now expect to see a much faster and wider adoption of these initiatives, especially in the public sector. This article lists some important areas of focus of these redesigns.</description>
      <dc:subject></dc:subject>
      <content:encoded><![CDATA[<h3>Background</h3><p>In a recent project for a local university, I looked at the pages of 25 universities, mostly from the US, UK, Australia &ndash; the countries that local students look to for higher education studies. In this respect, the sample size being terribly small, I cannot say for certain that what I&rsquo;ve learned is taking place universally. But the areas of change are so fundamental (and exciting) that I just had to write about it. </p><p>University websites tend to be more complicated than corporate websites. Here are some reasons why:</p><ul><li><strong>Difficultly in defining a common vision</strong>: unlike corporate websites, it is difficult for a university to get all of its schools, divisions, centers, etc., to agree on a common vision for communicating on the web. This is a classic example of a house-of-brands or a branded-house conflict.&nbsp; Only the administrative offices are under the fold for obvious reasons. Thus, it is not uncommon to come across a school or a division crafting their own vision, often citing the hyper competitive education marketplace as their main reason (e.g. business schools).</li><li><strong>&#39;Not invented here&#39; syndrome</strong>: because of the above, web design tends to fall into the hands of many different local webmasters who make decisions based on local directives &ndash; usually motivated by one-upmanship. This results in the hotchpotch that users finally get to see, and unfortunately, to experience.<br /></li><li><strong>Lack of knowledge in user-centered design</strong>: this is crucial one. Because the needs of the user (or as Don Norman would say, people) does not take center stage, as the above two points show, design decisions are based on varying principles and random rationales leading to haphazard design outcomes. Unless there&rsquo;s common understanding of user needs this is going to be a problem area for some time to come.</li></ul><p>Those in the know will have the urge to add to this list, but I guess the above is enough to provide hints of the complexity involved in the design and maintenance of university websites.</p><p>Now, let&rsquo;s see some areas of focus of the redesigns and how different universities are doing them.</p><h3>1. Web standards</h3><p>This is the big change. XHTML markup (usually 1.0 Transitional) and CSS are finding widespread acceptance. Some universities go even further. The <a href="http://www.ufl.edu/" title="University of Florida">University of Florida</a> website is mentioned in the <a href="http://www.wrox.com/WileyCDA/WroxTitle/productCd-0764588338.html" title="Professional CSS"><em>Professional CSS</em></a> book for its CSS work and on its printer friendly pages (largely based on <a href="http://www.alistapart.com/stories/goingtoprint/" title="ALA - Going to Print">this</a> <em>A List Apart</em> article). </p><p><a href="http://www.ox.ac.uk/" title="University of Oxford">University of Oxford</a> pages validate as HTML Strict but it is still a table-based layout. </p><p><a href="http://www.monash.edu.au/" title="Monash University">Monash University</a> is known for its <a href="http://www.monash.edu.au/accessibility/" title="Monash Univeristy - Accessibility">emphasis</a> on accessibility, but still displays a table-based layout. The same goes for the <a href="http://www.cam.ac.uk/" title="University of Cambridge">University of Cambridge.</a></p><p><a href="http://www.msu.edu/" title="Michigan State University">Michigan State University</a> not only validates as 1.0 strict but also has a very clean table-less markup.</p><p><a href="http://www.ic.ac.uk/" title="Imperial College of London">Imperial College London</a> provides the ability to resize fonts (for IE) and uses 1.0 Strict doc type.</p><p>Here are more that are doing a good job with web standards.&nbsp;</p><p><a href="http://www.cornell.edu/" title="Cornell University">Cornell University</a>, <a href="http://www.princeton.edu" title="Princeton University">Princeton University</a>, <a href="http://www.unl.edu" title="University of Nebraska">University of Nebraska, Lincoln</a>, <a href="http://www.dartmouth.edu" title="Dartmouth College">Dartmouth College</a>, <a href="http://www.bucknell.edu" title="Bucknell University">Bucknell University</a>, <a href="http://www.unimelb.edu.au" title="University of Melbourne">University of Melbourne</a>, <a href="http://www.wisc.edu/" title="University of Wisconsin">University of Wisconsin</a>, <a href="http://www.latrobe.edu.au/" title="La Trobe University">La Trobe University</a>, <a href="http://www.seattleu.edu/" title="Seattle University">Seattle University</a>, <a href="http://www.umich.edu" title="University of Michigan">University of Michigan</a>, <a href="http://www.shef.ac.uk/" title="University of Sheffield">University of Sheffield</a>, <a href="http://www.osu.edu" title="Ohio State University">Ohio State University</a>.</p><h3>2. Information architecture</h3><h4>Organization scheme</h4><p>If you visit some of the websites mentioned above, you&rsquo;ll notice that the top-level structure is somewhat similar across many websites&#8212;a dual organization scheme, one topic or subject-based, the other audience-based. <br />For example,</p><p><strong>Information For</strong> (audience): Prospective students, Current Students, Faculty/Staff, Visitors &amp; Family, Media, etc.</p><p><strong>Information About </strong>(subject): The University, Schools &amp; Courses, Research, Campus, Services, etc.</p><p>Different universities have different items listed under the scheme depending on their focus. For example,&nbsp;<a href="http://www.monash.au.edu/" title="Monash University">Monash University</a> has &lsquo;International Students&rsquo; under its audience-based scheme, simply because Monash is very strong in marketing education in South Asia.</p><h4>Main navigation</h4><p>Many universities now use the Yahoo! style directory structure on their homepage to provide hints (trigger words) to the content contained within the sections. For example, the <em>About</em> section on the <a href="http://www.ufl.edu" title="University of Florida">University of Florida&rsquo;s</a> homepage is represented as follows:</p><p><strong>About UF</strong> [Administration, Maps, Tours, Facts, Giving, Jobs, News, Spotlights&hellip;]</p><p>In fact, UFL uses the same strategy for all their lower level administrative pages too.</p><p>Here are others that use the same strategy:</p><p><a href="http://www.msu.edu/" title="Michigan State University">Michigan State University</a>, <a href="http://www.dartmouth.edu" title="Dartmouth College">Dartmouth College</a>, <a href="http://www.wisc.edu/" title="University of Wisconsin">University of Wisconsin</a>, <a href="http://www.mit.edu" title="MIT ">MIT</a>, <a href="http://www.berkeley.edu" title="UC Berkeley">UC Berkeley</a> and <a href="http://www.upenn.edu" title="University of Pennsylvania">University of Pennsylvania</a>.</p><p>Knowing the complexity in managing numerous sources of information for different audiences, and having all of it crisscross different stakeholders, it comes as no surprise that this strategy is becoming popular with university websites. </p><p>Also, a <a href="http://www.eastonmass.net/tullis/WebsiteNavigation/WebsiteNavigationPaper.htm" title="Research paper on Website Navigation">usability study</a> has shown this technique to be quite intuitive.</p><p>Furthermore, this strategy enables the university to be more responsive to user needs. For example, only for a specific duration of time, few weeks before convocation and a few weeks after convocation, your search logs might show an increase in the number of searches for <em>convo</em>, <em>convocation</em>, <em>convocation dates</em>, etc. With the trigger words approach the Webmaster can insert the &lsquo;convocation&rsquo; trigger word under the appropriate category thereby catering to a temporal, but important, info need.&nbsp;</p><h4>Utility navigation</h4><p>The following are quite common utility navigation options present on many university websites: <strong>Sitemaps</strong>, <strong>A-Z lists</strong>, <strong>Calendars</strong>, <strong>Maps</strong>, <strong>Directories</strong> and <strong>Search</strong>.</p><p>There is another&nbsp;&#8212;<strong>Quick links</strong>&#8212;provide shortcuts to frequently used information that cannot fit into the primary navigation. </p><p>Sitemaps and A-Z lists are present as content pages while the rest are web apps. </p><p>The web apps are the usual problem areas. These are usually not very user friendly. Web2.0 and AJAX can definitely make inroads here for the benefit of all (opportunity here AJAX gurus).</p><p>Here are some utility navigation examples: <a href="http://www.princeton.edu" title="Princeton University">Princeton University</a>, <a href="http://www.ufl.edu/" title="University of Florida">University of Florida</a>,&nbsp;<a href="http://www.monash.au.edu/" title="Monash University">Monash University</a>, <a href="http://www.upenn.edu" title="University of Pennsylvania">University of Pennsylvania</a>.</p><h3>3. Homepage, News &amp; RSS</h3><p>University homepages are also showing a common structure. Without going too much into the layout of the design, given below is a <a href="http://www.7nights.com/asterisk/archive/2005/04/page-description-diagrams" title="Definition of Page Description Diagrams">page description diagram</a> that shows the different components on the homepage and their importance.<br /></p><p><img src="/images/website/unihomepagepdd_621.jpg" alt="" title="University homepages - PDD" width="621" height="530" /> </p><p>Although many university websites treat the publication of news, events and spotlights (a featured story) as an independent subsite, usually in the form of a News Office, some websites, most notably the <a href="http://web.mit.edu/newsoffice/index.html" title="MIT News Office">MIT News Office</a>, professionally manages both the gathering and publication of news and related items. So, any MIT school or division can submit news worthy items on this website.</p><p>There is also a <a href="http://web.mit.edu/newsoffice/write-news.html" title="MIT: News writing guide">News Writing Guide</a> available on this website to aid on writing effective news items. </p><p>Needless to mention that most dynamic items such as news, events, spotlights, etc., are syndicated by RSS, finally. </p><h3>4. Branding</h3><p>This has always been a problem area for university websites: how to maintain the presence of the university brand when used in together with the school and divisional sub-brands. And the problem is even more intense when the sub-brand is more popular than the main (mother) brand. Thus it is not uncommon to find school deans fighting for more independence and the university communications department resisting the breakup. In short, this is the same branded house vs. house of brands dilemma. </p><p>Some university websites are trying to find common ground with different strategies. For example,</p><ul><li>Cornell University provides the typical <a href="http://www.cornell.edu/identity/web/" title="Cornell University - Identity Guidelines">main brand/sub-brand strategy</a>: consistent header with a placeholder for the faculty name.</li><li>Monash University provides the same as Cornell but also <a href="http://www.monash.edu.au/staff/web/branding/" title="Monash University - Brand Guidelines">color codes</a> the different faculty websites.</li><li>UW Madison gives <a href="http://www.uc.wisc.edu/webStyleGuide/" title="UW Madison - Style Guide">2 template color options</a> with a consistent top-bar with the option of not displaying the logo. </li><li>Ohio State University requires that all of its websites display at minimum a <a href="http://www.osu.edu/identity/web.php" title="Ohio State University - Web Identity">narrow red-grey top bar</a>. If a faculty website has a logo it can appear on the top-left or bottom-left as a &ldquo;signoff&rdquo;.</li></ul><p>Now, if you take a look at the faculty or school websites of the universities listed above, you&rsquo;ll notice that not all are in the common, consistent fold. Thus, even with the usage guidelines clearly stated, many faculty or school websites have an independent look and feel. </p><p>The real reason could be that the migration of a faculty or school website is an effort intensive task. It takes years to get all of the university subsites into a common fold.</p><h3>Conclusion</h3><p>This is very brief look at university websites. There is so much more taking place behind the scenes. Only the people working on such redesigns day and night know the enormous effort required to push forward in very trying situations &ndash; a change process on a massive scale and with multiple stakeholders. There will be many ups and downs, but the most interesting part is that there will be experimentations. And it will these experimentations that, I hope, will transfer to areas that the user experience and web standards communities find hard to reach.</p><p>Have you come across a university website redesign approach that is breaking new ground? If yes, then use the comments section below to share the learning.
</p>]]></content:encoded>
      <dc:date>2006-08-17T13:35:00+08:00</dc:date>
    </item>

    
    </channel>
</rss>