DIV funktion

[Project 2010]

Hallo Leute

liege ich richtig wenn ich sage, dass die DIV funktion die barrierefreie lösung der tabellen ist?

[Marcel]

DIV ist ein tag ^^

[Project 2010]

das ist mir klar....table bzw. tr/td auch.....aber mit div lässt sich doch indem sinne das gleiche erzielen wie mit table nur eben barrierefrei oder?

[Glory]

das ist mir klar....table bzw. tr/td auch.....aber mit div lässt sich doch indem sinne das gleiche erzielen wie mit table nur eben barrierefrei oder?

Nein. Mit Barrierefreiheit hat das erstmal nix zu tun.
Es ist nur so, dass man Tabellen nicht für das Seitenlayout (also die Aufteilung in Bereiche) einsetzen sollte, weil Tabellen dafür nicht da sind, sondenr für tabellarische Daten.
Deswegen sollte man lieber <div>s einsetzen.

[afra]

Hallo Glory!

das ist mir klar....table bzw. tr/td auch.....aber mit div lässt sich doch indem sinne das gleiche erzielen wie mit table nur eben barrierefrei oder?

Nein. Mit Barrierefreiheit hat das erstmal nix zu tun.
Es ist nur so, dass man Tabellen nicht für das Seitenlayout (also die Aufteilung in Bereiche) einsetzen sollte, weil Tabellen dafür nicht da sind, sondenr für tabellarische Daten.
Deswegen sollte man lieber <div>s einsetzen.

Nein, um Gottes willen, bitte nicht. Setze semantisches Markup ein. Listen wo diese sinnvoll sind, Definitionslisten, wenn möglich Absätze und Headlines etc. Divisions benutze bitte nur zum sinnvollen Gruppieren von Seitenelementen.

Schönen Gruß

Afra

[Project 2010]

es geht um ein seitenlayout ....www.kadia.net  ich möchte die jetzige tabelle mit grauem rahmen erreichen aber ohne tabelle....dafür sind doch divs da oder

[Manuel B.]

Ich grüsse den Cosmos,

es geht um ein seitenlayout ....www.kadia.net  ich möchte die jetzige tabelle mit grauem rahmen erreichen aber ohne tabelle....dafür sind doch divs da oder

Nein, <div /> ist zum gruppieren logischer Blöcke gedacht.
Für das Layout gibt es spezielle Elemente. Für Überschriften z.B. <h1>, <h2> usw, für Absätze <p /> für List <ul /><li /> usw.

Möge das "Self" mit euch sein

[Project 2010]

und gibt es hier auf self irgendwo eine liste mit diesen elementen, weiss leider nicht mit welchem element ich die tabelle mit rahmen auf www.kadia.net ersetzen soll

[Cheatah]

Hi,

und gibt es hier auf self irgendwo eine liste mit diesen elementen,

http://de.selfhtml.org/html/referenz/elemente.htm

weiss leider nicht mit welchem element ich die tabelle mit rahmen auf www.kadia.net ersetzen soll

Es existiert keine 1:1-Übersetzung. Lerne, das HTML nichts (in Worten: *nichts*) mit der Darstellung zu tun hat. Lerne, das HTML seine Inhalte strukturiert und ihnen bestimmte Bedeutungen zuordnet. Kurz gesagt: Lerne HTML neu. Alles, was Du bisher zu wissen glaubtest, ist falsch und hinderlich.

Cheatah

[Project 2010]

interessant, irgendwie scheint es mir als ob jeder eine andere lösung hat.
doch eines weiss ich immer noch nicht^^
wie soll ich diese tabelle www.kadia.net mit grauem rahmen ersetzen, was für eine lösung gibt es da, dies ohne tabelle und barrierefrei zu lösen.

habe ja mal vorgeschlagen mit div, die einen meinen ja die anderen nein...was jetzt?

[afra]

Hallo!

interessant, irgendwie scheint es mir als ob jeder eine andere lösung hat.
doch eines weiss ich immer noch nicht^^

Es gibt nicht _die_ Lösung. Und es gibt auch nicht _die_ Antwort. Cheatah hat es angedeutet. Lerne den Aufbau von Seiten neu. Lerne die Strukturierung von Content neu. Ein einfaches Ersetzen reicht sicherlich nicht. Ideen für eine _neue_ Struktur habe ich Dir weiter oben schon gegeben.

Schönen Gruß

Afra

[Jonathan]

Hallo Project,

wie soll ich diese tabelle www.kadia.net mit grauem rahmen ersetzen, was für eine lösung gibt es da, dies ohne tabelle und barrierefrei zu lösen.

habe ja mal vorgeschlagen mit div, die einen meinen ja die anderen nein...was jetzt?

Ein div wäre eine mögliche Lösung. Du solltest jetzt aber nicht prinzipiell wo du einen Rahmen oder etwas ähnliches willst, sofort zum div greifen. Schreibe anständigen (X)HTML-Quellcode und formatiere die Elemente (Absätze, Listen, Überschriften, ...) mit CSS. Setze divs nur da ein, wo es kein anderes sinnvolles Element gibt bzw. benutze es zurückhaltend und nur da wo es sinnvoll ist zum Grppieren von Elementen. Su kannst alle Elemente mit CSS formatieren, nicht nur divs.

Jonathan

[Project 2010]

habe jetzt für den gesamten rahmen einen div genommen da es wirklich kein anderes element gibt...das bild mit den wolken würde ich gerne als hintergrundbild definieren aber nicht in diesem div da dieser ja nicht die grösse des bildes hat, sollte ich hier jetzt wieder einen div verwenden oder kann ich auch per img ein hintergrundbild definieren?

[Jonathan]

Hallo Project,

das bild mit den wolken würde ich gerne als hintergrundbild definieren aber nicht in diesem div da dieser ja nicht die grösse des bildes hat, sollte ich hier jetzt wieder einen div verwenden oder kann ich auch per img ein hintergrundbild definieren?

Ich würde das ganz anders machen.

Fasse die Überschrift und die Wolken zusammen und mache dann sowas:

<h1><img src="..." alt="Herzlich Willkommen auf dem Startportal blablabla" /></h1>

Das <h1> kriegst jetzt als Hintergrundbild das Weiße, die grüne Linie und die Wolken in einem Bild und das img erzeugt noch den (blauen) Text und das Logo.

Jonathan

[Alexander (HH)]

Ich würde das ganz anders machen.

Fasse die Überschrift und die Wolken zusammen und mache dann sowas:

<h1><img src="..." alt="Herzlich Willkommen auf dem Startportal blablabla" /></h1>

Öm, war hier nicht mal die Diskussion um Barrierefreiheit im Gang? Ein Image als Heading ist definitiv nicht das Optimum, auch wenn immerhin ein ALT-Text vorhanden ist. Auch Suchmaschinen (die in Sachen Bilder und CSS absolut benachteiligt sind) würden sich über <h1>Sinnvolle Überschrift</h1> wesentlich mehr freuen. Auch valides XHTML wäre hilfreich.

Alexander

[D.R.]

Hallo,

Öm, war hier nicht mal die Diskussion um Barrierefreiheit im Gang? Ein Image als Heading ist definitiv nicht das Optimum, auch wenn immerhin ein ALT-Text vorhanden ist.

Wo siehst du hier ein Problem?
Bilder werden dargestellt: Bild anzeigen!
Bilder werden nicht dargestellt: Alternativtext anzeigen!

Da das Bild hier zum Inhalt gehört, ist das <img /> IMHO auch sinnvoll.

Auch Suchmaschinen (die in Sachen Bilder und CSS absolut benachteiligt sind) würden sich über <h1>Sinnvolle Überschrift</h1> wesentlich mehr freuen.

Woher willst du das wissen?

mfg. Daniel

[Gunnar Bittersmann]

Hello out there!

Ein Image als Heading ist definitiv nicht das Optimum, auch wenn immerhin ein ALT-Text vorhanden ist.

Wo siehst du hier ein Problem?
Bilder werden dargestellt: Bild anzeigen!
Bilder werden nicht dargestellt: Alternativtext anzeigen!

ACK.

Auch Suchmaschinen (die in Sachen Bilder und CSS absolut benachteiligt sind)

„Also kenne ich von Deiner Domain nur den Namen und eine Grafik. Ohne alt-text, übrigens.“ Soll heißen: „Hättest du einen Alternativtext angegeben, könnte ich den problemlos lesen.“

<h1><img src="..." alt="Herzlich Willkommen auf dem Startportal blablabla" /></h1> wäre also eine sinnvolle Überschrift – wenn da nicht „Herzlich Willkommen“ drinstehen würde, was ich als Begrüßung auf einer Website nie für sinnvoll halte.

See ya up the road,
Gunnar

[Project 2010]

also vergesst mal alle texte, das ganze wird nämlich ein template für ein cms und somit werden alle texte per cms ausgegeben.

also sind für mein template nur die grafischen elemente von bedeutung, genau darum bin ich der meinung, dass ich das hintergrundbild auch mit einer div machen muss.....das hintergrundbild ist ja nicht information und daher nicht relevant daher ist ja die img lösung nicht ideal wenn wir von barrierefreiheit sprechen...oder nicht?

[Gunnar Bittersmann]

Hello out there!

dass ich das hintergrundbild auch mit einer div machen muss.....

Du kannst jedem Element eine Hintergrundbild geben: 'html', 'body', 'h1', ...

Wenn es das Hintergrundbild einer mit 'div' ausgezeichneten Gruppe anderer Elemente sein soll, dann gibst du eben diesem 'div'-Element diese CSS-Eigenschaft, ja.

das hintergrundbild ist ja nicht information und daher nicht relevant daher ist ja die img lösung nicht ideal wenn wir von barrierefreiheit sprechen...oder nicht?

Wenn es ein Hintergrundbild ist, das lediglich der optischen Gestaltung dient, ist ein 'img'-Element dafür völlig unangebracht, ja.

See ya up the road,
Gunnar

[Jonathan]

Hallo Project,

also sind für mein template nur die grafischen elemente von bedeutung,

Evtl. hast du hier recht, allerdings bin ich mir nicht ganz sicher, ob du hier das richtige meinst.

genau darum bin ich der meinung, dass ich das hintergrundbild auch mit einer div machen muss

Nein. Ich gehe davon aus, dass in deinem Template am Anfang der Seite immer ein <h1> ist, dass die Seitenüberschrift enthält. Welcher Text darin ist, ist für dein Template irrelevant, aber was spricht dagegen, dem h1 das Hintergrundbild zu geben?

das hintergrundbild ist ja nicht information und daher nicht relevant daher ist ja die img lösung nicht ideal wenn wir von barrierefreiheit sprechen...oder nicht?

Richtig, ein img solltest du als Hintergrundbild nicht einsetzen. Es hindert dich aber keiner daran, den body, Überschriften, Absätze, Formulare uvm. mit Hintergrundbildern zu versehen.

Bitte lesen:
http://de.wikipedia.org/wiki/Divitis
http://css.fractatulum.net/sample/suppe/div_suppe1.htm

Jonathan

[afra]

Hallo kakasper!

es geht um ein seitenlayout ....www.kadia.net  ich möchte die jetzige tabelle mit grauem rahmen erreichen aber ohne tabelle....dafür sind doch divs da oder

Ja und nein, bei diesem Layout von http://www.kadia.net (<- so bindet man einen Link ein) würde ich ein umschließendes zentrierendes Div mit Hintergrundbild und Rahmen nehmen, dann eine H1, dann eine LI, folgend eine H2, ein paar DL, dann wieder eine h2 usw...

Schönen Gruß

Afra

[Kai345]

Grütze .. äh ... Grüße!

das ist mir klar....table bzw. tr/td auch.....aber mit div lässt sich doch indem sinne das gleiche erzielen wie mit table nur eben barrierefrei oder?

Zur Barrierefreiheit ist natürlich noch einiges mehr erforderlich als nur die Verwendung von divs, generell gesagt haben divs erst mal nicht viel damit zu tun.
Aber sagen wir mal so: es ist einfacher, Barrierefreiheit mit einem div- und somit CSS-basiertem Layout zu erreichen. Man muß dabei nur schauen, daß man kein Div-Süppchen kocht

Cü
Kai

[Manuel B.]

Ich grüsse den Cosmos,

DIV ist ein tag ^^

Nein, <div /> ist ein Element

Möge das "Self" mit euch sein

[Manuel B.]

Ich grüsse den Cosmos,

bzw.

div ist ein Element, <div /> ist ein Tag.

Möge das "Self" mit euch sein