3 Browser - 3 Bilder
0 
Felix Riesterer
0 0 Felix Riesterer
0 0 at
0 at
3 Browser - 3 Bilder
Der MartinHallo Leute,
ich habe eine vergleichbar einfache HTML-Konstruktion, aber meine 3 Browser stellen sie unterschiedlich dar.
Hier zunächst der HTML-Quelltext
...
<ul>
<li>
<img src="bild.jpg" alt="Alternativtext" style="float:left; margin-left:1em; margin-right: 1em;">
<a href="ziel.html">Linktext</a>
</li>
...
</ul>
Für <li> ist im zentralen CSS-File nur Schriftgröße und -farbe formatiert, für <ul> gar nichts. Das Bild ist unwesentlich höher als eine Druckzeile und etwa quadratisch.
Und so sieht das Ganze im Browser aus:
Internet Explorer (6 und 7beta Preview) bringt zunächst einen Abstand vom linken Rand, dann das Bild, danach das Aufzählungszeichen (dicker Punkt) und dann den Link-Text.
Firefox 1.5 bringt ganz vorne den Aufzählungspunkt (ohne Abstand, also in einer Flucht mit dem Ansatz der übrigen Punkte, die keine Bilder haben), dann den Abstand von 1em, dann das Bild und nach weiterem angemessenen Abstand den Linktext.
Opera 8.52 bringt zunächst einen linken Abstand, dann das Bild und daneben im passenden Abstand den Linktext. Der Aufzählungspunkt fehlt ganz, aber nur bei diesem Eintrag - bei denen ohne Bild, ist er natürlich vorhanden.
Mir sind alle 3 Darstellungen recht, da sie die gewünschte Gliederung immer noch abbilden. Optisch gefällt mir die Variante vom Firefox etwas besser als die übrigen, wohl wegen der durchgehenden Fluchtlinie.
Aber, wie müsste es denn gemäß der reinen CSS-Lehre aussehen ?
Habe ich irgendwas falsch gemacht, was die Browser aus dem Tritt bringt ?
Validierung beim W3C-Validator mit HTML-Strict bringt übrigens keine Fehler.
-
Lieber Thomas,
Für <li> ist im zentralen CSS-File nur Schriftgröße und -farbe formatiert, für <ul> gar nichts.
das bedeutet, dass der Browser <ul> entsprechend seines voreingestellten Stylesheets darstellt. Dass dieses in den verschiedenen Browsern natürlich nicht identisch ist, das kannst Du Dir vorstellen, oder?
Du kannst natürlich alle von Dir verwendeten Elemente in Deinem Stylesheet mit allen wesentlichen Eigenschaften neu "einstellen", dann hast Du auch die Gewähr, dass die Voreinstellungen der Browser mit der Anzeige Deiner Seite keine Willkür mehr walten lassen können. Nur noch der User selbst kann - je nach Browser - dann noch die von Dir beabsichtigte Art der Anzeige stören.
Liebe Grüße aus Ellwangen,
Felix Riesterer.
-
Hallo Felix,
...
das bedeutet, dass der Browser <ul> entsprechend seines voreingestellten Stylesheets darstellt. Dass dieses in den verschiedenen Browsern natürlich nicht identisch ist, das kannst Du Dir vorstellen, oder?
... naja, ich dachte eigentlich, dass man sich bei der Spezifikation von HTML und CSS etwas Konkretes vorgestellt hat. Dass z.B. ein <p>...</p> einen Absatz definiert, der vom übrigen Inhalt durch einen Zwischenraum (Leerzeile ?) abgesetzt ist, scheint ja auch allgemeiner Konsens zu sein.
Also ging meine Frage dahin, ob die Spezifikation von HTML und CSS eine "verbindliche" Darstellung für das Konstrukt impliziert. Immerhin sind ja die Unterschiede doch recht erheblich.
Grüße aus Berlin
Thomas-
Lieber Thomas,
Du hast mich anscheinend nicht verstanden.
... naja, ich dachte eigentlich, dass man sich bei der Spezifikation von HTML und CSS etwas Konkretes vorgestellt hat. Dass z.B. ein <p>...</p> einen Absatz definiert, der vom übrigen Inhalt durch einen Zwischenraum (Leerzeile ?) abgesetzt ist, scheint ja auch allgemeiner Konsens zu sein.
Das ist zwar richtig, welche exakte Schriftart mit welchem Zeilenabstand und Schriftgröße dazu allerdings verwendet wird, ist relativ und Einstellungssache. So gefällt mir z.B. nicht, was Textverarbeitungen wie Word oder OpenOffice als Überschriften voreingestellt haben. Daher muss ich das in meiner Vorlage entsprechend meinen Vorstellungen ändern.
Gleiches gilt auch bei den Browsern. Diese haben zum Teil unterschiedliche Voreinstellungen, was Abstände, Schriftarten und -größen angeht. Dazu kommt noch, dass diese Vorseinstellungen vom Benutzer geändert werden können, wie z.B. die Hintergrundfarbe und Schriftfarbe. Wenn Du diese in Deinem Stylesheet nicht festlegst, dann gelten die Werte des Benutzers und Deine Seite sieht eben nicht mehr so aus, wie Du das konzipiert hast!
Im Übrigen: "Spezifikation von HTML" hat rein überhaupt nichts mit dem Aussehen zu tun. HTML zeichnet Inhalte semantisch aus. Sonst nix! Wie das aussieht, regelt der Browser. Auch wenn in den HTML-Versionen immer mehr Elemente und Attribute hinzugefügt wurden, die konkret für die optische Präsentation entworfen wurden, so ist dieses zwar bedauerlich (denn es gibt für diese Aufgabe ja seit 1998 die CSS-Technologie), aber es ändert nichts an der ursprünglichen Funktion von HTML.
Noch viel deutlicher wird das bei Deiner "Spezifikation von CSS": CSS interessiert überhaupt nicht, wie etwas aussieht oder auszusehen hat. Ob es sich um ein <p>-Element oder ein <table>-Element handelt, ist CSS herzlich wurschd. Es gibt Einstellungen, mit denen Du ein <p> wie eine Tabelle, und ein <table> wie einen Textabsatz aussehen lassen kannst. Aber auch hier gibt es in den Browsern ein default-CSS, in dem die nötigen Einstellungen bereits getätigt sind, damit ein <p> oder ein <table> in etwa so aussieht, wie Du Dir das vorstellst. Aber wie schon gesagt: Je nach Browser gibt es da Unterschiede im Detail!
Also ging meine Frage dahin, ob die Spezifikation von HTML und CSS eine "verbindliche" Darstellung für das Konstrukt impliziert. Immerhin sind ja die Unterschiede doch recht erheblich.
Tja, diese Frage ist wohl im Hinblick auf Dein "verbindlich" mit einem deutlichen Nein zu beantworten. Begründung siehe oben.
Liebe Grüße aus Ellwangen,
Felix Riesterer.
-
Hallo Felix,
vielen Dank für deine ausführliche Antwort, die mir auch völlig einleuchtet. Dennoch 2 Bemerkungen:-
Ich habe bei allen 3 Browsern bzgl. CSS die Standard-Einstellungen. Ich denke mal, dass nur ein verschwindend geringer Anteil der Nutzer hier bewusst Veränderungen vornimmt. Als Webmaster verlasse ich mich also weitgehend darauf und nehme für Elemente, die im Standard wunschgemäß aussehen keine eigene Formatierung vor.
-
Im konkreten Fall scheinen mir 2 der 3 Browser mit ihrer Darstellung nun aber doch sehr freizügig zu sein. Der Firefox macht es so, wie ich es mir laut Struktur der Tags vorstellen würde.
Der IE zieht das Bild (und dessen Margins) vor den Aufzählungspunkt, obwohl es innerhalb <li>...</li> steht. Hier wird offenbar das "float:left" höher interpretiert. Opera lässt hingegen, den Aufzählungspunkt (bei dem Eintrag mit Bild) ganz weg. Dass er das Bild anstelle dessen verwendet, kann ich so auch nicht ganz empfinden, jedenfalls sieht es optisch nicht danach aus (Einrückung).
Also wie gesagt, ich finde alle 3 Darstellungen akzeptabel, aber so ganz überzeugt bin ich nicht, dass es von den Browsern so gewollt ist. Ich würde 2 der 3 Formen denn doch als "Bugs" bezeichnen.
-
Hallo Thomas,
Als Webmaster verlasse ich mich also weitgehend darauf [auf die Browser-Defaults] und nehme für Elemente, die im Standard wunschgemäß aussehen keine eigene Formatierung vor.
das halte ich für einen falschen Ansatz. Ich finde es richtiger, für _alle_ Elemente die Formatierungen und Eigenschaften explizit anzugeben, auf die du in der Darstellung Wert legst. Keine Angaben zu bestimmten Eigenschaften zu machen, kommt für mich der Aussage "ist mir egal" gleich. Das mache ich z.B. in sehr textlastigen Seiten, wo ich Schriftart und Größe, evtl. auch die Farben, nicht explizit festlege, sondern diese Wahl dem Browser oder dem Benutzer überlasse.
Also wie gesagt, ich finde alle 3 Darstellungen akzeptabel, aber so ganz überzeugt bin ich nicht, dass es von den Browsern so gewollt ist. Ich würde 2 der 3 Formen denn doch als "Bugs" bezeichnen.
Okay, bei Listen mit zusätzlichen Grafiken habe ich noch keine Erfahrungen gesammelt. Aber Tatsache ist, dass die verbreiteten Browser die übliche Anordnung bei Listen (Bullet, Einrückung) unterschiedlich realisiert wird (teils mit margin, teils mit padding, teils im ol/ul, teils im li). Daraus ergeben sich vermutlich auch die unterschiedlichen Darstellungen _mit_ Bild.
Schönen Tag noch,
Martin--
Viele Fachleute vertreten die Ansicht, jedes Feature eines Programms, das sich nicht auf Wunsch abstellen lässt, sei ein Bug.
Außer bei Microsoft. Da ist es umgekehrt. -
Lieber Thomas,
Als Webmaster verlasse ich mich also weitgehend darauf und nehme für Elemente, die im Standard wunschgemäß aussehen keine eigene Formatierung vor.
Warum fragst Du hier dann nach? Wenn es Dir egal ist, dann ist es Dir doch egal... oder doch nicht?
Also wie gesagt, ich finde alle 3 Darstellungen akzeptabel, aber so ganz überzeugt bin ich nicht, dass es von den Browsern so gewollt ist. Ich würde 2 der 3 Formen denn doch als "Bugs" bezeichnen.
Es sind definitiv keine Bugs, sondern Deine Sichtweise hat eher solche Eigenschaften, denn meine Ausführungen (die sich sehr auf den hier im Forum immer wieder nachlesbaren Konsens stützen) lehnst Du nach wie vor ab.
Daher lasse ich Dich schalten und walten wie Du willst. Viel Spaß!
Liebe Grüße aus Ellwangen,
Felix Riesterer.
-
-
-
Tach,
... naja, ich dachte eigentlich, dass man sich bei der Spezifikation von HTML und CSS etwas Konkretes vorgestellt hat. Dass z.B. ein <p>...</p> einen Absatz definiert, der vom übrigen Inhalt durch einen Zwischenraum (Leerzeile ?) abgesetzt ist, scheint ja auch allgemeiner Konsens zu sein.
du hast die Vorstellung, dass HTML ein rein visuelles Medium ist, das stimmt jedoch nicht. Es kann zum Beispiel auch akustisch ausgegeben werden, hier ergibt eine Leerzeile dann keinen Sinn mehr; vermutlich wäre das bei einer haptischen Ausgabe (z.B. Braille) auch anders.
mfg
Woodfighter -
Hallo.
Dass z.B. ein <p>...</p> einen Absatz definiert, der vom übrigen Inhalt durch einen Zwischenraum (Leerzeile ?) abgesetzt ist, scheint ja auch allgemeiner Konsens zu sein.
Der Schein trügt. Und es ist keine Leerzeile, sondern ein Abstand.
MfG, at
-
-
-
Hallo.
ich habe eine vergleichbar einfache HTML-Konstruktion
Meinst du "vergleichsweise", oder womit ist deine HTML-Konstruktion vergleichbar?
MfG, at