A Dao of Web Design (2000)
alistapart.com
alistapart.com
While their shoulders are giant, their message was often ignored, because many designers -- often instructed by their customers -- continued to think in terms of layout inseparable from their visual design.
Web users also valued consistent layouts, but it turns out, not enough websites actually cared! Marketing pressures for visuals and refreshes would frequently be at odds with the UI's UX. This is perhaps excusable for websites whose sole reason for being was to be a digital billboard, but this would be a point-of-contention for news sites, e-Commerce, social networks, and productivity sites too.
We know this is what happened, because when the Web 2.0 "age of mashups" came, most websites were caught by surprise. The coolness factor and emerging business cases finally pressured them to make available snippets of their content that can be surfaced independent of presentation -- but as a twist, instead of sending composed documents, they largely turned to shipping around context-free snippets of data. With content having been separated and spliced into pages using JS, the tight combination of HTML+CSS became a layout engine.
Because layout (space between elements) is inseparable from visual design, it's what has the biggest impact on visual perception right after contrast (visibility). Doesn't matter if web or analog design, it's a law of nature.
Would you expand on your approach? I'm interested in hearing about how you identify requirements, design of solutions, tooling selection, and implementation of solutions.
this sounds so un-Dao
https://0xadada.pub/2015/11/05/a-retrospective-responsive-de...
but to summarize some of its main points:
Responsive design is:
* A process * A relinquishing of the false sense of comfort we get when designing for a “design comp” * An experience-first / MVP friendly approach to building dynamic, consistent and importantly a complete experience that adapts to users context * A conduit for the flow of of communication, and much much like water, it flows into different browsers & devices, flows into robot search engine crawlers, flows into RSS feeds, flows into meta-data (hReview) parsers, flows into printers, flows into read-later tools like Web Clippings, Pocket, Instapaper and FlipBoard
Responsive Design isn’t a set of CSS features, a technology stack or a set of tools. Its when an organization decides to collaborate around a process; with accountability to the user first, to each other second, and to solve the technology last, once all important decisions have been made.
"...in the near future most web browsers will provide simple ways for readers to adjust the color of elements on a web page, via user style sheets, which can override your style sheets..."
While I believe that designing in an adaptive way, as described in this article, is the best approach, I wonder how much it has been handicapped as a method by browsers adapting to the web design methods that were actually used instead of the ideal approaches.
Early versions of Firefox shipped with a prominent stylesheet chooser in the status bar, that allowed alternate stylesheets on the page to be selected. Of course, hardly any website offered alternate stylesheets. So this later got moved to a menu and forgotten. According to this MDN page [1], IE8 has this feature too, which is wild to me, because that's right around the time most people accepted this feature as irrelevant.
Several browsers offer a way for the user to set a custom stylesheet that will be applied to every page. These options are almost always buried in some forgotten corner of an accessibility menu, if a UI is provided at all. The utility of this feature is passable when used to, say, enlarge text, or apply basic formatting to well-identifiable elements like h1, a, or table, and very useful for pseudoclasses. But because page layouts (i.e. the specific nesting of container elements, and the styles that affect them) between any two random websites can differ so widely, it's only capable of crude attempts to alter layout.
https://developer.mozilla.org/en-US/docs/Web/CSS/Alternative...
It looks like it's even broken in the most recent versions—although I may be making a bad inference and support was actually deliberately removed recently, which is equally likely.
One of the only sites I know of that ever offered alternate stylesheets is http://virtualplastic.net.
With Firefox's style switcher, you should be able to use "Page Style" from the "View" menu to switch between all three, if things were working. By using View Source on that page, you can see that there are three stylesheets available called "red", "purple", and "default". Since the style switcher currently only allows switching between styled and unstyled views, you have to use the in-content links in top right corner of the page header instead. (Note that there are only two icons for switching, though—"purple" is missing.)
> When a new medium borrows from an existing one, some of what it borrows makes sense, but much of the borrowing is thoughtless, “ritual,” and often constrains the new medium. Over time, the new medium develops its own conventions, throwing off existing conventions that don’t make sense.
This was quite apparent at the time IIRC. A lot of places at the time wanted a web page to almost like a printed page in a magazine and there was even a lot of magazine and newspaper style layout demos that you would find dotted about the web. Many of these designs are quite dated today because the designers were used to designing things for print rather than for web and never assumed that the content would change.
So the page looked great until you put some real content in it that was too long and then the nice layout wouldn't work.
I also remember Lorem Ipsum was used everywhere because it "flowed like real text". Except it really didn't and you quickly found that it was utter nonsense.
Lorem Ipsum would look like it took the space on the page quite nicely and things would look decent on the PSD. Once you put in English or God forbid a RTL language like Arabic it didn't work and everything again looked off and half arsed.
> But beneath questions like “how do I make my pages look the same on every platform” and “how can I make my fonts appear identical on the Macintosh and Windows” is an underlying question – “how do I control the user’s browser?” Indeed, the word control turns up with surprising frequency.
I remember in the mid 2000s (I only just left University). I thought it was the absolute height of skill to have my website look the same on every browser that was available. Then I encountered a Macintosh and I realised that it was I was trying to do was impossible because Mac OS Snow Leopard had different mechanism for rendering fonts than Windows. It shook me to the core at the time, I think I barely said anything to anyone for 2 days as I didn't really want to accept the fact that what I thought was pinnacle of ability with CSS wasn't actually possible. I find it quite amusing that I was once so absolutely naive.