nicht angemeldet
Erstens war es nicht Kai345, der von <br>s und s geredet hat
Für diese Verwechslung möchte ich mich entschuldigen.
sondern ich und zweitens hast Du Dich darauf eben nicht bezogen - schließlich hast Du absichtlich provokativ gefragt, wie "man denn einen JavaScript-Countdown semantisch aus[zeichnet]".
Daran war nichts provokativ. Dem Fragesteller wurde hier ein Ratschlag gegeben, leider sehr allgemein und unkonkret. Meine Bitte war, das bitte einmal auszuführen. Mit Bezug auf diesen konkreten Anwendungsfall.
<br>s sind ... NICHT dafür da, vertikale Abstände zu erzeugen.
s sind ... NICHT dafür da, horizontale Abstände zu erzeugen.
Richtig, man könnte dieses Konstrukt durch CSS-Formatierungen ersetzen, aber ehrlich gesagt weiß ich nicht, was das *in diesem Fall* bringen würde. Außer das Gefühl, dass man eine Technik nicht für etwas benutzt hat, wofür sie nicht gedacht war.
Der Code wäre lesbarer. Bei Layoutänderungen (CSS) muss die Struktur (HTML) nicht jedesmal angepasst werden. Keinerlei brauchbare Information beinhaltende Elemente fallen weg.
Nun, das ist doch hier der springende Punkt und darum geht es mir. Die übliche Schulmeinung von der guten Textauszeichnung samt ihrer üblichen Vorteile ist hier schwer anwendbar. Schau dir den Countdown einmal an, da wirst du ohnehin kein »brauchbare Information beinhaltendes Element« finden. Einfach weil keine Information existiert, die man entsprechend ihrer Bedeutung auszeichnen könnte.
Was genau sollte Deine Frage bezüglich der "semantisch korrekten" Notation von Javascript-Code bezwecken?
Wieso denn »von JavaScript-Code«? Ich habe vom HTML gesprochen. Vom HTML, das hier kritisiert wurde. JavaScript-Code kann man nicht semantisch auszeichnen, aber HTML-Code.
So wie ich Dich bisher kennengelernt habe und einschätze
... hast mich offenbar nicht verstanden, warum ich mich hier im Forum bewege, wenn du mir Kindereien vorwirfst, anstatt meine Fragen ernst zu nehmen.
hast Du sehr wohl Ahnung von vernünftiger HTML-Syntax, und -Notierung, weißt wozu CSS da ist
Ja, im Allgemeinen.
Nun geht es hier aber um einen JavaScript-Ticker mit Bildern, dessen HTML schlicht leer ist. Es ist ein ungeordnetes Elementgerüst, in das das JavaScript Bilder einfüllt. Letztlich steht da bloß »noch 94 Tage und 03:13:39 Stunden bis zum 18. Juli 2009«. Dieser Text ist sehr kompliziert und unaufgeräumt in HTML gegossen, ja. Unzugänglich zudem, weil alles in Bildern versteckt ist.
Aber was ist daran wie zu verbessern? Fangen wir einfach an:
<p>noch 94 Tage und 03:13:39 Stunden bis zum 18. Juli 2009</p>
Ich kann den obigen Satz erst einmal so auszeichnen, dass ich für CSS und JavaScript alle nötigen Angriffspunkte habe. Dabei kommt ungefähr so etwas heraus (sicher noch Optimierung möglich):
<p id="ticker">
<span id="ticker-noch">noch</span>
<span id="ticker-tage-wort">
<span id="ticker-tage-zahl">94</span>
<span id="ticker-tage-wort">Tage</span>
</span>
<span id="ticker-stunden">
<span id="ticker-stunden-und">und</span>
<span id="ticker-stunden-zahl">03:13:39</span>
<span id="ticker-stunden-wort">Stunden</span>
</span>
<span id="ticker-bis">bis zum 18. Juli 2009</span>
</p>
Dieses HTML ist nicht generisch, sondern ganz darauf zugeschnitten, wie die Präsentation sein wird. Wenn ich eine andere Präsentation oder ein anderes JS-Verhalten haben will, dann muss ich das HTML ändern.
Um aus diesem HTML die gewünschte Darstellung zu machen, muss ich einige fortgeschrittene CSS-Techniken kennen und anwenden können. Ich kann z.B. die statischen Teile mit CSS-Image-Replacement ersetzen, sodass der Text weiterhin zugänglich bleibt. Und die gesamten spans mit margins und ggf. display:block auf der Schultafel positionieren. Dabei kommt, vermute ich mal, ein beachtliches Stylesheet heraus. Mit JavaScript könnte ich dann den Ticker dynamisieren, indem ich #ticker-tage-zahl und #ticker-stunden-zahl mit img-Elementen mit alt-Text beschreibe.
Damit hätte ich Struktur und Formatierung getrennt, das ganze wäre recht abwärtskompatibel und mittelmäßig zugänglich. Aber was ist daran jetzt substantiell besser oder gar einfacher und übersichtlicher geworden? Ich habe sehr viel Aufwand in die Trennung von HTML und CSS investiert mit dem Ergebnis, dass das HTML kein Stück »semantischer« geworden ist, sondern eine hochspezifische span-Suppe geblieben ist. Und um diese recht einfache Darstellung ohne und <br> zu erreichen, muss ich ein dickes Stylesheet mit viel Know-How schreiben.
Okay, für mich weniger ein Problem, weil ich die nötigen Techniken beherrsche und vertraut mit dieser Arbeitsweise bin. Für einen Einsteiger aber ein sehr großes Problem, daher versteht es sich m.M.n. von selbst, warum der eine Quick'n'Dirty-Lösung wählen wird. Und da hätte ich in diesem Fall auch nichts vernünftig einzuwenden, denn für ihn hatte die andere Arbeitsweise erst einmal keine Vorteile. Ja, quick'n'dirty ist grauslich, aber das Problem an diesem JavaScript-Ticker ist doch wahrlich nicht das zusammengehackte Markup, sondern vielmehr das Konzept. Denn das kann ich, selbst mit getrenntem HTML/CSS, nicht eleganter und vorteilhafter umsetzen.
Mathias