Suggest Integration Best Practices
Summary
This article outlines key recommendations and ideas to help effectively integrate FactFinder Suggest module. By implementing these best practices the user search experience can be significantly enhanced, leading to quicker product discovery and increased customer satisfaction.
While these are general guidelines, specific shop's needs and domain should considered to determine which practices will provide the most benefit.
Enhancing User Experience and Usability
The primary goal of Suggest is to make searching easier and faster. Focus on intuitive interaction:
Support multiple selection methods (keyboard & mouse) - allow customers to easily select suggestions using both mouse clicks and keyboard arrow keys (up, down, enter). This caters to different user preferences and improves accessibility.
Clearly highlight the current selection - the currently focused suggestion should be visually distinct (e.g., using a contrasting background color or bold text). This provides clear feedback to the user as they navigate the list.
Emphasize the matching part of the search term - within each suggestion, highlight the characters or words that match what the user has already typed. This visually reinforces relevance and helps users understand why a particular suggestion is being offered.
Offer autocomplete for the top suggestion - to further streamline the search process, consider automatically completing the search input field with the most relevant suggestion. Users can then typically press the 'Tab' or 'Enter' key to accept this autocompleted term, saving keystrokes.
Optimizing Visual Design and Layout
A seamless integration into your existing shop design is crucial for a professional look and feel:
Maintain a unified color scheme - the Suggest dropdown should harmonize with your shop's overall color palette and branding. A consistent visual design creates a cohesive and trustworthy user experience.
Ensure seamless alignment with search box - minimize any visual gap between the search input field and the top of the suggestions list. The suggestions should appear as a direct extension of the search box for a clean, integrated look.
Leveraging Functional Enhancements and Behavior
Utilize preview images wisely - if product imagery is clear and relevant at a small scale, displaying preview images within the suggestion list can significantly aid visual recognition. Typically, the first product image associated with the search term is used. For brand suggestions, brand logos (managed via a whitelist if necessary) can be effective.
Images increase the overall size of the suggestion dropdown, potentially reducing the number of visible suggestions. Balance visual appeal with information density.
Integrate non-product suggestions (meta content) - FactFinder Campaign Manager can be used to direct users to relevant content pages (e.g., terms and conditions, legal disclaimers, buying guides, catalogue order pages) based on specific search terms. To ensure these terms appear as suggestions, even if not directly product-related, they should be added via the appropriate whitelist.
Implement direct navigation for specific Suggestion types - by default, selecting a suggestion executes a search for that term. If a suggestion is clearly a specific product name, consider linking directly to that product's detail page. For category or brand suggestions navigate the user directly to the corresponding landing page or a pre-filtered search results page. These advanced behaviors are often configurable within FactFinder response templates (e.g., block response). For custom implementations or different response variants, FactFinder account manager should be consulted.
Prioritizing Performance
Aim for rapid Suggestion display - suggestions should appear almost instantly as the user types. Delays can frustrate users and negate the benefits of the feature. Optimize data retrieval and rendering.
Balance the number of Suggestions - avoid overwhelming users with an excessively long list of suggestions. Display a concise, relevant set (e.g., 5-10 suggestions) that prioritizes the most likely matches. Too many choices can be as unhelpful as too few.
Visual Examples of Suggest Implementation
Last updated
Was this helpful?