Questions tagged [header]
Headers are an area of a website found at the top of the page, and traditionally contain elements such as site navigation, logo, and other site-wide controls and elements.
105 questions
55
votes
9
answers
8k
views
Why do websites toggle header visibility on scroll?
Some websites have a (usually rather small) header that hides when the user scroll down.
What I never understood is why it is shown again when scrolling up. Sometimes I want to scroll a bit up to ...
- 1,734
18
votes
10
answers
33k
views
Should headings always use the same font as the body?
I'm working on some of the layouts for a User Handbook and right now my main concern is fonts. I'm trying to decide whether to use the same font for the body text and the headings.
If I use different ...
- 284
18
votes
5
answers
13k
views
Usability research on sticky headers?
Sticky (or fixed) headers are not so uncommon nowadays, and for a large website that relies heavily on catalog and search functionality it may be a good choice to aid the user.
As I am currently ...
user12741
18
votes
4
answers
17k
views
Is a website with a Fixed Header good for end-users of a Web2.0 website?
Fixed Header is the header that is always visible to users even the user scrolls down. It uses the fixed-position in CSS.
There a lot of websites nowadays that use a fixed header, such as gmail or ...
- 311
16
votes
1
answer
2k
views
How should horizontal dashboard numbers react on a responsive page?
I have a set of dashboard values on a sticky horizontal panel on the top of the UI. These numbers are sales values so they are pretty important to the user.
The layout looks something like this:
But,...
- 285
14
votes
2
answers
7k
views
(How) does capitalization affect readability
TLDR
In short, given the following two options:
This is sentence case
This is Title Case
Has any research been done into which one is more user-friendly, especially considering dyslexia and other ...
- 4,704
12
votes
3
answers
920
views
Why some websites put a small contrasting bar on top of the page?
I've observed this pattern in practice at many places now, websites put a small contrasting bar on the top of the page. What is the rationale behind it?
Readability header:
Tenderapp header:
- 333
11
votes
3
answers
547
views
What is the best way to order items on an admin page?
We have a Content Management System (near enough).
The picture below is the Administration page, which is a flex based front end, viewed in a browser.
Thanks to Roger-A on another Q, he gave me the ...
- 681
11
votes
4
answers
1k
views
Mixing Full Page-Width Navbar With A 960px Body
Is there ever a use case for mixing a full-width top navigation bar (meaning the navigation bar content is also full-width) with a contained body (around 960px)? What are the benefits or drawbacks to ...
- 10.4k
8
votes
2
answers
333
views
Are people used to seeing a "My Cart" link in the header?
I have been designing an E-commerce platform where users will be able to buy Apps from the marketplace.
I had thought of placing "My Cart" links in a number of places, such as:
Docked widget in the ...
- 395
7
votes
3
answers
1k
views
Is a large breadcrumb good enough for a page title?
We have a breadcrumb under the menu and and the page title under the bread crumb. Can I get rid of the page title since it is really just a repeat of the breadcrumb? BTW, this is a LOB application ...
- 1,657
6
votes
3
answers
509
views
If a microsite uses the same logo as the main site, which "home" should it link to?
Which 'home' should the microsite's logo link to - the main site or the microsite?
Consider that...
The content and layout of the microsite is the only differentiator
Half the users reach the ...
- 181
6
votes
5
answers
1k
views
Are social media icons as effective when grey-scale?
Social icons may be more noticeable in the header, but they can clutter they navigation.
Are social icons as effective in grey-scale? ie. Will users still see them in a group of links if they're not ...
- 181
6
votes
1
answer
37k
views
What is an average header height for mobile websites?
What is recommended/average header height for mobile websites.
Browsers such as Chrome and Safari have an address bar at the top which takes space so in terms of UX how big the header (eg bootstrap ...
- 63
6
votes
2
answers
2k
views
Small Caps Headings: Accessible or not?
Recommendations on digital accessibility often include avoiding ALL CAPS.
There was even a discussion on this site (All capital titles: Good or Bad?), though the focus was not specifically ...
- 63
6
votes
3
answers
2k
views
Pros/Cons of placing Login/Account in line with the main nav bar?
Currently our navigational header is mostly left side and central of page, account is on upper right. A proposed design shows the account moved down, into the main nav bar. There's some space in ...
6
votes
3
answers
512
views
Are auto-hiding floating headers bad?
Many websites have headers that are always on-screen when you scroll up, but auto-hide when you scroll down.
I hate them personally because the screen space they would've used up if they stayed ...
- 1,180
5
votes
1
answer
1k
views
how to indicate to click on title for more information
im designing an app and am having trouble indicating to the user to click on the business name('candys' in this case) for more information. clicking shows details like contact details, website etc. ...
- 327
5
votes
6
answers
553
views
Radio Buttons in the header?
Our web app allows users to switch between (currently 3, potentially more in the near future) different "contexts". For example, they could choose to view the app from the point of view of a "...
- 193
5
votes
2
answers
447
views
Should a site have separate buttons for social media sharing and following?
Following: 'following' a business on Twitter or 'liking' a business on Facebook, or subscribing to their YouTube channel.
Sharing: posting something on their wall/Twitter or their content on your ...
- 181
4
votes
2
answers
5k
views
Placement of login/signup relative to website nav bar
When it comes to designing the header of a website, it is very common to have something like this:
Here we have a:
[LEFT] Logo
[RIGHT] Main navigation menu
[TOP RIGHT] Signup and Login links
...
- 927
4
votes
2
answers
2k
views
Appropriate UI Design for Crossing Matrix
i'm programming in php, javascript. This isn't a programming question but rather User Interface/Experience one. suppose i want to create a crossing matrix for dog breeds. I initially created a table ...
- 205
4
votes
5
answers
360
views
Do a large percentage of users fail to look at a website's logo?
I was testing some people - ok, family - with random websites and I noticed they didn't pay any attention to logos. Then I realized that I don't either.
Given the cost of logos and clients' ...
- 71
4
votes
2
answers
1k
views
Large hero banner in ux
I know that many website nowadays use large hero banner to bait people scrolling. And I read this one article:
"A big striking hero area at the top of a page, grabs people’s attention and gives ...
- 195
4
votes
2
answers
733
views
Site with full width navigation bar and header but pages that vary in width
This has been kinda asked before but my need is slightly different and would like to ask for opinion.
In short, my site has a couple of pages that need to have full page layout, namely, a map and a ...
- 143
3
votes
4
answers
701
views
Why is there a header and logo at the top in a web application?
We are building a webapp, so everyone asks me what content should be in header and why you are using a header at the top.
So my question is why are we using a header and logo at the top, we can use ...
- 2,278
3
votes
3
answers
4k
views
Are floating headers and footers good UX?
I'm making a website. I need to put in social media tools - facebook 'like' button and so on. It's been suggested to me that I use a floating, fixed position header or footer for this purpose.
...
- 133
3
votes
2
answers
2k
views
Is there a practical (UX driven) reason for why login pages often don't have headers/footers when the rest of the site does?
I'm designing a website with a login screen, so I've been looking around at examples on other sites to get a general feel for the UX/UI trends in the area (I'm primarily a dev, not a designer). I've ...
- 133
3
votes
4
answers
464
views
Is it a bad idea to auto-scroll to title of the page bypassing the header?
In one of the sites I developed, I want visitors to auto-scroll to the title of the page (blog) by passing the header of the website.
Only main page shows everything as usual. Inline pages doesn't ...
- 369
3
votes
3
answers
5k
views
Should I Put a Phone Number in the Header?
I see that it is really popular with web services nowadays to have their phone number in the header of the website. Is it really that effective? Does it make the company look more legit?
- 324
3
votes
1
answer
5k
views
Should the header be the same color as the footer in Material Design?
Strictly speaking of Material Design, Google states that you should use hue shade 500 for large areas of color. I would guess the header is considered large area?
Should the header and footer be the ...
- 265
3
votes
2
answers
782
views
Repeating Sidebar and Nav titles within the Page view
Should I repeat the active (selected) navigation (either top or sidebar) title within the page view itself? My current opinion is that it should not repeat as long as the tab that is active is clearly ...
- 131
3
votes
2
answers
2k
views
Is it a bad practice to have a two line title in header?
I'm designing a banking application which is capable of money transfer and showing transactions of each account to the user.
Is it a bad practice to have a two line title in the header? The main title ...
- 716
3
votes
2
answers
8k
views
Should there always be a header and footer on a website?
Strange question perhaps but I've been pondering over the idea of not using any header and footer at all for a website application (non-responsive).
I thought of the idea for only having a sidebar on ...
- 133
3
votes
1
answer
2k
views
Is it important to display a username to a user when logged in?
Our system header currently displays an icon and a username, as seen below:
For reasons of accessibility and clarity of purpose I have re-designed it to display a clearer call to action, as seen ...
- 1,062
3
votes
1
answer
456
views
Can Tabs also serve as Page Titles?
I have a full page where there are several Tabs across the top.
The content type is a data table in the example but could be anything.
Question: Is there a need for an explicit Title if the Tab ...
- 4,241
2
votes
4
answers
5k
views
Search-Bar in Header OR Navigation?
I design a online shop for a client. The searchbar is for the target group and the stakeholder very important. So I did the search in the header, on top over the navigation bar (variant 1). My client ...
- 545
2
votes
1
answer
455
views
Intranet static menu: Below or above page banner?
I am currently working on a project to redesign a large organisation's intranet site. At present the project team is debating whether the site's static menu should appear below or above the banner. ...
- 3,826
2
votes
2
answers
241
views
What is the best use of icons in the header? (icons replacing free text)
What is the best use of icons in the header? In my application I am using a number of icons for simple features such as "find friends". "ask a question" etc. This is mainly because I need to keep the ...
- 1,298
2
votes
3
answers
4k
views
Logo size for new website? [closed]
The large companies chose small logos (apple, amazon, gmail, facebook) etc (on login or search pages they have large logos).
But if I go back a few years, all those large companies had large logos.
...
- 915
2
votes
5
answers
751
views
Website logo: include the TLD or not?
Should a website logo include the TLD ".net"?
Background to my specific case:
I'm in the process of redesigning / relaunching a website, which includes redesigning the site logo. The site is moving ...
- 689
2
votes
2
answers
111
views
What is a space-efficient way to display two numbers next to each other while minimising confusion?
I'm working on a site that needs to show two balances next to each other, preferably in the header next to a user's name. The issue I'm having is differentiating the balances enough that they don't ...
2
votes
1
answer
1k
views
Shall keep the table header if it's an empty table?
I got the feedback from UX expert who suggested displaying the table header even though that there is no data created, UX expert thought if have table header, user can foresee what kind of information ...
- 41
2
votes
1
answer
562
views
Local navigation for long mobile web pages?
I have a long (possibly, around 2500-3000px) mobile page which content is divided into three sections. The page has a header for global navigation. I am now wondering should I have a subheader for ...
- 567
2
votes
1
answer
114
views
Column header name suggestions
I have a column in a table with each cell being a toggle switch (on/off),what would be an appropriate header for the column? Right now I have just called it as state
- 401
2
votes
2
answers
410
views
Sticky header + sticky social bar (mobile) = too much that is sticky?
Is it too much have both a sticky header (at the top of the viewport) and a sticky social bar (on the bottom) on mobile devices???
A sticky header is important for the user, but a sticky social bar ...
- 263
2
votes
2
answers
221
views
Top bar versus bottom bar for email subscription offer
Sites sometimes use a bar in order to invite readers to subscribe to their mailing list.
In my experience, the majority of sites that do this choose a non-sticky top bar (header). However, it seems ...
- 171
2
votes
3
answers
254
views
Header img with color overlay or shadow on elements?
I'm working on a web app and this question came to my mind. I tried to look around but found a lot of resources from both approaches. So here I am, trying to figure out a good solution.
The web app ...
- 1,371
2
votes
2
answers
159
views
2 different sort forms next to each other
Right now, on my site tindie, I have 2 sort forms next to each other (one for sorting products by price & popularity, the other for sorting items that can be shipped to your country). This just ...
- 123
2
votes
3
answers
355
views
title placement in mobile apps
What's best practice for placing page titles in mobile development?
In jquerymobile it looks like header is great placement, however titles can be long (ecommerce products), and because they're "...
- 1,092