4 ms·

CSS is almost a failure as technology. None of it's promises has been realized. The idea with CSS was that we would be able to separate content from presentati

CSS is almost a failure as technology. None of it's promises has been realized. The idea with CSS was that we would be able to separate content from presentation. Remember CSS Zen garden? Yet that has never been the case and div tags were always needed to be able to display something simple. Another promise was that content would be displayed easily on different mediums, desktop, mobile even print.. yet it's impossible to get decent rendering in every medium. For the first years of CSS it was always easier to get a decent layout with tables than with it. Finally all the CSS preprocessor, like saas and compass show how incomplete the technology really is.

mattlondon 8y ago
CSS Media queries allow you to trivially handle different mediums (screen size, pixel density, screen-vs-print etc). It really is very very easy. I dont agree that CSS preprocessors are evidence that the technology is incomplete. Does a c/java/golang/etc compiler mean that x86 is incomplete or somehow flawed? I would wager that most programmers wouldn't agree with that. CSS preprocessors are basically just a way of saving time and improving maintainability by "compiling" some syntactic sugar down to "raw" CSS. Same could be said with doing assembly programming vs e.g. rust/golang etc. I agree though that in the very early days layout was hard with CSS, but then in the very early days we didn't even have devtools and XMLHttpRequests were still something mysterious and exotic. Times have changed and CSS has changed along with it. I'd recommend you try revisiting modern CSS if you have not already done so - you may be pleasantly surprised at how easy it is these days.
- lazyjones 8y ago
  > CSS Media queries allow you to trivially handle different mediums (screen size, pixel density, screen-vs-print etc). It really is very very easy. Disagree. CSS media queries allow you to identify different media, just like uname(2) allows you to identify the platform you‘re running on. Handling all the aspect ratios, resolutions, capabilities, bugs, idiosyncracies of the current device or modus operandi is not at all trivial, especially if you don’t want to design for each situation from scratch.
nl 8y ago
Agree. Worth noting that the real separation of content from presentation is JSON-data + a CSS/HTML hybrid front-end, often implemented as an off-the-shelf display framework (Bootstrap etc).
themacguffinman 8y ago
It's only a failure when viewed through the lens of application development. The web platform wasn't initially designed for applications, it was designed for documents. If you're crafting a document, you can separate style from content pretty neatly with CSS.
- Mikhail_Edoshin 8y ago
  What if my style requires a triple outline around a header?
lmm 8y ago
My heretical view is that it's time to abandon CSS. You already generate your HTML with some program (whether server-side or javascript) that takes a canonical, normalized representation of your content and spits out repetitive HTML elements (one pattern of elements for a button, another for a calendar, etc). Have that same program apply inline styles on elements that need styling.
Mikhail_Edoshin 8y ago
The straightforward way to separate content from presentation is to have a step that transforms that content into a specific form: 2D screen based, 2D page-based, aural, etc., including different purpose like a small read-only mobile gadget vs a full-screen desktop app. Web technologies actually have a beginning of this: XML source + XSLT processor, which is a general-purpose declarative tree transducer. But web community took a wrong turn here.
fulltrottle 8y ago
> The idea with CSS was that we would be able to separate content from presentation I've been a frontend dev close to 5 years now, and recently I read the entire CSS spec front-to-back in scrutinizing detail for a project. If the goal was really to decouple presentation and content then CSS has failed spectacularly. Having element selectors, attribute selectors, child and sibling selectors, very tightly couples the content with the layout. It also has the ability to affect content by inserting text nodes for example using the 'content' rule. I'd say one big gotcha that trips up most people is not understanding when a style is valid or not. Certain styles are only valid for certain display types (see the CSS spec). Also look at the non-normative references on W3C for the default style sheet to see what default rules get applied to elements To really fully keep content and presentation decoupled you have to stay away from those things and use something like css modules or similarly have a one-class-per-component rule.

mattlondon 8y ago

CSS Media queries allow you to trivially handle different mediums (screen size, pixel density, screen-vs-print etc). It really is very very easy. I dont agree that CSS preprocessors are evidence that the technology is incomplete. Does a c/java/golang/etc compiler mean that x86 is incomplete or somehow flawed? I would wager that most programmers wouldn't agree with that. CSS preprocessors are basically just a way of saving time and improving maintainability by "compiling" some syntactic sugar down to "raw" CSS. Same could be said with doing assembly programming vs e.g. rust/golang etc. I agree though that in the very early days layout was hard with CSS, but then in the very early days we didn't even have devtools and XMLHttpRequests were still something mysterious and exotic. Times have changed and CSS has changed along with it. I'd recommend you try revisiting modern CSS if you have not already done so - you may be pleasantly surprised at how easy it is these days.

lazyjones 8y ago
> CSS Media queries allow you to trivially handle different mediums (screen size, pixel density, screen-vs-print etc). It really is very very easy. Disagree. CSS media queries allow you to identify different media, just like uname(2) allows you to identify the platform you‘re running on. Handling all the aspect ratios, resolutions, capabilities, bugs, idiosyncracies of the current device or modus operandi is not at all trivial, especially if you don’t want to design for each situation from scratch.

nl 8y ago

Agree. Worth noting that the real separation of content from presentation is JSON-data + a CSS/HTML hybrid front-end, often implemented as an off-the-shelf display framework (Bootstrap etc).

themacguffinman 8y ago

It's only a failure when viewed through the lens of application development. The web platform wasn't initially designed for applications, it was designed for documents. If you're crafting a document, you can separate style from content pretty neatly with CSS.

Mikhail_Edoshin 8y ago
What if my style requires a triple outline around a header?

lmm 8y ago

My heretical view is that it's time to abandon CSS. You already generate your HTML with some program (whether server-side or javascript) that takes a canonical, normalized representation of your content and spits out repetitive HTML elements (one pattern of elements for a button, another for a calendar, etc). Have that same program apply inline styles on elements that need styling.

Mikhail_Edoshin 8y ago

The straightforward way to separate content from presentation is to have a step that transforms that content into a specific form: 2D screen based, 2D page-based, aural, etc., including different purpose like a small read-only mobile gadget vs a full-screen desktop app. Web technologies actually have a beginning of this: XML source + XSLT processor, which is a general-purpose declarative tree transducer. But web community took a wrong turn here.

fulltrottle 8y ago

> The idea with CSS was that we would be able to separate content from presentation I've been a frontend dev close to 5 years now, and recently I read the entire CSS spec front-to-back in scrutinizing detail for a project. If the goal was really to decouple presentation and content then CSS has failed spectacularly. Having element selectors, attribute selectors, child and sibling selectors, very tightly couples the content with the layout. It also has the ability to affect content by inserting text nodes for example using the 'content' rule. I'd say one big gotcha that trips up most people is not understanding when a style is valid or not. Certain styles are only valid for certain display types (see the CSS spec). Also look at the non-normative references on W3C for the default style sheet to see what default rules get applied to elements To really fully keep content and presentation decoupled you have to stay away from those things and use something like css modules or similarly have a one-class-per-component rule.