City as metaphor for visual aspects online design
Because Iâd been thinking about this article for some time, the aerial view of these cities struck me as an apt metaphor for grid design on the web. With todayâs technologies and techniques, we are free to create grid designsâor we can choose to break out of grids completely. That such choice can empower a web designer is unquestionable: the true challenge lies in the way we bring ourselves to âlose small mindâ? and think outside the grid.
An interesting metaphorical exploration of the visual and logistical aspects of web-design. Among other issues, it explores how the form (coding approach) has had an influence on meaning (visual representation of content).
Itâs fascinating to me, as a person who tends to be a bit more code-centric than design-capable, to see how cemented to code our designs have been. I believe itâs been the constraints of the table-based layout that have kept us in visual gridlock for so long (figure 5). Add that to an only-now emerging understanding of CSS layout and itâs easy to figure out the reasons why.
There are some advantages to table-based grids, but, as with the urban-planning metaphor, a strength can also become a weakness. Table-based grids allow us to ensure that all the cells within it work in tandem. Want all columns to stretch to the same size? We donât even think about howâitâs the natural behavior of tables. Want to apply even spacing between cells? Again, itâs a no-brainer. Of course, what if you donât want this one-size-fits all result? The answer is a painful one: you canât have it.
The author also touches on the maturity of the web as a whole.
CSS changes all that, and this is why I theorize, along with many others, that weâve not yet learned to design for the web. What weâre just beginning to understandâparticularly those of us who come to CSS layouts after years of working with tablesâis that the visual model for CSS is far more conducive to breaking out of the grid and designing for discrete, semantic elements. Perfect, no, for despite the gains made possible by CSS, we lose things too. Stretching columns is a decidedly problematic issue in CSS design, and cell spacing is too.
The CSS visual model is all lines and boxes. Thatâs the stuff of grids, right? Well sure, if we want it to be. This is where the fundamental difference is. CSS allows us to take a boxâany boxâand do with it what we want, independent of its surrounding boxes (Figure 7).