GeorgiaGov

Background

Thu, 26 Apr 2012 16:05:00 -0400

georgia.gov is the main website for the state of Georgia. Each year, about 4.5 million people visit the site, accounting for almost 16 million page views. On the site, citizens can browse the site by topic and find links to information on other state websites, or search for the information they’re looking for.

The site went live in 2002; but with the exception of a refresh in 2006, it’s never had a major redesign. Ever.

A lot has changed in 10 years. We’ve seen the invention of Facebook, Twitter, the iPod, iPhone and iPad, but georgia.gov has stayed essentially the same. In fact, it’s gotten more crowded with information - not the type of message taxpayers want.

Back in 2002, we built the site to be like the old Yahoo - just click around, and you’ll eventually find what you’re looking for. But state government is too big for that, and as Google replaced Yahoo as the tool of choice for web surfers, we knew we had to totally rethink georgia.gov.

Methodology

Thu, 26 Apr 2012 15:05:00 -0400

With the redesign, we wanted to do something different. Something that hadn’t been done before. And we wanted to redo everything, not just give it a facelift.

So we looked at every aspect of georgia.gov. - content, search, information architecture, platform and design. What wasn’t working, and why wasn’t it working?

We had our ideas, but we wanted our decisions to be based on real data. So we gathered data from lots of areas:

Website analytics;
Site search statistics;
georgia.gov customer satisfaction survey
Information from the 1-800-georgia call center.

The findings:

Citizens came to georgia.gov looking for information that affected them personally. The needed financial support for their children, copies of birth and death certificates, jobs.
They couldn’t find what they’re looking for. The structure of the site was outdated, which caused citizens to bounce around the site, according to web analytics.

Trying to meet everyone’s needs, we tried to link to every possible bit of information out there. The result, long lists of links that were difficult to go through.
Bad content on other sites. Even if we got citizens to the right place, there was no guarantee that the information there was up to date and accurate.

Got Any Ideas?

Thu, 26 Apr 2012 14:05:00 -0400

We knew what the problem was. Now how were we supposed to solve it?

This was the fun part. We read blogs, poured over presentations at major web conferences, and armed ourselves with the latest research in usability, search, design, content strategy, even the rise of mobile devices.

We then came together for several navel-gazing sessions in which we looked at how we could address the problems. And even all the research brought us back to a few fundamentals:

The Long Tail still rules. We can’t meet every citizen’s need. In January 2011 alone, citizens searched for 25,000 different terms ranging from drip irrigation guidelines to the Advance Healthcare Directive. If we can serve 80% of the citizens with 20% of the content, it gives us an easier task.
Simplify. We knew our home page was too crowded and content heavy, but we aimed to simplify the design and content as much as possible. As mobile strategist Luke Wroblewski told Forbes magazine, “I hear it over and over again, ‘The mobile site is so simple, I wish the desktop site was that easy.’”
Holistic approach. We had to start from scratch, keeping nothing from the current site.

Now the hard work began.

Search

Fri, 20 Apr 2012 10:28:00 -0400

As we mentioned before, the old georgia.gov relied heavily on browsing. Each link to an agency service or content was organized in a special hierarchy. And state government is good at organizing things.

Unfortunately, state government is also big - immense, in fact - and users have trouble finding things. Can’t find hunting licenses under “Environment”? Well, try “Tourism.” Car tags not under “Transportation”? Maybe it’s under “Revenue,” since you pay ad valorem tax. It can get tricky.

More and more people are searching for information instead of browsing for it. And for something as big as state government, we knew our search had to carry the users’ experience.

We use the Google Search Appliance, and like its mother company, is very good at searching. In fact, it’s too good. Searching for something like “child abuse” yields 30,900 matches.

We needed something a bit more intelligent. So we designed a search that would allow us to promote certain content for keywords and synonyms. For instance, a user searching for DMV will get a match for the Department of Driver Services.

We also noticed that people may be looking for different kinds of information. Some people who are searching for “Child Support” may want to know how to file for child support, while others may be looking for the online service to check on the status of payments. So we organized search results

Google Maps mashups
SEO tweaking for all Vignette sites; checklist of SEO best practices for non-Vignette sites
More people are using search

Layout

Thu, 05 Apr 2012 13:12:00 -0400

“It’s my belief that in order to embrace designing native layouts for the web – whatever the device – we need to shed the notion that we create layouts from a canvas in. We need to flip it on its head, and create layouts from the content out.”
- Mark Boulton, Web Designer
“If something is on the screen and people aren’t clicking on it, we remove it.”

- Steve Hafner, CEO of Kayak

Our old design tried to be all things to all people and subscribed to the old adage, “Throw enough mud at the wall, and some of it will stick.” We crammed as much information on the page as possible and hoped people would eventually find something that pertains to them.

But a talk by usability guru Jared Spool opened our eyes. He showed us user behavior statistics for Walgreens’ front page. The findings:

One fifth of the visitors follow the “photo” link. 16% go to search. The third most important link is about refilling prescriptions. The fourth is the pharmacy link. The fifth most used links is finding the physical stores. Those five links add up to 59% of the total traffic …but those links take up just 3.8% of the page (via Jeremy Keith)

Users had trouble finding the links they were interested in because they had to wade through all the stuff Walgreens thought they were interested in.

Using a service called CrazyEgg, we were able to see what users were clicking on. And the results were stunning:

Child Support received 31% of all clicks on the front page of georgia.gov, but the words in the Child Support links took up about .49% of the real estate.
Search was used 13% of the time but took up just .65% of the page.
Jobs received 10.9% of all clicks, but four links took up only .43%.
In contrast, the Headlines feature took up 18% of the page but received only 3.6% of clicks.

Wow. Time for some level setting.

Content

Thu, 05 Apr 2012 12:30:00 -0400

In the past, georgia.gov had simply pointed the way to information on other websites. But given our new focus on search, we had to make sure that users found the right information quickly.

There were two problems with this approach:

We couldn’t control the search results from websites that were not hosted with us;
There may be more than one agency (or search result) with information about a topic. For instance, someone seeking information on starting a business may need information from the Secretary of State’s office and the Department of Revenue.

The solution was to create our own content. We could show users the information they needed to see, direct them to the agency website for more information, and show associated forms, services and documents. And by having access to keywords and metadata, we could also control how the content appeared in search results. Instead of seeing irrelevant content appear at the top of the search results, we could steer users to the right content.

We scoured search logs, call center data and site analytics to find the 50 most popular topics requested by Georgians. We worked with the agencies that dealt with those topics and wrote “profiles” of each topic.

The topics would contain consistent information:

Overview
What citizens needed to know
FAQs
Associated agencies, online services and documents

We also created pages for each state agency, also complete with consistent information, as well as pages for each city and county in Georgia (over 600 total).

One thing we were shocked at when looking at our analytics was the number of users looking for information on cities and counties. We are the website for state government, but to the user it didn’t matter. We knew we had to have basic information on all the local governments in Georgia - over 600 - so we created pages that listed basic information.

For new services and features, we relied on the trusted blog format to help us. Unlike our current features, which vanish once they are no longer relevant, blog articles will be archived and indexable. It will continue to give new state services a link that will help it in its Google Page Rank.

Less is More

Thu, 05 Apr 2012 12:16:00 -0400

Jared Spool and the CrazyEgg study opened our eyes to the realization that screen space was valuable, as was our users’ time and patience. We began laying out the front page with a few rules in mind:

The fewer words, the better. Content went through several edits, and each time we pared down the number of words and simplified them. We allowed for lots of white space. We made search bigger, took away the Headlines from the front page and moved our features to a less prominent area of the page. If it wasn’t important, it wasn’t going to be on our home page.

Responsive Design

Thu, 05 Apr 2012 12:16:00 -0400

We wanted to do something special with GeorgiaGov - something that no other state site had done.

With Responsive Design, we think we’ve accomplished that.

Responsive Web Design is a new way of presenting web content in which the layout of the site adapts to the device that is accessing it. A person with a large computer monitor will see a different layout than a person using a mobile device.

This is important for two reasons:

Based on our statistics, our mobile users quadrupled in 2011, which accounted for 5% of all visits. From January to February 2012 alone, it doubled to 10% of all visits.
At the same time, our site is accessed by 191 devices and 86 browsers at 1,750 different resolutions. We knew that we had to accommodate the fast changing trends in devices and browsers.
Our “content first” motto would not work unless we took into account how these devices were accessing our content. For instance, mobile users would care more about searching for a specific task than desktop users, who would have the time and the screen space to browse using a menu.

Responsive design allows the site to resize and reorganize itself based on the browser and device. We designed the site to accommodate three common screen widths:

Large desktops (960px and above)
Small desktops & tablet portrait (740px to 960px)
Mobile (Below 740px)

For mobile users, we reordered some of the functionality, moving search to the top of the page and sending the navigation to the bottom. Why? Because users don’t want to navigate, waiting for each page to load and then clicking on something else. They search.

Testing the Look

Thu, 05 Apr 2012 12:15:00 -0400

We didn’t design in a vacuum. User testing played a major part in the design process, helping us gauge how well we were meeting users’ expectations.

To test the new design, we conducted a 5 second test in which users were given a snapshot of the front page for 5 seconds, then asked a series of questions about what they thought the site was about, what types of feelings it conveyed, and what they noticed about it.

Our first iteration yielded the following results:

We knew we were on the right track with the simple approach and the emphasis on search. But users thought it was too blue and too plain.

Our second iteration got better response:

With just a few more tweaks, the design was ready.

Where are the Pretty Pictures?

Thu, 05 Apr 2012 12:15:00 -0400

One thing that you won’t find on the new GeorgiaGov is a gallery of beautiful photos depicting the state’s natural resources. It’s something that is on almost every other state portal.

The reason is simple. Stunning photography of the North Georgia mountains or the beaches of Cumberland Island won’t help our constituents get their child support. It’s eye candy, and it takes up room and bandwidth. We want to look beyond style and focus more on substance.

What the Font?

Thu, 05 Apr 2012 12:14:00 -0400

Fonts can be subjective - everybody has a favorite, and everyone has an opinion -but when it came to which fonts to choose for GeorgiaGov, we were all in agreement: we needed something that could be read easily, and something that would load quickly.

Verdana is widely known as one of the more readable sans-serif fonts for type, as is Georgia among serif fonts. They are common on both PC and Macintosh platforms, and since they are installed on local machines, they will render quickly and have a full range of variants (bold, italics, italic bold, numeric, special characters).

We used both of these fonts to add variety to pages and to aid in setting apart bits of content; this helps users chunk information and make it more readable.

For the headlines we chose a web font. These types of fonts are becoming more common throughout the web. It gives us the ability to give the site a different look; the browser simply downloads the font from a service and displays them on the page. We chose Franklin Gothic Condensed, which helps us achieve a more official, authoritative look.

Usability

Tue, 03 Apr 2012 12:18:00 -0400

We paid close attention to usability during the whole design process, paying attention to detail:

We added “search as you type” functionality to help users find relevant content more quickly.
Popular topics were worded as a call to action; instead of “child support,” the link read “Get Child Support”.
Links looked like links - blue and underlined - and were consistent throughout the site.
Long lists of content - the 600 cities and counties, the 120 agencies - can be filtered through a search box. As you type, the number of terms is filtered based on your input.

And what’s usability without a little testing? We put the new GeorgiaGov site in front of users and asked them to find information to see how they interacted with the new site, whether it improved their user experience, and note any problems.

The first user noted that our suggested search results looked like the paid searches that Google shows, and therefore they wouldn’t click on them. We changed the styling to make it more like the regular search results.

Testing the IA

Mon, 05 Sep 2011 12:13:00 -0400

Information architecture, or the structure of the website, was now taking a back seat to search. We joked that the new GeorgiaGov would just have one big search field - no menu, no navigation.

Of course, we can’t do that. Yet.

We use menus to direct users toward a smaller universe that’s more directed toward their interest. From this second level, users can see popular topics in that area as well as the agencies that are associated with that area. We don’t try to direct them further or try to send them through a series of door. We go one level deep. That’s all.

We defined those areas based on user input, getting testers to organize the top 50 topics logically into categories. This test, called a card sort, allowed us to see state government from a citizen’s perspective. We knew how we would organize it; that’s not how a user organized it.

Design

Tue, 05 Apr 2011 12:13:00 -0400

Most people think of design and layout as very subjective, based on the whims of a few art students who throw something together at the last minute.

Far from it. Our design decisions were based on careful research, testing and analytics.

We began with personas - creating imaginary people who we thought were typical users of georgia.gov. We quickly discovered that, unlike other products that have a niche or a target audience, our users were the entire state of Georgia. Urban and rural, rich and poor, young and old. How could we be all things to all people?

We discovered that in spite of the all-encompassing aspects of our task, there were some basic concepts:

Friendliness. In spite of the size, we wanted government to possess small-town values and treat citizens as a person, not a number.

We wanted to point the way, and then get out of the way. Signs at airports are good at being clear and concise, with its fresh, modern fonts. GeorgiaGov needed to show as little as possible while conveying as much information as the user needed.

One final note: We didn’t want to fall into the regular Georgia cliches. That meant no peaches, peanuts, Gone with the Wind references, state outlines, or state seals.