WEB UI
the anatomy of
a website
Page headers
- miniature versions of the home page that sit atop each page and do many of the things that home pages do, but in a limited space.
- provides site identity and global navigation, with search and perhaps other tools.
- The exact location and arrangement of the components vary from site to site, but the overall design pattern has become fairly consistent.
Home link
- Placing your organization or site logo in the upper left corner of the page—and linking that logo to the home page—is a widely used convention and one you should adopt.
- If you are not using a logo or graphic in your header, at least put a “home” link near the upper left corner of the page, where 99 percent of users will expect to find it.
Layout
- Subdividing the page field into functional regions is a fundamental characteristic of modern graphic design.
Page Content
Page titles
- Don’t bury the lead. Every page needs a visible name near the top.
- For all kinds of logical, editorial, accessibility, search visibility, and common-sensereasons, use an <h1> heading at the top of the page to let users know what the page is about.
Breadcrumb navigation.
- The top of the content area is the most common location for breadcrumb navigation.
Breadcrumb navigation.
- The top of the content area is the most common location for breadcrumb navigation.
Search
- All sites with more than few dozen pages should offer local site search.
- The upper right area of the header is a popular location for search boxes, but a header search box must necessarily be simple to fit in this relatively small area
W
By Lea Sacdalan Abarentos
W
- 455