{"id":250098,"date":"2012-12-11T15:55:30","date_gmt":"2012-12-11T23:55:30","guid":{"rendered":"https:\/\/divi.ameravant.com\/ameravant\/?p=250098"},"modified":"2022-06-14T10:19:21","modified_gmt":"2022-06-14T17:19:21","slug":"3403-why-2013-is-the-year-of-responsive-web-design","status":"publish","type":"post","link":"https:\/\/ameravant.com\/article\/3403-why-2013-is-the-year-of-responsive-web-design\/","title":{"rendered":"Why 2013 Is the Year of Responsive Web Design"},"content":{"rendered":"

[et_pb_section fb_built=”1″ theme_builder_area=”post_content” _builder_version=”4.14.7″ _module_preset=”default”][et_pb_row _builder_version=”4.14.7″ _module_preset=”default” theme_builder_area=”post_content”][et_pb_column _builder_version=”4.14.7″ _module_preset=”default” type=”4_4″ theme_builder_area=”post_content”][et_pb_text _builder_version=”4.14.7″ _module_preset=”default” theme_builder_area=”post_content” hover_enabled=”0″ sticky_enabled=”0″]<\/p>\n

this article republised from industry web leader,\u00a0<\/span>Mashable.com<\/a><\/p>\n

\n
<\/a><\/p>\n
\n
\n

\"Why<\/p>\n

<\/div>\n<\/div>\n<\/div>\n<\/figure>\n
\n
Pete Cashmore<\/div>\n

\n

You may have noticed that\u00a0Mashable got a new look recently<\/a>. The design seems wider than usual, and when you shrink your browser, the content resizes to fit.<\/p>\n

The aim here isn’t merely prettiness or technical trickery, however: Media companies like ours are seeing a major shift in the consumption habits of their audiences.<\/p>\n

Those organizations that don’t act may find themselves behind the curve. Here’s why.<\/p>\n

The Post-PC Era<\/h2>\n

<\/a><\/p>\n

\n
\n

PC sales are projected to be lower than they were in the previous year<\/a>.<\/p>\n

So which devices are consumers buying? Tablets, for one thing.<\/a><\/p>\n

\n
\n

may top notebooks next year<\/a>. Smartphones, of course, are also a hot commodity — according to\u00a0Nielsen<\/a>, the majority of U.S. mobile subscribers now own smartphones, not feature phones.<\/p>\n

Meanwhile, the shift to mobile is happening at an extraordinary speed. Today, 30% of Mashable’s traffic is mobile. By the end of next year, this may exceed 50%.<\/p>\n

Web or Apps? How About Both.<\/h2>\n

<\/a><\/p>\n

\n
\n

According to the Pew Research Center<\/a>, 60% of tablet users prefer reading news on the mobile web than via an app. While I think media companies should certainly offer apps, it’s clear that having a great mobile website should be the priority.<\/p>\n

Responsive Web Design<\/h2>\n

<\/a><\/p>\n

\n
\n

<\/a>In simple terms, a responsive web design uses “media queries” to figure out what resolution of device it’s being served on.<\/p>\n

In simple terms, a responsive web design uses “media queries” to figure out what resolution of device it’s being served on.<\/span>Flexible images and fluid grids then size correctly to fit the screen. If you’re viewing this article on a desktop browser, for example, try making your browser window smaller. The images and content column will shrink, then the sidebar will disappear altogether. On our homepage, you’ll see the layout shrink from three columns, to two columns, to a singular column of content.<\/p>\n

In the case of Mashable, we also detect the type of device and change the site’s behavior accordingly. On touch devices, for instance, we enable swiping between columns. (Technically, detecting device functionalities may be referred to as “adaptive design,” rather than “responsive,” but increasingly both approaches are used in tandem.)<\/p>\n

The benefits are obvious: You build a website once, and it works seamlessly across thousands of different screens.<\/p>\n

2013: A Responsive Year<\/h2>\n

<\/a><\/p>\n

\n
\n

explains<\/a>, “Now more than ever, we\u2019re designing work meant to be viewed along a gradient of different experiences. Responsive web design offers us a way forward, finally allowing us to ‘design for the ebb and flow of\u00a0things.'”<\/p>\n<\/section>\n

[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"

this article republised from industry web leader,\u00a0Mashable.com Pete Cashmore Dec 11, 2012 You may have noticed that\u00a0Mashable got a new look recently. The design seems wider than usual, and when you shrink your browser, the content resizes to fit. The aim here isn’t merely prettiness or technical trickery, however: Media companies like ours are seeing […]<\/p>\n","protected":false},"author":16,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","inline_featured_image":false,"footnotes":""},"categories":[34],"tags":[],"_links":{"self":[{"href":"https:\/\/ameravant.com\/wp-json\/wp\/v2\/posts\/250098"}],"collection":[{"href":"https:\/\/ameravant.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ameravant.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ameravant.com\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/ameravant.com\/wp-json\/wp\/v2\/comments?post=250098"}],"version-history":[{"count":0,"href":"https:\/\/ameravant.com\/wp-json\/wp\/v2\/posts\/250098\/revisions"}],"wp:attachment":[{"href":"https:\/\/ameravant.com\/wp-json\/wp\/v2\/media?parent=250098"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ameravant.com\/wp-json\/wp\/v2\/categories?post=250098"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ameravant.com\/wp-json\/wp\/v2\/tags?post=250098"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}