Hacker News new | past | comments | ask | show | jobs | submit login
The secret law of page harmony (retinart.net)
88 points by hackermom on March 12, 2011 | hide | past | favorite | 12 comments



I've come across this before... Am I the only one who finds it awkward? It's unsettling to me... all the whitespace at the bottom of the page.... it feels like gravity is sucking the two text boxes up and into the crease.

And maybe part of it is that I've read thousands of books in my life, and I don't think I've EVER read one with this layout.

And this guy going on and on about the golden ratio and all this pointless geometric coincidences. It's like some weird fetish.

Now don't get me wrong, I fully appreciate the need for harmony in graphic design, and the importance of geometric relationships. I just think that some relationships are actually felt by the reader, and others are utterly invisible, un-feelable ones that people like this jerk off to.

[cringe]. I need to go look at something beautiful to get the taste of that out of my mouth.

Edit: I also think the golden ratio is bullshit, but that's another story...


Leaving more space at the bottom is a technique used to center things 'optically' in a page (the same thing happens when you draw letters like 'H' 'B' 'S'), this is also explained in Gestalt inspired analysis (Arnheim, etc.) Big side margins were used in manuscripts to allow for side notes, and sometimes in very dense typographic pages margins were filled with printed commentary (for example in religious books), like an heavy frame. Otherwise the big margins could be used for decoration (like in the 'medieval' revival of Morris's Kelmscott Press). To save space in cheap or small books margins becomes smaller and every margin should be set equal. Therefore the big margins setting is used to convey a meaning of magnificence (for example in Italy, Adelphi uses this pattern of big margins in the expensive books – it is consistent with their 'corporate identity' – and small margins for the pocket version).

The idea of a 'rule' looks like a modern interpretation of a phenomenon (indeed it is often attributed to Tschichold), The so-called Villard diagram itself is a modern interpretation of a small drawing found in his notebook.

The idea of the golden ratio as a perfect proportion, imho, is also a modern one. My understanding of the Renaissance is that they were interested in integer ratios, like 'musical' ratios (1/2, 3/4, 4/3, etc.)

[sorry for my english]


The golden ratio is not bullshit at all. It's just not scientific as such. But it works.


Wow...you....sound like such a graphic design hater. haha


I love good graphic design. I've actually never met an actual graphic designer who bought this shit. There are much more advanced theories of design harmony. This kind of stuff always seems to come from graphic design enthusiasts, not professionals.

It's like the CutCo of design theory. You're like "WHOA IT CAN CUT A TIN CAN IT MUST BE AWESOME" but pro chefs don't cut cans or use CutCo knives.


Excellently clear breakdown. Quite a nice read, and even a good skim (you can pick up nearly everything just by looking at the pictures and reading the intro paragraphs).

I think it really only applies to books which seek to be decorative objects as well as literature, however. The wide outside margin allows for side notes or decorative borders, and the bottom is similar to how pictures are matted for display in galleries - "heavier" bottoms have a subtle but important impact. It also creates room for detached footnotes or larger decorations. The thinner inside margins help keep text on a readable level due to the book binding techniques (remember, books were typically thicker when scribes did the work).

But without that decoration, I'm pretty sure the small blocks of black text would act as an optical illusion, making them appear smaller than they are. Without things filling those areas, I'd think it would make the book look empty, overly white-filled, rather than balanced.


The article seems to talk a lot about how to reproduce the guides, and how great they are.

It doesn't provide any context as to why these are supposedly such great guidelines to follow.


He does, but you have to read between the lines (so to speak). In graphic design, objects feel anchored when they have some strong relationship to the other objects on the page or to the placement on a series of pages. You could plop everything dead center and be done with it, but most designers would say that that's terrifically static and dull. Usually designers like to work with a grid pattern. But here he's also working the corner angles, to get a further relationship to the page elements that helps to anchor the content (in a subtle way) without being static and without looking arbitrary. Ultimately, the only thing that's important is that it's just a very pleasing structure.


I'm starting to love the typography of Edward Tufte's "The Visual Display of Quantitative Information." I'm loving it because unlike a lot of other texts I've read its margins provide room for very detailed notes. In a normal book if I wanted to sketch out an amazing proof, I wouldn't have the space, but his book has room for that and more.

You know what would suck? If people didn't have any idea that choosing one page design over another actually changed how there product would be used. Not that long ago there was an interview with Joel Spolsky on here where he pointed out that small differences could really change a community. This is just as true in books as it is in an internet application.

So there is no perfect page. There is no secret law. Your better off doing A/B testing than treating anything but the gospel as gospel.


What would the equivalent perfect text-centric (articles/blog posts) web layout look like?


I don't claim OP's design is perfect, but it's one of the very few sites that don't make me want to click on readability bookmarklet.


Most standard two-column layouts follow the golden ratio roughly. If you look at, for example, subtraction.com (a good place to steal layout inspiration from) it's 2 columns within 2 columns within 2 columns.




Consider applying for YC's Fall 2025 batch! Applications are open till Aug 4

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: