Da wir gerade im IRC ne kleine Diskussion zu dem Thema hatten, möchte ich euch einfach mal fragen, was ihr für besser haltet und selbst praktiziert: Gestaltet ihr eure Webseiten so semantisch korrekt wie möglich (<hx> für Überschriften, Texte schön in <p></p> und alles was einer Aufzählung ähnelt [z.B. eine Navigation] als echte Auflistung) oder macht ihr es euch einfach und benutzt für alles <div> und <span> und gestaltet eure Designs hauptsächlich mit Tabellen?
span hab ich noch nie genutz, find ich sinnlos....
Benutze div, p, überschriften, und eigentlich alles so korrekt wie möglich^^
ich versuche es zumindest.
tabellen sucken.
ne, navi mach ich ned als listen, sondern einfach als untereinanderstehende links die alle display:block gedingst werden.
--
cats are not characteristically disposed toward voluntary aerobic exercise
Ich bekenne mich als Tabellen-Benutzer. Ich versuche allerdings <div>s bzw eben die korrekten Tags wie <hx> und Listen da zu benutzen, wo sie auch hingehören und ein bisschen von den Tabellen wegzukommen
Wobei ich Tabellendesigns nicht so schlimm finde, wie die meisten anderen hier im Forum
--
Eines vorweg, mit deiner Überschrift implizierst du, sematisch korrektes HTML sei nicht simpel und leicht.
h1, p, blockquote, ul, ol und wie sie nicht alle heißen sind alle bereits mit Formatierungen ausgestattet. Das erlaubt es graphischen Browsern, ohne weitere Stylesheetangaben ein Dokument so darzustellen, dass man Überschriften und Absätze voneinander unterscheiden kann.
Im Gegensatz dazu wäre eine div/span Suppe a la
Das habe ich mir nicht ausgedacht. Entsprechende Fälle sind keine Seltenheit. Freenet bringt es auf 445 <div>s...
Wenn das nicht kompliziert ist?
Ich selbst gehe so gut wie möglich semantisch vor. Die Überschriften erster und zweiter Ordnung verstecke ich, da sie nur für Textbrowser relevant sind. Die anderen verwende ich je nach Bedarf.
Ich verwende kein <b> und kein <i> (<u> sowieso nicht), stattdessen verwende ich <em> und <strong>. Halt mag jetzt jemand sagen, semantisch etwas falsch verwenden ist doch böse.
Das ist richtig, aber indem ich nur <em> und <strong> verwende zwinge ich mich selbst immer wieder nachzudenken, ob dieses Wort wirklich betont werden muss. Nicht selten bin ich dann zur Entscheidung der Nichtnotwendigkeit gekommen.
Auch verwende ich Listen, dank Stylesheets sieht man es ihnen aber nicht an, man hat eben künstlerische Freiheit
Sematisches Auszeichnen mit HTML macht viel Sinn:
- Nicht-graphische Browser (Braille, Speaker, etc.) sprechen keinen langen Fließtext, sondern Überschriften und Absätze mit entsprechender Betonung.
- Suchmaschienen können korrektes HTML besser Verarbeiten und weisen ihm mehr bedeutung zu. Das bezieht sich teilweise auf die strengere XHTML Syntax.
--
Die Wespe, der Fuchs und der Vogel gehen erst in die Oper und dann auf Safari. 8)
Nützliche Adressen (HTML, CSS, PHP, MySQL, Werkzeuge) für Webgestalter.
-> Übersicht meiner Artikel (HTML Strict verstehen Teil 1-8 und weitere interessante Themen).
Auflistungen meist in Listenelementen, Menü's vielleicht demnächst in Listenelementen (habe schonmal ein Versuch mit CSS gestartet und es war garnichtmal so übel).
Gegen Tabellenwebseiten habe ich nicht's einzuwenden, propagandiere jedoch lieber CSS Webseiten, da diese "komplizierter" umsetzbar sind und viele Leute sich von einfachen Betitelungen wie "Kann jeder Benutzer lesen oder vorlesen lassn, geniale Barrierefreiheit, bla..." begeistern lassen - auch wenn die Seiten der Leute garnicht für diese kleinere Gruppe von Menschen gemacht sein sollte/ müsste.
Im Grunde ist es mir Schnuppe wie jemand seine Seite erstellt, aber ich lege Wert auf selbstgeschriebenen Code (von mir aus auch per PHP verunstaltet in der "schönen" Form - sprich Einrückungen usw.).
Wenn ich für jemand ein Design slicen soll verwende ich auch nur CSS, wenn ich ein Slice ausbessern soll das auf Tabellen bassiert kommt es auf die Tabelleneinteilung an, erstelle jedoch meist auch wieder auf CSS basierende Enddateien (aber auch nur wenn ich mit dem Tabellenzeug das ich geliefert bekomme nicht allzuviel anfangen kann ohne mich groß damit zu beschäftigen [habe kein WYSIWYG Editor - will auch nur selten einen
Zu Texten: Ich verwende meist <div> Elemente für Texte, ich verstehe die <p> Elemente nicht so richtig wegen Ihrer äußeren Formatierung - und deren Abständen - aber ich habe mich auch noch nie richtig mit ihnen beschäftigt.
--«Wir können alles schaffen, wir brauchen nur genug dressierte Affen» - infinite monkey theorem
Ich habe nie Tabellen für Layouts verwendet, würde mich da auch erstmal einarbeiten müssen, daher bleibe ich sicher bei der <div>-Variante. Überschriften kennzeichne ich auch immer mit entsprechenden <h*>-Tags und verwende für Absätze in letzter Zeit auch meistens <p>-Elemente.
Den ganz radikal korrekten Kurs mit <strong>, <em> und Listen bei der Navigation habe ich allerdings nicht eingeschlagen, kommt aber vielleicht noch, wenn ich mal eine komplett neue Site machen sollte. Grundsätzlich finde ich nämlich schon, dass man Elemente so verwenden sollte, wie sie vorgesehen sind, das W3C bestimmt das ja nicht aus Willkür oder zum Spaß. o_O
@ Dennis: Die Abstände bei <p>-Elementen bekommst du doch ganz einfach mit "padding: 0px; margin: 0px;" weg. o_O
--A human is a system for converting dust billions of years ago into dust billions of years from now via a roundabout process which involves checking email a lot.
Ich weiß, aber das wäre dann unnötig, da kann man dann gleich <div> Elemente nehmen.Zitat von drunken monkey
--«Wir können alles schaffen, wir brauchen nur genug dressierte Affen» - infinite monkey theorem
Eben nicht. Es geht ja gerade um die Vorformatierung, die zB in Textbrowsern bzw bei fehlendem CSS ihre Wirkung zeigt. Und es geht ums Prinzip: <div>s sind nichtssagende Tags, die keine besondere Bedeutung haben, sondern eben einfach nur zur Formatierung benutzt werden können. <p>s sind Absätze, sie haben also eine sinnvolle Bedeutung innerhalb des Textes.Ich weiß, aber das wäre dann unnötig, da kann man dann gleich <div> Elemente nehmen.
--
Warum soll das besser sein als eine Liste? Listen sind entsprechend formatierbar und im Textbrowser auch als soclche erkennbar.
Vermutlich ist gegen eine einzge Tabelle nichts auszusetzen, mein altes Projekt basierte beispielsweise auch auf einer Tabelle und war mit Lynx sehr gut darstellbar.
Tatsache ist aber, dass sich mit Stylesheets wesentlich mehr herausholen lässt, und das, obwohl einige werwirrte Leute noch eine bestimmte Software als Browser misverstehen.
CSS ist nicht komplizierter. Der HTML Code lässt sich bei standardnahen Designs besser Warten als mit unzählich verschachtelten Tabellen. Sicher werden dann mehr als 4 <div>s gebraucht, mit denen ich z.B. in meinem aktuellem Projekt auskomme.
Aber du darfsst gutes CSS Design nicht mit meinen Negativbeispielen oben verwechseln.
Zum Vorlesen: Ich selbst und viele meiner Bekannten lassen sich Internetseiten vorlesen, obwohl unsere Augen noch sehr gut sehen. Von daher sollte man nicht ausgehen, dass nur blinde Menschen sich was vorlesen lassen.
Bezüglich Barrierefreiheit: Ist dir schon mal in den Sinn gekommen, dass immer mehr Mobiltelefone und Handhelds (Tragbare PDAs, die PSP, Nintendo DS) im internet surfen können? Wie sollen diese Geräte deine Seiten darstellen? Und besitzer dieser Geräte können durchaus zu deiner Zielgruppe gehören!
Gerade deshalb ist es auch wichtig <p> statt <div> zu verwenden!
<p> sagt einem graphischen Browser dass ein Absatz von einem anderem unterschieden werden kann. Dies trifft auch ohne formatierung auf Textbrowser zu.
Verwendest du dagegen <div> Sieht man nur lauter zusammengeklebte Textblöcke und ich tu mich schwer, dem Text dann entsprechend Bedetung zuzurdnen, so geht es sicher auch manchen Suchmaschinen.
--
Die Wespe, der Fuchs und der Vogel gehen erst in die Oper und dann auf Safari. 8)
Nützliche Adressen (HTML, CSS, PHP, MySQL, Werkzeuge) für Webgestalter.
-> Übersicht meiner Artikel (HTML Strict verstehen Teil 1-8 und weitere interessante Themen).
Ich habe komplizierter extra in Anführungszeichen gesetzt.
Zu den Zielgruppen und den alternativ Geräten (vor allem Nintendo DS dürfte so gut wie keine Probleme mit Tabellendesigns haben, da man auf dem unteren Bildschirm im Normalmodus ja die Seite sieht undmit dem Stylus "befährt" um auf dem Topscreen das ganze größer zu betrachten): Das ist mir schon klar, aber so viele Menschen verwenden diese Geräte (noch) nicht (oder noch nicht richtig).
Bandwebseiten z.B. beinhalten meist nicht wirklich informatives auser den Tourdaten und vielleicht ein oder 2 interessante Geschichtchen über die Band, der Rest besteht meist aus irgendwelchem Vorzeige MP3s oder die Seite ist komplett aus Flashelementen, solche Seiten bekommt man schwer auf die mobilen Geräte - da hat man meist nur eine spezielle Seitenversion als Alternative auf HTML Basis mit wenig Schnick- Schnak. Die sollte dann natürlich angepasst sein an die Mobile Geräte.
Nocheinmal zu der <div> und <p> Geschichte: Ich verwende meist nur ein <div> und darin kommt der gesamte Inhalt (mit <br /> Absätzen) - macht da ein Vorlesebrowser/ Programm wirklich so große Unterschiede (wenn 2x <br /> statt <p>)?
Was für ein Programm/ Browser verwendest Du für das vorlesen? Ich habe bis jetzt nur schlechte Erfahrung mit diesen Anwendungen gesammelt, sprich: Texte waren schlecht verständlich von der Stimme.
Ich erwirke aber das selbe Ergebnis wenn ich 2 <br /> verwenden statt <p> Elemente. Aber ich werde mich mal näher damit befassen wenn Du sagst das die so wichtig sind.
--«Wir können alles schaffen, wir brauchen nur genug dressierte Affen» - infinite monkey theorem
Es ist bequemer, imo.
Ich brauche keine Umbrüche, spare Aufwand bei der Formatierung etc.
es ist schon ein unterschied, ob ich
oder
schreiben muss
edit:
code auf nem roten hintergrund ist scheiße >_> man sollte die standartfarbe ändern...
--
cats are not characteristically disposed toward voluntary aerobic exercise
Ich sehe das eher als Kritikpunkt der Band. Aber das ist ein verbreitetes Problem, offizielle Seiten sind so oft so derartig schlecht, das mal am liebsten losheulen möchte
Flash ist natürlich eine Ausgeburt der Hölle XD Vor allem wenn "Skip intro" innerhalb der Flashanimation stehtAber das ist wieder ein ganz anderes Thema.
Ja, diverse Freeware ist wirklich nicht sehr gut und ist von daher vermutlich auch nicht, mit speziell dafür ausgelegten Programmen vergleichbar.
Seit kurzem habe ich das Vergnügen auch OS X testen zu dürfen, das über eine eigene Sprachausgabe verfügt.
Was mir bei <br /> auffällt ist, dass die Pause dazwischen relativ kurz ist, was ich persönlich als nervig empfinde. Es sind zwar englische Stimmen, aber das sollte in diesem Fall keine Rolle spielen.
--
Die Wespe, der Fuchs und der Vogel gehen erst in die Oper und dann auf Safari. 8)
Nützliche Adressen (HTML, CSS, PHP, MySQL, Werkzeuge) für Webgestalter.
-> Übersicht meiner Artikel (HTML Strict verstehen Teil 1-8 und weitere interessante Themen).
Es ist bequemer, imo.
Ich brauche keine Umbrüche, spare Aufwand bei der Formatierung etc.
es ist schon ein unterschied, ob ich
<div class='navi'>
link
link
link
link
</div>
oder
<div class='navi'>
<ul>
<li> link </li> <br />
<li> link </li> <br />
<li> link </li> <br />
<li> link </li> <br />
<li> link </li> <br />
<li> link </li> <br />
</ul>
</div>
schreiben muss
edit:
code auf nem roten hintergrund ist scheiße >_> man sollte die standartfarbe ändern...
edit: *[-tt-]* benutz^^
--
cats are not characteristically disposed toward voluntary aerobic exercise
Deine beiden Beispiele entsprechen zwei verschiedenen Anzeigemethoden, was willst du denn nun?
Listenpunkte kannst du sowohl nebeneinander als auch untereinander mit Abstand anzeigen, geht mit Stylesheets viel einfacher als mit <br />.
Der neuen Führung bereits gemeldet.
--
Die Wespe, der Fuchs und der Vogel gehen erst in die Oper und dann auf Safari. 8)
Nützliche Adressen (HTML, CSS, PHP, MySQL, Werkzeuge) für Webgestalter.
-> Übersicht meiner Artikel (HTML Strict verstehen Teil 1-8 und weitere interessante Themen).
Ich frag mich, warum CSS und Tabellen immer als gegensätzlich gesehen werden. Ich kann meine Tabelle doch auch mit CSS formatieren...
--
Es geht darum, das ich die Tabelle als Designmittel missbraucht habe, unabhängig davon, ob sie mit CSS formatiert wurde oder nicht. Das ist das einzige was an Tabellen kritisiert wird: Dass sie als Gestaltungsmittel und nicht für tabellarische Daten verwendet werden - obwohl Spaltendesigns schon lange mit CSS möglich sind.
Sicher stimmst du mir zu, dass Spalte 1 Menü und Spalte 2 Inhalt weitaus weniger bezug zueinander hat als eine tabellarische Auflistung der Threads in diesem Forum mit entsprechenden Tabellenüberschriften.
--
Die Wespe, der Fuchs und der Vogel gehen erst in die Oper und dann auf Safari. 8)
Nützliche Adressen (HTML, CSS, PHP, MySQL, Werkzeuge) für Webgestalter.
-> Übersicht meiner Artikel (HTML Strict verstehen Teil 1-8 und weitere interessante Themen).
Wenn mein Design eine Tabelle ist, warum soll ich mir unnötig mit <div>s einen abkrampfen?
--
Weil man außerhalb der Tabelle denken muss
Ich weis beispielsweise nicht, welche col/rowspan Mischung ich schreiben muss um eine Tabelle zu erhalten, die eine Kopfzeile hat, in der linken Spalte zwei zellen und in der rechten drei.
In der Praxis bleit es daher aus Erfahrung nicht bei einer Tabelle.
Ein Design ohne Tabelle ist dagegen wesentlich flexibler und kann besser angepasst werden. Der Quelltext wird nicht stark aufgebläht und man findet sich daher relativ schnell gut zurecht.
--
Die Wespe, der Fuchs und der Vogel gehen erst in die Oper und dann auf Safari. 8)
Nützliche Adressen (HTML, CSS, PHP, MySQL, Werkzeuge) für Webgestalter.
-> Übersicht meiner Artikel (HTML Strict verstehen Teil 1-8 und weitere interessante Themen).
mit entsprechenden stylesheets kann man beides gleich formatieren*.
im oberen beispiel würd ich halt einfach auf alle <a> elemente in dem div ein display:block oder wie des heißt (dreamwaver macht faul... :P) legen, und sie wären hübsch untereinander. GENAUSO (also von der letzendlichen anzeige) könnte ich sie auch mit listen Formatieren, allerdings hätt ich da imo mehr codeaufwand.
Ich benut listen eigentlich nur zum Auflisteon von Zutaten, INhaltsverzeichnissen etc.
Ein weiterer Grund für Divs, sie sind einfacher
* Eigentlich kann man dank CSS jedes Tag stellvertretend für jedes andere Verwenden (außer das bei manchen [leider] manche attribute nicht möglich ist)
Wenn für h1 z.b. alle attribute erlauft wären wie für div, könnte man ne ganze page nur mit h's stylen 8)
--
cats are not characteristically disposed toward voluntary aerobic exercise
Die Praxis hat gezeigt, das eine allgemeine Standardisierung von Webseites mehr Traffic spart als verursacht
Ich suche mal nach Belegen dafür.
Im moment fallen mir da auch nur href für Verwesie und spezielle Inputattribute ein, ansonnsten könnte man alles nur mit einem einzigen Element machen (Bilder mit Hintergrundbildern^^). BTW: src (von <img />) kann man in XHTML 2 auch jedem Element geben^^
Aber HTML ist halt eie Auszeichnungssprache die mit semantik im Kopf entwickelt wurde.
--
Die Wespe, der Fuchs und der Vogel gehen erst in die Oper und dann auf Safari. 8)
Nützliche Adressen (HTML, CSS, PHP, MySQL, Werkzeuge) für Webgestalter.
-> Übersicht meiner Artikel (HTML Strict verstehen Teil 1-8 und weitere interessante Themen).
Berechtigungen
Zitieren
