"F 패턴 레이아웃“에 대해 알아보기로 합니다. F-레이아웃은 보는 사람의 시각적인 흐름을 강제하기보다는 많은 웹 사용자의 자연스러운 행동 및 과학적 연구에 기반하고 있습니다. 이 튜토리얼은 F-레이아웃의 원리 및 구현 방법 그리고 자신만의 웹사이트를 만들 수 있는 방법 등을 보여줄 것입니다.

F레이아웃에 대하여

F-레이아웃의 기초적인 개념은 다양한 시표추적(eye-tracking) 연구를 기반으로 하고 있습니다. 이러한 과학적 연구들은 웹사용자들이 화면을 볼 때 “F’ 패턴 – 대부분 화면의 상단, 좌측상단, 좌측면 등을 본 다음, 부득이한 경우에만 화면 오른쪽을 향해 시선을 움직인다는 것을 보여줍니다.

화면 왼쪽에 사이트의 가장 중요한 요소(브랜딩, 네비게이션 등)가 배치되어 있는 웹사이트 디자인은 이러한 시표추적 연구들의 주장을 입증하고 있습니다.

.... (생략)


Today we’re going to examine the “F Pattern Layout”. Rather than trying to force the viewer’s visual flow, the F-Layout gives in to the natural behaviors of most web surfers and it uses scientific studies to back it up. This tutorial will walk you through the principles of the F-Layout, why it works, and how you can create your own.

The F-Layout relies upon various eyetracking studies for it’s foundational concept. These scientific studies show that web surfers read the screen in an “F” pattern – seeing the top, upper left corner and left sides of the screen most… only occasionally taking glances towards the right side of the screen. These eyetracking studies argue in favor of placing the most important elements of your site (branding, navigation, call to action) on the left side of the design.

글  Brandon Jones 

[원문보기] http://webdesign.tutsplus.com/articles/design-theory/understanding-the-f-layout-in-web-design/