A site implemented using responsive web design (RD) provides an optimal viewing experience across a wide range of devices (including desktop monitors, laptops, tablets, and mobile phones). And, it does this all within one webpage. This optimal experience allows for easy reading and navigation with a minimum of resizing, panning, and scrolling.
Leveraging responsive design is not the same thing as having a mobile version of your site. Typically, a mobile version of a site means having a separate site that runs in parallel to the "main" site, often doubling the work for the content manager. With responsive design, the same content areas, images, styles and other elements are prioritized, reused and re-presented for the various devices.
For example, as you're looking at our website (especially the homepage), slowly decrease the width of your browser window. As you continue to decrease the width of the page (referred to as the viewport in RD), you'll see how the main navigation adjusts and the content boxes rearrange and re-prioritize themselves automatically.
Here is a video showcasing the responsive elements of the Modern Signal website:
Why Responsive Design is IMportant
Content parity is a term that's used to refer to one of the web's primary guiding principles - that technology is an equalizer, that it provides open access to information and it does so for everyone -- no matter what device that person is using. In this spirit, responsive design helps ensure that a person who can only access the web via a mobile phone is able to get at the same information (and just as easily) as a person who's looking at the same site via a computer with a large monitor. And given that 45% of Americans surf the web via smartphones, with 17% of them primarily searching on these devices, it's not just altruistic to address this audience, it's practical and smart to do so.
You Don't Have to Start Over from Scratch
When we launched our site last year, we almost immediately hit ourselves on the forehead for not developing it to be responsive! But we realized that going responsive doesn't mean you have to start over. We simply looked at our content, made decisions about how the user interface would change across different devices and went to work updating the CSS. Within a few days, our site was officially responsive. Of course, ideally it's best to plan these things from the start as part of your overall web strategy, but with budget and time constraints, that's a luxury that we and our clients often don't have.
Responsive Design And Your CMS
Responsive design is a client-side technology, which is implemented using Cascading Style Sheets (CSS). No server-side code updates are required to support RD. As such, you can continue to use your content management system as you would with a non-RD site. Based on the screen size, elements will change size and location, and appear or be hidden.
Responsive Design And Lighthouse CMS
Modern Signal's Lighthouse CMS has been built with a focus on responsive design. While editing a page on your site, you can click the "Resize Viewport" button, which allows you to quickly and easily select a screen size to view. In real time, you can see how your page will look on popular devices, such as iPhone 4, iPhone 5, iPad, and Samsung Galaxy SIII.
The following video highlights responsive design integration in Lighthouse CMS:
Planning for Responsive Design
If you're working to modify your current site to be responsive, here are some things you should keep in mind. If your company or organization is interested in a full redesign with responsive design in mind, or if you want to keep the existing design and want to apply the responsive elements, we can help.
This was by far the smoothest website redevelopment I have ever experienced. Modern Signal was a wonderful company to work with and we greatly value our working relationship.
Modern Signal has a professional staff that was very responsive to our needs during all phases - scoping, developing, implementing and maintaining - of our project. We have been pleased with their ability to deliver quality work on time and on budget. If given the opportunity, I would work with them again.
Modern Signal worked with us to understand our needs and figure out what solution would work best for us. Our Lighthouse CMS is perfectly suited to our website goals. When we later needed to modify the CMS, they again took the time to understand exactly what was needed and then built that functionality rather than delivering a cookie cutter solution.
I love working with Modern Signal! Their CMS is very easy to use and they are incredibly responsive to questions or challenges I bring them.
I felt as if my company was their only client. They responded to my needs quickly and efficiently despite short turn around time and intense demands.
We wouldn’t have gotten where we are today without your support over the years. Modern Signal has always been a great partner to us.
Modern Signal understands our business - from future needs to current limitations - so their solutions are always scalable, solid, and service-oriented.
Modern Signal significantly enhanced our site to be more efficient and user-friendly. They provide excellent customer service with timely and cost-effective solutions.
Modern Signal has been a great partner for us for over the past 10 years. As our business grew and our needs changed, Modern Signal was able to work with us to adjust our website platform in the ever-changing online world. Their service and response level has been second to none, and we've been never been happier with our relationship with them.