As we continue to find ways to improve our school library websites, a previous post about library website design discussed reflecting on the focus and purpose of your school library web page. Click here to view the earlier post. Another step of a website review involves looking at layout or the placement of important items on your site. This could be a link, image, search bar, or other notable information. The placement of those items can influence how easily learners can locate needed information.
According to web design experts like Insivia, users have two patterns when scanning a web page, F-shaped pattern and Z-shaped pattern. F-shaped pattern works well with web pages that have a lot of text like a blog. Z-shaped pattern is great for minimal text web pages. Knowing this information, you can set up your page to place important items in the F or Z-shaped pattern to help a user’s eye find the most important items on your page.
F-Shaped Pattern Example
Z-Shaped Pattern Example
Example
I drew the Z-shaped pattern over my school library home page and noticed a large gap on the right side of the page. (See images below.) I reflected on the parts of the page that students had the most difficulty finding to determine my next step. I moved the search books widget to the top right corner.
Library web site before Z Shaped Analysis
Library web site after Z Shaped Analysis
Next Steps
Start with your school library home page and draw the Z Shaped or F Shaped pattern. Do you notice any gaps on your page according to F or Z Shaped pattern? If so, consider the following questions.
What are the most important items on your web page?
What do learners have difficulty finding on the web page?
How can you use this information to adjust placement of important items?
Additional Resources
Web page design: 3 steps every designer should follow: A quick read discussing the F and Z shaped patterns and more information about website design.
Your Blueprint for a Successful Saas Website Redesign: Additional information about layout including F and Z shape patterns.
Z Shaped Pattern Reading for Web Content: A blog post that discusses how users scan (versus read) a web page.
Author: Becca Munson
Becca Munson, Librarian, is a National Board Certified Teacher with over 23 years of experience in education. She is currently a school librarian at Blue Valley West High School in Overland Park, KS. Becca continues to find ways to positively impact student learning with literacy initiatives, technology integration, and building rapport with students and staff. Follow her on Twitter to view the library in action @bvwlibrary and @beccamunson .
Categories: Blog Topics, Technology
Leave a Reply