Skip to main content

Smiley Cat

  • Home
  • Elements of Design
  • About
  • Contact

Elements of Design

Elements of Design is a collection of UI components that highlight best practices for particular design patterns from leading websites around the world. Browse the archives and use it as a source of inspiration for your next web design project.

Pull quote design gallery banner

Pull Quotes Design Gallery

June 18, 2016November 7, 2020 Christian Watson

Pull quotes — also known as block quotes or lift-out quotes — are a small selection of text that is pulled out and quoted in a larger typeface. They are a great way to attract attention to a particular point, especially in long articles.

Read More
Pages: 1 2 3 4
Breadcrumb trail navigation design gallery banner

Breadcrumb Navigation Design Gallery

June 18, 2016December 6, 2020 Christian Watson

Breadcrumb trail navigation is a series of text links that show where in a site hierarchy the current web page is located. A form of secondary navigation, breadcrumb trails give the user context for where they are located within a site, and provide shortcuts to quickly move higher up the site hierarchy.

Read More
Pages: 1 2 3
Login forms design gallery banner

Login Forms Design Gallery

June 16, 2016November 7, 2020 Christian Watson

Login form design is a critical component of web application usability. Successful login pages make it easy for registered users to gain access. They minimize the barrier to entry and provide options for users who are having difficulty logging in.

Read More
Pages: 1 2 3 4 5 6 7
Signup form design gallery banner

Registration Forms Design Gallery

May 29, 2016September 25, 2020 Christian Watson

Registration forms create a significant barrier for new users to access your product or service. Therefore, they should be designed to be as frictionless as possible in order to reduce user drop-off during signup.

Read More
Pages: 1 2 3 4 5 6 7 8 9 10
Website carousels design gallery banner

Home Page Carousels Design Gallery

May 29, 2016November 7, 2020 Christian Watson

Carousels are a popular way to showcase a variety of ‘featured’ content on a web site’s home page. By cycling through the different features they enable a large amount of content to be presented within a set physical space on the page.

Read More
Pages: 1 2 3 4 5 6 7 8 9
Mega menu design gallery banner

Mega Drop-Down Menus Design Gallery

May 29, 2016December 6, 2020 Christian Watson

Mega drop-down menus are characterized by large panels divided into groups of navigation options. By structuring navigation choices through the use of layout, typography, and icons, everything is visible at once which avoids the need to scroll.

Read More
Pages: 1 2 3 4 5 6 7 8

Posts navigation

Newer posts 1 … 4 5

Recent Posts

  • Easily Create iOS and Android App Store Badges
  • Abandoned Cart Email Copywriting that Brings Shoppers Back
  • How to Convert Popup Windows to Tabs in Google Chrome
  • Abandoned Cart Emails Design Gallery
  • Online Form Error Message Design Gallery

Categories

  • Web Design 157
  • Usability 100
  • Web General 98
  • Tools & Resources 90
  • Writing for the Web 59
  • Elements of Design 46
  • Real Life 46
  • Top Ten Lists 44
  • Blogging 43
  • Showcases 41
  • SEO 37
  • Ecommerce 36
  • Email 29
  • CSS 23
  • Web Analytics 18
  • Mobile 17
  • Reviews 16
  • Infographics 12
  • Product Management 4

Top Posts

  • How to Mass Delete All the Emails in a Folder in Gmail
  • Easily Create iOS and Android App Store Badges
  • Save Time and Effort With the Testimonial Generator
  • LinkedIn Recommendation Generators
  • Banner Ads Design Gallery
  • 30 Call-to-Action Examples that are Better than Learn More
  • Website Footers Design Gallery
  • Optimize Your CSS by Combining Classes

Popular Categories

  • Web Design 157
  • Usability 100
  • Web General 98
  • Tools & Resources 90
  • Writing for the Web 59
  • Elements of Design 46
  • Real Life 46
  • Top Ten Lists 44

You Should Follow Me

  • LinkedIn
  • Twitter
  • RSS
  • Instagram
© 2020 Christian Watson • Theme by Colorlib Powered by WordPress