There’s a lot of talk about how responsive design is the wave of the future for the Web. As more and more people are using mobile devices to surf the Internet, more and more Web site owners are redesigning their pages to be suitable for portable devices.
What is Responsive Web Design Anyway?
In order to comply with the fast-evolving world of mobile phones and tablet PCs, Web developers have come up with a way to accommodate the design needs of these devices, which is called responsive design. Responsive Web design is the use of CSS 3 media queries, which are used to adapt a Web sites design to any device that accesses it. So if you decide to use your laptop or desktop to visit a site, it will look a certain way, then when you use your smartphone to access the same site, the layout will automatically adjust to fit the size and capabilities of the device you’re using.
Why it’s Too Good to be True
Responsive Web design seems like the right way to go and it could be if a few adjustments are made. But as of today, it comes with flaws that are undeniable. For instance, when you visit a Web site on a mobile device, the layout changes a bit too much to where you have to re-explore the site to find where everything is. The typical design of a Web site consists of a navigation bar, block of text and a sidebar. This layout changes when you access sites that are using CSS3 using a mobile phone. Navigation bars disappear, leaving you searching around for a way to get around the Web site. In other words, the computer version of the site is more complete, while the mobile device version feels inadequate and frustrating.
More Money, More Problems
Not only does responsive design cost more money to do than non-responsive design, but it also takes a lot longer. If you are a Web site owner, this can become an issue if you are on a tight budget. Now, it isn’t going to cost as much as having a Web developer create a separate mobile site for your business or blog, but you have to ask yourself if it is worth it. Will you get a return on investment if you decide to go with responsive Web design? How important is it for your audience or customers? If majority of your visitors are iPhone toting consumers, then you may want to opt for responsive Web design.
If it’s Not Broke, Don’t Fix it
You’ve heard the saying and in this case, it couldn’t be any more correct. If you take a mobile device and access your Web site, does it show accurately? In most cases, non-responsive Web designs work just fine. So instead of rushing out to get your site revamped with a responsive Web design, you should test it out to see if it’s actually needed. Today’s mobile phones and tablets are great at displaying non-responsive designs, so majority of Web site owners will find their design to be alright.
It Doesn’t Help Load Time
Not everyone has high-speed internet on their mobile devices, which means that they need to have optimal load times that fit the bandwidth that they have. Some responsive Web designers only do a half job when increase load times by only hiding elements that take a while to load. However, although not seen, the element is still being uploaded by the device. Since the load time isn’t enhanced with responsive design, it may not do your mobile device visitors any justice.
It seems that responsive design has gotten a good wrap to where many people and businesses are crossing over. However, with careful research, you may find that at this point in time, it may not be worth it. Look into it some more to see if it would be right for you and your visitors before diving in.
Instead, I would recommend using AMP to speed up mobile device usability and performance (also, making them ‘responsive’).
First off, what is AMP?
The AMP Project, started by Google, has been working hard to develop a highly optimized method for delivering content to mobile devices. These “Accelerated Mobile Pages” utilize a number of optimization techniques for lightning-fast load times. AMP is a highly specialized way of making super-fast mobile web pages.
How does AMP differ from Responsive Web Design?
Accelerated mobile pages and responsive websites will both work on a mobile phone, but the AMP Project and Responsive Web Design have different goals.
- Responsive Web Design is a method of organizing and designing a website so that it works on any device, from a desktop computer to a mobile phone. It could be said that RWD is focused on flexibility.
- The AMP Project is a web framework designed for delivering content to mobile users instantly. AMP is focused on speed. Malte Ubl, Google’s Tech Lead for the AMP Project, wrote a great summary of why AMP is fast.
How to Set Up WordPress AMP?
The AMP for WordPress plugin is an excellent tool if you want to set up AMP for your WordPress site quickly and easily. Although the default version has a minimal amount of features for customizing your AMP setup, your options can be extended with the help of additional plugins. We’ll cover that process later on. For now, let’s run through how to set up the plugin itself.
First, navigate to Plugins › Add New in your WordPress dashboard. Enter ‘AMP for WordPress‘ in the search bar, and look for the right AMP plugin for WordPress. Then, install and activate it:
Next, navigate to the new Appearance > AMP tab in your dashboard. This will bring up the AMP customizer page. Once there, select the Design tab:
Here, you can customize the way your WordPress AMP site will display, and preview any changes before you make your site live. You can adjust your site’s text, link, and background color. Plus, you can select whether or not you want a light or dark (i.e. black or white) color scheme for your site. Once you’re happy with your changes, simply hit Publish at the top of the screen.
You can also set whether you want posts, pages, or both to display on WordPress AMP. To do this, simply return to the WordPress dashboard and go to AMP > General:
Once there, check the boxes under Post Type Support for the options you wish to include in your WordPress AMP, and click on Save Changes.
Are you currently using non-responsive or responsive design? Do you plan to use responsive design in the future? Do you plan using AMP instead?