If you’re viewing this site on a desktop computer, slowly shrink the width of this window until it can’t get any smaller. Did you notice what happened? The website reorganized itself (putting the sidebar down below this post), and it changed the menu. If you are on a phone or a mobile device, you already see these changes without needing to do anything.
Across our clients, we see that between a third and half of our website visitors are using a phone or tablet.This site takes advantage of a concept called “responsive web design.” It will automatically resize and reorganize content to fit your screen, whether that is a desktop, a netbook, a tablet, or a phone. It’s no secret that more people are using mobile devices to interact with websites. Across our clients, we see that between a third and a half of our website visitors are using a phone or tablet. Even if you mainly view your site from your desk at your agency, keep in mind many of your visitors are viewing your site on a much smaller screen.
Even if you know this, though, you need to figure out how it should affect your website’s design. This is where responsive web design comes in. The three most important benefits to using responsive web design are
- Easier page-navigation,
- More readable text, and
- No need for a “mobile version” of your site.
A traditional drop-down navigation menu is usually difficult to use on a device that uses a smaller screen. Since phone and tablets use touch screens, the user must use their finger to select relatively tiny parts of the screen to access the menu. If they are off by fractions of an inch when selecting a page on a menu, they end up on the wrong page.
Sites that use responsive web design will change the format of the menu for devices with smaller screens. If you shrink the width of this window, you’ll see the menu change into a dropdown “pick-list” that is easier to use on a mobile device.
More Readable Text
When you visit a site on your phone, if that site isn’t responsive, your phone will fit the width of the website into the width of your phone. That means that if fifty words fit on a line on that website on your laptop’s screen, those same fifty words will fit on that line on your phone’s screen – but the words will be much, much smaller and harder to read.
A site that is responsive will restructure the page to accommodate your phone’s screen. Instead of fitting those fifty words on a line, it may only fit 10, but those words will appear larger and be a lot easier to read. This site, for instance, will drop the sidebar below the main page content to help make this adjustment. Increasing the readability of your content is the biggest benefit of responsive design.
No Need for a “Mobile Version” of Your Site
If your website is responsive, you will only need to develop one site and keep one version of your site updated.One way to account for the issues associated with viewing your website on a smaller screen is to make a separate version of your site which is only used on smaller screens. These mobile versions of websites are better than making your website’s users always view the same version of your site across all screens, but developing a mobile version of your site creates more work for you and can cost you more money.
If your website is responsive, you will only need to develop one site and keep one version of your site updated. Taking advantage of a website tool that allows you to make a responsive site will save you time while making sure your site is usable on large and small screens.
If you want to know more about how you can implement responsive website design, contact Agency Marketing Partner, and we can tell you how to get responsive web design working for your agency.