Only One h1 Tag Per Page
While technically we could load a page up with h1 tags, it's a bad SEO practice and can cause penalties.
Use Title Attributes with Links
Using a title attribute in your anchor elements will improve accessibility when used the right way.
It is important to understand that the title attribute should be used to increase the meaning of the anchor tag.
How Much Will A Reader Read?
"A sentence should contain no unnecessary words, a paragraph no unnecessary sentences, for the same reason that a drawing should have no unnecessary lines and a machine no unnecessary parts."
The <main> element should contain the main content for your web page. All of this content should be unique to the individual page, and should not appear elsewhere on the site. Any content that is repeated on multiple pages (logos, search boxes, footer links, etc.) should not be placed within the <main> element.
Use the ARIA role=”main” attribute here is it indicates the significance of this element to programs that don’t yet support the <main> element (such as some screen readers).
You should only use one <main> element on a page, and it shouldn’t be placed within an <article>, <aside>, <header>, <footer>, or <nav> element.
The <section> element is used to represent a group of related content. This is similar to the purpose of an <article> element with the main difference being that the content within a <section> element doesn’t necessarily need to make sense out of the context of the page.
It’s advisable to use a heading element (<h1> – <h6>) to define the topic for the section.
Using this blog post as an example, you could have <section> elements that represent each of the individual parts within the post.
If you just need to group content together for styling purposes you should use a <div> element rather than a <section>.
The <article> element should contain a piece of self-contained content that could be distributed outside the context of the page. This includes things like news articles, blog posts, or user comments.
You can nest <article> elements within one another. In this case it’s implied that the nested elements are related to the outer <article> element.
The <aside> element is used to represent content that is tangibly related to the content surrounding it, but could be considered separate. This includes things like sidebars (like those you might find in a book), groups of <nav> elements, figures and pull quotes.
The <header> element is used to represent the introductory content to an article or web page. This will usually contain a heading element as well as some metadata that’s relevant to the content, such as the post date of a news article for example. It could also contain a table of contents (within a <nav> element) for a longer document.
A <header> element will be associated with the nearest sectioning element, usually it’s direct parent in the page structure.
The <footer> element is used to represent information about a section such as the author, copyright information, or links to related web pages.
As with <header>, the <footer> element is associated with the nearest sectioning element.