U.S. flag

An official website of the United States government

Dot gov

The .gov means it’s official.
Federal government websites often end in .gov or .mil. Before sharing sensitive information, make sure you're on a federal government site.

Https

The site is secure.
The https:// ensures that you are connecting to the official website and that any information you provide is encrypted and transmitted securely.

Skip to page content

Embracing Responsive Design

There has been a shift in consumer behavior during the last few years, a move toward immediacy and convenience, and with the responsive redesign of USA.gov and GobiernoUSA.gov, consumers can now have access to the same information and services when they need them, and on any platform and device.

The number of mobile users is growing rapidly. In 2012 USA.gov and GobiernoUSA.gov received more than 2.5 million visits from mobile devices, not including tablets. These customers want access to our full sites without unnecessary clicks (not a different version of the site on mobile). Responsive design adapts the display to the customers’ device, offering the full site in an optimized resolution regardless of the device of choice, presenting the same high-quality content to fit smaller devices.

Using responsive design is very efficient and cost effective: It allows us to more easily create and maintain content that will display correctly on all devices and across all platforms. It saves the government money since it’s “future ready,” which means that the sites will work on future mobile devices.

A lot of planning went into the redesign efforts.

  • We met with key stakeholders in developing our strategy and goals.

  • We studied responsive design on various public and other government sites.

  • We also discussed the pros and cons to using responsive design and decided that responsive was the way to go for USA.gov and GobiernoUSA.gov. We had done the apps galleries in responsive design and that served as a baseline to approach the bigger sites.

  • Building on this project, we decided to design the Spanish site first, since text as well as words tend to be 15% longer in Spanish – this strategy ensure that the design would work well for both sites.

  • From there, our contractor built a prototype and we tweaked it so that design and accessibility guidelines were met.

  • We worked with our accessibility experts every step of the way to ensure compliance with section 508 of the Rehabilitation Act — we are still working out some minor details, but fixes are on their way to make both site fully accessible.

Let us know what you think. With the ability to count traffic for desktop, tablet and mobile phones separately, we’re anxious to see what our numbers tell us about this approach over time.

More responsive design examples:

Tags: , , , ,

GitHub LogoEdit
Top