Section, Article & Aside:
<Section>:
Es un contenedor genérico que agrupa contenido que está relacionado. Cuando creamos bloques cuyo contenido es parte de un bloque total usaremos section.
<Article>:
Es un contenedor que representa contenido independiente, es decir, podemos leer ese fragmento en cualquier otro sitio y tendría sentido por sí mismo.
<Aside>:
se utiliza para representar contenido indirectamente relacionado pero que no forma parte del contenido principal.
<Address>:
Se utiliza para aportar información de contacto para el article más cercano o para todo el body.
Anidamiento:
Un section puede contener articles, por ejemplo, si tenemos varios artículos que hablan sobre noticias, deben ir dentro de un section, ya que es contenido relacionado entre sí, y los article serían cada una de las noticias porque podríamos leer cada una sin haber leido el resto, y seguiría teniendo sentido.
El article es definido como un componente de la página de contenido independiente, esto implica que esta etiqueta pueda tener un header y un footer propios.
También existe el caso en el que un article contenga varias secciones, el artículo independiente podría ser navegadores y este contener dentro secciones como navegadores más utilizados en 2020
Ejemplo 1:
NOTICIAS INTERNACIONALES
Noticias Del Día
Noticia 1
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Iure exercitationem saepe animi unde perspiciatis accusantium totam repudiandae aut, delectus aspernatur nisi sequi velit temporibus accusamus quasi? Vitae enim quaerat in!
Noticia 2
Lorem ipsum dolor sit amet consectetur adipisicing elit. Nostrum eaque nihil possimus cum excepturi, id dolorum, vero perferendis magni deleniti unde, a laudantium. Sequi consequuntur corrupti id aspernatur eligendi eos?
Noticia 3
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Dolorem nostrum ad libero ut harum saepe alias ratione quasi. Vitae autem aut cupiditate, voluptatem exercitationem ipsa quod vel iste animi placeat?
Ejemplo 2:
NAVEGADORES
Navegadores más utilizados en 2020
Chrome
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis facilis dolor amet iure aspernatur molestias dolore, dolorum reiciendis quisquam corporis nesciunt consequuntur nam tempore tenetur? Soluta aliquid inventore consequatur ratione?
Firefox
Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam, quo quam deserunt aliquid consectetur qui ex, quia vero iusto dolorem odit, est a architecto dolor asperiores modi! Qui, minus sunt!