Tapping into the Mobile Web Design Trends of 2013

Mobile market is huge today. Every other person today wants to own a smartphone or a tablet! These smartphones are not just some kind of fashion trend which would just come and go in sometime. They are here to stay. The sales of smartphones in India alone has risen almost 400% over the last 2-3 years while that of PC has been nothing more than steady! The number of people using internet through their smartphones and tablets have already surpassed that of desktop users.

mobile-global-audience

mobile-data-traffic

The usage of web from mobile has changed the way businesses market their products and services. Smartphone sales have become bigger than PC sales. A sale coming from mobile phones on eBay comes every 2 seconds. Travel industry has benefited largely from mobile evolution. 19% of the search queries for travel websites come from mobile.

Mobile web designing has grown leaps and bounds in the last few years and it keeps on growing with every moment passed. The designing of websites has changed drastically because of smartphones and tablets and mobile OS like the iOS and Androids. We are already half way into the year 2013 and there are trends that need to be followed by every web designer. Below are 8 trends that are needed to be looked at before designing any mobile website

Mobile Web Design Trends of 2013

1. Flat Design

flat_ui_design_mobile

Windows 8 and the new iOS has really set the pace of flat designs. Flat design is the one in which only the essential elements are displayed on the page. The textures, shadows, patterns, bevels, etc. are done away with.

Just like windows 8 and windows phone are the best examples of flat design. Mobile web design is catching up with this trend pretty fast. Mobile users only want the most important of the information to be provided to them and Flat design does exactly that! Even websites which show how to build a free website are using these Flat UI designs in majority of their templates

2. Typography

typography_in_mobile_websites

Typography is the backbone of any website design. More so when it comes to mobile. Since there needs to be the least of design elements in mobile websites, typography becomes more vital then ever. Many mobile screens are brighter thus making it difficult for many users to read when in sunshine or bright light. Thus, it is necessary to use a good contrast of typography for mobile web designs!

Ofcourse, the typography needs to be responsive. Based on the width of the screen the type needs to be re-sized along with optimized line and word lengths. You can do it using pixels or ems. It is important that the users get the most readable type on any device they see the website on! Always try to keep your type less and simple.

3. QR Code Usage

qr_code_for_mobile

Many must have heard this term “QR Code”. But there are not many who can tell what it is or what is it used for! QR(Quick Response) code is a kind of symbol which takes some piece of information from print media or website and save it to your mobile phones. When you see a QR code on an advert, or some billboards you just need to scan that through your QR code app and all the information saved in that QR code will be in your cell phone.

Many businesses use QR codes on their website contact page so that the customers can save their contact directly by taking a picture of the code. Then, there are businesses who use to provide product information, Offer details, event details, Coupons to their customers directly on their cell. Not just mobile websites but every website should have a QR code to make it mobile friendly!

4. Video Marketing

video_marketing_mobile

Video accounts for 69% of mobile data traffic. With the increase in the usage of 3G and 4G networks, there has been a tremendous increase in the speed of internet. With this speed, video marketing is becoming a huge market, as many businesses now tend to use great videos to try and lure customers.

Many mobile users like to see videos on their mobile when they are free. Businesses are now using this as their weapon and have started investing heavy on making some really great videos for mobile websites

5. Navigation

navigation_mobile

Navigation is literally a make or break for any mobile web design. Users do not want to have many clicks on the website to try and get to their required page. If it take more than 2 clicks to get to a page, you have 70% of the users exiting your website, with least possibility of them returning. When creating the mobile website keep in mind to have minimum and the most important of the menus.

Try to use the top of the screen of the mobile to separate categories of menus. This makes it simpler for many users to get what they want. Menus should also be responsive, so that they behave differently when viewed on different screens. The menu should fit right into the screen.

6. Site Search

linkedin_wap

70% of the users who search on a mobile finish the task within an hour, compared to almost a week on their desktops. Thus, it is of utmost importance to have a site search in your website. The search box should ideally be placed at the top of the screen. You could even create a menu item for search! Predictive search could give you a real advantage!

7. Touchscreen friendly

touchscreen_friendly_mobile_website

Mobile users do not have the luxury of a mouse pointer. Most of the smartphones are touch friendly and thus users mostly use their thumbs to touch the screen. Designers need to understand this aspect very carefully. They cannot have buttons and menu links that are small or very close to each other. They need to have proper space between them and also fit on the screen without making anyone click anything accidentally.

8. Responsive Design

home1_slide_1
Though this is not the newest trend but still worth mentioning. Responsive design is nothing but making the website or app fit as per the size of the screen without any user having the trouble in reading it. In doing so you need to work with fluid layouts. You need to have images that are responsive, so that they fit right into the screen and also so they are small in size to get downloaded!

The navigation and the typography also needs to be responsive. Every HTML element needs to be responsive!

A total football nerd, he loves designing to the core and also likes to get his hands on some programming. He is the Co-Founder of ArtAtm. He hails from India. You may want to Follow Him On Twitter

Jitu – who has written posts on Artatm - Creative Art Magazine.


Tags:

Leave a Reply