All Tips

The Perfect Header
The Perfect Header

The Perfect Header

hierarchy
ui
ux
visual effect
header

A good header needs to put attention on the title and then lead the reader to the description, which must be readable.

A few quick hacks to achieve this hierarchy include:

  1. Stronger font-weight for the title
  2. A consistent type scale system. The most common is x1.25, which means that if the title is 40px, the subtitle must be 40/1.25 = 32px.
  3. Lower contrast for the subtitle
  4. Proper line-height for the description text.
  5. Left alignment, since it boosts readability
←Previous Tip

Use Better Link Button

Links are important and you need to treat their appearance nicely. Many times a traditional button works better than a single link. Especially if the link is not on a header, footer, or the body of an article. Always make the copy actionable and hint at the action they initiate.

button
cta
ux
ui

Become a Better Designer.
The Fun way.

Join 100s of developers, entrepreneurs & junior designers who strive to become better in UI & UX design with byte-sized, practical tips & examples!

Get notified about new tips & articles before anyone else!

  • "

    I love these little tips. It’s like Dribbble but actually useful.

    Martin LeBlanc

    CEO of Iconfinder

  • "

    I love UX & UI tips. Especially, when they are practical and presented in a very good way. Yours are meeting both criteria.

    Lisa Dziuba

    Head of Marketing at Abstract

  • Logo

    Learn to design better User Interfaces with practical UI & UX tips

  • Projects

    MagicPattern

    BrandBird

    PH Launch Checklist

  • Popular Posts

    15 Practical UI Form Tips

Β©2021 . Made by Jim Raptis