Elements of a Clean Web Design
sixrevisions.com
sixrevisions.com
CSS to change colours and relative proportions is, I suppose, a concession that had to be made to 'designers', but when you, as the page author, are having to concern yourself with typography, then something has gone horribly wrong. Layout, spacing, leading - these are all the /browser's/ job; at most the page should give a few hints ("this section needs to be clear" -> use more leading/spacing), since such hints are meaningful to other renderings than the graphical browser. Did these designers ever stop to think about blind people relying on text-to-speech? It's obvious how that should render <em> - with emphasis - but what does it do with "letter-spacing:110%;"?
As for the advice about using a grid, that should definitely have been accompanied with the caveat that your design should still flow to the browser's width. Fixed-width web pages are _evil_, where by evil I actually mean _stupid_.
<span style="letter-spacing:110%;">forever</span>
f o r e v e r
Typography is relating to the design and appearance of the page. It should still go hand-in-hand with creating semantic markup of the actual page.
However, for what it's worth, of the many stupid (or is it evil?) things you wrote the best was 'how should a screen reader deal with letter-spacing'. Letter spacing is an aid for the visual user it makes text easier to read in certain cases. A screen reader doesn't 'read' in the human sense.
For instance, as you point out, his complaints about visual design in reference to blind people makes absolutely no sense whatsoever. Either he is really outdated in modern theories of web design/development or he's just being confrontational on purpose.
Perhaps you are confusing it with kerning, which does make text easier to read, and which absolutely should at all times be automated (no exceptions, not even for 'display' text).
Also, I quoted "designers" in the strict sense of scare quotes: to indicate that the word's meaning was different from (my understanding of) its usual definition. Most people who design things are not visual artists; properly construed, "designer" is almost synonymous with the modern meaning of "engineer". However, on the web at least, its meaning has been blurred.
Letter-spacing is the overall spacing between letters and is again purely visual, used to prevent unsightly gaps toward the end of the line in justified text or to make uppercase titles easier to read.
The only meaning you might possibly want to convey to an unsighted user regarding letter-spacing is a propensity for sheep rustling (however blackletter isn't a popular style on the web).
If, for instance, uppercase text requires wider spacing, the browser — or better still, the font renderer — should work that out; the designer should not have to explicitly tell it things like that.
Since, in any case, most manual typography is already algorithmic (if such-and-such condition, the spacing needs to be increased), and since the 'judgement calls' about the aesthetics of type are already encoded into the font by the foundry, manual typography outside the foundry is /obsolete/: machines can do it better, because they can use optimisation algorithms to find the best trade-offs (compare, for instance, TeX's line-breaking algorithm to the common manual approach of "first-fit, but backtrack if the solution is too poor").
We had that, it was called gopher. We didn't like it then, why would we suddenly want it now? It's not as if design, from typefaces to colors to everything else, does not complement the content.
If anything, the kind of non-design you seem to want is a regression to even before not just the web, but writing itself. Graphical elements, colors and design touches were part of the written word since before Gutenberg (from the ancient egyptian hieroglyphics, to the arabic ornamental manuscripts to the elaborate scrolls of the middle ages, to William Morris).
As for the advice about using a grid, that should definitely have been accompanied with the caveat that your design should still flow to the browser's width. Fixed-width web pages are _evil_, where by evil I actually mean _stupid_.
I'm not sure. Fixed-width is better for human consumption for several reasons, not just because books and magazines are fixed width. For one, we like to read a number of words on each line, not everything that fits in a huge horizontal lines of text in a 30" monitor. Second, we like the text we are reading to have some proportional relationship with the figures, images etc that come with it -and those images are fixed-width. Catering to multiple widths is less of an ideal, and more of a pragmatic necessary evil due to varying computer screens. Let's not make a virtue out of necessity.
I'm not advocating regression to non-design; merely the automation of design, and its implementation as close to the user as possible. It may disturb the more artistically inclined to learn that their profession is in the process of being obsoleted by technology, but there it is and I hope they won't be Ludditic about it.
"we like to read a number of words on each line" (etc.) - who are "we"? I certainly don't; a line break forces you to re-acquire the text stream, producing regressive eye movement. Do you have data for your assertions? My understanding of the science was that the optima are narrow columnar formats and maximal width.
What you're describing isn't clean web design, it's HTML without CSS.
>Did these designers ever stop to think about blind people relying on text-to-speech? It's obvious how that should render <em> - with emphasis - but what does it do with "letter-spacing:110%;"?
Yes. Check out the concept of the semantic web. It's the idea that the structure of the page should give some semantic meaning to the content. Which is why the use of <i> or <b> tags is eschewed in favor of <em> and <strong>.
>Fixed-width web pages are _evil_, where by evil I actually mean _stupid_.
Depends on the content. If I'm reading a something text-heavy, I want the width of the page to be relatively small - I find it much more comfortable to have a vertical column of words.
> CSS to change colours and relative proportions is, I suppose, a concession that had to be made
> to 'designers', but when you, as the page author, are having to concern yourself with
> typography, then something has gone horribly wrong.
Also: nobody has to concern themselves with design. I'm sure you know that you can put up some semantic markup and expect UAs to figure it out, and they will. If you want to let browsers dictate the layout of your content, that's a doable thing. If you want to put some directives on top and tell the browser what fonts/colors/positioning etc you want, that's doable too. Where's the issue?
> Did these designers ever stop to think about blind people relying on text-to-speech? It's obvious
> how that should render <em> - with emphasis - but what does it do with "letter-
> spacing:110%;"?
> Fixed-width web pages are _evil_, where by evil I actually mean _stupid_.
While that may be an appealing ideal, particularly if you personally prefer to concentrate only on the content, I don't think complete separation can ever be possible.
Content should always be paramount, but the reality is that presentation does affect how that content is perceived. Presentation of text content can affect reading speed and retention. Presentation of graphical data can highlight useful patterns or it can obscure and mislead. In some cases, a minor adjustment to the content itself will give better results than changing the whole presentation: consider the editor who recommends slightly rewording an article rather than accepting a semantically awkward line break.
You can choose not to specify anything about your presentation, but that doesn't mean it's not there, only that you're going to get some default behaviour, which may or may not be any good for your content.
This does pose a genuine issue for those with disabilities, who may use assistive technologies to access the same content but not necessarily with the same visual styling. This is one good reason for marking up Web content using semantic HTML, and then applying visual styling as an extra layer of presentation on top: alternative tools, such as screen readers, can present the same information in different ways for audiences with differing needs.
As far as fixed-width pages being evil/stupid, I think as an industry we've grown beyond treating page layout as a dichotomy where it's either "fixed width" or "fluid layout". With the myriad devices used to access Web content today, neither a completely fixed-width layout nor a classical fluid layout with widths given using relative units or percentages is likely to be much good for all likely screen types. Thus we see the emerging field of responsive design, where content-rich sites specify multiple layouts (any of which might contain fixed and/or fluid elements) and choose between them based on screen resolution, device orientation, physical screen size/pixel density, and so on. We've even been seeing interesting research into responsive content recently, where more than just the layout adapts to give a better experience particularly to users of mobile devices with small screens and different browsing habits, though personally I think the jury is still out on that one. In any case, hopefully we are well past the days of either specifying a wide fixed width that doesn't work very well for smaller devices (or those who just prefer to browse in a relatively narrow window) or specifying no width at all and allowing text content to get far too wide to read comfortably on large screens.
Not caring about typography and how something looks is much like not caring about eye contact and tone of voice when talking to people: it is a bit autistic and generally doesn't help communication.
But as I said: I can understand where you are coming from. Most web design is terrible -- and the more money you spend on it, the worse it gets.
It's very much a UNIXy attitude, and ties in to ideas like "mechanism, not policy". If stylistic fashion changes, much simpler for the browsers to update their presentation mechanisms than for every website to redesign their CSS. Policy should be pushed as close to the user as possible - but the flipside is that the user shouldn't have to decide anything you can reliably deduce automatically; applying this with the web designer considered as the user of HTML, CSS etc is left as an exercise for the reader.
For example, text content should be dark, navigation and other stuff should be light or grey. Use simple icons that do not distract. Don't distract the user by large unrelated graphics or images. Don't use animated stuff if it's not related to the content (or monetizes the page). Keep everything around the main content simple and lighter than the main content.