Kitchen Unit Product Listing
The interface uses a clean, organized layout with clear visual hierarchy and consistent typography, making it easy to scan product options and understand the process. However, it could improve by adding more interactive filtering options and enhancing the contrast and padding around text for better accessibility and readability.
Public
Design Score
Polish Opportunities
Design Perspectives
0To Review
Recommended Fixes by Impact
0Total
Fixes by Category
2
Color & Contrast3
Content Readability & Clarity4
Visual Consistency, Imagery & Media1
Navigation & Structure1
Conversion & Actions2
Tone, Friendliness & Delight2
Accessibility & Input Ergonomics3
Efficiency & Cognitive Load2
Flow & States Completeness2
Strategic DesignRecommended Fixes by Impact
0Critical
1Major
15Moderate
7Minor
Primary Action Button Placement Conflicts with Main Goal
Major
Strategic Design
The Problem
The homepage calls for requesting a quote as the primary action but also presents multiple competing CTAs such as browsing sink units, which can dilute user focus and slow goal completion.
Why it Matters
Users may hesitate or get confused about the next step, reducing conversion rates for quote requests which appear to be a key user goal.
How to Fix
Prioritize and clarify the main conversion path by making the primary call-to-action more prominent and reducing or secondary CTAs that compete with it visually and contextually.
Issue Highlights
Mismatch in Button Styles Between Header and Hero Section
Moderate
Visual Consistency, Imagery & Media
The Problem
The 'Request a quote' button style in the navigation header uses an outline style, while the same call-to-action button in the hero section uses a filled dark blue background. This inconsistency could confuse users about button importance or interaction.
Why it Matters
Inconsistent button styles can create uncertainty about which actions are primary or secondary, making navigation less intuitive.
How to Fix
Standardize the call-to-action buttons across the site, using consistent color fills, outlines, and hover states.
Issue Highlights
Text Blocks in 'How It Works' Section Not Vertically Aligned
Moderate
Visual Consistency, Imagery & Media
The Problem
The three explanation boxes in the 'How It Works' section are not perfectly aligned horizontally. The text and numbering within the middle box appear visually off compared to the other two.
Why it Matters
Misaligned content reduces readability and aesthetic consistency, making the instructions harder to follow.
How to Fix
Align the text and numbering within all three boxes to a consistent baseline and spacing grid.
Issue Highlights
Low contrast for primary paragraph text
Moderate
Color & Contrast
The Problem
The paragraph text below headings appears to be a dark gray on an off-white background. The contrast is likely below WCAG AA standards for normal text due to the light background and medium gray text color.
Why it Matters
Users with low vision or color vision deficiencies may have difficulty reading the paragraph text, reducing content accessibility.
How to Fix
Increase the text color darkness to achieve a contrast ratio of at least 4.5:1 against the background, or darken the background while keeping text color constant.
Issue Highlights
No Clear Active State in Primary Navigation
Moderate
Orientation Missing (Environment/Role/Location)
The Problem
The top navigation bar lists main links (Home, Belfast Sink Base Units, Guides, How it works, About) but only 'Home' is underlined as the active page. The other links show no active styling or contextual highlight to indicate their state clearly.
Why it Matters
Users might get confused about which section of the site they are on, affecting their ability to understand the site's structure and orientation.
How to Fix
Implement consistent active state styling for all navigation items, such as underlining or color changes, to clearly show where the user is within the site.
Issue Highlights
Primary CTAs labeled with vague terms 'Request a quote' and 'Browse Belfast Sink Base Units'
Moderate
Conversion & Actions
The Problem
The main actionable buttons use labels like 'Request a quote' and 'Browse Belfast Sink Base Units' which are somewhat descriptive but could be more specific regarding the exact next action or benefit. This can cause uncertainty about what the user can expect after clicking.
Why it Matters
Vague CTAs can reduce user confidence and lower conversion rates as users hesitate or abandon tasks when unsure what will happen next.
How to Fix
Refine CTA labels to be more action- and benefit-focused, such as 'Get Your Custom Kitchen Quote Now' or 'Explore Belfast Sink Base Options'. Adding microcopy or tooltips can help clarify.
Issue Highlights
Missing trust signals near 'Request a quote' buttons
Moderate
Tone, Friendliness & Delight
The Problem
The 'Request a quote' buttons invite users to submit inquiries involving potentially sensitive details like sink size, room layout, or delivery area, but there are no trust signals or privacy reassurances visible near these calls to action.
Why it Matters
Users might hesitate to share personal or business details without clear trust signals, which can reduce conversion rates or cause anxiety about data privacy.
How to Fix
Add concise privacy assurances or trust badges near the 'Request a quote' buttons, such as 'Your data is protected' or a link to a privacy policy to build user confidence.
Issue Highlights
Small clickable text links in top navigation
Moderate
Accessibility & Input Ergonomics
The Problem
The navigation links such as 'Home', 'Guides', 'How it works', and 'About' in the top bar use relatively small font sizes and have minimal padding, likely making their tap targets smaller than the recommended minimum of 44x44 pixels.
Why it Matters
Small tap targets increase the chance of user error and frustration, especially for users with motor impairments or those on touch devices.
How to Fix
Increase padding around each navigation link to ensure tap targets meet or exceed 44x44 pixels and consider increasing font size slightly for better readability.
Issue Highlights
Duplicate navigation buttons for requesting a quote and browsing units
Moderate
Efficiency & Cognitive Load
The Problem
The page contains two separate areas with identical 'Request a quote' and 'Browse Belfast Sink Base Units' buttons, leading to unnecessary repetition of action points.
Why it Matters
Repeated action buttons force users to process the same choices multiple times, increasing cognitive load without added benefit.
How to Fix
Consolidate the repeated action buttons into a single, clearly visible section to reduce visual clutter and simplify decision-making.
Issue Highlights
Homepage Lacks a Distinctive Hero Message
Moderate
Strategic Design
The Problem
The top section includes a generic headline and image with minimal branding or emotional appeal, making it less likely to captivate or differentiate from competitors quickly.
Why it Matters
Users are less likely to form a clear impression or feel motivated to engage immediately when the hero section does not create a memorable moment or distinct value proposition.
How to Fix
Enhance the hero area with a stronger, benefit-driven headline and more visually compelling imagery or design elements that highlight uniqueness or key user benefits.
Issue Highlights
Section headings lack visual distinction
Moderate
Content Readability & Clarity
The Problem
Section headings such as 'START HERE', 'BELFAST SINK UNITS', and 'NEED HELP CHOOSING THE RIGHT UNITS?' are all in uppercase and similar font weight with body text nearby without strong size or style contrast, making it harder to visually separate sections at a glance.
Why it Matters
Users may find it more difficult to quickly scan and understand the structure and importance of different content sections.
How to Fix
Increase font size and weight difference for section headings or add color differentiation to create clearer visual hierarchy.
Issue Highlights
Ambiguous labeling of navigation links with similar wording
Moderate
Content Readability & Clarity
The Problem
The navigation includes both 'Belfast Sink Base Units' and 'Browse Belfast Sink Base Units' buttons/links, which are very similar in label phrasing and may confuse users about different destinations or actions.
Why it Matters
Users might hesitate or get confused when choosing between similar labels, leading to reduced navigation efficiency.
How to Fix
Use clearer, more distinct labels that differentiate the navigation from call-to-action buttons, such as 'View Belfast Sink Base Units' vs 'Request a Quote'.
Issue Highlights
Primary Navigation Links are Very Close Together
Moderate
Navigation & Structure
The Problem
The primary navigation links have minimal horizontal spacing and small font size, which may cause click target crowding especially on desktop and larger screens.
Why it Matters
User may find it hard to accurately click navigation links, resulting in frustration or accidental clicks on wrong links.
How to Fix
Increase horizontal spacing and padding around navigation links to create distinct, easy-to-click targets.
Issue Highlights
Top navigation links are spaced too closely
Moderate
Accessibility & Input Ergonomics
The Problem
The text links in the top navigation bar are placed with minimal horizontal space between them, increasing the likelihood of users accidentally tapping or clicking the wrong link.
Why it Matters
Insufficient spacing between clickable elements can cause input errors, especially on touchscreens where finger size affects precision.
How to Fix
Increase horizontal spacing between top navigation links to at least 8-10 pixels apart to reduce accidental taps.
Issue Highlights
Unclear action after browsing Belfast sink base units
Moderate
Flow & States Completeness
The Problem
The page provides product listings and guides but lacks clear instructions or highlighted primary actions beyond browsing and requesting a quote. After viewing product details or guides, it is not clear what the next step is to proceed with the purchase or inquiry process.
Why it Matters
Users may feel uncertain about how to continue the process after browsing products or reading guides, which could cause hesitation or drop-off.
How to Fix
Add clear, persistent calls to action or progress indicators guiding users from browsing to requesting a quote or confirming specifications, ensuring a smooth flow.
Issue Highlights
Multiple 'View range' links for product categories without clear primary action
Moderate
Efficiency & Cognitive Load
The Problem
Each product category (Belfast Sink Base Units, Matching Kitchen Units, Sinks, Taps and Accessories) has a 'View range' link but no indication which one users should start with or prioritize.
Why it Matters
Presence of multiple similar decision points without hierarchy could confuse users about the best next step, increasing cognitive load and potentially reducing completion rates.
How to Fix
Add guidance or prioritize one action, visually emphasize recommended path, or combine categories for simpler navigation.
Issue Highlights
Misalignment of Main Navigation Links Relative to Logo
Minor
Visual Consistency, Imagery & Media
The Problem
The main navigation menu links appear slightly misaligned vertically with the logo above, disrupting visual harmony and balance in the header area.
Why it Matters
Misalignment reduces visual polish and can make a site feel less professional.
How to Fix
Adjust vertical positioning and spacing so that navigation links and logo align on a consistent baseline or centerline grid.
Issue Highlights
Unlabeled View Range Links
Minor
Visual Consistency, Imagery & Media
The Problem
The 'View range' text links appear multiple times across sections, but their function is ambiguous as no icon or additional label clarifies their purpose or destination.
Why it Matters
Ambiguous interactive elements increase cognitive load and may confuse users about the next steps or functionality available.
How to Fix
Add icons or tooltip labels clarifying these links, or rename them to clearer calls to action indicating their destination or function.
Issue Highlights
Low contrast for link text in navigation bar
Minor
Color & Contrast
The Problem
The navigation menu links, such as 'Belfast Sink Base Units', 'Guides', and others, appear as medium gray on a white background, which may not meet the contrast threshold for accessibility.
Why it Matters
Users with low vision or in low-light conditions may struggle to identify and read navigation links, impacting site usability.
How to Fix
Use a darker text color for navigation links or increase the background contrast behind the links to ensure text meets at least 4.5:1 contrast ratio.
Issue Highlights
Body text in informational boxes may be too small
Minor
Content Readability & Clarity
The Problem
Body text inside the 'HOW IT WORKS' steps and item descriptions appears to be small and tightly spaced, potentially below optimal size for comfortable reading on desktop.
Why it Matters
Users may experience reading fatigue or miss details due to small font size and dense text.
How to Fix
Increase the font size slightly and add line spacing to improve readability in these areas.
Issue Highlights
Multiple large sections with similar layout reduce distinctiveness and increase scan time
Minor
Efficiency & Cognitive Load
The Problem
The page uses repeated boxed panels with product categories and large images that visually blend, making it harder for users to quickly distinguish content hierarchy.
Why it Matters
This visual repetition can cause users to spend more time scanning the page and differentiating sections, increasing cognitive load.
How to Fix
Introduce more distinctive styling, spacing, or visual cues to clearly separate sections and reduce uniformity.
Issue Highlights
Missing empty state guidance for Matching Kitchen Units and Accessories sections
Minor
Flow & States Completeness
The Problem
Sections for Matching Kitchen Units and Sinks, Taps and Accessories display some introductory text but no products or items visible in the screenshot, and no empty state guidance or calls to action are shown to direct users on what to do next.
Why it Matters
Users encountering these empty sections may be confused about availability or necessary next steps, resulting in user confusion or reduced engagement.
How to Fix
Provide clear messaging or actionable links in these sections addressing the absence of items or suggesting next steps such as browsing other categories or contacting support.
Issue Highlights
Unclear claim about 'checked before quote' in product descriptions
Minor
Tone, Friendliness & Delight
The Problem
The product description for Belfast Sink Base Units includes the phrase 'checked before quote' which may be misinterpreted or lacks clarity about what is being checked and how that benefits the customer.
Why it Matters
Unclear claims can reduce trust and create confusion, making users unsure about the reliability or quality assurance process.
How to Fix
Clarify the statement with additional context, e.g. 'All units undergo a quality check before you receive a quote to ensure compatibility and accuracy.'
Issue Highlights