Open Text Search
Last updated: September 10, 2015 at 21:11 pm

The method by which users can search for specific content on the site, including the search box style and interactivity elements.


Visual example of the element:


What problem does this element or pattern solve?
Search should allow users to find a specific piece of content, answer a particular question, or fast-track users to a certain page as quickly and intuitively as possible.
It applies to these platforms:

Desktop Web, Tablet Web, Smartphone Web

An example of this element or pattern in production:


Detailed specifications

Specifications To Consider

  • Where will your open text search area be displayed? Best practices indicate it should be considered a global feature, and occupy a consistent location site-wide.
  • Will you offer auto-suggest or auto-complete functionality?
  • Is the user required to press a “submit” button to generate search results, or will hitting “enter” or “return” perform the same function? Or, will the results begin to dynamically update as the user types?
  • Will you use an external label which says “Search” or will the search label appear as ghost text within the text field itself? Be sure to confirm accessibility coding guidelines if you decide upon ghost text.
  • Fully define the size and visual styling for the all elements: input box, labels, keyword text, and trigger buttons.


Location of assets to build this element or pattern
Location of UX or visual design assets
Location of development code repository


Additional details
Information on research, user testing, or usability reports:

Not Applicable (Remember: no field should be blank!)

This element or pattern may also be known as:
search box, search field, search button, site search, text search
Related elements within this Style Framework:

Not Applicable (Remember: no field should be blank!)



Owners and governance
UX or design 0wner
John Designowner
Email: design.owner@yourcompany.com
Business or marketing owner
Mary Businessowner
Email: business.owner@yourcompany.com
Development owner
Mike Devowner
Email: development.owner@yourcompany.com


Other information
Please include any other relevant information about this element or pattern:
Not Applicable (Remember: no field should be blank!)


Comments & Questions

Leave a Reply