A List Apart

Menu

Topic: Mobile/Multidevice

Each week, new devices appear with varying screen sizes, pixel densities, input types, and more. Creating great mobile (and immobile) experiences. Constraints, challenges, and new opportunities. Mobile-first. Content-first. Responsive workflow. Responsive Design + Server Side Components (RESS). JavaScript, APIs, and progressive enhancement. Designing for hand, lap, and desk.

  • Planning for Performance

    by Scott Jehl · Issue 409 ·

    We should build websites that are not merely responsive, but sustainable, globally accessible, and, well, responsible, as Scott Jehl suggests in his new book, Responsible Responsive Design. Our approaches to responsive websites need to consider ever-changing devices, limited networks, and unexpected contexts. In this excerpt from Chapter 3, Scott discusses page load times and the responsible delivery of code.

  • Look at the Big Picture

    by Lyza Danger Gardner ·

    It’s easy to see that automation can streamline image-optimization for all the varied contexts on the pan-device web. What’s harder to imagine is a future where foregrounding meaningful content in images can be handled by an algorithm. Art direction still requires human intervention, and that’s often a luxury in high-production environments.

  • Surveying the Big Screen

    by Mike Pick · Issue 386 ·

    We’ve been designing responsively for more than three years, now, and have the small-screen pattern libraries and portfolios to prove it. But what about larger screens? While we commonly use liquid design for smaller breakpoints, allowing our content to expand and contract as needed, few of us consider what happens beyond a maximum width of 960 pixels or so—which can leave a heap of unused pixels on a contemporary desktop display. Mike Pick explores how to use negative space, scale, density, and layout devices such as grids, modules, and columns to break through the 1024-pixel layout barrier.

  • Designing Offline-First Web Apps

    by Alex Feyerke · Issue 386 ·

    We assume our users are like us—with the latest devices, the most recent software, and the fastest connections. And while we may maintain a veritable zoo of older devices and browsers for testing, we spend most of our time building from the comfort of our modern, always-online desktop devices. But what happens when our users descend into the subway, board a plane, go to live in the country, or just happen to find themselves in the wrong corner of the room? The truth is, offline is a fact of life—but there are ways to design for it. Alex Feyerke tells all.

  • Do as Little as Possible

    by Lyza Danger Gardner ·

    I make websites for mobile phones. Or, at least, that’s what I used to say. Nowadays, it’s complicated.

  • Client Relationships and the Multi-Device Web

    by Matt Griffin · Issue 379 ·

    When you step into the room with a client, you are a visitor from the future. You, web professional, spend your days immersed in the new paradigms of the multi-device web. Yet even for you, the constant change and adjustments that come with living on the internet can feel overwhelming. So how do you think your clients feel? It’s time to shed the vestigial mindsets we’ve inherited from the advertising world—the closed communications and drama of the “big reveal”—and build new systems based on honesty, inclusion, and genuine communication, says Matt Griffin. In this way, our clients will become true partners—rather than confused, anxious bystanders—as we learn to better navigate this strange, evolving digital universe together.

  • Summer Reading Issue

    by ALA Staff · Issue 378 ·

    Presenting the second annual ALA Summer Reading Issue—a deep pool of editor’s picks from the recent archives of A List Apart, sprinkled with some of our favorite outside links. This summer’s picks are arranged in clusters that echo the design process, and like all good summer reading, they travel light. (This issue is also available as a Readlist, suitable for reading on Kindle, iPhone, iPad, Readmill, or other ebook reader.) Dive in!

  • The Alternative is Nothing

    by Karen McGrane ·

    We’re witnessing one of the latest waves of technological disruption, as mobile devices put access to the internet in the hands of people who previously never had that power.

  • The Web on Mobile and Beyond

    by The W3C ·

    People used to stare at me and laugh, back in 2005 when W3C launched its Mobile Web Initiative to advocate the importance of the web to the mobile world. Now I am the one smiling much of the time, as I did most recently during the 2013 edition of the Mobile World Congress (MWC) in Barcelona, one of the largest events to focus on mobile devices and networks.

  • Environmental Design with the Device API

    by Tim Wright · Issue 369 ·

    Real-world factors like low batteries and weak signal strength can turn even the most expertly crafted digital experience into a frustrating clustercuss. These factors are beyond your control, and, until recently, there was nothing you could do about them. Now there just may be. Tim Wright explains how to begin improving your users’ experiences under constantly shifting (and sometimes quite dreadful) conditions, via environmental design thinking and the Device API.

  • Windows on the Web

    by Karen McGrane ·

    You have five minutes while waiting for a friend to meet you for lunch, so you find yourself shopping for a new pair of shoes. When your friend arrives, you put the phone away, but leave the web page open to help you remember what you found when you get home.

  • Vexing Viewports

    by Lyza Danger Gardner, Stephanie Rieger, Luke Wroblewski, Peter-Paul Koch · Issue 367 ·

    Each week, new devices appear with varying screen sizes, pixel densities, input types, and more. As developers and designers, we agree to use standards to mark up, style, and program what we create. Browser makers in turn agree to support those standards and set defaults appropriately, so we can hold up our end of the deal. This agreement has never been more important. That’s why it hurts when a device or browser maker does something that goes against our agreement—especially when they’re a very visible and trusted friend of the web like Apple. Peter-Paul Koch, Lyza Danger Gardner, Luke Wroblewski, and Stephanie Rieger explain why Apple’s newest tablet, the iPad Mini, creates a vexing situation for people who are trying to do the right thing and build flexible, multi-device experiences.

  • Uncle Sam Wants You (to Optimize Your Content for Mobile)

    by Karen McGrane · Issue 364 ·

    Thirty-one percent of Americans who access the internet from a mobile device say that’s the way they always or mostly go online. For this group, if your content doesn’t exist on mobile, it doesn’t exist at all. The U.S. government has responded with a broad initiative to make federal website content mobile-friendly. Karen McGrane explains why this matters—and what you can learn from it.

  • Your Content, Now Mobile

    by Karen McGrane · Issue 364 ·

    Making your content mobile-ready isn’t easy, but if you take the time now to examine your content and structure it for maximum flexibility and reuse, you’ll have stripped away all the bad, irrelevant bits, and be better prepared the next time a new gadget rolls around. This excerpt from Karen McGrane’s new book, Content Strategy for Mobile, will help you get started.

  • The Infinite Grid

    by Chris Armstrong · Issue 363 ·

    Grid systems are a key component of graphic design, but they’ve always been designed for canvases with fixed dimensions. Until now. Today you’re designing for a medium that has no fixed dimensions, a medium that can and will shape-shift to better suit its environment—a medium capable of displaying a single layout on a smartphone, a billboard in Times Square, and everything in between. You’re designing for an infinite canvas—and for that, you need an infinite grid system. Discover techniques and guidelines that can help bring structure to your content whatever the screen size.

  • Responsive Comping: Obtaining Signoff without Mockups

    by Matt Griffin · Issue 363 ·

    If you’re making websites, chances are you’ve given some thought to what constitutes a responsive-friendly design process—and you’ve probably found that adding a mockup for every breakpoint isn’t a sustainable approach. Designing in code sounds like the answer, but you may be mystified at where to begin—or feel unmoored and disoriented at the prospect of giving up the approach you’ve long relied on. Enter responsive comping. This new, mockup-less web design process makes it easy to get that Photoshop monkey off your back, and have a fresh new beginning with your old friend the web browser.

  • The Web Aesthetic

    by Paul Robert Lloyd · Issue 362 ·

    Today, when every device begs to be connected, it has become easier—almost necessary—to accept the adaptable nature of the web. Responsive web design is an emerging best practice, and our layouts are becoming more flexible. But often, innovation is focused on technical implementations while the visual aesthetic remains ignored. To put it another way, we’re embracing “responsive” but neglecting the second part: “design.” Now is the time to seek out an aesthetic that is truer to the medium.

  • A Case for Responsive Résumés

    by Andrew Hoffman · Issue 353 ·

    Grizzled job hunting veterans know too well that a sharp résumé and near-flawless interview may still leave you short of your dream job. Competition is fierce and never wanes. Finding new ways to distinguish yourself in today's unforgiving economy is vital to a designer/developer's survival. Happily, web standards whiz and mobile web developer Andrew Hoffman has come up with a dandy differentiator that is just perfect for A List Apart readers. Learn how to author a clean résumé in HTML5/CSS3 that scales well to different viewport sizes, is easy to update and maintain, and will never grow obsolete.

  • Dive into Responsive Prototyping with Foundation

    by Jonathan Smiley · Issue 348 ·

    There are hundreds of devices out there right now that can access the full web, as Steve Jobs once put it. They come with different capabilities and constraints, things like input style or screen size, resolution, and form. With all these devices set to overtake traditional desktop computers for web traffic next year, we need tools to help us build responsively. Jonathan Smiley shows how to dive into responsive design using Foundation, a light front-end framework that helps you rapidly build prototypes and production sites.

  • A Pixel Identity Crisis

    by Scott Kellum · Issue 342 ·

    The pixel has long been the atomic particle of screen based design: a knowable, concrete unit of measurement. But layouts based on the hardware pixel are fast becoming an endangered species. Even the introduction of a new, W3C standard reference pixel, although it promises stability in the long-term, can't help us navigate the current chaos. Consider the two "standard" pixel definitions and 500 "standard" viewports your user's Android device may support. To create designs that transcend platform differences, the promise of the web and standards, you must normalize pixels across devices. Scott Kellum shows how math and media queries can keep you sane and help you design consistently across platforms.

Topics