Introduction to Mobile Web Design

Posted on 30. Sep, 2017 by in Developement, Programming, SEO, Uncategorized, Web Hosting

Are you ready to step into the next big arena of web design? Build Mobile Websites and Apps for Smart Devices, as the name suggests, is all about designing for mobile devices. It’s about designing for the future. This article will guide you through the process of designing and building a mobile web application from scratch. We’ll take a look at what you should consider when designing in a mobilecontext—building the base of our application using webstandards,and layering interaction on top of that base. Ultimately, we’ll have our application up and running in a native wrapper so that it can be downloaded from the various app marketplaces. This book will focus on building for phone-sized devices, though many of the concepts and techniques can be applied to other mobile devices and contexts, such as tablets or netbooks.
From a technical perspective, we’re going to be talking about the same technologies we’re used to building with; HTML, CSS, and JavaScript are going to form the basis for (almost) everything we cover. So you will need a basic understanding of those technologies at the very least.

What does it mean?

First of all, let us make sure we are on the same page. You may well ask, “What do you mean by mobile?” The answer is: many things. On the surface, building for the mobile web may appear to be not all that different from building for any other web application or site;

we’resimplyoptimizing for viewing on mobile devices. Dig a little deeper, though, and there’s a lot more we need to think about.

Discussions about the mobile web tend to focus on the devices and their capabilities—things like the latest iPhone, the newest Android phone, or this week in webOS. It’s a rapidly changing landscape and thus an exciting time for web development, so it’s easy to get caught up in discussions of the technical requirements and solutions for targeting mobile devices. But this misses the great opportunity we have with mobile design, because, ultimately, it’s about people, not devices. The definition Barbara Ballard gives in her book, Designing the Mobile User Experience, is right on the money:1
Fundamentally, “mobile” refers to the user, and not the device or the application.
People,notthings.Mobility is more than just freedom from the confines of our desks.It’sadifferent context,adistinct user experience.Strangely enough,people use mobile apps when they’re mobile, and it’s thisany where-and-every where convenience of mobile design that makes mobile applications incredibly useful, yet so hard to design. We need to think hard about who we’re targeting and what they want or require. Our focus has to be on having our application shine in that context. And while, for much of this book, we’ll be focusing on the technical implementation, we’ll be keeping Ballard’s definition at the forefront of our decision-making.

Why does it matter?

Estimates put the combined number of smartphones and other browser-equipped phones at around 1.82 billion by 2013, compared to 1.78 billion PCs.2 Reliable stats on mobile browser usage are notoriously difficult to find, but regardless of the source, the trend is clear. According to StatCounter, the mobile share of overall web browsing is currently sitting at 4.36%, and while that figure may seem small, bear in mind that’s a whopping 430% increase over the last two years. And this is just the very beginning of mobile browsing. We’re never going to spend less time on our phones and other mobile devices than we do now. Inevitably, more powerful mobile devices and ubiquitous internet access will become the norm.And the context in which those devices are used will change rapidly. The likelihood of our potential customers being on mobile devices is higher and higher. We ignore the mobile web at our peril.

The Natives Are Restless

The inevitable decision when designing for the mobile space is the choice between building a native application or a web application. Let’s first define both of those terms. A web application is one that’s accessed on the Web via the device’s browser—a website that offers app-like functionality, in other words. A so-called native application is built specifically for a given platform—Android or iOS, for example—and is installed on the device much like a desktop application. These are generally made available to consumers via app platform-specific app marketplace.

Most famous among these is Apple’s App Store for the iPhone and iPad.
Let’s now take a look at the pros and cons of native apps and web apps. As a general rule, native apps offer a superior experience when compared to web applications; the difference is even more pronounced on slower devices. Native applications are built, optimized, and, most importantly, compiled specifically for the device and platform they’re running on. On iOS, this means they’re written in Objective-C, and on Android, in Java. In contrast, web applications are interpreted; that is,theyhavetobereadandunderstoodontheflybythebrowser’srenderingandJavaScriptengines. For iOS, Android, BlackBerry, Symbian, and webOS, the browser engine of choice is the open source WebKit project—the same engine that powers Safari and Chrome. For Windows Phone 7, the engine is currently a version of Internet Explorer 7, though Microsoft have announced plans to change that to the rendering engine inside Internet Explorer 9. This extra layer between our code and the device means that web applications will never perform as well as native apps, and that’s problematic if we’re building an app that requires high-resolution 3D graphics or a lot of number crunching.However,ifwe’rebuildingsomethingsimpler,awebappwilldothejobjustfine.There will still be a difference in performance, but we will be able to provide a good user experience nonetheless.

Will Be Continued…..

Rate this ➜

0 people like this.

Tags: , , ,

No comments.

Leave a Reply