Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

H2 vs H3 headers #1128

Open
nunogit opened this issue May 12, 2020 · 6 comments
Open

H2 vs H3 headers #1128

nunogit opened this issue May 12, 2020 · 6 comments

Comments

@nunogit
Copy link
Collaborator

@nunogit nunogit commented May 12, 2020

Many pages have H2 and H3 titles.

In terms of UI, they are indistinguishable at plain sight. The CSS of each is very similar.
This raises the question if having h2 and h3 headers is on purpose or just not consistent.

Suggestions:

  • If lack of consistency, make all headers H2
  • Otherwise, make the difference more noticeable in CSS

eg.:
image

Number of pages per year - H3
Venue statistics - H2

@Daniel-Mietchen
Copy link
Collaborator

@Daniel-Mietchen Daniel-Mietchen commented May 12, 2020

I'd go for making the difference more pronounced.

@fnielsen
Copy link
Owner

@fnielsen fnielsen commented May 13, 2020

Yes, they should be consistent. Aren't we using vanilla Bootstrap? h1 on the top. After that h2. Something h3, e.g., h2 on a citation section that have multiple table labeled with h3 headers.

@Daniel-Mietchen
Copy link
Collaborator

@Daniel-Mietchen Daniel-Mietchen commented May 18, 2020

Perhaps @carlinmack has an opinion here?

@carlinmack
Copy link
Contributor

@carlinmack carlinmack commented May 18, 2020

Agree with the above,

  • make the difference more pronounced
  • only use smaller ones if they have a corresponding larger heading above it.

Imagine making a table of contents, you wouldn't naturally do
image
but you might do
image

@nunogit
Copy link
Collaborator Author

@nunogit nunogit commented Jun 24, 2020

I dug a bit more into this. So, the sizes in CSS for bootstrap are defined in rem. H2 is currently 2rem (32px) and H3 is 1.75 (28px).

This is a very close size yet, strangely, the bootstrap team has made this decision.
Anyway, I played a bit in jsfiddle with bootstrap and apparently, 1.5rem (24px) size would be good for H3.

http://jsfiddle.net/m26frngk/

Any suggestions?

@Daniel-Mietchen
Copy link
Collaborator

@Daniel-Mietchen Daniel-Mietchen commented Jun 27, 2020

Looks good to me.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
4 participants
You can’t perform that action at this time.