6

When I was learning about web design, and I remember similar things from art classes, people said that the eye sees things the most on an object which are in a line from the top-left to bottom-right corners.

Is there a word or phrase for that line? I've heard "order of the occident" to refer to the order western text is written, but that's not really the same thing. Thanks to the thread on english.stackexchange, I now also know about a boustrophedon, which is is a line back-and-forth down the item in question.

It seems like there should be a term for this particular diagonal, but I can't find one.

3 Answers 3

5

There are a number of terms and models (only slightly different) that describe this. Personally I think you're better off simply referring to it as the natural reading order. The "shape" isn't really it's own thing, it's just a result of most Western languages reading right to left, top to bottom. We've applied this to the digital realm. In no small part thanks to Western influence in the creation of the early Web and computer technology in general, this reading order has become common even in Left to Right language websites or bilingual websites as a kind of default for layout of elements.

Vanseo Design's 3 Design Layouts offers three related terms to define this: The Gutenberg Diagram, Z-Pattern Layout and F-Pattern Layout. If you'll look, you'll realize they're really the same thing, visualized in superficially different ways. For what it's worth, more web design people will likely recognize F Pattern or F Shape but you'll get more design geek cred by calling it The Gutenberg Diagram. Again, if you're using plain English or conversing with users not designers, I'd strongly suggest referring to it as (natural) reading order.

No, reading isn't "natural" depending on your definition, but that doesn't really matter

1
  • The link to Vanseo Design explains what I wanted to know. Thank you for the reference, and summary.
    – Hydrangea
    Sep 14, 2012 at 22:06
4

As Matt Obee says, the Gutenberg Diagram is a great visualization of web users' habits, as is Jakob Nielsen's "F-pattern"

Gutenberg Diagram:

enter image description here

Jakob Nielsen's F-pattern heatmaps:

f-pattern

0
0

Might you be thinking of the Gutenberg diagram?

1
  • 1
    Please don't just link to somewhere else without actually answering the question. At the minimum you should summarise the link and then provide a link as the citation, not just the link on it's own.
    – JonW
    Sep 14, 2012 at 20:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.