Design nachbauen
bearbeitet von
@@MrMurphy1
> Du verwendest das header-Element falsch. Dein header enthält keinen Inhalt, der in den header gehört. Ein Logo allein macht noch keinen header. Damit ist der überflüssig - weglassen.
_“A `header` typically contains a group of introductory or navigational aids.”_{: lang="en"} [[Spec](https://www.w3.org/TR/html5/sections.html#the-header-element)]
Sowohl Seitenlogo als auch Navigation sind im `header` bestens aufgehoben.
> Für Anfänger ist auch irritierend, das header nichts über die Position des header aussagt.
Das allerdings ist richtig. Genauso wie [`footer` nichts über dessen Position aussagt](https://forum.selfhtml.org/self/2016/may/6/update-einer-chatfunktion/1666796#m1666796).
> Das Logo kann in das nav-Element verschoben werden.
Wenn es denn ein Link zur Homepage ist – was es sein sollte. (Außer natürlich auf der Homepage selbst.)
> Die Liste im nav-Element ist überflüssig.
Kann man so sehen. Muss man nicht.
> Das cite-Element ist nicht für Namen gedacht und damit falsch.
Wer hat dir denn das eingeredet?
Hatten wir das nicht letztens erst? Ah ja, [hatten wir](https://twitter.com/stephenhay/status/724603261571993601) – nur dass du nicht mit dabei warst.
Laut [W3C-Spec](https://www.w3.org/TR/html5/text-level-semantics.html#the-cite-element) ist das `cite`-Element ausdrücklich auch für Namen gedacht. Wie ich sagte: _“The WHATWG spec is wrong on other elements too (`main` element), so pick the one you like better. ;-)”_{: lang="en"}
> Für das Zitat mit Nennung des Namens eignet sich besser das figure-Element mit einem blockquote- und einem figcaption-Element.
`blockquote`-Element mit `footer` und/oder `cite`.
LLAP 🖖
--
_“You might believe there are benefits for the developer, but first of all, you should put those behind the interest of the user.”_{: lang="en"} —Stefan Tilkov
_[Selfcode](http://community.de.selfhtml.org/fanprojekte/selfcode.htm): `sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|`_{: style="display: block; font-size: 0.875em; font-style: inherit; margin-top:1.5em"}