A List Apart

Menu

Topic: Browsers

  • Prefix or Posthack

    ·

    Vendor prefixes: Threat or menace? As browser support (including in IE9) encourages more of us to dive into CSS3, vendor prefixes such as -moz-border-radius and -webkit-animation may challenge our consciences, along with our patience. But while nobody particularly enjoys writing the same thing four or five times in a row, prefixes may actually accelerate the advancement and refinement of CSS. King of CSS Eric Meyer explains why.

  • Stop Forking with CSS3

    ·

    You may remember when JavaScript was a dark art. It earned that reputation because, in order to do anything with even the teensiest bit of cross-browser consistency, you had to fork your code for various versions of Netscape and IE. Today, thanks to web standards advocacy and diligent JavaScript library authors, our code is relatively fork-free. Alas, in our rush to use some of the features available in CSS3, we’ve fallen off the wagon. Enter Aaron Gustafson’s eCSStender, a JavaScript library that lets you use CSS3 properties and selectors while keeping your code fork- and hack-free.

  • The Problem with Passwords

    ·

    Abandoning password masking as Jakob Nielsen suggests could present serious problems, including undermining a user’s trust by failing to meet a basic expectation. But with design patterns gleaned from offline applications, plus a dash of JavaScript, we can provide feedback and reduce password errors without compromising the basic user experience or losing our visitors’ trust.

  • Using SVG for Flexible, Scalable, and Fun Backgrounds, Part II

    ·

    In Part II, dig deeper into the technology behind using SVG for your site design. Explore how to incorporate SVG in a cross-browser friendly manner, including using SVGWeb to ensure that the SVG shows in Internet Explorer. And discover the unique characteristic that makes SVG ideal for page backgrounds: scalability.

  • Using SVG For Flexible, Scalable, and Fun Backgrounds, Part I

    ·

    Many of us think of Scalable Vector Graphics (SVG) as an also-ran: fine for charts and tables, but not much else. Yet SVG can actually enhance a site’s overall design, and can be made to work in even the most stubborn browser. In Part I of a two-part series, Shelley Powers covers important basics of working with SVG, including browser support and accessibility.

  • Testing Search for Relevancy and Precision

    ·

    Despite the fact that site search often receives the most traffic, it’s also the place where the user experience designer bears the least influence. Few tools exist to appraise the quality of the search experience, much less strategize ways to improve it. But relevancy testing and precision testing offer hope. These are two tools you can use to analyze and improve the search user experience.

  • Beyond Goals: Site Search Analytics from the Bottom Up

    ·

    Top-down analytics are great for creating measurable goals you can use to benchmark and evaluate the performance of your content and designs. But bottom-up analysis teaches you something new and unexpected about your customers, something goal-driven analysis can’t show you. Discover the kinds of information users want, and identify your site’s most urgent mistakes.

  • Introduction to RDFa II

    ·

    In part I of this series, we looked at 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. Along the way, we defined six rules of RDFa. In part II, we’ll learn how to add properties to an image, and how to add metadata to any item—and we’ll add a few more rules to that list.

  • 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).

  • To Hell With Bad Browsers

    ·

    In a year or two, all sites will be designed with standards that separate structure from presentation (or they will be built with Flash 7). We can watch our skills grow obsolete, or start learning standards-based techniques. In fact, since the latest versions of IE, Navigator, and Opera already support many web standards, if we are willing to let go of the notion that backward compatibility is a virtue, we can stop making excuses and start using these standards now. At ALA, beginning with Issue No. 99, we’ve done just that. Join us.

  • Better Living Through XHTML

    ·

    Everything you wanted to know about converting from HTML to XHTML, including why you’d want to, tools that help, changes in the way browsers display XHTML pages, shortcuts, bugs, workarounds, and other tips you won’t find elsewhere.

  • 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.