Good web site navigation builds your brand

October 16th, 2009

One point I often make in discussing web site design with clients is that your site’s navigation is also part of your brand. On the web “the brand is the experience and the experience is the brand.”*

Recently a potential client in discussing a web site redesign expressed how their content management vendor’s implementation of navigation with multiple levels of fly-out menus caused problems for older alumni (who can’t drive a mouse as well as they used too — this issue it not limited to older individuals, by the way). The vendor is probably no doubt proud of the technical aspects of its menus — it uses them frequently in its online portfolio examples — but this is an example where the technical solution is not the best human solution, and it leaves a bad impression with certain users.

James Kalbach writes in Designing Web Navigation that while the “cost of finding information is high, the cost of not finding information is perhaps higher.”** A site’s navigation plays a role in expressing a brand, it:

Communicates … priorities and values through categories, the order of options, and the tone of the labels. Well-structured navigation also contributes to the overall credibility…. People seem to trust a site that appears clearly organized with an easy-to-use navigational structure.

How you help or hinder your site visitor’s completion of his or her goals and whether you respect or waste a user’s time, feeds the stream of impressions about your institution. In the example above, the message is: We don’t care so much about our older alumni. If your navigation is “cool,” but unusable by persons with disabilities, you are sending a pretty definite message about your institution, and its brand, into the world.

We’re all aware that our brand extends beyond the visual aspects of it. We’re frequently much better at implementing the visual parts — the logo, the stationery package, the publications, the appearance of the website — than we are the physical and experience aspects. But our brand’s story is also informed by physical interactions and by experiences, whether we actively try to mange those aspects or not. An unhelpful employee can damage the impression of your brand for a campus visitor. A campus tour and the appearance of your physical plant can affirm or change your brand impression in the mind of a prospect or a parent. And nothing can telegraph an organization’s thinking about its consumers or audiences quicker than its web site.

In web projects there’s often pressure to get to something visual very quickly, but web design is as much, if not more, about enabling an experience as it is about including the logo and new pictures of the quad. Your site’s navigation, and the information architecture and the back-end technical systems supporting it, are the foundation of the online experience. Design decisions should always consider accessibility, responsiveness, and polite degradability (for assistive technology devices and older browsers) with the goal to leave site visitors with a delightful, as opposed to frustrating, experience. Navigation design should not be left to the IT intern or the default settings of your content management system.

* Dayal, S., Landesberg, H. and Zeisser, M., “Building Digital Brands,The McKinsey Quarterly, May 2000: 42-51.

** Kalbach, James, Designing Web Navigation (Sebastopol, CA: O’Reilly Media, 2007) 22.

Seven tips on search engine optimization for edu sites

July 27th, 2009

Writing and designing for today’s web is about writing and designing for humans and robots.

Content must not only pique the interest and meet the needs of a site’s human visitors, but it must be equally nutritious to the Pac Man appetites of the search engines of Google, Yahoo, and others. Every search engine has an application — crawler, spider, or bot — that finds and follows the links of your site, sending back a list to a database, which is then analyzed by the search engine’s proprietary algorithm to rank your pages and serve up a search engine results page (or SERP, in the lingo). Optimizing your site for search requires having content, structure, and technology that help both the crawler move over the site and the search engine rank the results.

Search optimization is a mix of science and magic and a continually moving target. Even the search engine optimization (SEO) experts don’t agree on all techniques. And an .edu site is going to have different priorities for SEO than a business site that exists for e-commerce. But since many SEO techniques are easy and actually encourage good organization and content practices, adopting them as part of your site development and maintenance guidelines is not a waste of time, particularly in an era of belt-tightening for traditional marketing budgets. Here are seven tips gleaned from the realm of SEO to get you started:

1. Use descriptive page titles — We’re talking the TITLE tag here, and it’s one of the first things that both humans and robots encounter. Make sure your pages have descriptive titles with keywords. Simply repeating the name of your institution on every page is not sufficient. Each page should have a unique page title, with keywords (but not stuffed with keywords) relevant to the page content, front loaded with the words that matter most. Aim for no more than 66 characters and use title case.

2. Put effort into the most valuable meta tags — The meta description tag deserves your attention, not necessarily for its influence over rankings, but because its content can be what search engines display on SERPs. You want to control that display, not leave it up to the crawler’s best guess. It should be around 160 characters and be unique to each page. The meta keyword tag has been so abused with spamming that it has low to zero influence on search engines. If you use it, it should be different on every page. Simply repeating the same words in the keywords tag on every page of your site may look more spammy than legitimate to a search engine.

3. Use heading tags — Headlines are looked at with more importance by crawlers than body text. The H1, H2, and so on tags are a way to indicate headlines and their relative importance to search engines. In the dark ages before CSS, we were saddled with fixed heading sizes that were often too big or too small or otherwise ugly in the layout, so we sometimes used other tags (or even images, gasp) to style headlines. Now with CSS we can visually style H tags any way we like, and they can be used to add robot-readable structure to a web page. Heads should be both descriptive and have relevant keywords when possible.

4. Write one topic per page — This is a tip followed by most pro content developers. Not only does it help your human readers, but the algorithms that search engine crawlers use work best on one topic at at time. Keeping focused in your writing also makes it easier to come up with keywords and meta descriptions for a page. Since you’re sticking to one topic per page, you can also keep it short and get to to the point quickly, right? Headlines, subheads, and concise paragraphs are good SEO writing, and consistency among those helps search engine crawlers (and humans) understand your content.

5. Don’t be lazy with your links — The anchor text of a link gives descriptive information about the content of the link’s destination page and can influence search engine rankings. Lazily written “click here” links, for example, tell nothing about the destination page, but may get you a top ranking for “click here.” (Search “click here” in Google. Hello, Adobe.) Use keywords in the link text that are relevant to the destination page. And while you’re at it, pay attention to linking to the PDFs, videos, images, and similar assets that are all part of today’s sites. For example, a search engine cannot tell that’s the spring commencement video unless the link to it says “spring commencement video,” and it is placed next to text in the page about spring commencement. And, by the way, for similar reasons make sure all your images (including logos and images used as buttons) have appropriate text in their ALT tags.

6. Understand the search implications of technologies —
This is a whole topic unto itself, but be aware of search implications of your technical choices. Flash for example, has improved in its ability to be indexed and to allow search engines to find the content and links embedded within Flash objects. But it’s unlikely that search engines will open themselves up to full compatibility with Flash, because that would also open the door to being gamed by an unethical optimizer. Current search engines don’t generally index Flash content on par with HTML. HTML pages will get ranked higher.

There are similar challenges with AJAX and JavaScript. Search engines can’t deal very well with the dynamic and “pageless” content that can be enabled by these technologies. The functional and stylish enhancements that JavaScript can bring to a site’s navigation can also block a search engine’s ability to build a model of the site’s link structure. Search engines can only see the initial page load. If AJAX is used to later alter that content, the new content won’t be seen by a search engine. There are techniques to deal with these issues that you may want to consider.

And finally, with the growing popularity of content management systems (CMS) in education, institutions are faced with a whole slew of additional considerations that affect search. For example, it’s not uncommon to “restart” a site within a CMS, generating a new URL structure for all the content. Search engines, however, have indexed your site using the previous URLs. You are effectively starting over at ground zero with search engines when you flip the CMS switch. Content management systems can also generate problematic URLs along with cloned and duplicated content, which also don’t make search engines happy. If you’re considering a CMS, questions to the vendor about how it supports search are in order.

7. Bring back the site map — And finally, have a good old site map page, a hierarchical list of all the links of the site. The popularity of providing site maps has waned, but they are good for SEO. For one thing, such an alternative link structure can help make up for issues being caused by JavaScript, AJAX, and other crawler blockers. Also including the site map’s links at /sitemap.xml and /sitemap.txt can help search engines understand your site’s structure.

Like all things web, developing for search optimization is a balance between human needs and the needs of technology. It can be challenging, but in many cases what works well for one — structure, conciseness, explanation, consistency — also benefits the other. Search optimized content can be a win win for human and robot.

This post originally appeared in Stein Communications The Scoop

Social network research questions influencer role

January 13th, 2008

How important a few exceptionally influential people are to spurring social epidemics and viral campaigns is the subject of recent research by social network theorists Duncan J. Watts of Columbia University and Peter Sheridan Dodds of the University of Vermont in Burlington.

Published in the Journal of Consumer Research, the researchers’ findings question the notion of influencing the influential:

They found that highly influential individuals usually spread ideas more widely, but not very much more widely….Sometimes, the researchers found, the difference wasn’t even measurable.

In a few networks, ideas espoused by influential individuals spread much further than those of average folk, but those types of networks were not common and not likely to be similar to the real world….

More at Science News: The Power of Being Influenced, Network theory reveals the best way to spread ideas

Getting to empty: the organized inbox

September 6th, 2007

43 Folders creator Merlin Mann gives a Google TechTalk on dealing with email and getting your inbox to zero…

Print and web design: narrative and behaviors

September 5th, 2007

I was recently involved in a conference call with managers of university communications staff. They were looking for better ways to organize and increase the team-building in their internal communications personnel. They were considering how to bring their print and web folks closer together.

They wanted to pick our brains because, as an organization, we were a print print-focused long before we added web services. They wanted to know how we had integrated the print designers into the web design process.

This answer is, we haven’t; at least not in the sense that we use print and web visual designers as interchangeable parts, plugging them in and out of interactive and print-based projects at will. We certainly have — and strongly believe in — input and cross fertilization on these projects, but we haven’t tried to organizationally force people to be what they’re not.

My observation — based on years of working with design in both print and web projects, and which I shared on the call — is that you can’t expect interactive and print designers to casually change rolls.

Yes, the fundamental traits of a good visual designer — taste, talent, and tenacity — apply to both fields, but the way those aspects are applied and realized are significantly different between print and web. It’s not unheard of, but it’s a rare animal that can move effortlessly between print and interactive design and maintain equally high quality work. Design Director Khoi Vinh recently wrote about the differences in approach and skills needed by web and print designers:

…on the Web, design is not a method for implementing narrative, as it is in print, but rather it’s a method for making behaviors possible…the Web is not commonly an effective tool for highly expressive displays of typographic, photographic or illustrative skill. Looking for opportunities to execute the sort of improvisational and dramatic creative visions that we see in printed periodicals, for instance, is likely to be an exercise in disappointment.

Understanding how to finesse, and appropriately subvert, the many constraints involved in working in digital media requires, as Vinh notes, “an attention to detail that bores all but the most dedicated.”

More: This Way to the Web, Print Designers!