Screen Density and Readability
|
The screen density is suitable for the target users and the activities they will be performing to enhance readability and usability.
|
|
The fonts and their sizes are legible and easy to read to ensure accessibility.
|
|
There is a good balance between information density and the use of white space to enhance readability.
|
|
Guided Layout and Navigation |
The layout guides the user's focus on the next action/step to ensure a smooth and intuitive user journey.
|
|
Every page has a clear visual starting point to guide the user's navigation.
|
|
The layout is consistent on all pages of the website and mobile application to provide a cohesive experience.
|
|
Above the Fold |
Important information, like commonly used features, appears on the first screen of all pages (above the first section) to improve efficiency.
|
|
Clickable Items and Controls |
Clickable items, such as buttons, are clearly recognizable as interactive elements to enhance usability and reduce ambiguity.
|
|
Non-clickable items do not possess attributes that may indicate they are interactive to prevent user confusion and frustration.
|
|
Buttons and controls have labels or designs that clearly indicate their intended function to improve user interaction.
|
|
Hyperlinked texts are readily identifiable (e.g., underlined) without requiring the user to search for them to ensure they are easily found.
|
|
The relationship between controls and their corresponding actions is clear and apparent to enhance user understanding.
|
|
GUI Components and Standard Elements
|
GUI components, such as checkbox buttons and checkboxes, are used appropriately and whenever necessary to ensure proper functionality.
|
|
Icons and graphics are standard and intuitive (i.e., recognizable and commonly understood) to improve user comprehension.
|
|
Standard elements such as page titles, site navigation, page navigation, privacy policy, etc., are easily accessible and recognizable to users for consistent navigation.
|
|
Visual Hierarchy and Emphasis |
The homepage design stands out from other pages, capturing user attention immediately.
|
|
A good visual hierarchy is established on the homepage, arranging elements by importance, making information easier to find.
|
|
Important topic categories are emphasized by using bold text or a slightly bigger font size than regular text to draw attention.
|
|
Color and Consistency |
The same font style is used throughout the website or mobile application to maintain visual consistency.
|
|
Colors are used to organize and group items on the page to enhance visual hierarchy.
|
|
The color scheme is visually harmonious, with an emphasis on avoiding complicated or distracting backgrounds, and complies with the color ratios of WCAG guidelines to ensure accessibility.
|
|
Consistent branding and visual style are maintained on all pages.
|
|
Print-Friendly and Accessibility |
The pages of the website and mobile application are print-friendly or have a printable version separately available for user convenience.
|
|
Avoid italicized text and reserve underlining solely for hyperlinked texts to prevent confusion.
|
|
Content pages have line lengths that are neither too short (less than 50 characters per line) nor too long (over 100 characters per line) to improve readability.
|
|
Layout and Structure |
The pages are designed using an underlying grid system to ensure proper alignment of items and widgets both horizontally and vertically for a structured layout.
|
|
Information and functions that are related are grouped together so that each group can be scanned in a single go to enhance user efficiency.
|
|
A web page is well-structured to assist users in locating each element on the user interface.
|
|
Icons and Graphics |
Icons are visually and conceptually distinct while remaining harmonious (clearly part of the same library) to ensure clarity.
|
|
Logo Placement and Branding |
Consistency in the placement of the organization's logo on every page is maintained, and clicking on the logo leads the user to the homepage to reinforce brand identity.
|
|
Attention-Grabbing Elements |
Attention-grabbing elements (such as animation, bright colors, and size differences) are used only when necessary to avoid overwhelming users.
|
|
Hyperlinked Texts |
Hyperlinked texts are readily identifiable (e.g., underlined) without requiring the user to search for them.
|
|