Category: Mobile

This category features articles on best and emerging practices for responsive website design, Web apps and native apps. While the mobile Web is still in it’s infancy, we can learn from the experiences of professionals who are working on mobile every day. Curated by Derek Allard. Subscribe to the RSS-Feed.

Popular tags in this category:

Responsive Web Design Apps Techniques iOS iPhone

Case StudyMaintaining Momentum Through Efficient Mobile Design

When interacting with mobile devices, users have little patience for confusing interfaces or unnecessary steps that impede their progress. As designers, we must understand the role of momentum in effective user interface design and create experiences that keep our users moving forward.

Maintaining Momentum Through Efficient Mobile Design

Think about the act of checking email on a mobile device. This is probably one of our most efficient interactions with our phones; we do it while crossing the street, between conversations and even (for the dangerous few!) while driving. Every distracting bit of user interface (UI) that could get in the way of checking our email has been stripped from the design, making it a streamlined process that we love doing.

Read more...

Streamlining Mobile Interactions

The mobile web is a harsh environment: mobile processors are slower than their desktop counterparts; network connectivity is flaky; bandwidth is low; latency is high; and touchscreen keyboards are slow. The best mobile web applications are the ones that excel at handling these challenges.

Streamlining Mobile Interactions

In this article, we'll look at how to identify the tasks your users want to accomplish on a mobile device, memorize as much as you can about your users’ situation, presume that your users’ actions will succeed (and get them to their next task) and also how to predict your users’ next actions, and prepare accordingly.

Read more...

Next-Generation Responsive Web Design Tools: Webflow, Edge Reflow, Macaw

To prepare for a talk about the changing roles of designers and developers, given at HOW Interactive a few months back, I interviewed 20+ web shops. Validated by my own experience, I found that many of them faced challenges fitting responsive design into their workflow, and the role of most web designers had changed to include coding in some form or another.

Next-Generation Responsive Web Design Tools: Webflow, Edge Reflow, Macaw

At least half of the designers knew HTML and CSS well but wanted a more visual way to get at it. Well, a new generation of visual responsive design tools has arrived. These responsive design tools are for anyone who understands HTML and CSS (or is willing to learn) and wants to visually design a responsive website — and have code to show for it.

Read more...

Mobile And Accessibility: Why You Should Care And What You Can Do About It

Mobile has revolutionized the way we use the web. This is especially true of disabled users, for whom mobile devices open the door to a whole new spectrum of interactions.

Mobile And Accessibility: Why You Should Care And What You Can Do About It

And they are taking advantage of it. A July 2013 survey (PDF) of adults with disabilities done by the Wireless Rehabilitation Engineering Research Center found that 91% of people with disabilities use a “wireless device such as a cell phone or tablet.” Among these users, screen reader usage is common, even on mobile devices.

Read more...

Team Collaboration And Closing Efficiency Gaps In Responsive Design

Responsive design ushers in complexities that require a more involved design and implementation process. Because of this, the effort has piled up on the front end. Working in silos, where you talk to each other only occasionally or during scheduled meetings, has too many unknowns. Let's look at how these new challenges create opportunities to work together better.

Team Collaboration And Closing Efficiency Gaps In Responsive Design

We have to kill the mentality that there is an assembly line of workers waiting for it to be their turn, and instead embrace more focused collaboration across the project’s entire team.

Read more...

Responsive Images Done Right: A Guide To <picture> And srcset

On Monday, we published an article on Picturefill 2.0, a perfect polyfill for responsive images. Today's article complements Tim Wright's article and explains exactly how we can use the upcoming <picture> element and srcset, with simple fallbacks for legacy browsers. There is no reason to wait for responsive images; we can actually have them very, very soon. — Ed.

Responsive Images Done Right: A Guide To <picture> And srcset

Images are some of the most important pieces of information on the web, but over the web’s 25-year history, they haven’t been very adaptable at all. Everything about them has been stubbornly fixed: their size, format and crop, all set in stone by a single src.

Read more...

Unicode For A Multi-Device World

A while ago, I was working on a website that required a number of icons. “No problem,” I thought. “I know how to handle this. I’ll use an @font-face icon set for high-resolution screens. It’ll be a single file, to reduce HTTP requests, and I’ll include just the icons that I need, to reduce file size.”

Unicode For A Multi-Device World

“I’ll even use a Unicode character as the base of the icon, so that if @font-face isn’t supported, then the user will still see something like the intended icon.” I felt pretty pleased with myself.

Read more...

↑ Back to top