KAMİS
Navigation
Feedback on Waiting Time
Principle
In lengthy processes, users should be informed about which stage the process is at and provided with an estimated waiting time.
Description
Users often engage in multiple tasks simultaneously, making it necessary for them to be aware of the status of lengthy processes. Without information about when the process will be completed, users may prematurely leave a website or shift their focus to other tasks, resulting in time loss.
Guidelines
- In lengthy processes, users should be informed about which stage the process is at.
- Users should be informed about the waiting time during lengthy processes.
- Users should be given the option to cancel ongoing processes.
- For delays lasting 2 seconds or longer, a progress bar should be displayed, and for processes under 2 seconds, a clear visual indication should convey that the process is ongoing.
- For waiting times that could exceed 10 seconds, users should be provided with advance notice, and a confirmation message should be displayed upon process completion.
References
- ISO 9241-151 / 8.3.5 – Offering task-based navigation
- ISO 9241-151 / 8.3.6 – Offering clear navigation within multi-step tasks
Useful Resources
Significance Level
★★★★★ 4/5
Example
In the sample site, information about the completion of the process is displayed, and users are given the option to cancel the relevant process if desired.
Navigation in Multi-Step Processes
Principle
Horizontal scroll bars should not be used on websites.
Description
The use of horizontal scroll bars is discouraged because it can hinder users from fully grasping the content and make it difficult to view content on different screen types. When designing websites, it is recommended to avoid requiring horizontal scrolling and instead opt for flexible designs that can adapt to different screens. This issue often arises due to pages being developed in full-screen mode and not being adequately tested with smaller browser windows.
Guidelines
- The use of horizontal scroll bars should be avoided on web pages.
- During the development phase, the site should be tested with browser windows smaller than full-screen.
- Fluid design, with the use of CSS technology, should ideally allow switching between approximately three different design width modes for various screen sizes.
References
- ISO 9241-151 / 8.2.2 – Showing users where they are
- ISO 9241-151 / 8.3.5 – Offering task-based navigation
- ISO 9241-151 / 8.3.6 – Offering clear navigation within multi-step tasks
- ISO 9241-151 / 8.4.13 – Providing a “step back” function
Useful Resources
- –
Significance Level
★★★★★ 4/5
Example
In the sample site, a multi-step task clearly indicates the steps, where the user is in the process, and how many steps remain.
Dynamic Navigation Elements
Principle
Dynamically generated links should be distinguishable from static/unchanging links for users.
Description
Dynamic navigation elements are components that are generated dynamically based on the site's content or user parameters during each visit. With dynamic navigation elements, a website can offer users different links on each visit, depending on changing content or user profiles. However, it should be kept in mind that while dynamic navigation elements can facilitate access to changing content, they can also have negative impacts on the usability and accessibility of a website.
Guidelines
- If dynamic navigation elements are used on a website, they should be distinguishable from static elements.
- While there may be technical capabilities, the use of dynamic navigation elements should be done with care, focusing on functional necessity.
References
- ISO 9241-151 / 8.4.10 – Making dynamic navigation links obvious
Useful Resources
- –
Significance Level
★★★★★ 2/5
Example
In the sample site, dynamic navigation (on the left) is created for search results based on the user's search, providing dynamically generated links.
Texts with Excessive Links
Principle
Necessary measures should be taken to maintain readability in texts with excessive links.
Description
User reading behavior on the internet is different from that on paper. Therefore, measures are taken, especially in texts with numerous links, to ensure easy readability and comprehension.
Among these measures are grouping, numbering, tabulation, and so on. Grouping and numbering in lists of links will make it easier for users to find the information they are looking for and navigate more effectively between links. In websites with a large number of links, users' attention can easily be scattered. In such cases, multiple hierarchies can be preferred.
Guidelines
- In websites with an excessive number of links, grouping, numbering, tabulation, or the use of bullet points should be implemented.
- For each link, it is preferable to use an approach where users can perceive at first glance rather than the "Click here to access" approach.
References
- ISO 9241-151 / 9.4.15 – Avoiding link overload
Useful Resources
Significance Level
★★★★★ 3/5
Example
In the sample site, the links within the text are presented in a bulleted format.
Clear Statements in Navigation Elements
Principle
The naming of navigation elements should be in line with user expectations and guide user navigation.
Description
Users may not know on which page they can find the transaction or content they are looking for on a website. In such cases, navigation elements should assist and guide users.
Guidelines
- Navigation elements should be named in accordance with the page content.
- Misleading expressions should be avoided in the naming of navigation items.
- In navigation elements, technical terms, jargon, etc. that all users have difficulty in understanding should be avoided.
References
- ISO 9241-151 / 8.2.1 – Making navigation self-descriptive
- ISO 9241-151 / 8.3.4 – Organizing the navigation in a meaningful manner
Useful Resources
Significance Level
★★★★★ 4/5
Example
In the sample site, under the "Contests" heading, only subheadings related to contests are provided, ensuring ease of use.
Grouping Navigation Elements
Principle
Complex navigation elements should be grouped, summarized, and supported with visuals to make it easier for users to understand the entire structure.
Description
In websites with a complex hierarchical structure, organizing, summarizing, and visualizing the navigation structure can be beneficial for users to easily comprehend it. However, it should be noted that excessive efforts in this regard can become a challenging factor for user perception.
Additionally, it is recommended to include some navigation elements in different sections of the website. For instance, placing items like "About Us" and "Contact" found in the main menu at the bottom of all pages will facilitate users' navigation within the site.
Guidelines
- If the navigation structure includes multiple levels within a hierarchical system, the first two levels can be displayed when the website is initially opened to help users better understand the structure.
- Complex hierarchical navigation structures can be divided into different navigation components while maintaining logical relationships.
References
- ISO 9241-151 / 8.4.2 – Providing navigation overviews
- ISO 9241-151 / 8.4.6 – Making several levels of navigation visible
- ISO 9241-151 / 8.4.7 – Splitting up navigation overviews
Useful Resources
- –
Significance Level
★★★★★ 4/5
Example
In the sample site, under the "Digital Transformation in Turkey" heading, a different submenu is revealed. This submenu is visually distinct, both related to the "Digital Transformation in Turkey" section and separate from the main menu, enhancing usability.
Consistency in Navigation Elements
Principle
There should be consistency among navigation elements on the website.
Description
The consistent use of navigation elements on the website will facilitate the operations of the users and accelerate the learning process. This will be a factor increasing user satisfaction.
Guidelines
- Navigation elements' placement and appearance should be consistent across all pages of the website.
- There should be harmony between navigation elements and the content.
- The navigation element related to the displayed content should be prominently visible during navigation.
- The effort required to view navigation elements should be minimized whenever possible.
References
- ISO 9241-151 / 8.2.1 – Making navigation self-descriptive
- ISO 9241-151 / 8.3.4 – Organizing the navigation in a meaningful manner
- ISO 9241-151 / 8.4.4 – Consistency between navigation components and content
- ISO 9241-151 / 8.4.5 – Placing navigation components consistently
Useful Resources
Significance Level
★★★★★ 4/5
Example
In the sample site, it can be observed that navigation elements are consistently used across different pages.
Placement of Navigation Elements
Principle
Navigation elements on web pages should be consistently positioned in a way that is meaningful, visible, and reduces the effort users need to navigate.
Description
Navigation elements play a crucial role in facilitating the use of a website and allowing users to access the desired content quickly and easily. Therefore, the appropriate placement of navigation elements is a significant factor in improving the user experience.
Guidelines
- Navigation structures on pages should be designed to be meaningful for users, aligning with their perceptions and expectations.
- Main navigation elements should be continuously visible on the screen or, when they are not within the visible area, they should be positioned in a way that users can easily access them.
- Navigation structures within the site should be consistent and have similar design structures.
- The placement of navigation elements should enable users to navigate the site with minimal effort.
- A structure should be created in which a minimum number of navigation items can be clicked in order to complete an operation. However, if the operation to be performed is complex, it may be preferable for the navigation structure to consist of a large number of simple steps.
- Navigation structures on the website should be positioned in a way that distinguishes them from one another.
- The relationship between top and sub-level navigation elements should be visually distinct.
- User navigation can be facilitated by including the headings in the page collectively at the beginning of the page.
References
- ISO 9241-151 / 8.2.5 – Minimizing navigation effort
- ISO 9241-151 / 8.3.4 – Organizing the navigation in a meaningful manner
- ISO 9241-151 / 8.4.3 – Maintaining visibility of navigation links
- ISO 9241-151 / 8.4.5 – Placing navigation components consistently
Useful Resources
Significance Level
★★★★★ 5/5
Example
In the sample site, both horizontal and vertical navigation elements are utilized, and they are grouped using distinct colors for easy navigation.
Navigation Options
Principle
Different navigation options should be provided on websites, and navigation features should be included on all pages.
Description
A well-designed website is similar to a well-planned city. In addition to specific points, signs, directions, and other components, the structural design that aligns with a person's perception is also crucial for easy navigation.
Users tend to avoid planning and excessive use of their memory while navigating websites. They prefer to use the links presented as navigation elements on the current page. Users create a mental map by deducing the site's navigation structure, and they rely on this map while navigating the pages. To enable users to create these mental maps efficiently, the navigation structures on the website should be well-organized.
Guidelines
- Navigation elements on the website should be designed to be suitable for different user goals and easily understandable.
- Because initial visual cues for navigation are crucial, careful planning should be in place to provide visible cues for users to access all primary functions.
- Navigation elements should be created considering navigation structures such as content-based (based on the content of the pages), task-based (based on the purpose and complexity of tasks), or frequency-based (based on the frequency of page visits) as defined in the ISO 14915-2 standard. In goal-oriented navigation, guiding links should be used, and the navigation structure should be designed to facilitate easy recovery in case of mistakes.
- Cross-links to relevant content can be provided without creating link clutter on the pages.
References
- ISO 9241-151 / 8.2.3 – Supporting different navigation behaviours
- ISO 9241-151 / 8.3.2 – Choosing suitable navigation structures
- ISO 9241-151 / 8.3.7 – Combining different ways of organizing navigation
- ISO 9241-151 / 8.4.9 – Providing cross linking to potentially relevant content
Useful Resources
Significance Level
★★★★★ 4/5
Example
In the sample site, navigation elements are grouped based on their purposes and the tasks they are related to.
Hierarchical Depth and Breadth in Navigation Structures
Principle
The complexity of the navigation structure on a website should determine whether deep or wide navigation structures are preferred.
Description
Navigation structures consisting of a large number of levels with a small number of links at each level are called deep; navigation structures consisting of a small number of levels with a large number of links at the same level are called wide.
Guidelines
- Websites that are frequently used and involve transactions can have deep structures, while information-based websites that users do not visit regularly should employ a wide navigation structure.
- Complex websites with numerous links should use wide navigation structures.
- In websites with deep navigation structures, the number of links at each level should not overwhelm the user's perception, preferably not exceeding three levels of hierarchy and seven links at each level. If more links are required, they should be grouped.
- Deep navigation structures should pay attention to logical grouping and meaningful naming of links.
References
- ISO 9241-151 / 8.3.3 – Breadth versus depth of the navigation structure
Useful Resources
Significance Level
★★★★★ 4/5
Example
The example image displays wide (top) and deep (bottom) navigation structures.
Location Information (Where Am I?)
Principle
Users should be provided with information about where they are within the website.
Description
The famous tale of Hansel and Gretel introduced the concept of "breadcrumbs," which serves as a clue for users to retrace their steps or navigate within the hierarchy. Each item in the breadcrumb trail, except the page the user is on, should be clickable, positively impacting users' navigation within the website. Knowing which page they are on makes it easier for users to return to that page during their next visit.
Guidelines
- The last section of the hierarchical path in the breadcrumb trail should display the page users are currently on.
- The last section of the hierarchical path should not be clickable.
- Users should be able to click on links within this structure at any time to view higher-level pages.
- Breadcrumb trails should be visually distinguishable from other basic navigation components.
References
- ISO 9241-151 / 8.2.2 – Showing users where they are
- ISO 9241-151 / 8.4.12 – Going back to higher levels
Useful Resources
Significance Level
★★★★★ 4/5
Example
In the example website, users are provided with information about the page they are on, making it easier for them to understand their location within the site.
Pages Containing Only Links
Principle
In pages that consist solely of links, the design of these links should be understandable and distinguishable for users.
Description
Links within text are generally distinguishable from non-link portions of the text. However, when it comes to web pages that contain only links, the design of these links is of paramount importance.
Guidelines
- Links within a page should have a design that is immediately recognizable as links, in line with user perception.
- When users hover their cursor over a link, they should be able to tell from the changing style that it is clickable.
- Visited links should appear more worn or have a paler color tone than other links. Visual considerations should not compromise this principle.
- Considering different devices, links should provide sufficient clickable areas. White space (whitespace) can be included in link design when necessary.
- Attention should be paid to avoiding links that lead to incorrect pages or that are improperly written.
- If removing non-functional or underdeveloped links from the site is not feasible, they should be made recognizable as non-functional, and they should not be designed to appear clickable.
- Links that are excessively designed to arouse curiosity can lead users to perceive them as advertisements, so it's advisable to avoid such links.
References
- ISO 9241-151 / 8.4.16 – Avoiding “dead links”
- ISO 9241-151 / 8.4.17 – Avoiding incorrect links
- ISO 9241-151 / 9.4.3 – Distinguishing adjacent links from each other
- ISO 9241-151 / 9.4.8 – Highlighting previously visited links
- ISO 9241-151 / 9.4.15 – Avoiding link overload
Useful Resources
Significance Level
★★★★★ 3/5
Example
In the example website, the links are designed to be understandable and distinguishable.
Site Map
Principle
In complex internet sites, a sitemap should be provided.
Description
Public web pages often cater to a wide range of users and can have rich content and multi-layered navigation structures. Sitemaps are not frequently used by users but are often preferred by those who cannot find the page or content they are looking for on the website. Most importantly, sitemaps can be helpful for users when they feel lost within the site and are on the verge of leaving the website.
Guidelines
- In internet sites with rich content and multi-layered navigation structures, sitemaps should be used to make the structure easily understandable.
- The link to the sitemap should be placed where users can easily find it and should be labeled as "Site Map."
- Sitemaps should not strain users' understanding and should be kept as concise as possible.
- Sitemaps should be simple enough to be understood at a glance, or they can provide ease of navigation through a gradual display (accordion-style).
- Dynamic structure should be avoided in sitemaps; a simple and static structure should be used. Although the use of complex and innovative technologies may be preferred to facilitate access, it may reduce the accessibility of the page.
- Long pages that require scrolling should be avoided; multi-column structures should be used where possible, or grouping should be employed in a hierarchical manner when necessary.
References
- ISO 9241-151 / 8.4.8 – Providing a site map
Useful Resources
Significance Level
★★★★★ 3/5
Example
In the example website, the sitemap is prepared to be associated with the website's content.
Navigation on Long Pages
Principle
Navigation elements on long pages should be positioned in a way that users can easily access them.
Description
One of the greatest risks on long pages is that users may get lost within the page. The inability to understand where they are can make users uncomfortable and negatively impact the overall user experience. On such pages, it is essential to remember that users need to know their position within the page and access other navigation options.
Guidelines
- Pages with a lot of content should ideally be divided into multiple pages.
- If a page's content cannot be split, the page should be divided into sections with headings, and links to these headings should be provided at the top of the page.
- On long pages, navigation elements should be positioned in a way that users can always see them.
- Navigation elements should be easily accessible by users if they go off-screen.
- In long pages that use scroll bars, navigation elements can be placed at both the top and bottom of the page.
- Navigation elements on long pages should be positioned to prevent the misconception that the page has ended.
References
- ISO 9241-151 / 8.4.3 – Maintaining visibility of navigation links
- ISO 9241-151 / 8.4.14 – Subdividing long pages
Useful Resources
Significance Level
★★★★★ 3/5
Example
In the example website, links provide access to different sections of the content on a long page.
Timeout
Principle
On websites, users whose sessions are about to expire should be informed in advance that their session will be terminated.
Description
Websites that require users to log in with a username and password may terminate user sessions after a certain period of inactivity for security reasons.
Guidelines
- Session termination should be implemented after a detailed analysis, with the duration and scope determined accordingly.
- Session timeout warnings should not be displayed unnecessarily frequently or at inappropriate times.
- Users should be informed about the automatic session expiration time.
- Users should be provided with the option to extend their session.
- In special cases, the session timeout duration can be displayed as a live countdown to users.
References
- ISO 9241 9.3.5 – Visualizing temporal status
Useful Resources
Significance Level
★★★★★ 4/5
Example
In the example website, users are informed that their session will be automatically terminated. Users have the option to cancel the session timeout and continue using the system.