or every online teacher and trainer it might come as a surprise that their students and trainees read about 20% of their online material, often only scanning the pages for the information that pertains to their concerns. Despite the fact that more people are using the Internet in recent years, this behavior has remained consistent.
Today’s “Hot Topics Wednesdays” blog describes the findings of Dr. Jacob Nielsen who suggests that F-shaped pattern has been shown to be most effective for readers, as this is their natural reading pattern online. F-shape stands for “fast” and for the two horizontal stripes followed by the vertical stripe of reading. This means that:
- Users read the top first, often the top bar content.
- Users read below the top bar content to get a sense of the page.
- Users review the left side’s menu.
The following picture demonstrates this pattern:
Heatmap images that demonstrate F-shape pattern of reading online text
The picture above reflects heatmaps from user eyetracking studies of three websites. The areas red colors show most popular parts of the content; the yellow areas reflect fewer views, blue areas are least viewed, while gray areas did not demonstrate any eye fixations.
While this pattern does not match the reading patterns of all users, knowing where the reader will look for information can help you in writing and designing the web content of your online class. If you are not aware of the F-shaped pattern, this can lead to troubles with Web page use as readers might not read the content thoroughly, and leave out most important information.
Therefore, since readers might skip your content online, you should state the most important information in the first two paragraphs and start subheads, paragraphs and bulleted points with the information-carrying words that will be placed within the F-shape.
I hope these findings will help you design your online content to be more easily readible by your students.
I wish you a Fantastic, Fun, and Fascinating New Year!
What TO DO NOW:
In the comments below list any wishes that you have for this blog in the 2012!
If you liked this discussion, please subscribe to my blog to receive timely updates and you FREE Attention Grabber:
Spread the word, spread the love:
If you know of ANYONE who is looking for a job teaching online and will benefit from my e-guide please pass this information along.
Click on the picture for more information!
If you liked this article you may also like:
http://effectiveonlineteaching.org/2011/12/21/lessons-from-the-eye-movement-research-using-pictures-to-guide-learners-attention-online/-or-how-gamification-improves-your-online-classroom/



Very interesting and practical, thanks.
Muchas gracias, Paz! Me fascina estos resultos de “eye movement”:-)
Thank you! Very useful findings which can even be applied in a wider teaching context.
Thank you so much, Polechka! I am fascinated by the eye movement research myself:-)
This is really interesting! As you suggest, most of us are used to scanning pages for hypertext and other links; this transforms meaning construction and flow to a “hunt and click” process. On most webpages, we are looking more for paths of information than the traditional start to finish approach we use with a book or other print information. Since there seems to be an ingrained tendency to view pages in a certain predictable pattern, designers/online instructors need to be aware of how screen real estate is used, but I suspect there are a lot of other applications as well. For example, can we use this data to inform how we present information visually on a white board?
Mary, this would be a fascinating study! I do not really know myself as I have not conducted the experiment, but it would be definitely worth a shot! If you do something of this sort please let me know! Thanks so much for your comments.
Marina, thank you for your posts, they are informative.
I find this one interesting since many of the LMSs – Moodle, Bb for example – that I’ve used (as a student and teacher) have a lot of admin stuff on the left hand side, whereas blogs, comments, important dates we’ve put on the right hand side! I suppose one must balance the importance of where certain information is placed for the best impact/access.
Maybe this is why some of our students get their assignment due dates mixed up! More so it seems important announcements or updates are missed. Hmmm might be an interesting exercise to move the blocks around and see if there’s an improvement.
This is something to definitely think about, Ken! Let me know about your experiment! I would imagine this is true for most English speaking students. What about non-English speaking crowd? It would be nice to conduct research with those participants also
I have been looking at a variety of websites and ‘expanding’ my repertoire on many things. We’ve not updated our LCMS to Moodle 2.0 as yet (issues that only the IT guys know about!!), and its interesting to see the improvements that have been made which I think go a long way to supporting the idea of the F-pattern.
The ‘sidearms’ have gone from the page and now exist as tabs and so a lot of the ‘clutter’ I referred to in my initial post have been tidied up. Anything that reduces the brain/eye strain has got to be a bonus!!
As we implement the new version of Moodle I’ll be looking to ensure the F-pattern is used on the more detailed pages/links.
Ken,
I hear you! It is hard to update Moodle versions as it takes time and you need to have all people off the system to provide smooth transition. I hope this post helps you! I find these findings fascinating and would love to see more research of this sort!