W3C home > Mailing lists > Public > www-style@w3.org > March 2009

Re: layout idea

From: Bert Bos <bert@w3.org>
Date: Mon, 16 Mar 2009 21:01:12 +0100
To: www-style@w3.org
Message-Id: <200903162101.13080.bert@w3.org>
On Friday 13 March 2009, Jonathan Snook wrote:
> I've spent a little time over the past week working on an idea. I
> don't know if it's viable or not or whether something like it has
> already been proposed (besides Advanced Layout and the Grid module).
> But it never hurts to pitch my own stone into the pond.
>
> Matrix Layouts:
> http://snook.ca/technical/matrix-layouts/
>
> Along with the accompanying blog post:
> http://snook.ca/archives/html_and_css/matrix-layouts
>
> Good or bad, I look forward to some feedback.

Interesting idea, and well presented.

I thought a bit in the past about using numerical coordinates (x,y) 
instead of letters in the Template Layout module, because coordinates 
are, after all, the first thing you think of when you need to put 
something in a matrix. But I decided I preferred the letters:

  + letters are shorter (one letter vs two digits and a separator)
  - but only a limited supply of letters (up to a few thousand if you
    read Chinese)
  + easy to add a row or column, no need to renumber
  + can reserve a "magic" letter (@) for the default slot
  + accidentally overlapping slots is impossible
  + possibility in the future of non-rectangular slots
  + no need to count
  + can change the layout by changing just the matrix, no need to change
    the 'position' properties on other elements (useful in combination
    with Media Queries)
  + easier to combine with the '::slot()' pseudo-element

Defining matrices explicitly rather than implicitly (as in your 
proposal) has advantages, too, because it provides a place to put 
information about the matrix:

  + how many rows and columns are there (implicit in your case, which
    may be an advantage as well as a problem, e.g., for understanding
    the style sheet)
  + what is the height and width of slots (your syntax allows multiple
    conflicting widths and heights, even impossible ones)
  + any (re)sizing policies, fixed, flexible, levels of flexibility,
    percentage size... (not sure what your system allows)
  + self-documenting: the "ASCII art" serves as a diagram of the
    intended layout (some people do not like this, not sure why)
  + another magic letter (.) documents explicitly unused slots

Attaching a matrix to an element also allows a variation: attaching a 
matrix to an @page rule. In paged media you can thus have matrices that 
are the size of a page and repeat on each page.



Bert
-- 
  Bert Bos                                ( W 3 C ) http://www.w3.org/
  http://www.w3.org/people/bos                               W3C/ERCIM
  bert@w3.org                             2004 Rt des Lucioles / BP 93
  +33 (0)4 92 38 76 92            06902 Sophia Antipolis Cedex, France
Received on Monday, 16 March 2009 20:01:57 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:17 GMT