A List Apart

Menu

Topic: Browsers

  • Introduction to RDFa

    ·

    In part one of a two-part primer on RDFa, learn how semantic features normally confined to the head of an HTML document can be used to add semantic richness to the elements of the body. Mark Birbeck shows us how.

  • Semantics in HTML 5

    ·

    The BBC’s dropping of hCalendar because of accessibility and usability concerns demonstrates that we have pushed the semantic capability of HTML far beyond what it can handle. The need to clearly and unambiguously add rich, meaningful semantics to markup is a driving goal of the HTML 5 project. Yet HTML 5 has two problems: it is not backward compatible because its semantic elements will not work in 75% of our browsers; and it is not forward compatible because its semantics are not extensible. If “making up new elements” isn’t the solution, what is?

  • Return of the Mobile Stylesheet

    ·

    At least 10% of your visitors access your site over a mobile device. They deserve a good experience (and if you provide one, they’ll keep coming back). Converting your multi-column layout to a single, linear flow is a good start. But mobile devices are not created equal, and their disparate handling of CSS is like 1998 all over again. Please your users and tame their devices with handheld style sheets, CSS media queries, and (where necessary) JavaScript or server-side techniques.

  • Understanding Progressive Enhancement

    ·

    Steven Champeon turned web development upside down, and created an instant best practice of standards-based design, when he introduced the notion of designing for content and experience instead of browsers. In part one of a series, ALA’s Gustafson refreshes us on the principles of progressive enhancement. Upcoming installments will translate the philosophy into sophisticated, future-focused design and code.

  • Faux Absolute Positioning

    ·

    CSS layout is awesome, except when your layout calls for a header, a footer, and columns in between. Use float, and content changes can cause columns to wrap. Use absolute positioning, and your footer can crash into your columns. Add the complexity of drag-and-drop layouts, and a new technique is needed. Enter “faux absolute positioning.” Align every item to a predefined position on the grid (as with absolute positioning), but objects will still affect the normal flow (as with float).

  • They Shoot Browsers, Don’t They?

    ·

    Version targeting will allow Microsoft to reach new heights of standards compliance where CSS and (especially) scripting are concerned. But to benefit from it, developers must explicitly opt in. That’s just not right, says Jeremy Keith. And it’s doomed to fail, because standardistas, by their very nature, will refuse to opt in.

  • Keeping Your Elements’ Kids in Line with Offspring

    ·

    Alex Bischoff introduces Offspring, a JavaScript library bringing the power of advanced CSS selectors to browsers that can’t quite handle the real thing.

  • From Switches to Targets: A Standardista’s Journey

    ·

    Grab your galoshes and walking stick and follow along with A List Apart’s Eric Meyer as he considers the vices and virtues of version targeting as a standards toggle.

  • Beyond DOCTYPE: Web Standards, Forward Compatibility, and IE8

    ·

    For seven years, the DOCTYPE switch has stood designers and developers in good stead as a toggle between standards mode and quirks mode. But when IE7, with its greatly improved support for standards, “broke the web,” it revealed the flaw in our toggle. The quest was on to find a more reliable ensurer of forward compatibility. Is version targeting the answer?

  • How to Size Text in CSS

    ·

    It’s a tug-of-war as old as web design. Designers need to control text size and the vertical grid; readers need to be able to resize text. A better best practice for sizing type and controlling line-height is needed; and in this article, Richard Rutter obligingly supplies one.

  • Put Your Content in my Pocket, Part II

    ·

    Screen size matters. And now that Apple is embedding mobile Safari in more iPods than the iPhone alone, it matters even more. Concluding his remarkable two-part series, Craig Hockenberry covers the down and dirty details of designing and coding with the iPhone (and its brethren) in mind.

  • Conflicting Absolute Positions

    ·

    All right, class. Using CSS, produce a liquid layout that contains a fixed-width, scrolling side panel and a flexible, scrolling main panel. Okay, now do it without JavaScript. By chucking an assumption about how CSS works in browsers, Rob Swan provides the way and means.

  • Accessible Web 2.0 Applications with WAI-ARIA

    ·

    Our web applications can suffer from inaccessibility problems due to inherent markup limitations. Martin Kliehm helps us sort through the WAI specs for Accessible Rich Internet Applications (ARIA) to increase usability.

  • Cross-Browser Scripting with importNode()

    ·

    Anthony Holdener explores the world of XML DOM support for web browsers and presents a new technique for cross-browser scripting.

  • Switchy McLayout: An Adaptive Layout Technique

    ·

    The introduction of new mobile and computing devices challenges us to look beyond the liquid layout. Marc van den Dobbelsteen offers a way to bring appropriate layouts to a wider range of screens and devices.

  • Text-Resize Detection

    ·

    Chris Heilmann and Lawrence Carvalho serve up a way to detect your visitors’ text size settings using JavaScript.

  • Bye Bye Embed

    ·

    Break the chains of <embed> and live free. Elizabeth Castro explains how to embed movies without using invalid markup.

  • ALA’s New Print Styles

    ·

    Print away, you fiends! Eric Meyer presents the ALA 4.0 print styles and discusses the challenge of translating a complex screen layout into a well-designed and useful printed page.

  • Hybrid CSS Dropdowns

    ·

    Yup. It’s yet another CSS dropdown article — but one that resolves many problems associated with common dropdown methods and degrades beautifully. Hybrid CSS dropdowns allow access to all pages, keep the user aware of where she is within the site, and are clean and light to boot. It’s a tasty little vitamin pill, so quit sighing and try it.

  • Big, Stark & Chunky

    ·

    You’ve designed for the screen and made provision for blind, handheld, and PDA browser users. But what about low-vision people? Powered by CSS, “zoom” layouts convert wide, multicolumn web pages into low-vision-friendly, single column designs. Accessibility maven Joe Clark explores the rationale and methods behind zoom layouts. Board the zoom train now!