Mobile Web Design
Strategies
It seems like almost everyone is using their mobile devices to access the web, including smartphones and tablets. As web designers, all this means we must begin using mobile strategies to address the new needs of your website(s).
We need to address a new design strategy for how your website functions in the mobile space. Is your website a ‘static’ site (informational only, no real functionality - it’s hard to believe anything on the web is really just ‘static’) -- or a dynamic content-driven site, or an interactive web app, you need to take a look at your mobile visitor’s user experience.
When we design for mobile, we ensure to touch on the following needs considerations.
Do you have a real NEED for a mobile site? Is your site :
- A new website in need of both a desktop and mobile design.
- A website re-design, in which you’d like to include a new mobile site.
- Just adding a mobile site to an existing website.
All of these scenarios have different needs and requirements, which require a sort of ‘needs analysis’ to define the best way for you to move forward with your project.
Your Business Objectives
What are your business objectives and goals as related to the the mobile site you’d like to implement? Objectives need to be prioritized. Focus on just a few major priorities for the business.
You Have to Know Where You’ve Been Before You Know Where You’re Going
Whether your project is a redesign or you’re adding a mobile component to an existing website, you need to make sure you’ve been tracking the site stats with Google Analytics. It’s good to know how your site’s been doing. You should know which devices and browsers your visitors are using to access the site. It’s great to know this information so you can effectively target these particular browsers.
What is ‘Responsive’ Web Design?
Ran across this term a while ago upon reading an article on A List Apart - it’s very descriptive. So many new mobile devices are popping up every week; so checking your site in only a couple different browsers is no longer feasible. You must optimize for every possible scenario including, different screen resolution, supported technologies, and user-base. The article ‘Responsive Web Design’ says it’s best to create both the desktop and mobile sites a the same time.
“Rather than tailoring disconnected designs to each of an ever-increasing number of web devices, we can treat them as facets of the same experience.”
Using cutting-edge web technologies such as the latest HTML5, CSS3, and Web Fonts, we will design your site to scale and ensure it adapts easily to every device. This is ‘responsive web design’.
Less Is More
When converting a desktop site to mobile, keep it small and simple. The main reasons for this are 1) keeping file sizes small so they load quickly, 2) wireless connections are still only 4g at best - significantly slower than dsl or cable on your desktop. The quicker your site loads the less chance you have of losing the visitor. The more simplified your site is, where layout, design & navigation is concerned, the better user experience your visitor will have.
When You Think ‘Mobile’, Think ‘Single-Column Layout’
A single-column layout makes for faster loading and ease of navigation for your visitor. It will be easier to deal when there is such limited real estate on the smaller screen, it also helps you easily scale between different device resolutions and flipping between portrait and landscape mode. By using responsive web design we have the ability to turn a multi-column site layout into a single-column layout.
Collapsible Navigation
Lots of navigation and information on your website that needs to be on the mobile site? Create a collapsible navigation. We can place large blocks of content in collapsible accordion/drop-down-type modules allowing your visitor to tap open the content they want to view while hiding the rest.
Turning ‘Clickable’ Into ‘Tappable’
Whatever is ‘clickable’ or ‘live link’ on your website needs to be ‘tappable’ on your mobile site for maximum visitor usability.
We make sure all the menus, buttons, links, icons, etc. are ‘tappable’ for your visitors to engage properly with the mobile site. The ‘clickable’ areas need to have larger buttons, and active areas to make thumb and finger navigation easier on the smaller screen.
Call us today to find out more about taking advantage of what a mobile web design can do for your business!