Tiny Headers and Website Navigation Bars

Featured Image credit to Sandeep Prabhakaran

When you first sit down to design a website you need to consider many of the same interface areas. Header section, logo, nav links, sidebar, maybe even a large footer area. But it’s commonly true that your navigation is almost instinctively located directly near the heading. This gives your visitors direct access to pages instead of scrolling down to find related links.

While this trend isn’t exclusive to web design it does bring up some valid points. You must consider how your navigation menu is displayed and how many links are required. In the gallery below I’ve put together an inspirational collection of website headers with top navigation bars. Use these ideas to your advantage on any new web project or startup idea. Similarly if you have navigation bar designs feel free to share in the post discussion area below.

Travel Deal Site Header

Red Navigation Bar

Portfolio Header

Chocolaterie Header

Dropdown Tools

Sallee Design: New Header

CamFlare Header

Small Portfolio

Blog Header v2

New Website Header

Website Frame Design

Vault of Pixels

Musician & Composer Site

Web App Header

Clean Header Buttons

Sales-y Header

Cart Header

Green Photoshop Header

Web App Redesign


Galaxy Header

Oakway Cakes & Buns

Header Utility

Wood & Paper Header

Cookiesound is Travelling

Collectr Navigation

Professional Header

Simply Menu

About the Author: Kalen Smith

Kalen is a freelance writer and entrepreneur. He can be found on the web writing about topics including startups and UI design. Check out his other articles through Google or follow his updates on Twitter @engineerbiz.