nicht angemeldet
Header mit integrierter Navigation semantisch richtig festlegen
Hi,
dem Header meiner Webseite würde ich gerne ein ähnliches Layout wie dem Header auf dieser Webseite zuweisen:
Nun habe ich einfach mal alle Grafiken ausgeblendet. Sind die Grafiken nichtmehr eingeblendet, dann werden auch die Menüpunkte "Über uns", "Shop" und "Geschichte" nichtmehr angezeigt. Genau das will ich verhindern, wenn ich den Header nachbaue.
Demnach überlege ich mir gerade wie ich das Markup semantisch korrekt gestalte um dieses Layout auch bei augeblendeten Bildern korrekt darzustellen.
Könnt ihr mir hier ein bißchen auf die Sprünge helfen?
-
Grüße,
Nun habe ich einfach mal alle Grafiken ausgeblendet. Sind die Grafiken nichtmehr eingeblendet, dann werden auch die Menüpunkte "Über uns", "Shop" und "Geschichte" nichtmehr angezeigt. Genau das will ich verhindern, wenn ich den Header nachbaue.
alt=""?
oder die restlichen 1001 methoden bei denen die grafik im hintergrund platziert wird und der text rausgeschoben etc.MFG
bleicher--
__________________________-
Die Essenz der Egomanie
ie:{ fl:( br:< va:| ls:[ fo:# rl:? n4:? ss:| de:> js:| ch:| sh:( mo:| zu:|-
alt=""?
oder die restlichen 1001 methoden bei denen die grafik im hintergrund platziert wird und der text rausgeschoben etc.Sorry, ich versteh nicht ganz was du meinst. Kannst du das vielleicht etwas detailierter erklären?
-
Grüße,
Sorry, ich versteh nicht ganz was du meinst. Kannst du das vielleicht etwas detailierter erklären?
du kannst nach "FIR, LIR, Phark" googeln, oder doch vllt noch mal erklären was GENAU deine absicht ist - bei simplen abschalten der grafiken, wäre sinvolles einsetzen des ALT-Attributs, der eben dafür gedacht ist, sinvoll - aber ich verstehe leider dein problem nicht ganz.
MFG
bleicher--
__________________________-
Die Essenz der Egomanie
ie:{ fl:( br:< va:| ls:[ fo:# rl:? n4:? ss:| de:> js:| ch:| sh:( mo:| zu:|-
Grüße,
Sorry, ich versteh nicht ganz was du meinst. Kannst du das vielleicht etwas detailierter erklären?
Momentan ist es so, das meine Webseite bezüglich des Markups in drei Bereiche aufgeteilt ist:
1.) header
2.) content
3.) footerNun fehlt ja noch die eigentliche Navigation. Bisher hatte ich die Navigation immer links oder rechts vom content bzw. eine horizontale Navigation direkt über dem content. Demnach hatte ich dann einfach einen weiteren Bereich für die Navigation erstellt. Vom Markup her sa das dann ungefähr so aus:
<body>
<h1 id="header">Text unter Image Replacement</h1>
<div id="content">
</div>
<ul id="nav">
</ul>
<address id="footer"></address>
</body>Die Navigation brauchte ich dann einfach nur mit Hilfe von CSS richtig zu positionieren und einzufärben.
Wie du siehst, befindet sich die Liste die die Navigation darstellt außerhalb des Headers. Die war bei meinem bisherigen Vorgehen auch kein Problem, da sich die Navigation ja nie innerhalb des Headers (bezüglich des Layouts) befunden hat. Mein Problem ist nun das Markup semantisch der der Weise korrekt aufzubauen, dass ich eine Seite wie diese:
Navigation Bestandteil des Headers
korrekt erzeugen kann. Wie du siehst ist die Navigation hier in den Header integriert (zumindest was das Layout angeht).
Vielleicht kannst du mir sagen, wie du grob das Markup gestalten würdest um solch ein Layout hinzubekommen. Es muß natürlich semantisch korrekt sein.
Momentan stelle ich mir das so oder ähnlich vor:
<body>
<ul id="header">
</ul>
<div id="content">
</div>
<address id="footer"></address>
</body>Wie du siehst, handelt es sich bei dem eigentlichen header nun nichtmehr wie oben um eine Überschrift sondern um eine Liste. Die Liste würde ich dann anschließend mit CSS entsprechend formatieren. Ich würde eine horizontale Liste erstellen und die einzelnen Listenpunkte mit den entsprechenden Abständen versehen. Anschließend würde ich meine Headergrafik per Imagereplacementtechnik über den Header bügeln. Hier muß man dann natürlich aufpassen, dass z.B. der Punkt "Impressum" auf der Grafik auch genau über den Punkt "Impressum" der in der Liste existiert geschoben wird.
Meine Frage:
Was haltet ihr von diesem Vorgehen? Ist das OK oder würdet ihr es anders machen?
-
Grüße,
Wie du siehst, handelt es sich bei dem eigentlichen header nun nichtmehr wie oben um eine Überschrift sondern um eine Liste.
gut.
Die Liste würde ich dann anschließend mit CSS entsprechend formatieren.
gut
Ich würde eine horizontale Liste erstellen und die einzelnen Listenpunkte mit den entsprechenden Abständen versehen.
keine gegenargumente meinerseits
Anschließend würde ich meine Headergrafik per Imagereplacementtechnik über den Header bügeln.
sehr metaphorisch - aber "bügeln" ist mir als CSStechnik weitgehend unbekannt.
Hier muß man dann natürlich aufpassen, dass z.B. der Punkt "Impressum" auf der Grafik auch genau über den Punkt "Impressum" der in der Liste existiert geschoben wird.
ehm.. was genau versuchst du an exakt dieser Stelle? Hört sich an als würdest du grafiken absolut über den links positionieren wollen - aber offensichtlich ist es ja nicht der fall. scheinbar reichen meine deutschkentnisse nicht aus ;(
Was haltet ihr von diesem Vorgehen? Ist das OK oder würdet ihr es anders machen?
OK - ja, wer bin ich dir was zu verbieten?
Anders? ja - grafiken als links? dann eben grafiken als links - was für voodootanz versuchst du drumherum?was für den Fall dass CSS abgestellt wird oder dass suchroboter es auch noch "Lesen" können?
dann http://meiert.com/de/publications/articles/20050513/was für den fall dass grafiken, warum auch immer abgeschaltet werden? alt-attribut der img.
habe ich jetzt dein vorhaben erraten?
hoffe es hilft was
MFG
bleicher--
__________________________-
Die Essenz der Egomanie
ie:{ fl:( br:< va:| ls:[ fo:# rl:? n4:? ss:| de:> js:| ch:| sh:( mo:| zu:|-
Ja jetzt komme ich klar. Ich brauchte diesen Denkanstoß...
-
-
-
-
-