Jens Oliver Meiert

CSS (Cascading Style Sheets) (2)

The Truth About “!important”

Sometimes I wake up at night, full of agony, tears in my eyes. The Holiest Alliance Against !important is haunting me. I see their countless crusaders gallop at innocent web developers with merciless force, incessantly blowing their deafening horns…

#58 ¡ ¡

Cover: The Little Book of HTML/CSS Frameworks.

New Book: “The Little Book of HTML/CSS Frameworks”

It’s out! My new book, The Little Book of HTML/CSS Frameworks, is now available. I myself have been surprised by the sudden release, and while I’m still unsure about how print copies can be obtained, the book can now be downloaded for free at O’Reilly.

#57 ¡ ¡ , , ,

On the Deterioration of HTML/CSS Practices

Presentational markup for everyone.

#56 ¡ ¡ , ,

CSS and Specificity

On one of CSS’ greatest features, going from using graphs for greater understanding to affirming fundamentals for saner coding.

#55 ¡ ¡

Google and HTML/CSS Code Quality

For much of Google’s life time there have been few Google web pages of high code quality. That had changed over the last years, but now there are regressions. On the rise and fall of Google’s websites.

#54 ¡ ¡ , , ,

CSS, DRY, and Code Optimization

Why we should minimize repetition in style sheets—perhaps through using declarations just once—, focus more on CSS optimization, and consider that avoiding problems is also a way of solving them.

#53 ¡ ¡ , ,

On Declaration Sorting in CSS

I keep on seeing people advocate to sort declarations “by type.” And every time I wonder, why is this idea still going around? Type sorting is extraordinarily ineffective, for it’s extremely slow and consistently unreliable…

#52 ¡ ¡ ,

CSS: When to Use Generated Content

Generated content means a special option in CSS to embed content in documents. It’s achieved through the content property. Fast forward, generated content should only be used for non-critical content; there it can be a very sharp instrument.

#51 ¡ ¡

CSS, HTML, and the Problem of Spec Fragmentation

We have not one but two fundamental problems with CSS. One is unrestricted growth and complexity leading to poor understanding and poor code. Another one is spec fragmentation, also an issue with HTML, which results in inefficiencies. We should look for a better balance.

#50 ¡ ¡ ,

Object-Oriented HTML, and OOCSS

“Object-oriented CSS” is the idea of treating page elements as objects, giving all these objects classes, treating objects’ classes as single entities in style sheets, and taking it from there. I reviewed the old OOCSS site and Smashing Magazine’s introduction.

#49 ¡ ¡ ,

How to Order CSS Selectors

There are a number of ways to write style sheets. The domain of style guides, many of them go into some detail. What I, despite my work on a number of guides, have so far missed, is a reference to sort selectors and rules, as proposed here.

#48 ¡ ¡

The CSS Problem

CSS is growing too large while CSS 2 has not nearly been understood by authors. This non-sustainable growth is a big problem for CSS.

#47 ¡ ¡

Print Style Sheets and URLs

Print style sheets are awesome. They’re easy to write, too. Site owners and developers who care about print typically know what to do. Alas there’s one thing that’s done rather the wrong than in any right way: printing URLs…

#46 ¡ ¡ ,

Testing Tricks: CSS Bookmarklets

On complex development environments and CSS bookmarklets as a testing complement. Complement as in you’ve done everything you can but want to err on the safe side.

#45 ¡ ¡

CSS: How to Host Right-to-Left Styling

For international projects, don’t use separate style sheets for right-to-left (RTL) styling: use natural (@dir) or artificial (@id, @class) hooks instead. The only exception are unbearable performance issues due to hundreds of RTL rules…

#44 ¡ ¡ ,

CSS Validation and Vendor Extensions: Throw Warnings, Not Errors

If you understand valid code as a quality baseline, you validate your code. If you validate style sheets, you come across errors like “Property -moz-border-radius doesn’t exist’”…

#43 ¡ ¡ ,

“px” Is Dead, Long Live “px”

It’s over. There is no ban on px anymore. The only reason why we as web developers had to adjust coding practices were user agents that failed to meet user agent accessibility guidelines.

#42 ¡ ¡

HTML/CSS Frameworks: Useful, Universal, Usable, Unobtrusive

A high quality HTML/CSS framework needs to have four attributes: useful, universal, usable, and unobtrusive. The four U’s.

#41 ¡ ¡ , , ,

HTML, CSS, and Web Development Practices: Past, Present, and Future

Articles with a title consisting of more than 15,000 characters don’t need an introduction.

#40 ¡ ¡ , ,

The True Advantage of CSS

Despite CSS being around for a long, long time, there are still some myths around it. Reading Mike’s post on CSS evangelism again I couldn’t only relate to Mike’s concerns, I also felt reminded of…

#39 ¡ ¡ ,

Diagnostic Styling Reloaded

Eric cultivated the concept of “diagnostic styling,” meaning using CSS to track down problems within HTML documents. I’ve been working with diagnostic style sheets for general quality assurance…

#38 ¡ ¡ ,

Microformats, Key Flaws

I like the idea behind microformats, but I’m not convinced of the way that idea is brought to life. I see three major flaws that appear to make microformats stand in their own way.

#37 ¡ ¡ ,

“handheld” Media Type, RIP?

Website authors don’t use handheld as it’s barely supported; mobile device manufacturers don’t support handheld because it’s barely used. This is kind of the situation I think we’re facing, and it’s a problem.

#36 ¡ ¡

Let’s Make The Web Faster

Two weeks after my last outcry regarding slowness on the Web there’s a more proactive response: Google launched code.google.com/speed, subtitled “let’s make the Web faster.”

#35 ¡ ¡ , ,

Maintainability Guide

Maintainability is important in order to deal with change. Good maintainability means making change easier and more affordable, and avoiding change that is not necessary…

#34 ¡ ¡ , ,

CSS: The Maintenance Issue #1 and How You Can Avoid It

The biggest—as most unnecessary—maintenance issue in web development is, as my recent research shows, style sheet naming and integration. Web developers use inadvisable style sheet names and inadvisable ways to integrate style sheets that force them…

#33 ¡ ¡ , ,

Why CSS Needs No Variables

CSS variables and constants are one of the top features web developers are asking for in web development fora, magazines, blogs, and on W3C’s www-style. Following a concept written by Daniel Glazman and Apple’s Dave Hyatt, the WebKit rendering engine…

#32 ¡ ¡

The Stupidest Style Sheet Name Ever

The last name you want to pick for your style sheet is “style.css”. Why is “style.css” such a poor CSS file name? The main reason is maintenance…

#31 ¡ ¡

CSS: Style the Non-Obvious

One of the qualities you have to acquire as a web developer is to see the non-obvious, and to use that skill to your code’s advantage. Let me explain by two simple examples.

#30 ¡ ¡

Performance of CSS Selectors Is Irrelevant

…if you like to have a strict read of Steve Souders’ recent research. We’ve still got few but now a few more numbers backing up what we always suspected, that merely optimizing selectors is micro-optimization.

#29 ¡ ¡ ,

When to Split Style Sheets

Three factors influence whether it makes sense to split style sheets: probability, meaning (aka semantics), and granularity.

#28 ¡ ¡

Arial, Helvetica

An extension of my post on Arial and Helvetica: For those who want or have to use Arial as their standard font, there is no point in mentioning Helvetica anywhere in the code, as in arial, helvetica, sans-serif.

#27 ¡ ¡

5 Tips To Deal With Right-to-Left Projects

Know what goes into your markup and what goes into your style sheets. It’s actually simple: When available, you should always use dedicated bidi markup to describe your content. CSS may not be available, and the specs actually say that…

#26 ¡ ¡

WDR #1: Versioned Style Sheets

Ladies and gents, all I present’s… the Web Dev Report, issue #1.

#25 ¡ ¡

5 CSS Tips Every Web Developer Should Know About

Of all the tips this site shares, the following ones may be special. Let’s quickly run through what might be essential for every web developer to know about CSS. Main focus: maintainability, though differently.

#24 ¡ ¡ ,

An Exercise for Emerging CSS Experts: Avoid IDs and Classes

To gain more expertise with CSS, there’s a great bonus level: Try to avoid IDs and classes altogether. That’s right: Write your markup without any IDs and classes.

#23 ¡ ¡ ,

When Guidelines Should Be Descriptive or Prescriptive

Every time I’m putting up guidelines or conventions one of the decisions I need to make is whether the guidelines, or which parts of them, should be descriptive or prescriptive. For coding guidelines this could mean the difference between, say, “the markup should be valid” and “the markup must be valid”…

#22 ¡ ¡ , ,

To Be Clear (on Conditional Comments and Resets)

My articles on Conditional Comments and “reset” style sheets belong to the most popular articles on the respective topics not just on this site, but apparently on the Web. Now, it looks like I could still clarify my standpoint.

#21 ¡ ¡ ,

Best Practices for ID and Class Names

I’m working on another article for German Dr. Web mag, this time covering recommendations for IDs and classes, an issue likely as old as the Web itself. Taking a different approach than usual I’m feeling free to publish a “guerrilla sneak preview” in this place.

#20 ¡ ¡

A Few Words on HTML/CSS Frameworks

Public, or open, or external, HTML/CSS frameworks are rarely a good idea. Why? Because framework developers are outside of your organization and cannot know your needs. This simple fact, the inevitable ignorance of a third party, means that—

#19 ¡ ¡ , , ,

When Validation Becomes Unimportant

Validation becomes unimportant only once you’re ahead of the game. Even then, truly mastering HTML and CSS, it’s best to stick with valid markup and styling. Improving latency might constitute the only exception—if at all.

#18 ¡ ¡ , ,

CSS: Simple Rules for Better Organization and More Efficiency

“Organization is not everything, but without organization, everything is nothing,” one of my teachers used to say. Almost everything benefits from organization, and so does work with CSS—especially when working with many people.

#17 ¡ ¡ , ,

Why “Reset” Style Sheets Are Bad

Jonathan set the pace, Eric countered, a few people chimed in, and I, having criticized reset and undo style sheet criticism back in January, feel obligated to repeat that reset style sheets are bad: A novice should not use them, an expert would not use them…

#16 ¡ ¡

CSS Properties Index

A list of all properties in CSS 1, CSS 2, CSS 2.1, and CSS 3, including their initial values.

#15 ¡ ¡

Great CSS Techniques and the Simple Truth Behind Them

There’s a simple recipe to judge CSS techniques: Does the method in question require HTML additions and modifications (beyond introducing IDs or classes)? If yes, the technique likely isn’t elegant and might be inadvisable.

#14 ¡ ¡ , ,

CSS: Selector Variables

Complex projects suffer from higher cost of selector changes, and long sequences of simple selectors do impact the understandability and efficiency of style sheets. One solution could be selector variables or “synonyms,” a concept I proposed to the CSS Working Group …

#13 ¡ ¡

Choke Web Development Framework 1.0

After years of thorough research I may finally present the Choke Web Development Framework 1.0, “Choke” or “CWDF” in short. Choke is an easy-to-use, easy-to-maintain, and future-proof platform for web design and development…

#12 ¡ ¡ ,

User Agent Style Sheets: Basics and Samples

CSS manages the default formatting of documents through user agent style sheets, a cornerstone of the cascade. This means that a web browser doesn’t just present a line of text when it’s fed with an HTML document that has no styling information, but…

#11 ¡ ¡

Microformats Would Benefit From a Namespace

Microformats become more and more popular, accelerated by the questionable success of the nofollow microformat. However, those of them that mandate class names cause problems that could be avoided by using a “pseudo-namespace.”

#10 ¡ ¡ , ,

WCAG, HTML, and CSS: Maybe the Standards Need a Break

The web development community worries about the development of WCAG, HTML, and CSS (about the latter since recently). These worries and the related criticism appear valid and legitimate, and there are things we could do.

#9 ¡ ¡ , ,