CSS Regions and free Flow of Text

Page content

But that’s not the only trade-off to consider when dealing with layout and design. HTMLbook is all about the semantics of a book’s content: authors and publishers define elements like chapters, figures, table of content etc. HTMLbook does not define how these elements are supposed to be displayed, i.e. does not say anything about layout or design. This is left to other technologies, one of which may be CSS. Let’s leave the topic of styling aside for now and focus on layout.

Bringing semantics and layout together to create pages

Suppose your document has three semantic elements: a body text (2), a kind of aside with some annotations (1) and a figure (3). As an author, let us assume you totally trust your designer and do not (currenty) care about the visual appearance of your semantic blocks. Your only concern is: the reader must have easy access to (1) and (3) when arriving at their reference points in (2).

A versed layouter has a good sense for how to place semantic entities to support the reader in understanding the document. Usually there are a whole lot of constraints when deciding about a layout, especially if output media are manifold. One thing has not changed very much over the centuries when talking about design and layout: we are thinking about the placement of boxes (or frames or whatever you want to call them). TeX and InDesign are all about boxes, HTML and CSS as well. We will have to create boxes somehow to do layout.Other concepts for layout have been tried, but so far have not been successful. Human brains seem badly suited for thinking in, e.g., constraints. And one should never forget: humans want to fiddle with visual details—it is in the genes of anyone having to do with design.

HTML/CSS lets you create boxes by the following means:

  • The user agent (browser) follows an algorithm for generating boxes for HTML elements (plus some anonymous boxes).
  • CSS may be used to alter the boxes and to generate some new ones (based on the existing ones).

From a designer’s point of view this is bad news: the creation of boxes—the things she most urgently cares about—is outsourced to an opaque machine. She is only allowed to do damage control afterwards, by writing brilliant CSS code to re-position the boxes. InDesign allows her to do the exact opposite: think about boxes first and then fill in the textual content like a liquid.TeX users are no strangers to boxes either, creating things like \hbox{…} and \vbox{…} And that is the trade-off here: maximizing designers’ control over the creation and placement of boxes versus keeping a strict separation of semantics and layout. HTMLbook emphasizes the latter, leaving it to systems like TySE to invent strategies for the former.

Spalten

Wer über Spalten nachdenkt, denkt automatisch über constrained ressources nach: entweder begrenzte Textmenge, oder begrenzten vertikalen Platz. Ein Kapitel komplett zweispaltig im Browser darzustellen, ohne den Fluss irgendwie in Abschnitte zu unterbrechen (Seiten), würde zu einem grotesken User-Erlebnis führen. Er müssten ganz nach unten scrollen, um dann für die nächste Spalte wieder ganz oben weiterlesen zu müssen.