Blog-Darstellung

[’sup]

Hi,

zum CSS wurde bereits etwas gesagt. Also gebe ich meinen Senf zum Markup ab 😉

Datum und Autor sollten nach der Überschrift im Quelltext stehen. So wie es jetzt ist, gehören Datum und Autor des dritten Eintrags zur Überschrift des zweiten Eintrags. Über display: flex; und flex-direction: column-reverse; oder order: n; kannst du Autor und Datum optisch vor der Überschrift anzeigen.

Ich würde die Einträge in einer Liste (<ul> oder <ol>) gruppieren. Die einzelnen Einträge dann als <article> darin verschachtelt:

<ol class="postings">
  <li>
	  <article>
		  <header>
			  <h2><a href="/">Ich bin ein Titel</a></h2>
				<p>Max Mustermann</p>
				<p><time datetime="2018-01-01">01. Januar 2018</time></p>
        <img src="../pfad/zum/bild.jpg" alt="Alttext nicht vergessen!">
			</header>
			<p>
				Ich bin ein Teaser-Text!
			</p>
		</article>
	</li>
	<!-- weitere Einträge hier einsetzen ... -->
</ol>

Du hast hier eine Liste von Einträgen, von denen jeder für sich selbst Sinn ergibt. Ich finde, das darf man dann auch ruhig so im HTML darstellen. Eventuell lohnt es sich auch, das ganze zusätzlich via schema.org auszuzeichnen. Da kenne ich mich allerdings nicht unbedingt mit aus.