Horizontales Menü

[Gunnar Bittersmann]

@@Rolf B

Insbesondere rate ich Dir dringend zu Semantin Forte.

Ein Footer ist ein Footer ist ein footer.

Deine Klassen erinnern an BEM

BEM?

Wie auch immer. Das äußere deiner Container-divs kannst Du definitiv loswerden

Du kannst so zeimlich alle divs loswerden. Einzig die Gruppierung des Textabsatzes mit der Liste im blauen Bereich (ich nenne ihn mal social-links) scheint sinnvoll.

Weitere Mark-up-Korrekturen:

• Hierarchie-Ebene der Überschrift (wurde schon angesprochen)
• alt-Attribute für die Bilder
• Wenn Deutsch Englisch Spanisch ein Sprachwahl-Menü sein soll, dann sollten die Sprachbezeichner in der jeweiligen Zielsprache sein: Deutsch English Español (jeweils mit lang-Attribut). Außerdem gehört ein Sprachwahl-Menü ganz nach oben an den Seitenanfang.
• Auszeichnung der Linkliste als Liste. Wobei eine Linkliste im Footer wohl eher keine Navigationsliste ist, das nav-Element also falsch.

Sieht dann so aus:

<footer id="pagefooter">
	<h2>Slorem ipsum dolor</h2>
	<div id="social-links">
		<p>Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes</p>
		<ul>
			<li><a href=""><img src="…" alt="…"/></a></li>
			⋮
		</ul>		
	</div>
	<ul id="language-menu">
		<li><a href="" lang="de">Deutsch</a></li>
		<li><a href="" lang="en">English</a></li>
		<li><a href="" lang="es">Español</a></li>
	</ul>
	<ul>
		<li><a href="">Aenean</a></li>
		⋮
	</ul>
</footer>

Da Mark-up genügt zum Stylen völlig ☞ Codepen

LLAP 🖖