Tabs, modal overlays, hidden navigation: we’ve developed many patterns to help us design for mobile screens. But these patterns tend to show and hide content using JavaScript—which can come with its own challenges. Art Lawry explores techniques for reducing that dependency on JavaScript using an unlikely tool: radio buttons.
Topic: HTML
Accessibility: The Missing Ingredient
If economics is “the dismal science,” accessibility has long been the least loved branch of web design and development—and the least specified client requirement. Type and grids (especially the flexible variety) have fans aplenty. CSS, Sass, and frameworks draw huge, passionate crowds. But even die-hard front-enders and dedicated followers of best practices seem to wilt in the face of today’s greatly improved accessibility techniques. As a result, while most of us have kept up with the emerging methods, technologies, and challenges of multi-device design and development, essential and well supported specs like WAI-ARIA remain woefully under-implemented. Even the best of us seem to consider accessibility something to be done at the end of the job. Andrew Hoffman explains the advantages and necessity of an “accessibility first” approach.
Start Coding with Wireframes
As a designer or UX pro, you’ve long suspected you ought to learn to code, but where to start? How about making your next wireframe responsive? When you build wireframes with simple code, you create a deliverable that can be reused while you become more knowledgeable about the inner workings of the web.
Bring Me The Head Of Tim Berners-Lee
Concerned about the MPAA getting a seat at the web standards table? Robin Berjon of the W3C and A List Apart’s Jeffrey Zeldman hold a rational conversation about EME, DRM, the MPAA, and the W3C in Episode № 109 of The Big Web Show on Mule Radio.
WYSIWTF
Arguing for “separation of content from presentation” implies a neat division between the two. The reality, of course, is that content and form, structure and style, can never be fully separated. Anyone who’s ever written a document and played around to see the impact of different fonts, heading weights, and whitespace on the way the writing flows knows this is true. Anyone who’s ever squinted at HTML code, trying to parse text from tags, knows it too.
Digital Publishing and the Web
Electronic books are on the rise everywhere. For some this threatens centuries-old traditions; for others it opens up new possibilities in the way we think about information exchange in general, and about books in particular. Hate it or love it: electronic books are with us to stay.
Improving UX Through Front-End Performance
Adding half a second to a search results page can decrease traffic and ad revenues by 20 percent, says a Google study. For every additional 100 milliseconds of load time, sales decrease by 1 percent, Amazon finds. Users expect pages to load in two seconds—and after three seconds, up to 40 percent will simply leave. The message is clear: we must make performance optimization a fundamental part of how we design, build, and test every site we create—for every device. Design for performance; measure the results.
Responsive Comping: Obtaining Signoff without Mockups
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.
Mo’ Pixels Mo’ Problems
Mobile devices are shipping with higher and higher PPI, and desktops and laptops are following the trend as well. There’s no avoiding it: High-pixel-density, or “Retina,” displays are now becoming mainstream—and, as you’d expect, our websites are beginning to look a little fuzzy in their backlit glory. But before we go off in the knee-jerk direction of supersizing all our sites, we must identify the problems ahead and figure out the most responsible way forward—keeping our users in mind first and foremost.
Learning to Love the Boring Bits of CSS
The future of CSS gives us much to be excited about: On the one hand, there’s a whole range of new methods that are going to revolutionize the way we lay out pages on the web; on the other, there’s a new set of graphical effects that will allow on-the-fly filters and shaders. People love this stuff. Magazines and blogs are full of articles about them. But if these tools are the show ponies of CSS, then it’s time to give some love to the carthorses of the language. Learn why “boring bits” like selectors, units, and functions will be revolutionary to the way we work—albeit in humble, unassuming ways.
