frage zum layout

[marco]

ich habe mich nach mehrfacher kritik entschlossen mein komplettes layout auf css+div umzustellen, vor allem weil der quelltext zu unübersichtlich und gross ist.
das is ja soweit alles kein problem, schliesslich gibt es genug tutorials diesbezüglich.
allerdings besteht ein großteil der seite aus grafik. bisher habe ich das bild einfach in mehrere einzelteile zerschnitten und jeweils in zellen einer tabelle eingefügt. das bild ist unter anderem deshalb zerschnitten, weil es die navigation enthält und ich bei dieser mouseover effekte benutzt habe.
wie setze ich das ganze am besten um oder sollte ich für die grafik weiterhin eine tabelle benutzen?

hier das beispiel:
http://www.fantomasss.de/stuff/scv2/news.htm

[marco]

und gleich noch ne frage zum w3c validator.. w3c fordert für jedes bild  alt="".. wenn wie bei mir die page aus mehreren bildern besteht kommt unter IE bei jedem bild der alternativ text. bei bestimmten bildern mag das ja sinn machen, wie z.b. bei navi bildern aber wozu sollte ich bildern die von 1-30 durchnummeriert sind noch nen alt geben. es sieht total blöd aus wenn bei jeder bewegung das 01 ect angezeigt wird. gibts da ne möglichkeit das zu umgehen und trotzdem valid zu sein?

ich habe mich nach mehrfacher kritik entschlossen mein komplettes layout auf css+div umzustellen, vor allem weil der quelltext zu unübersichtlich und gross ist.
das is ja soweit alles kein problem, schliesslich gibt es genug tutorials diesbezüglich.
allerdings besteht ein großteil der seite aus grafik. bisher habe ich das bild einfach in mehrere einzelteile zerschnitten und jeweils in zellen einer tabelle eingefügt. das bild ist unter anderem deshalb zerschnitten, weil es die navigation enthält und ich bei dieser mouseover effekte benutzt habe.
wie setze ich das ganze am besten um oder sollte ich für die grafik weiterhin eine tabelle benutzen?

hier das beispiel:
http://www.fantomasss.de/stuff/scv2/news.htm

[Kai]

Hallo,
lass das alt-tag einfach leer alt="", ist zwar nicht im Sinne des Erfinders aber Webseiten aus Grafiken und Tabellen auch nicht.

[Ashura]

Hallo marco.

[...] aber wozu sollte ich bildern die von 1-30 durchnummeriert sind noch nen alt geben.

Um einen Alternativtext für alle Sehgeschädigten, Suchmaschinen, Nutzer von Textbrowsern, ... zur Verfügung zu stellen.

es sieht total blöd aus wenn bei jeder bewegung das 01 ect angezeigt wird.

Dass der IE beim Überfahren eines Bildes mit der Maus das dazu gehörige alt-Attribut als Tooltip anzeigt, ist seine Eigenart und nicht im Sinne des Erfinders.

gibts da ne möglichkeit das zu umgehen und trotzdem valid zu sein?

Gib dem alt-Attribut einen _sinnvollen_ Wert und dem title-Attribut den gewünschten Text, welcher beim Überfahren mit der Maus erscheinen soll.

Warum beharrst du eigentlich so auf Validität?
Eine sinnvolle Strukturierung der Inhalte ist _weitaus_ wichtiger; die Validität geht damit meist einher.

Lasse dich nur nicht dazu verleiten, eine div-Suppe zu kochen, diese schmeckt ebenso wenig wie die Tabellenwüste fruchtbar ist.

Und bitte vermeide TOFU, danke.

Einen schönen Mittwoch noch.

Gruß, Ash*feel free*ura

[marco]

danke, vor allem für den div-suppe link. was meinst du mit tofu? ich esse ausschliesslich fleisch.. :P

[Ashura]

Hallo marco.

danke, vor allem für den div-suppe link. was meinst du mit tofu? ich esse ausschliesslich fleisch.. :P

[Wikipedia: TOFU]

Einen schönen Mittwoch noch.

Gruß, Ash*feel free*ura

[marco]

Hallo marco.

danke, vor allem für den div-suppe link. was meinst du mit tofu? ich esse ausschliesslich fleisch.. :P

[Wikipedia: TOFU]

Einen schönen Mittwoch noch.

Gruß, Ash*feel free*ura

und wie positionier ich die bilder die verlinkt werden sollen richtig? das ganze ist in meinem fall ja absolut unregelmäßig, siehe http://www.fantomasss.de/stuff/scv2/news.htm

[Ashura]

Hallo marco.

und wie positionier ich die bilder die verlinkt werden sollen richtig?

Im Normalfall gäbe es eine recht einfache Methode, Listenelemente separat zu selektieren:

ul li { /* Definitionen für das erste Listenelement und alle weiteren */ }
ul li+li { /* Definitionen für das zweite Listenelement und alle weiteren */ }
ul li+li { /* usw. ... */ }

Nun könntest du abweichende margin-bottom-Definitionen angeben, welche die Elemente ausrichten.
Notfalls könntest du auch mit absoluter Positionierung arbeiten, wobei hier die Gefahr droht, dass dein Layout bei jeder kleinen Unregelmäßigkeit auseinander bricht.

Da der derzeitig aktuelle IE diesen Selektor aber leider nicht unterstützt, wirst du wohl für jedes Listenelement eine ID (oder ggf. auch eine Klasse) vergeben müssen.

das ganze ist in meinem fall ja absolut unregelmäßig, siehe http://www.fantomasss.de/stuff/scv2/news.htm

Ich habe dir mittlerweile gezeigt, wie man hier einen Link erstellt, konsultiere hierzu auch </faq/#Q-19>.

BTW: Warum antwortest du hier, wenn du dich inhaltlich auf mein anderes Posting beziehst?

Einen schönen Mittwoch noch.

Gruß, Ash*feel free*ura

[marco]

BTW: Warum antwortest du hier, wenn du dich inhaltlich auf mein anderes Posting beziehst?

das ist ne gute frage... ich dank dir soweit erstmal. werd mir das mal alles in ruhe durchlesen und gegebenen falls mich nochmal melden.

[Der Martin]

Hallo marco,

[Wikipedia: TOFU]

du hast gelesen, was Ashura dir zum Thema TOFU ans Herz gelegt hat?
Und zitierst trotzdem wieder das komplette Vorgängerposting?

und wie positionier ich die bilder die verlinkt werden sollen richtig?

Lass sie am Stück. Zerschneide dein Bild nicht in viele Schnipsel, sondern binde es im Ganzen ein. Und dann stattest du es mit einer Imagemap aus. Dann bruchst du auch nicht die -zig alt-Attribute, die dir ja anscheinend so lästig sind.

So long,

Martin

[Ashura]

Hallo Martin.

Lass sie am Stück. Zerschneide dein Bild nicht in viele Schnipsel, sondern binde es im Ganzen ein. Und dann stattest du es mit einer Imagemap aus.

Stimmt, diese Methode dürfte hier auch gut passen.

Dann bruchst du auch nicht die -zig alt-Attribute, die dir ja anscheinend so lästig sind.

Was aber kein Grund ist, auf sie zu verzichten.

Einen schönen Mittwoch noch.

Gruß, Ash*feel free*ura

[Ashura]

Hallo marco.

ich habe mich nach mehrfacher kritik entschlossen mein komplettes layout auf css+div umzustellen, vor allem weil der quelltext zu unübersichtlich und gross ist.

Wenn du dein Vorhaben so umsetzt, gehst du vom Regen in die Traufe über.
Wie ich in meinem anderen Posting bereits erwähnte, solltest deine Inhalte strukturell sinnvoll auszeichnen und jegliche Darstellung mittels CSS tätigen.
In SelfHTML gibt es zu beiden Themen umfangreiche Kapitel.

allerdings besteht ein großteil der seite aus grafik. bisher habe ich das bild einfach in mehrere einzelteile zerschnitten und jeweils in zellen einer tabelle eingefügt. das bild ist unter anderem deshalb zerschnitten, weil es die navigation enthält und ich bei dieser mouseover effekte benutzt habe.
wie setze ich das ganze am besten um oder sollte ich für die grafik weiterhin eine tabelle benutzen?

Teile die ursprüngliche Grafik in Hintergrundgrafik und Grafiken für die Navigation auf, welche den Hovereffekt empfangen sollen.

hier das beispiel:
http://www.fantomasss.de/stuff/scv2/news.htm

Einen schönen Mittwoch noch.

Gruß, Ash*feel free*ura

[marco]

Teile die ursprüngliche Grafik in Hintergrundgrafik und Grafiken für die Navigation auf, welche den Hovereffekt empfangen sollen.

wie meinst du das? eine tabelle mit dem großen hintergrund bild und an den jeweiligen stellen die navigationsbilder?

[Ashura]

Hallo marco.

Teile die ursprüngliche Grafik in Hintergrundgrafik und Grafiken für die Navigation auf, welche den Hovereffekt empfangen sollen.

wie meinst du das? eine tabelle mit dem großen hintergrund bild und an den jeweiligen stellen die navigationsbilder?

Nein.
Es geht um die Navigation, also bietet sich hier eine Liste geradezu an.
Du verpasst der Liste (oder ggf. dem body-Element) deine Hintergrundgrafik und setzt den Hovereffekt für das jeweilige Listenelement oder einem volltransparenten GIF / PNG (mit alt-Attribut!) in diesem Listenelement um.

Einen schönen Mittwoch noch.

Gruß, Ash*feel free*ura

[Der Martin]

Hallo Ashura,

Es geht um die Navigation, also bietet sich hier eine Liste geradezu an.
Du verpasst der Liste (oder ggf. dem body-Element) deine Hintergrundgrafik und setzt den Hovereffekt für das jeweilige Listenelement oder einem volltransparenten GIF / PNG (mit alt-Attribut!) in diesem Listenelement um.

Auweia, da packst du aber große Kaliber aus.
Okay, die Navigation auf Listen aufzubauen, ist zwar semantisch korrekt und deine Idee hat durchaus eine gewisse Eleganz - aber meinst du nicht, dass für solche Fälle (Navi-Links in ein Bild eingebettet) eine Imagemap sinnvoller wäre?

So long,

Martin

[Ashura]

Hallo Martin.

Auweia, da packst du aber große Kaliber aus.

Möglicherweise ja.

Okay, die Navigation auf Listen aufzubauen, ist zwar semantisch korrekt und deine Idee hat durchaus eine gewisse Eleganz - aber meinst du nicht, dass für solche Fälle (Navi-Links in ein Bild eingebettet) eine Imagemap sinnvoller wäre?

Wie gesagt: ja.

Einen schönen Mittwoch noch.

Gruß, Ash*feel free*ura