I want to know if there's an standard or at least a nice way to stylize table headers?
Uppercase or lowercase? Left or centered? Top or bottom?
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.Sign up to join this community
Miles Tinker's research work (32 years of research!) looked at legibility of upper and lowercase words.
From a research study at NCBI, an abstract that cites Tinker's observations:
Miles Tinker, an authority on legibility and typography said “Lower-case letters have more ‘character’ in terms of variation in shape and the contrasting of ascenders and descenders with short letters. This leads to characteristic word forms that are much easier to read than words in all capitals”
There's several fairly advanced frameworks out there.
Material Design table specs: It appears they use Sentence case headers, and right align headers for columns with numerical data. Right aligning the data (regardless of column header) makes sorted comparison easier.
Bootstrap: Sentence case again, looks like left align standard.
Salesforce Lightning: Their headers are in all caps, and it doesn't seem they right align for columns with numeric data.
Zurb Foundation: Left aligned, plus background shading in the headers.
One common observation regardless of framework is that table headers are almost always distinguishable from the content in some graphical manner. This can be accomplished by:
Alignment: Don't center align a header with left aligned text. Don't make my eye do more work than it needs to.