{"id":5984,"date":"2011-09-26T15:15:29","date_gmt":"2011-09-26T09:45:29","guid":{"rendered":"https:\/\/bookbuzzr.com\/blog\/?p=5984"},"modified":"2014-12-23T16:15:18","modified_gmt":"2014-12-23T10:45:18","slug":"a-mobile-friendly-website-from-design-user-perspective","status":"publish","type":"post","link":"https:\/\/bookbuzzr.com\/blog\/a-mobile-friendly-website-from-design-user-perspective\/","title":{"rendered":"A Mobile-friendly website: From Design &#038; User Perspective"},"content":{"rendered":"<p>Guest Expert: <a href=\"http:\/\/in.linkedin.com\/in\/sharatpotharaju\" target=\"_blank\">Sharat Potharaju<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-5988 alignleft\" style=\"margin-right: 10px;\" title=\"Mobile sites\" src=\"https:\/\/bookbuzzr.com\/blog\/wp-content\/uploads\/2011\/09\/Mobile-sites-300x216.jpg\" alt=\"\" width=\"300\" height=\"216\" \/>Research by Gartner has forecasted that by the year 2013, mobile phones will overtake PCs as the most common Web access device worldwide.With mobile market expected to reach 1.7 billion by 2013, a major bulk of your audience will be viewing your website or blog on a screen that takes up just a few inches. The rapid evolvement of mobile ecosystem, supported by availability of high-end mobile devices (including tablets) and better internet accessibility makes it an absolute necessity for content publishers \u2013 authors\/bloggers\/webmasters \u2013 to provide mobile friendly content that can be consumed by your target audience, on the move.<\/p>\n<p><strong>Design it for Mobile, but keep the User in mind\u2026<\/strong><\/p>\n<p>Creating a mobile-friendly version of your content isn\u2019t just about reducing the form factor to fit the small screen. In fact, as a publisher you have to factor in the mobile user experience as well. The following elements will help you balance the limitations of the small mobile screen with your audiences\u2019 expectations:<\/p>\n<p><strong>\u2022 Style your designs for mobile: <\/strong>Mobile Web encompasses a diverse set of elements including \u2013 different media, browser variations, screen size, connection speed, and platforms among a host of other things. Thus, when styling your mobile site it is always safer to stick to relative units and minimize scroll and page transitions. Furthermore, maintaining visual consistency with the desktop site will help in maintaining brand consistency &amp; recall.<\/p>\n<p><strong>\u2022 Re-do for easy navigation: <\/strong>Research has shown that mobile web experience accounts for high bounce rates. It is suggested to focus on a few key areas of your website and eliminate links to destinations that don\u2019t have a high mobile priority. However, be sure to add the \u2018contact\u2019 and \u2018search\u2019 link as a top-line header item for better usability.<\/p>\n<p><strong>\u2022 Use automatic redirection for mobile devices:<\/strong> The mobile version of your website should be automatically triggered for all mobile users. The most reliable way would be to use \u2018user agent detection\u2019, wherein a server makes a decision on what to serve based on how an incoming browser describes its capabilities. Alternatively, other devices like DeviceAtlas or WURFL, wherein real-time JavaScript requests databases to supply information on what a device can do, can also be used.<\/p>\n<p><strong>\u2022 Check for broken links: <\/strong>Links are the only way to traverse the web, so it\u2019s best check for broken links periodically. Besides, it also helps to keep the links consistent with the version of content a user is viewing.For example, if a <em>www.yoursite.com\/category\/article\/<\/em> was the original link, make sure that your mobile visitor is presented with the mobile-optimized <em>m.yoursite.com\/category\/article\/<\/em>, and not just the <em>m.yoursite.com<\/em> homepage.<\/p>\n<p><strong>\u2022 Resize pictures and images: <\/strong>Viewing a websiteon a screen with limited view requires that the images and pictures are resized for fast and easy loading. A good idea would be to resize the images on the web server as this will take significantly less time to load.<\/p>\n<p><strong>\u2022 Keep content clear and updated:<\/strong> With a mobile website it becomes all the more necessary to grab the readers\u2019 attention instantly. This involves having compelling headlines and clear content layouts that can grab a reader\u2019s attention even if they are distracted or busy.<\/p>\n<p><strong>\u2022 Provide a clear path to the full version site:<\/strong> Sometimes the mobile visitor to your site will not be able to access acertain piece of information since it would not have been included in the mobile version. In order to avoid this pitfall, it is always better to include a footer link to your \u201cFull Site\u201d on every page and ensure that this link takes the user to the full version of the exact page that they\u2019re currently browsing.<\/p>\n<p><strong>\u2022 Install Mobile Analytics:<\/strong> Installing mobile analytics to measure the mobile audience is important as it helps make informed decisions towards creating an outstanding mobile presence and successfully monetizing it.<\/p>\n<p><strong>Do I need a plugin or a better solution for my mobile site?<\/strong><\/p>\n<p>It depends what your requirements are. There are a number of plugins available that can help you create a mobile version of your website\/blog in no time. You just need to visit the plugins directory of the platform your website\/blog is developed on. Search for the plugin, activate it and you\u2019re good to go.<\/p>\n<p>But if you\u2019re a professional blogger who needs more than just a mobile version like \u2013<br \/>\n\u2022 Ad network integration<br \/>\n\u2022 In-depth Analytics<br \/>\n\u2022 Multiple sites management via a dashboard<br \/>\n\u2022 SEO-enabled &amp; Social Media Integration etc.<br \/>\n\u2022 Increased audience reach<br \/>\n\u2022 Ad revenue augmentation<\/p>\n<p>\u2026 then MobStac is a solution that may suit your purpose effectively. In addition to offering a fast and easy way to create and manage a mobile site\/blog of your web equivalent, MobStac enables content publishers to monetize and track the incoming traffic.<\/p>\n<p>Finally, as the mobile web evolves it has become imperative to have a mobile friendly version of your website or blog that must be designed within the constraints of the mobile device and the expected user experience. And as we slowly move towards the touch interface, it presents <a href=\"http:\/\/blog.mobstac.com\/blog\/2011\/08\/touchsite-the-new-interaction-paradigm-on-tablets\/\" target=\"_blank\">a whole new paradigm for user interaction<\/a>.<\/p>\n<hr \/>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignright\" style=\"margin: 10px;\" title=\"Sharat Potharaju \" src=\"http:\/\/media.linkedin.com\/mpr\/pub\/image-_n7sXpNVcC0x4srj_pb2XRC6lZ2K4ArjfZP2XrrLQp6VQj60\/sharat-potharaju.jpg\" alt=\"\" width=\"80\" height=\"80\" \/><a href=\"http:\/\/in.linkedin.com\/in\/sharatpotharaju\" target=\"_blank\">Sharat Potharaju<\/a> is the Co-Founder &amp; CEO of <a href=\"http:\/\/www.mobstac.com\/\" target=\"_blank\">MobStac<\/a> \u2013 a product that helps content publishers create a mobile equivalent of their website\/blog in a few minutes. The company has a base of 3500+ publishers spread across 40 countries and is about to launch a new product \u2013 \u201cTouchsite\u201d at TC Disrupt. He has a Masters in Engineering Management (MEM) from Duke University, and a B. Tech in Chemical Engineering from IIT Madras.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Guest Expert: Sharat Potharaju Research by Gartner has forecasted that by the year 2013, mobile phones will overtake PCs as the most common Web access device worldwide.With mobile market expected to reach 1.7 billion by 2013, a major bulk of your audience will be viewing your website or blog on a screen that takes up [&hellip;]<\/p>\n","protected":false},"author":12,"featured_media":5988,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[353,3],"tags":[9,3,548,354,554],"class_list":["post-5984","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-bbmtc","category-book-marketing","tag-authors","tag-book-marketing","tag-mobile-friendly-websites","tag-mobile-marketing","tag-mobile-readers"],"_links":{"self":[{"href":"https:\/\/bookbuzzr.com\/blog\/wp-json\/wp\/v2\/posts\/5984","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bookbuzzr.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bookbuzzr.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bookbuzzr.com\/blog\/wp-json\/wp\/v2\/users\/12"}],"replies":[{"embeddable":true,"href":"https:\/\/bookbuzzr.com\/blog\/wp-json\/wp\/v2\/comments?post=5984"}],"version-history":[{"count":0,"href":"https:\/\/bookbuzzr.com\/blog\/wp-json\/wp\/v2\/posts\/5984\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/bookbuzzr.com\/blog\/wp-json\/wp\/v2\/media\/5988"}],"wp:attachment":[{"href":"https:\/\/bookbuzzr.com\/blog\/wp-json\/wp\/v2\/media?parent=5984"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bookbuzzr.com\/blog\/wp-json\/wp\/v2\/categories?post=5984"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bookbuzzr.com\/blog\/wp-json\/wp\/v2\/tags?post=5984"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}