search

ploeh / ploeh.github.com

ploeh blog 'source code'
131 stars 320 forks source link

Semantic section markup #874

Open ploeh opened 1 year ago

ploeh commented 1 year ago

When I migrated the blog to Jekyll (or possibly even before that), I just decided to use h3 tags for section headers.

I don't use h2 og h4, etc. so this looks consistent enough, but is semantically wrong. While I could probably do a search and replace, just replacing all the h3 tags with h1 is not going to look good, so I would also need to edit the blog's style sheet.

Additionally, I don't have a good grasp of what the Jekyll Bootstrap theme I'm using is doing when it comes to actual blog post titles and other headers like that. Does it use h1 for that?

And, I now reveal my abysmal ignorance of HTML and front-end technology, is there a more appropriate tag to use for those section headers? Is the semantic web still a thing?

Danielovich commented 1 year ago

Unwrapping these

bootstrap.min.css seems a default Bootstrap theme.

style.css is your overwrites.

If you wish a different font-size for your h3 you can go into you style.css and adjust:

/ Permalinks / h3 a { font-size: 0.5em; color: #f5f5f5; }

/ show permalink when hovering over matching header / h3:hover a { color: #2a6496; / copied from bootstrap.min.css / }

If you wish to overwrite you H1 for the headlines on your posts it's basically the same thing.

My frontend skills are also very limited but I guess it suffices in this complex case :)