The Connected Government Act (H.R.2331) was signed into law on January 10, 2018, and requires new and redesigned federal agency public websites to be mobile-friendly. The General Services Administration (GSA) and Office of Management and Budget (OMB) will submit a report to Congress in 2019 that describes how agencies can implement the law and assess their compliance.
The new law codifies OMB Memorandum M-17-06, Policies for Federal Agency Public Websites and Digital Services (PDF, 1.2 MB, 18 pages, November 2016).
The sections below were curated by the MobileGov Community of Practice to help you make sure that your websites comply with the law.
What Is Mobile-Friendly?
Mobile-friendly means a digital product can be navigated, viewed and accessed on a smartphone, tablet computer, or similar mobile device.
- Is Your Site Mobile-Friendly?
Many of us get toward the end of mobile site development and really do not know if what we created is “mobile-friendly.” We think we have followed all of the mobile best practices and performed usability testing. However, do we have something concrete to quantitatively certify that we are mobile-friendly?
Create a Mobile Strategy
Do you know how mobile fits into your agency’s larger digital strategy? If not, these articles will help you.
- Mobile Application Development Program
This resource helps agencies plan, develop, test and launch anytime, anywhere, any device mobile products and services for the public.
- Mobile Device Trends on Government Websites
The shift to “mobile first” makes sense given that the smartphone is now the growth driver, while desktop device usage is rapidly decreasing among U.S. users. Now that we’ve seen the top level shift from desktop to mobile, let’s drill deeper into mobile device specific trends.
- Finding the Best Mobile Moment Is the First Stepping Stone to Anytime, Anywhere Government
Mobile moments are your agency’s chance to shine. The key is getting to know your user; analytics can help you find the moment.
- Making MobileGov Project
Making MobileGov was a three phase multi-media project created by the MobileGov Community of Practice in 2011 to help federal agencies discover, discuss and design a citizen-centric path to mobile government services and information. Many of the findings in the project still apply in 2018.
- Mobile Development Strategies
Mobile first, mobile-only, mobile-friendly? What’s the difference? There are many mobile development strategies to choose from and there are very subtle differences between some of them, and some are used in combination. We’ve got you covered on them all here.
- Google Will Rank ‘Mobile-Friendly’ Sites Even Higher Beginning in May
Google now focuses even more exclusively on boosting mobile-friendly sites.
- Mobile First Webinar Recap
A “mobile first” approach is where new websites and applications are designed for mobile devices first, instead of designed for the traditional desktop. Representatives from government and the private sector spoke about what it means to be “mobile first.”
- How Contact Centers are Adapting to the Mobile User
According to this study by Compare Business Products, one of the most important impacts for contact centers is that smartphone users can now connect with contact centers via voice calls, SMS messages, Internet pages, social media video chat and native apps.
- Structured Content and the Power of Syndication
Structured content and APIs form the core of any open content platform, whether it be syndication or other types of data sharing.
- Is Crowdsourcing the Future of Mobile Design and Development?
This is the first government smartwatch app development we’ve talked about on DigitalGov and an example of a great mobile moment use case. Not only is the smart app interesting (see the UI images!) but also how NASA is approaching its development is worth examining. While agencies are crowdsourcing via native apps and crowdsourcing their actual mobile development, none have publicly crowdsourced just the app design.
Agency Examples and Recommendations
Resources to help your agency comply with the Connected Government Act.
- Mobile User Experience Guidelines and Recommendations
As more agencies develop mobile apps and websites, they need quick guidance on mobile user experience Do’s and Don’ts. To answer their call, we asked MobileGov Community of Practice members to choose their top Mobile UX Guidelines from the original group of 42. From that feedback, we have distilled the following six mobile user experience guidelines.
Design for Your Users
Great mobile design requires all the best practices from Human Centered Design and should provide consistent information as other agency channels.
- You’ll Have Them at Swipe: Making An Awesome Mobile User Experience Webinar
In this webinar, MobileGov developers from the National Institutes of Health and Department of Veterans Affairs talk about how mobile user experience is different from traditional channels, discuss how to approach user experience during mobile implementations, and demonstrate their successful practices.
- Always Future Ready: The Benefits of Open Content Models and Structured Data Webinar
The National Cancer Institute (NCI) discusses what structured content and open content models can do, to help government agencies create content that is platform-agnostic, format-free, and device-independent.
- Responsive Web Design Challenges Webinar Recap
A website redesign is never an easy task, but when responsiveness is one of your redesign’s key goals, special considerations come into play that can present unique challenges. In the webinar on responsive web design challenges in government, we heard from two agencies who identified coordination, leadership buy-in and content decisions when mobilizing their websites.
- Open and Structured Content Models Workshop Recap
The Open and Structured Content Models Working Group, an interagency working group, has been exploring the approach for government and they have created two open and structured content models—one for articles and one for events. They hosted a workshop so agencies could hear from a few organizations who are already putting these ideas into practice. Attendees discussed how to build the case for the content model approach, how the models work in practice and how to implement the existing models.
- Mobile Content: Less is More
How big is your smartphone? Way smaller than a desktop monitor. The user will have a radically different experience on a desktop, and they are usually expecting a different experience.
- How to Make a Mobile Paper Prototype
Well before we get into the design and coding phases, we can show customers a mockup of an idea of what our product might look like. It’s called a prototype (or a wireframe)—it’s a model of a design that’s still in development. It doesn’t need to be fancy, or even made on a computer. But it can make the difference between a product that looks good and one that people will actually use.
- Design Sketching: The Easiest Prototype Method Ever
Smart designers create a “low-fidelity” prototype of your product—a rough approximation of what it’s going to look like so people can actually interact with it.
- Federalist Is out of Beta and Open for Business
In one package, built on a trusted, FedRAMP authorized platform, we provide a hosting solution for your site with flexibility to scale and security compliance built in. On top of the technical advantages, we also provide some basic templates built to meet Section 508 Standards, and a guide to help you shape your content. All of this lets you focus on designing the content and structure of your site and leave the rest to us.
- U.S. Web Design System + DigitalGov
The System provides an increasingly important service to government modernization.
Agency Examples and Recommendations
Resources to help your agency comply with the Connected Government Act.
- MobileGov User Experience Resources and Design Tools
There are a number of resources in the private sector for designing excellent User Experience. Here are some recommended by the MobileGov Community of Practice.
Pay Attention to Analytics
Analytics are everywhere! This section will help you uncover and analyze the data you need to make mobile users happy.
- Measuring Your Mobile Users
The Digital Analytics Program (DAP) Learning Series: Measuring Your Mobile Users webinar, co-sponsored by the MobileGov Community of Practice, focused on measuring mobile users with DAP’s analytics tools, which are essentially a pre-configured version of Google Analytics.
- Using ‘Pirate Metrics’ to Analyze Your Mobile Application’s Audience
The pirate metrics framework is a good way to understand how your product is performing. Coined by David McClure, the “pirate” in the metrics comes from the first letters of the lifecycle stages of the framework.
- 4 Tips for Analyzing Mobile Traffic with DAP
It’s important to optimize your mobile experience. You can use data from the Digital Analytics Program (DAP) to gain insight on your mobile traffic. Do you know the mobile characteristics of your users? Here are four useful tips and reports to analyze your users’ mobile experience.
Develop Your Site
What’s the best way to build a mobile website? Below are some approaches and tools we think you will find helpful.
- A Guide to Creating Mobile-Friendly Websites
- Responsive Design Overview, Resources and Tools
Responsive web design refers to a fluidly-constructed web page layout that scales from handheld device displays to large, high-resolution computer displays using flexible typography, flexible images, fluid grids, and CSS3 media queries.
The Accessibility Guild in the Technology Transformation Services (TTS) at the U.S. General Services Administration (GSA) set out to understand how people in different roles practice accessibility. We asked designers, developers, and product managers across our organization to share their accessibility practices, from self-testing to asking for help. We heard about the barriers that can stand in the way of making products more accessible, from lack of knowledge to lack of buy-in.
- Mobile Development and Testing with Chrome Developer Tools
Chrome Developer Tools (or DevTools) are a set of web authoring and debugging tools built into the Google Chrome web browser. Its controls allow you to simulate a wide range of devices, and help you build responsive, mobile-first web experiences.
- 8 Ways to Format Tables for Responsive Web Design
We regularly access charts and tables on our desktop computer to glean valuable information from a pile of data. But, how can you display a full-size, desktop sized chart on a 4-inch smartphone screen, and make it remain useful?
- HHS Conquers Tables in a Responsive Design
We moved HHS.gov to a responsive template to ensure that users accessing our site in a mobile environment had the best possible experience. Our department faced several challenges in moving a site the size of HHS.gov into a responsive template and one of those challenges surrounded our need to make tables work in a responsive environment.
Test Your Mobile Website
You need to embed testing in the creation, development and launch of your mobile product. These articles will give what you need to know to test successfully.
- What is Mobile Device Compatibility Testing?
While usability testing focuses on the look, feel and ease of use, compatibility testing focuses on determining if the hardware and software display and allow the application to function properly.
- Federal Crowdsource Mobile Testing Program
Our CrowdSource Mobile Testing program is a FREE service provided for federal agencies by federal employees. We do compatibility testing (determining how mobile websites display on the multiple makes and models of devices, operating systems, and mobile browsers), for mobile websites.
- Which Devices Should I Test With?
Developing a test device selection plan that is updated on a regular basis will help your organization whittle down the list of devices to a manageable number.
- Mobile Product Compatibility and Functional Testing 101
This article is a resource of the Federal CrowdSource Mobile Testing Program and focuses on two common test types are compatibility testing and functional testing.
- The Test Case: Write It Once, Test Many Times
A test case is simply a list of setup instructions (or preconditions) and steps to expect a test usually linked to a requirement or expected behavior. Think of a test case as the directions you would give to a user to complete a task broken into the most basic of steps. Test cases allow almost anyone to execute the same test in the same way every time.
- Mobile Web Lessons From the CrowdSource Mobile Testing Program
The CrowdSource Mobile Testing Program offers a simple way to collect feedback on compatibility testing. During each test cycle, testers log issues specific to the application or site being tested. Four themes have emerged from the logs, with lessons that are relevant to anyone developing mobile websites.
- The Emulator Dilemma: Can Mobile Device Testing Be Completed Without Mobile Devices?
Do all developers and testers need a collection of devices to physically test the application with? There are many types of tools that provide alternatives to building your own lab.
Focus on Performance
If your mobile product breaks a user’s phone, you are not creating a good experience. Here are some concepts and approaches you should apply to your development process to avoid a bulky product.
- A Guide to Creating Mobile-Friendly Websites
- Speed Matters When Measuring Responsive Web Design Performance Load Times
During the MobileGov Around the Horn Call, the AIDS.gov team laid out why performance testing is important for government, how they approach the testing and some tools agencies use for testing.
- Performance Guidelines
The U.S. Web Design System team embarked on a 3-month research effort to better understand what performance means to U.S. government web teams of all shapes and sizes, and we’re excited to share the results with you.
- New ITIF Report Inspires a Closer Look at Website Performance and Security—Here Is Where to Begin
The Information Technology & Innovation Foundation (ITIF) published a report that looked at the page load speed, mobile-friendliness, security and accessibility of the top 297 government websites. And based on the four benchmark areas, we’ve pulled together a number of resources and tools to help your agency’s website provide better access to services and information.
Case Studies and Good Examples
There are a number of resources in the private sector for designing excellent user experience. Here are some recommended by the MobileGov Community of Practice.
- The Benefits of Being Push-y: Reaching Your Audience Through Push Notifications
Push notifications allow agencies to connect with their audiences for immediate communication. The Office of Personnel Management (OPM)’s OPM Alert app provides a real time look at the current operating status for federal offices in the Washington, DC, area and uses push technology to alert users of status changes.
- Fostering Medical Innovation: A Plan for Digital Health Devices
The U.S. Food and Drug Administration (FDA)’s Digital Health Innovation Plan is focused on fostering innovation at the intersection of medicine and digital health technology. This plan will include a novel, post-market approach to how we intend to regulate these digital medical devices.
- The Smithsonian’s IPOP Exhibition Framework: Lessons for a Human-Centered Content Approach
The Smithsonian Institution’s Office of Policy and Analysis has another tool to consider for your UX toolbox: IPOP. It was formed to guide exhibition design, and born from years of research studies and interviews with Smithsonian visitors. IPOP is a useful framework for building a content strategy and thinking about audience diversity and preference differences.
- Welcome to the New DHS.gov
DHS.gov now works for desktop computers, tablets and smartphones, making it easier to get the information you need—wherever you are—in the format appropriate for your device. https://www.digitalgov.gov/2016/06/09/welcome-to-the-new-dhs-gov/
- Building Brick by Brick: Ed.gov’s Website Redesign and Mobile Implementation
The U.S. Department of Education’s website and blogs now have responsive design and Bootstrap styling. The combination of responsive themes and Bootstrap means that Ed.gov pages automatically adjust to the size of smartphones or tablets.
- My TSA Mobile App
The MY TSA mobile app and website developed by the Transportation Security Administration (TSA) is designed to help passengers better prepare for security so they can get through TSA airport security checkpoints more efficiently. The app has multiple functions to help travelers and uses information from TSA, the Federal Aviation Administration (FAA), NOAA and users.
We’ve covered the essentials above, but below is information about policies, platforms, and other resources you should think about when building a mobile experience.
If you are creating an app, you will need to work with the platform to get your app added to their store. The following have federal-compatible Terms of Service agreements.
- Blackberry App World
https://s3.amazonaws.com/digitalgov/_legacy-img/2014/07/blackberry-app-world-tos-agreement.pdf (PDF, 270 kb, 4 pages)
Native Apps or Progressive Web Apps
Should you focus your efforts on either of these two options?
- Planning with a Purpose: 3 Reasons Why Agencies Created Native Apps
Agencies who have created native apps outlined three areas they considered in the mobile development process: strategy, business requirements and measuring value.
Progressive Web Apps
- Progressive Web Applications, Part 1: the New Pack Mule of the Internet
Progressive Web Apps have been able to take the best of native and web applications and combine them into a hybrid application that is fast (with or without a fast network connection), can work across devices, and does not need to be distributed through a store as it is as linkable and shareable as a web page.
- Progressive Web Applications, Part 2: Pros, Cons, and Looking Ahead
Along with the advantages, PWAs bring challenges, and these may be deal breakers for some.
Public Trends, Policies, Legislation or Initiatives
When you are building an app or creating a mobile-friendly site, there are certain requirements to be aware of.
- Digital Analytics Dashboard
- Mobile User Experience Guidelines and Recommendations
- GAO Report investigating mobile presences, December 2014 (PDF, 3.2 MB, 44 pages)
- U.S. Digital Services Playbook, August 2014
- Public Participation Playbook, February 2015
- U.S. Digital Government Strategy, May 2012-2013
- Connected Government Act, December 2017
- Policies for Federal Agency Public Websites and Digital Services (M-17-06), November 2016 (PDF, 1.2 MB, 18 pages)
- Open Data Policy—Managing Information as an Asset (M-13-13), May 2013 (PDF, 5.83 MB, 12 pages)
- Navigating the Future of Mobile Services
This document provides guidance and recommendations for vetting the security of mobile apps based on standards and agency best practices.
https://www.atarc.org/wp-content/uploads/2017/10/ATARC-MSCT-Report-Navigating-Future-of-Mobile-Services.pdf (PDF, 5.6 MB, 242 pages, October 2017)
- Making Your Agency Apps Secure
Security and privacy are part of the six Mobile User Experience Guidelines developed by the MobileGov Community of Practice. This webinar dove further into guideline six: Develop security and privacy guidelines with regard to what the app does and how it protects user data and government systems.
- DHS Study on Mobile Device Security
The Department of Homeland Security (DHS) submitted a report to Congress that details current and emerging threats to the federal government’s use of mobile devices and recommends security improvements to the mobile device ecosystem. The DHS Science and Technology Directorate (S&T) led the study in coordination with the National Institute of Standards and Technology (NIST) and its National Cybersecurity Center of Excellence.
- CIO Council Federal Secure Mobility Toolkit
The Chief Information Officers (CIO) Council’s Services, Strategy, and Infrastructure (SSI) Committee sponsored an initiative to identify agency secure mobility success stories to feature in a best practices report that agencies can use to model their own initiatives.
https://cioknowledge.max.gov/?q=system/files/attachment/Federal%20Secure%20Mobility%20Toolkit.pdf (PDF, 1.7 MB, 44 pages, January 2018)
- Mobile SOW and Developer Qualifications
We are providing sample Statement of Work (SOW) language for the procurement of customer or external-facing mobile products, skills, testing and mobile code sharing. This language is also included in the RFP-EZ contracting tool. Here are some guidelines for its use.
- Policies for Federal Agency Public Websites and Digital Services
The review of privacy risks should begin at the earliest planning and development stages of agency actions and policies that involve PII, and should continue throughout the life cycle of the information. (See page 6)
https://www.whitehouse.gov/sites/whitehouse.gov/files/omb/memoranda/2017/m-17-06.pdf (PDF, 1.2 MB, 18 pages, November 2016)
Negotiated Federal Terms of Service
- This is a list of free tools and services that have federal-compatible Terms of Service agreements.
Federal Mobile Apps Directory
A sortable list of all known federal government apps.
U.S. Digital Registry
Resource to confirm the official status of social media and public-facing collaboration accounts, mobile apps, and mobile websites.
MobileGov Community of Practice
Join this network of federal employees who are tackling mobile technology challenges together.