Scanning a page - Revision history

Kirabug at 18:47, 1 June 2020

2020-06-01T18:47:48Z

← Older revision		Revision as of 11:47, 1 June 2020
Line 1:		Line 1:
			[[Category: Design]]
	When users initially visit a page, their first action (generally unconsciously) is to scan the page to confirm that it has what they're expecting it will have, and understand the page's content.		When users initially visit a page, their first action (generally unconsciously) is to scan the page to confirm that it has what they're expecting it will have, and understand the page's content.

Kirabug at 18:45, 1 June 2020

2020-06-01T18:45:33Z

← Older revision		Revision as of 11:45, 1 June 2020
Line 1:		Line 1:
	~~<div class="sc-kPVwWT ebJGjp"><div class="ak-renderer-document"><p data-renderer-start-pos="0">~~When users initially visit a page, their first action (generally unconsciously) is to scan the page to confirm that it has what they're expecting it will have, and understand the page's content.~~ </p><p data-renderer-start-pos="197">~~Users generally employ an~~ <a class="sc-kIPQKe gRuEgX"~~ href="http://uxmag.com/articles/the-f-pattern-understanding-how-users-scan-content" ~~title="http://uxmag.com/articles/the-f-pattern-understanding-how-users-scan-content"><u>~~F-pattern for scanning a page~~</u></a>~~, which is to say they start at the top of the page and scan all the way across, then move down the left edge, occasionally darting slightly to the right for more information. </p><div class="media-single image-center sc-kfGgVZ fUfchs sc-gzOgki eXInRU" width="1200" data-node-type="mediaSingle" data-layout="center"><div class="sc-boHNyh jfWTVQ"><div class="sc-fgITWd hrJxle" data-testid="media-card-view"><div class="sc-kDkoGq lXGOL sc-gXPbch hxUyHf" data-testid="media-file-card-view" data-test-media-name="http://uxmag.com/sites/default/files/Uxmag-articles/2017-articles/F-Patterns/img/moyers-fpattern/f-frame-design-1.jpg" data-test-status="complete"><div class="wrapper"><div class="img-wrapper"><img class="sc-hBAczQ fQGYhq" data-testid="media-image" draggable="false" src="http://uxmag.com/sites/default/files/Uxmag-articles/2017-articles/F-Patterns/img/moyers-fpattern/f-frame-design-1.jpg" style="transform: translate(-50%, -50%); width: 100%;"></div></div></div></div></div></div><p data-renderer-start-pos="433"><em>Image from T</em><a class="sc-kIPQKe gRuEgX" href="http://uxmag.com/articles/the-f-pattern-understanding-how-users-scan-content" title="http://uxmag.com/articles/the-f-pattern-understanding-how-users-scan-content"><em><u>he F Pattern: Understanding How Users Scan Content</u></em></a></p><p data-renderer-start-pos="497">Because we know that users' eyes will follow the left edge of the page, we want to make sure that critically important information such as headers are left-aligned.~~ </p><p data-renderer-start-pos="664">~~We can also use this as a guide to prioritizing content. Most important content at the top, least at the bottom, but within that, most important to the left, least important to the right. So the bottom right corner is the perfect place to put the thing someone with more authority than you insisted you had to put on your page even though nobody's going to use it. It's also a good place to put something that only a limited number of users need (such as the support staff) because they can learn where it is and everyone else will automatically ignore it.~~ </p></div></div>~~		When users initially visit a page, their first action (generally unconsciously) is to scan the page to confirm that it has what they're expecting it will have, and understand the page's content.

			Users generally employ an [href="http://uxmag.com/articles/the-f-pattern-understanding-how-users-scan-content" F-pattern for scanning a page], which is to say they start at the top of the page and scan all the way across, then move down the left edge, occasionally darting slightly to the right for more information.

			Because we know that users' eyes will follow the left edge of the page, we want to make sure that critically important information such as headers are left-aligned.

			We can also use this as a guide to prioritizing content. Most important content at the top, least at the bottom, but within that, most important to the left, least important to the right. So the bottom right corner is the perfect place to put the thing someone with more authority than you insisted you had to put on your page even though nobody's going to use it. It's also a good place to put something that only a limited number of users need (such as the support staff) because they can learn where it is and everyone else will automatically ignore it.

Kirabug: Created page with "
When users initially visit a page, their first action (generally unconsciously)..."

2020-06-01T18:41:58Z

Created page with "<div class="sc-kPVwWT ebJGjp"><div class="ak-renderer-document"><p data-renderer-start-pos="0">When users initially visit a page, their first action (generally unconsciously)..."

New page

<div class="sc-kPVwWT ebJGjp"><div class="ak-renderer-document"><p data-renderer-start-pos="0">When users initially visit a page, their first action (generally unconsciously) is to scan the page to confirm that it has what they're expecting it will have, and understand the page's content. </p><p data-renderer-start-pos="197">Users generally employ an <a class="sc-kIPQKe gRuEgX" href="http://uxmag.com/articles/the-f-pattern-understanding-how-users-scan-content" title="http://uxmag.com/articles/the-f-pattern-understanding-how-users-scan-content"><u>F-pattern for scanning a page</u></a>, which is to say they start at the top of the page and scan all the way across, then move down the left edge, occasionally darting slightly to the right for more information. </p><div class="media-single image-center sc-kfGgVZ fUfchs sc-gzOgki eXInRU" width="1200" data-node-type="mediaSingle" data-layout="center"><div class="sc-boHNyh jfWTVQ"><div class="sc-fgITWd hrJxle" data-testid="media-card-view"><div class="sc-kDkoGq lXGOL sc-gXPbch hxUyHf" data-testid="media-file-card-view" data-test-media-name="http://uxmag.com/sites/default/files/Uxmag-articles/2017-articles/F-Patterns/img/moyers-fpattern/f-frame-design-1.jpg" data-test-status="complete"><div class="wrapper"><div class="img-wrapper"><img class="sc-hBAczQ fQGYhq" data-testid="media-image" draggable="false" src="http://uxmag.com/sites/default/files/Uxmag-articles/2017-articles/F-Patterns/img/moyers-fpattern/f-frame-design-1.jpg" style="transform: translate(-50%, -50%); width: 100%;"></div></div></div></div></div></div><p data-renderer-start-pos="433"><em>Image from T</em><a class="sc-kIPQKe gRuEgX" href="http://uxmag.com/articles/the-f-pattern-understanding-how-users-scan-content" title="http://uxmag.com/articles/the-f-pattern-understanding-how-users-scan-content"><em><u>he F Pattern: Understanding How Users Scan Content</u></em></a></p><p data-renderer-start-pos="497">Because we know that users' eyes will follow the left edge of the page, we want to make sure that critically important information such as headers are left-aligned. </p><p data-renderer-start-pos="664">We can also use this as a guide to prioritizing content. Most important content at the top, least at the bottom, but within that, most important to the left, least important to the right. So the bottom right corner is the perfect place to put the thing someone with more authority than you insisted you had to put on your page even though nobody's going to use it. It's also a good place to put something that only a limited number of users need (such as the support staff) because they can learn where it is and everyone else will automatically ignore it. </p></div></div>

Scanning a page - Revision history

Kirabug at 18:47, 1 June 2020

Kirabug at 18:45, 1 June 2020

Kirabug: Created page with "When users initially visit a page, their first action (generally unconsciously)..."

Kirabug: Created page with "
When users initially visit a page, their first action (generally unconsciously)..."