​​vvvvvvvSERP Design Research Notes
​​This page collects existing research regarding Search Engine Results Pages (SERP). The purpose of this page is to catalog existing UI patterns, gain an understanding of user expectations & UX on these type of pages, and inform our own design decisions.
​​
​​Table of Contents
  1. ​​The Search box
  1. ​​Search box features
  1. ​​Search box examples
  1. ​​Search box best practices
  1. ​​Search Control
  1. ​​Search control mechanisms
  1. ​​Search control best practices
  1. ​​Search results listings
  1. ​​Google rich snippet evolution
  1. ​​Search result (single)
  1. ​​Potential search result elements
  1. ​​Presenting structured data
  1. ​​A catalogue of Google rich snippets
​​
​​

​​The Search box

​​A text input field accompanied by a submit button. Search boxes are usually made up of at least two elements (input + button) but they are conceptually treated as a single unit, and can provide multiple features. Search queries themselves often contain special search operators that act as filtering mechanisms.
​​

​​Search box features

  • ​​search suggestions
  • ​​search query autocompletion
  • ​​Language picker / Primary Search Filter
  • ​​Placeholder text
​​

​​Search box examples

​​
 
User-uploaded image: seach-autocomplete-example.png
​​
​​
​​Google Autocomplete. 
​​With the helpful ‘press enter to search’ tip below. 
​​
​​
 
User-uploaded image: paul-smith-search-box.png
​​
​​
​​
​​
​​
​​Autocomplete with thumbnails and search suggestions.
​​Suggestions are divided into two groups
​​
​​Search Suggestions
​​Suggested Results
​​
​​Suggestions appear even before the user starts typing. 
​​http://www.paulsmith.co.uk/uk-en/shop/
​​
​​
 
User-uploaded image: Screen+Shot+2016-08-25+at+2.16.35+PM.png
​​
​​