mkiser / WTFJHT

Logging the daily shock and awe in national politics. Read in moderation.
https://whatthefuckjusthappenedtoday.com/
GNU General Public License v3.0
554 stars 197 forks source link

Internal Structure, and Semantics #15

Open StevenBlack opened 7 years ago

StevenBlack commented 7 years ago

Discussion: For full-value in the future, it would be helpful if the site used more than one level of heading tags to distinguish semantic structure . Currently h2 headings are used to delineate days, and that's it.

It will help search (and therefore discoverability) if search bots are able to better infer and structure site contents, and header nesting is one way to convey meaningful semantics.

Proposal: Daily sub-segments should be built with h3 tags, and things like Updates should use h4 tags. Consider using HTML 5 aside elements to structure the sidebar-like sections.

The following is captured using Chris Pedrick's Web Developer Toolbar Extension (under Information ~ View Document Outline). This is the current structure of the site:

2017-02-17_23-14-39

mkiser commented 7 years ago

I think a few things have changed since this was logged. But, it's still largely correct.

The site title uses an h3 and the index page uses h2's for listing all the posts.

On a post page, the title uses an h1, though the text inside it isn't very helpful (e.g. Day 175)

Suggestions on improvements?

mkiser commented 6 years ago

I'd like to revisit this. Anybody able to do a new audit of the current structure?

StevenBlack commented 6 years ago

@mkiser here's the semantic view of the homepage today (June 14, 2018).

2018-06-14_22-44-36


Looking within the pagination structure, picking a prime number at random (23) here's page 23.

2018-06-14_22-48-05


Within that page 23 is Day 480. Here are the day-specific structural semantics.

2018-06-14_22-58-21

StevenBlack commented 6 years ago

@mkiser I'd be happier if the tool I'm using could distinguish between <header>...</header>, <main>...</main> and <footer>...</footer>

StevenBlack commented 6 years ago

@mkiser here's Day 480's HTML formatted by the first online HTML formatter returned by a Google search. Viewing the HTML, properly formatted, is often interesting.

https://gist.github.com/StevenBlack/2453a0becac6716f08cdc963bdb62b6e

mkiser commented 6 years ago

Thanks! Digging into this shortly – got sidelined on some things.

joecoc1916 commented 6 years ago

I will do work on this. I would apprciate help with my first to WTFHT. Thanks in advance ! joseph