RSS
 

Archive for June, 2011

Is It Time to Rethink Website Navigation?

27 Jun

Advertise here with BSA


The hyperlink has been a staple of the Internet since it began. The Web simply wouldn’t be a web at all if we didn’t link from one web page to another. Links make the Web work.

So it would make sense to put a lot of time and effort into how we design our links and navigation systems.

But, this isn’t always the case. Oftentimes, we shortchange the information architecture phase of a site build and fall back to one of the few tried-and-true design patterns — a canned template — for designing site navigation.

The Status Quo of Site Navigation

One of the many beautiful things about Web Design is the near-limitless options available to us. Yet, still, our navigation systems seem stuck into the existing preformed solutions.

For small, personal sites, a simple top horizontal navigation bar is the typical option.

For larger sites with more pages to link to, we default to a stacked vertical navigation bar to give us the ability to include more links.

In other situations, we find that drop-down menus or fly-out menus are used to keep the navigation menu compact.

Drop-down menu on Google home page.

It’s easy to see why we have these options. To some degree, we have been forced to conform to them because of the early limits in web design.

As time went on, our users got used to the status quo. As a result, we’ve been hesitant to rethink the way navigation systems are designed.

And even if we didn’t put our users first, why spend time creating something new when the hackneyed solutions work? (At least we think they do, anyways.)

But are these conventional forms of navigation still the best solutions?

Natural Evolution

Since its inception, Web Design continues to evolve at a rapid pace. Our designs are getting easier to use, they’re more pleasing to experience, they have become richer in features, and are better optimized for speed.

Through the changes, our conventions for navigation have stayed the same, perhaps with the exception of the short surge we saw of entirely Flash-based websites that introduced some pretty unique navigation system designs.

This Flash site forgoes the common navigation design patterns we see in most websites.

While there are plenty of reasons to avoid going back to the days of entirely Flash website builds — whether your reasons are related to performance, SEO, web accessibility, independence from a proprietary technology, etc. — for most of our projects, we may still be able to gain some inspiration from what Flash sites showed us, especially in the rethinking of how website navigation can look and function.

As web browsers become broader in features and as web design specifications continue to advance — most recently with CSS3 and HTML5 — our design opportunities broaden.

Website navigation should be at the forefront of our minds as we take advantage of these new technologies for the betterment of the user experience.

We have already seen CSS3 in action to some degree, most notably on responsive web designs that transform the navigation menu’s layout on-the-fly depending on the size of the user’s display (with the help of media queries).

On the Forgotten Presidents site, navigation layout changes from horizontal to vertical depending on display size.

Change with Purpose

Of course, changing something just for the sake of change is a poor excuse. We shouldn’t be changing the design and layout of navigation systems just because we have the tools to do so.

Instead, we should approach the situation by looking at existing issues with navigation design, and how we may address them with the new techniques available to us.

Some of the bigger questions touch on things such as where the navigation should be located, how expansive it should be, what shapes it consists of and what kind of feedback it will provide users. All of these lead to huge decisions that play a pivotal role in how usable, flexible and practical your design is.

Newegg provides the ability to navigate its immense inventory of products with multiple navigation solutions.

The New Face of Navigation

CSS can do some downright exciting things these days and it’s in the nature of many designers to experiment and push the boundaries of innovation.

For example, blogger and web developer Chris Coyier shows that we can draw adaptive shapes that can transcend the scalability limitations of images.

Graphic designer/web developer Alex Girón shows us that we can create pretty impressive animation effects and transformations with his experiment involving the solar system’s orbit.

This sampling of possibilities demonstrates some pretty impressive capabilities. It doesn’t take long to see that these experiments can be adapted practically to solve design problems.

With shapes, and the ability to animate them, we have the building blocks to create flexible and imaginative interfaces.

Offline Inspiration?

We don’t have to go far to see new twists on navigation. Our computers, stereos, appliances, vehicles, and even our keyboards all use a wide array of shapes, sizes and colors to build interaction.

The spacebar on your keyboard is not larger than the other keys because it contains more characters. It’s used the most, so it’s the largest — an application of Fitt’s Law.

Source: Wikipedia

Compare the size of your spacebar to your Y key, for example. In your web design, could the Home link (or any other frequently used navigation link) also benefit from the same boost in size over a less important link?

The interfaces on our sound system receivers, remote control, and car dashboards all house a wide variety of size, shape and color to denote differences in importance and function.

We hold the ability to craft these solutions in our web interfaces without sacrificing flexibility or accessibility, the traditional reasons we’ve stayed away from them, using progressive enhancement and other best practices.

To illustrate my point, I put together a quick example of an early-generation-iPod-inspired navigation using just HTML and CSS.

iPod illustration by Matthieu Riegler, Wikimedia Commons

In reality, a circle can often provide a much more convenient use of space when compared to rectangular shapes.

Also with all of the active areas of our navigation naturally placed at equal distance from each other, this type of navigation is consistent with Fitts’ Law.

Of course, this may or may not be the best solution for any single situation, but that is the beauty of our profession. Designers should be taking the time and consideration to explore all of the constraints each project comes with and working out individualized and ideal solutions.

Take Advantage of New Opportunities

Now, more than ever, we have the opportunity to use our creativity to solve complex issues with our navigation systems. The rapid adoption of CSS3 unlocks a huge amount of design potential. We can start to think outside of the limited array of design patterns we have for site navigation.

Related Content

About the Author

Jason Gross is a freelance web designer focused on creating clean and user friendly websites. Jason currently lives in Indiana and can be found on Twitter as @JasonAGross or on the web at his personal blog and portfolio.

 
 

Our Narrowing Food Tree

26 Jun

From NatGeo:

 
 

Wikipedia is Adding a Love Button Next Week

24 Jun

Kittens and beer for everyone!

Wikipedia is now an undeniably good source of information on almost any topic. In order to continue improving, the community-edited site needs a continuous flow of volunteer editors willing to put time and energy into making new edits. And studies show that people are more willing to do that if they have been shown support by other people on the site.

Wikipedia's getting pretty well-filled out, so compliments are getting harder to come by and criticism is more available than ever. In order to step up the love, Wikipedia announced tonight that it has begun experimenting with and plans on pushing site-wide on Wednesday a new feature: the WikiLove Button.

Sponsor

The WikiLove Button is live on the Wikipedia test site right now and if all goes well it will go site-wide on Wednesday the 29th. It appears in the right hand corner of each user's page, in the form of a little red heart. Users are encouraged to click the button when they come across edits or other on-site activity that deserves commendation.

A click of the button will result in the launch of a Love Interface, in which the button clicker is presented a number of options for what kind of love to send and images to append to a free-text compliment area. The resulting declaration of support is published to the receiving user's account discussion page.

It's all semi-structured and closely monitored by the top nerds at Wikipedia in order that a more hospitable environment can be optimized.

I think it sounds like a very good idea. This kind of gentle social engineering to create a structure for the site that's more welcoming, accessible and effective could help produce a better product for us all (more edited Wikipedia content) and could help the site better serve us as people. Ultimately that is the point of all this, right?

kittybutt.jpg

Below: Semantic analysis of message text concludes that Wikipedians are too seldom nice and that they need a button.

wikimean.jpg

Discuss

 
 

Google Health: Why It's Ending & What It Means

24 Jun

Google's quest to organize the world's information will no longer include one of society's most important and sensitive sources of data: our health records. The company announced this afternoon that Google Health will be closed forever and deleted in 18 months, along with a thematically similar and also formerly ambitious project, Google Power Meter.

Google says it's shutting down the projects because they got very little traction but health industry tech innovators say that Google Health may have been ahead of its time, did a poor job reaching out to a now growing ecosystem of developers and ought to be put on slow life support or open sourced instead of being shut down. When it comes to patient-centric cloud-based electronic health records, the opportunity remains large, the need severe but the challenges are substantial.

Sponsor

When Google Health launched just over 3 years ago, ReadWriteWeb's founding Editor Richard MacManus called it decent and a good start, but short on advanced functionality or integration with the existing healthcare system. MacManus called Health 2.0 game-changing (and potentially hugely profitable) but said that Google Health fell far short of its potential relative to the market it was targeting. All of those things remained too true throughout the life of the project.

What it Means to Lose Google Health

Medical information heavy-hitter John D. Halamka MD says Google Health was a real trailblazer in its time. Dr. Halamka is the Chief Information Officer (CIO) of Boston's Beth Israel Deaconess Medical Center, the CIO and Dean for Technology at Harvard Medical School, the Chairman of the New England Health Electronic Data Interchange Network (NEHEN), CEO of MA-SHARE (the Regional Health Information Organization), Chair of the US Healthcare Information Technology Standards Panel (HITSP) and a practicing Emergency Physician.

"Google Health is truly innovative and broke new ground when it created interfaces to hospitals, labs, and pharmacies in 2008," Halamka wrote today on his blog. "I was there at the beginning and can definitively state that it was Google's reputation and vision that broke down the political barriers keeping data from patients...Google Health [still] has the best user interface, feature set, and ease of use of all the stand alone personal health records." (It should be noted that Israel Deaconess Medical, one of Dr. Halamka's employers, was one of Google Health's launch partners.)

Halamka says Google Health "really moved the industry" but other observers express disappointment that the project barely got out of the starting gate.

"It will take someone the size of Google and not in the health space to create something that's more standardized in the health space, where everything is so proprietary and money driven," says Shwen Gwee, founder of the blog Med 2.0.

"Unfortunately, it's always been Google's philosophy to fail fast and cut off the arm that isn't doing any work. Early adopters were interested in using Google Health, but it took too long to move. I wonder what would happen if they launched it now, with everything that's coming out around open and standardized data. I wish they would donate the platform, open source it, issue a challenge or something, and see what others could do with it."

The request that the Google Health platform be open sourced is something we heard from multiple industry players. People feel burned by the loss of a big opportunity due to the impatience of a big, slow company.

"Google is cutting and running too early from Google Health..in the long term I believe this to be a big mistake," says Mark Scrimshire, co-founder of the HealthCamp Foundation, an organization that puts on events around the world to hack on the future of healthcare.

"Health was always a long term play. An industry mired in regulation and conservative approaches, things were never going to change quickly. However, momentum is building. We are [now] seeing a tremendous uptick in innovations that make use of Government Health Data [for example].

MarkScrimshire3.jpg"Personally, I still use Google Health on a daily basis. My Fitbit and numerous other health related data sources feed in to Google Health and pass data out to other services like Keas.com [a workplace wellness program]. I recently moved my Pharmacy because I could have my data automatically piped in to Google Health.

Right: HealthCamp's Mr. Scrimshire, before and after using Google Health.

"Google Health - what we call an untethered Personal Health Record - was NOT a destination in and of itself. Instead it was more useful as a conduit through which we could channel our health data.

"As Meaningful Use requirements kick in as a result of the implementation of the Affordable Care Act we can expect to see Patient Portals popping up like daisies and consequently a growing need to provide a place that Patients can bring together all these disparate data sources in order to get a comprehensive view of their Health. It is not happening yet, but expect to see changes happening in 2012 and people starting to look for solutions to help them get their arms around their health data. The problem for Google will be that by cutting and running now who will trust them in the future if they decide to come back to the table?"

A spokesperson for Google declined an offer to respond to any of the issues raised in this article prior to publication, saying the company preferred that its announcement today speak for itself.

Why Did Google Health Fail to Gain More Traction?

There are many different theories about why Google Health didn't grow faster.

A Very Tough Market

Tech analysts, entrepreneurs and market leaders have been gambling on the viability of consumer and industry support for medical data storage and transfer for several years. Big companies like AOL co-founder Steve Case's Revolution Health have tried and failed and small independent companies like MiVitals (see our profile in 2008, TechCrunch's RIP post in 2009) have tried and failed as well.

The health care sector is flush with money, power, fear and according to some, technological apathy or ineptitude. Dave deBronkart (ePatient Dave, as he's known) was one of the first patients to sign up for Google Health but found that the data it exposed to him was wildly inaccurate and unhelpful. Painted in the press as Google Health's biggest critic, deBronkart says he's actually a huge fan of the idea - he's just concerned that the garbage-in-garbage-out dynamic means that a whole lot of terrible data is being brought out from the shadows of legacy systems offline and being shoved thoughtlessly into new electronic health records systems online. The end result is a big mess, he says.

deBronkart says he thinks Google's outsider relationship with the medical community is a strength, not a weakness. "Many of the medical IT systems in this country are built really poorly," says deBronkart, who is now a prominent patient advocate. "I hope that the passing on of Google Health will give us all cause and occasion to think about how our medical records systems should work. I hope that 5 years from now we'll look back and say what Google started has lead to something truly game changing."

A related analysis is offered in other words by John Moore, analyst at Chilmark Research, who has been tracking Google Health for years and today offered a timeline of its slow but probably foreseeable decline.

"Healthcare is a tough market in and of itself and the consumer health market is even tougher," Moore writes. "There is a paucity of consumer health information in structured, machine computable format. Maybe in a few years once we get doctors comfortable using EHRs and readily sharing records with their patients that may change, but that is still a few years out.

"Few consumers are interested in a digital filing cabinet for their records. What they are interested in is what that data can do for them. Can it help them better manage their health and/or the health of a loved one? Will it help them make appointments? Will it saved them money on their health insurance bill, their next doctor visit? Can it help them automatically get a prescription refill? These are the basics that the vast majority of consumers want addressed first and Google Health was unable to deliver on any of these."


Dave Chase, founder of Microsoft's health business and now CEO at a startup that overlaps with Google Health, offers a number of explanations for Google's health stumble. The most interesting was the company's failure to work with more doctors:
"As much as there's a massive consumer-empowerment movement, in order to get ongoing and broad adoption of something in healthcare, one needs to lead with the clinicians. Take a look at ZocDoc, for example. They are having success with appointment scheduling by leading with doctors/dentists who then, in turn, bring in their patients. Without provider adoption first, they would have had limited success with consumers."

Matthew Holt, Co-Chair of the organization the Health 2.0 Network says he thinks insurance companies were in part to blame. "Google became disappointed when they found out how hard it was to get Insurance agencies to share their data voluntarily," Holt says. "They made some progress but not enough."

The most common critique we heard though was of Google Health's work with tech developers.

Healthcare blogger Faisal Qureshi said on Twitter this afternoon, "Google Health failed at not reaching out to vertical developers, Android fixation & not learning how MSFT partners."

Brian Ahier, a hospital IT evangelist in Oregon echos that sentiment:

"While Microsoft has assembled a list of companies that make products (glucometers, blood pressure monitors, etc.) and offered software that pulls in data from hospitals and labs, compatible with their HealthVault product, Google has made little to no headway in this area.

"I remember a few years back Google did fairly well when compared to Microsoft but HealthVault has continued to mature and Google has been stalled for some time."

Ahier says that Google's decision to pull the plug on Google Health will ultimately be a bad thing for the whole industry.

We spoke to a number of people who agreed that Google launched a stronger health data product than Microsoft, but that Microsoft's HealthVault has since surpassed Google Health.

"The problem with Google Health is that it offers no incentive to use it, it positioned itself as a data repository and not much else," says Brian Dolan, Editor of MobileHealthNews. "Some of the other consumer apps and devices are filling the gaps and they have their own back end systems and APIs, they're all sharing with each other. These other sticky consumer health apps are driving uptake and driving adoptions."

One of those startups and a platform in-and-of itself is Boston-based fitness tracking service Runkeeper. Founder Jason Jacobs says of Google Health's closure,

"Sensors are starting to proliferate across categories, but someone still needs to tie this data together and provide the users a holistic view. Google's vision for data aggregation and the good that can come from it was right, but data aggregation isn't the only piece, the consumer-facing system that people love has to be there. And that is the hardest part.

"Google was a pioneer in many ways with Google Health, and helped turn people on to the need to solve the problem of health data fragmentation. While they may not have achieved the consumer adoption they were hoping for, someone is going to crack the consumer nut in health in a Facebook-like way, and the world will be better off for it."

Or, as RunKeeper's @HealthGraphAPI Twitter account said upon learning the news, "Don't worry folks, we'll take it from here..."

Surely someone will take it from here, right?

Discuss

 
 

CHART OF THE DAY: Facebook’s Unbelievable Effect On The Rest Of The Web

24 Jun

Facebook is quietly eating up all the time we spend on the web at the expense of all other static non-Facebook sites, according to an analysis by Ben Elowitz CEO and founder of Wetpaint, a digital media startup.

If you exclude online video, and mobile web consumption, Elowitz says, "the web is shrinking." He says the rest of the web is quickly becoming "irrelevant," and argues that in the future companies will need to spend less time on SEO, and more time on optimizing for Facebook.

It's an interesting outlook, and worth a read here.

chart of the day, facebook growth vs the rest of the web, june 2011

Follow the Chart Of The Day on Twitter: @chartoftheday

Please follow SAI on Twitter and Facebook.

Join the conversation about this story »

See Also:



 
 

Sufficiently large X

24 Jun

Victimless Crime

As comic Saturday Morning Breakfast Cereal explains, this is what happens when a powerful weapon falls into the wrong hands. Or when someone in power is just plain dumb.

[SMBC via @eagereyes]

 
 

Oldest Art in Americas Found on Mammoth Bone

22 Jun
The Americas' oldest known artist has been confirmed as an Ice Age hunter in what is now Florida, according to a new study.

Email this Article Add to del.icio.us Add to digg Add to Facebook Add to StumbleUpon Add to Google Add to Reddit
 
 

Apple Is Hiding Its Google-Killer (AAPL, GOOG)

22 Jun

steve jobs 1997

It now appears that Apple is waiting for iOS 5 to be ready to release the iPhone 5, which shows how big a deal the latest version of its mobile operating system is. 

However, there was a huge thing missing from that unveiling. 

Siri. 

Siri is the mobile assistant app Apple acquired almost a year ago. 

Siri is really a mobile search engine. Or really, it's what a mobile search engine would be like if we'd had the Internet on phones before computers. 

You speak into it, you say something like, "Siri, I want a romantic Italian restaurant nearby", and it will do that. It will take your location and scour Yelp and the like for Italian restaurants with the attribute "romantic" near you. You can ask it to make a reservation, and it will go through OpenTable and do it. 

It's like it's magical. It uses artificial intelligence developed by the Pentagon and was funded by the CIA. 

It also ought to scare the bejeezus out of Google, because search is its core business and mobile search is the big reason why Google got into the mobile phone business in the first place. If Apple can do it better than Google, they're in big trouble.

So, what's the hold up? 

The last time he was asked about Siri, Steve Jobs punted on the question, and said that Siri wasn't a search startup, but an artificial intelligence startup. This suggested that Siri was really an "acq-hire" for Apple to get great engineers.

But it's hard to buy. Siri built right into iOS would be such an amazing feature, plus such a great sop at Google, that it's hard to imagine Apple isn't working on it. 

We only see one explanation: Apple is working on a new, even better and more powerful version of Siri, which can take voice commands and do all sorts of stuff, including search. 

We can't wait. 

Don't Miss: How iOS 5 Copied Android →

Please follow SAI on Twitter and Facebook.

Join the conversation about this story »

See Also:



 
 

What Potential Impact Can HTML5 Have on SEO?

22 Jun

Advertise here with BSA


What Potential Impact Can HTML5 Have on SEO?

Although still a work in progress, HTML5 is the next major revision of the HTML standard. HTML, which is the markup language that allows us to structure and present our web content, is the primary factor in search engine optimization efforts. HTML gives search engines the needed context they need to understand what’s contained in a web page.

How might HTML5 change the way we approach SEO? What are the possible impacts of HTML5 in search engine algorithms? In this article, I will attempt to answer these questions.

Web Page Segmentation and Increased Semantics

One key component of HTML5 is that it adds new elements that help us better express what’s on a web page. This helps improve web page segmentation so that different parts — such as the header, footer, main content area, etc. — can be easily be distinguished from one another.

Once HTML5 becomes more widely adopted, search engines can use these new elements to help them find page elements of interest to them.

Currently, we use <div> elements to organize and segment a web page.

The issue with using <div> elements is that the element is meaningless. It doesn’t add semantic value or give context to what’s inside it.

With new elements such as <header>, <article>, <aside> and <footer>, the segmentation of the web page becomes more meaningful.

The benefit of this is that it will allow search engines to easily crawl the website, possibly skipping sections such as <footer> or <header> or using them for different indexing purposes (such as identifying copyright information or finding the site’s name or logo). Search engine indexing will thus be more efficient, meaningful and possibly more advanced.

HTML5 Elements That Can Affect Search Engine Indexing

Below are some new HTML5 elements that can have a direct impact on SEO.

<article>

You probably already know the importance content plays in your website’s search engine ranking.

The new <article> element is probably one of the most important additions to HTML5 when it comes to SEO. It allows you to indicate the main content of a web page.

One potential change to search engine indexing is that search engines may put more weight on the content inside the <article> element.

<section>

The <section> element is meant to indicate various sections on a page. The advantage is that each section can have its separate HTML heading. This can give search engines a better understanding of how the web page is segmented and structured. Search engines might be able to tease out the information hierarchy of the HTML document based on <section> tags.

<header>

The <header> element can give search engines a clue as to where the site name and logo is on a web page or where the primary navigation is (as this is often the place where navigation menus reside).

<footer>

In web design, a footer usually contains auxiliary information such as copyright information, licensing terms, privacy policy information, links to static pages, and links to social media profiles. This section could be used by search engine spiders to identify items related to copyright, terms of use, privacy policies and social media profiles.

Since <footer> contains auxiliary information, will its content be heavily discounted in search engine algorithms? Possibly.

<nav>

This new element can give search engine indexing algorithms clues to the information architecture of your website, (just like how sitemaps help them gain a better understanding of the website’s structure).

Link Types

One of the ways search engine rankings are determined is through hyperlinks in a web page. Search engines study links in a web page to see what web pages it points to as well as to see what web pages point to it.

Link types in HTML5 allow us to give our links better meaning. This gives search engines greater context for each link they encounter.

You are probably familiar with rel="nofollow", which was a non-standard rel value in HTML4 that many search engines use to identify links that the current web page doesn’t endorse. The new link types, which also use the rel attribute, works the same way.

New attribute values like rel="author" and rel="license" essentially allow us to describe our links better. The rel="prev" and rel="next" attributes, which is a link that points to another web page that is related to the current web page, can be used in circumstances where a blog post is broken up into several web pages.

Below is a table containing interesting link types for <a> elements that can influence search engine indexing in the future.

Link Type Description
alternate Links to an alternate presentation of the current web page
author Links to a web page related to the author of the web page
external Links pointing to external domains
help Links pointing to relevant help pages
license Links to licensing terms of the current document
next In a series of web pages, this links to the next web page
nofollow Indicates that the link is not endorsed by the site
prev In a series of web pages, this links to the previous web page

See a full list of link types here.

Improved Media Handling

The addition of native multimedia elements such as <audio> and <video> can mean increased interoperability with search engines. Google, for example, presents YouTube videos in search engine results. Google already indexes images in Google Images. We could see video and audio being treated like images indexed in Google Images.

Related Content

About the Author

Adam Heitzman is a web designer/developer with a strong background in SEO. He’s a Managing Partner at HigherVisbility, a Memphis-based internet marketing agency that offers a full range of marketing services ranging from SEO, Pay Per Click Marketing, Web Design and Development, and Social Media Marketing. Connect with HigherVisibility on Facebook and Twitter.