zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Wie setze ich diese Navigation um?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 16.12.2010, 22:22
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 16.07.2010
Beiträge: 70
micronix befindet sich auf einem aufstrebenden Ast
Standard Wie setze ich diese Navigation um?

Hallo,



Wie setze ich diese "Navigation" semantisch am sinnvollsten um?

Aus SEO-Gründen möchte ich mit <img> arbeiten, und nicht mit background-image. Außerdem sollte es eine Liste sein. Sowohl Bild als auch Text sollen verlinkt sein.

Mir fällt nur sowas ein wie:

<ul>
<li><a href="#"><img>text</a></li>
<li><a href="#"><img>text</a></li>
</ul>

Bin mir aber nicht so sicher.

Ich hoffe ihr könnt mir helfen.

Danke im Voraus.

MfG

Geändert von micronix (16.12.2010 um 22:52 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 17.12.2010, 00:23
Benutzerbild von Crizzo
der mit dem Editor kämpft
XHTMLforum-Kenner
 
Registriert seit: 17.10.2006
Ort: Ost-Hessen
Beiträge: 4.828
Crizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer Mensch
Standard

Was bitte soll ein <img> denn für "SEO" verbessern?

Ansonsten, pack den Link-Text in ein <span> und formatiere dann <span> und <img> getrennt, dann sollte das wunderbar klappen.
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 17.12.2010, 09:20
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.034
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

@seo : Man kann (und sollte) dem img-Tag alt-Attribute verpassen, die google anscheinend zu einem gewissen Anteil honoriert, wenn Inhalte des alt-Attributes zum verlinkten Inhalt passen.
@ Text: Hier wäre ein zusätzliches Element, z.B. span erforderlich, welches pos. absolute gesetzt wird und unter das Bild geschoben wird. Andererseits hast Du dann Probleme bei Vergrößerungen - der Text drückt sich spätestens bei der zweiten Vergrößerung raus, das ist unschön und unprofessionell und wegen des zusätzlichen Elements allenfalls eine Notlösung.

Der SEO-Gedanke kommt bei Navi-Elementen übrigens nicht so zu tragen wie Du zu glauben meinst. Tante G. erkennt Navilinks an ihrer Repetition oder Position ( glaube ich), so dass sie entsprechend gering bewertet werden. Du kannst also den klassischen Weg über Backgroundgrafiken gehen.
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
  #4 (permalink)  
Alt 17.12.2010, 09:31
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.086
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von micronix Beitrag anzeigen
Aus SEO-Gründen möchte ich mit <img> arbeiten, und nicht mit background-image. Außerdem sollte es eine Liste sein. Sowohl Bild als auch Text sollen verlinkt sein.
Wer hat dir denn das eingetrichtert??
Aus SEO- und Accessibilty-Gründen solltest du mit background-images arbeiten, die über den Linktext geschoben werden (wie andir schon schrieb).
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
  #5 (permalink)  
Alt 17.12.2010, 09:53
EvT EvT ist offline
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.09.2006
Ort: Bad Wildungen
Beiträge: 2.220
EvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekannt
Standard

Zitat:
Zitat von andir Beitrag anzeigen
@seo : Man kann (und sollte) dem img-Tag alt-Attribute verpassen, die google anscheinend zu einem gewissen Anteil honoriert, [...]
Alt macht Sinn aus Gründen sauberen Codierens und der Accessibility. Google hingegen hebt mehr auf das title-Attribut ab, das zum Beispiel dem a mitgegeben werden kann. Deshalb auch mein Votum für Hintergrundbilder, die ja auch als CSS-Sprites eingesetzt werden können, so dass die Site etwas schneller lädt, immerhin ein Faktor, der ja neuerdings von Google mit ins Ranking einbezogen wird.
Mit Zitat antworten
  #6 (permalink)  
Alt 17.12.2010, 09:53
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 16.07.2010
Beiträge: 70
micronix befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Wer hat dir denn das eingetrichtert??
Aus SEO- und Accessibilty-Gründen solltest du mit background-images arbeiten, die über den Linktext geschoben werden (wie andir schon schrieb).
Wenn ich Bilder verwende, kann ich Ihnen ein title- und alt-Attribut geben, was seotechnisch vorteilhaft ist?! Wenn ihc mit background-image arbeit, habe ich ein title- und ein alt-Attribut weniger.^^

Was gibt es denn an meiner Variante zu bemängeln?

<ul>
<li><a href="#"><img>text</a></li>
<li><a href="#"><img>text</a></li>
</ul>

Mir geht es nur um die Verschachtelung / Semantik / wie auch immer. Das Stylen kommt später hinzu, spielt für mich im Moment keine Rolle.
Mit Zitat antworten
  #7 (permalink)  
Alt 17.12.2010, 13:00
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von micronix Beitrag anzeigen
Wenn ich Bilder verwende, kann ich Ihnen ein title- und alt-Attribut geben, was seotechnisch vorteilhaft ist?!
Ist es das?
Welche wichtigen Zusatzinformationen hast du denn für deine Menüpunkte? Und wenn es so viel wichtiges gibt: Warum machst du dann nicht eine Navigation mit sichtbaren Beschreibungstexten?
Was werden deine menschlichen Besucher davon halten, wenn bei jedem Menüpunkt noch ein title aufklappt (und womöglich dabei den eigentlichen Linktext verdeckt) -- vielleicht sogar zwei? Nichts nerviger als das

Zitat:
Was gibt es denn an meiner Variante zu bemängeln?
Ins Markup gehören nur Bilder, die inhaltliche Relevanz haben. Das haben deine Icons definitiv nicht.

Zitat:
Mir geht es nur um die Verschachtelung / Semantik / wie auch immer. Das Stylen kommt später hinzu, spielt für mich im Moment keine Rolle.
Dann bist du im falschen Forenbereich. Hier geht's um "Stylen".
Am besten gehst du aber wohl in ein SEO-Forum. Da ist man wahrscheinlich zugänglicher für deine angestrebten Manipulationen.
Mit Zitat antworten
  #8 (permalink)  
Alt 17.12.2010, 13:09
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 16.07.2010
Beiträge: 70
micronix befindet sich auf einem aufstrebenden Ast
Standard

Danke, das mit der inhaltlichen Relevanz kann ich nachvollziehen. Also verzichte ich lieber auf <img>.

Ich mache eine ganz normale Liste, gebe den Links die Grafiken als Hintergrund und gut ist.
Mit Zitat antworten
  #9 (permalink)  
Alt 17.12.2010, 16:02
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

[ironie]

Code:
<ul>
<li title="Aktien"><a href="/aktien" title="Aktien">
<img src="/aktien.png" alt="Aktien" title="Aktien"> Aktien
</a></li>
...
[/ironie]
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 17.12.2010, 16:26
Benutzerbild von nevermind
Trollflüsterer
XHTMLforum-Kenner
 
Registriert seit: 29.08.2005
Ort: Bietigheim-Bissingen
Beiträge: 2.215
nevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblick
Standard

Was finde ich nun nochmal unter dem Menüpunkt?
__________________
Gruß Roman // ngkreativ.de - Webdesign & Motorradumbau
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Problem mit Navigation safari CSS 12 20.04.2011 12:11
Float-Problem? mischaef CSS 33 20.10.2010 17:20
Problem mit FlyOut Menu im IE7 quarki69 CSS 5 15.03.2010 16:46
Javascript UL Navigation im IE6 ven CSS 7 29.04.2008 16:29
Container mit 2 Container darin -> Hintergrund anzeigen bendar CSS 4 05.04.2005 19:18


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:57 Uhr.