Archiv verlassen und diese Seite im Standarddesign anzeigen : Testet ihr eure Webseiten?
Hallo,
beim Herumspielen mit Xubuntu habe ich ohne besondere Absicht meine Website im Konqueror angesehen und feststellen muessen, dass z.B. das die Sprachumschaltung vom Hauptmenue ueberdeckt wurde - trotz W3C Standard :roll:. Hingegen zeigt sich Opera 9 unauffaellig und unter Firefox 2 als genereller Testbrowser sowieso.
Handeln war angesagt. Die Anpassungen erwiesen sich als mittelschwierig, da im ersten Quick-and-Dirty abswork nun die Seite in Firefox nicht mehr korrekt angezeigt wurde. Nach etwas Feinjustage ist optisch sowie funktional wieder alles im Lot.
Wie testet ihr eure Websiten? - Immer vor dem Hintergrund, dass sie fuer jemanden eine unueberwindbare Barriere darstellen kann (wie im o.g. Beispiel die Sprachauswahl im Konqueror). Zusaetzlich installierte (VM) ich mir noch den Apple's Safari Browser und auch hier funktioniert (nun) alles anstandslos. Schliesslich koennte Steve Jobs auch bei euch auf der Suche nach Bildern fuer das naechste OS-X sein... ;)
Viele Gruesse, Torsten.
Machst da eigentlich schon alles richtig. Teste auch immer mit iE, Firefox, Opera und Safari. Mehr kann man einem eigentlich auch schon wieder nicht zumuten.
zwischen iE und den anderen gibt's allerdings häufig ganz gravierende Darstellungsunterschiede...
emundem164
17.02.2008, 15:23
trotz W3C Standard :roll:.
Tja, leider sind diese Standards nicht so standard wie man gerne hätte :( Da ich meine Seiten ohne kommerziellen Hintergrund betreibe, bin ich mittlerweile so weit, dass ich sie nur auf firefox, opera und ie7 teste, ob sie lesbar sind.
Die Optik selber wird nach den Standards gemacht und geschaut, dass Sie im Firefox auch so ausschaut. Alle anderen sind mir mittlerweile egal, weil ich schlichtweg keinen Bock habe, stundenlang irgendwelche CSS-hacks zu testen bis es überall gleich ausschaut. Ausserdem machen genau diese Hacks nun dem ie8 das leben schwer, und MS schiebt die Schuld sogar auf die Webdesigner, weil überhaupt mit Hacks gearbeitet wurde... :flop:
Lange Rede kurzer Sinn: Solange die Browser sich nicht alle genau an die Standards halten, muss halt jemand mit einem solchen Browser damit rechnen, auf meinen Seiten optische wie auch bedienfehler zu haben. Das gilt aber nur für meine kleinen Privatseiten.
Müsste ich damit Geld verdienen würde es anders ausschauen...
gruss
michel
ps: da kommt mir mal wieder in den Sinn, ich wollte schon seit einer Weile ein neues 4images-template basteln.. :roll:
Machst da eigentlich schon alles richtig. Teste auch immer mit iE, Firefox, Opera und Safari. Mehr kann man einem eigentlich auch schon wieder nicht zumuten.
Das sehe ich genauso.
zwischen iE und den anderen gibt's allerdings häufig ganz gravierende Darstellungsunterschiede...
Leider. Ich behaupte mal dass einige meiner grauen Haare hierauf zurückzuführen sind ;)
Hallo,
den IE habe ich Eingangs bewusst aussen vorgelassen. Hier ist das Dilemma, dass dieser besonders in Firmen der primaere Webbrowser ist. Privat hat man hier mehr Spielraum und Auswahl.
Auf dem IE6/7 zu testen habe ich bereits vor Jahren aufgegeben. MS sagt, dass alles besser wird, aber ich habe davon nicht viel gesehen. Meine Seiten werden noch genauso maessig dargestellt, wie bereits vor 3 Jahren auf dem IE5 (z.B. der Vergroesserungseffekt, wenn man ueber bestimmte Bilder faehrt - das zappelt im IE6/7 immer noch fuerchterlich).
Da ich mich an den Standards orientiere ist es nicht moeglich, sich mit Browsern herumzuaergern, welche konsequent Standards ignorieren und eigene Sueppchen kochen - wie der IE6/7.
Ich habe derzeit 4 verbreitete Browser der Windows/Linux/Mac-Welt als kompatibel zu meiner Seite "eingestuft". Dies soll zunaechst als eine erste Orientierung fuer alle Besucher dienen aber auch nach aussen zeigen, dass ich konsequent bin und keinen Sonderlocken nachgeben werde.
Viele Gruesse, Torsten.
Hi,
ein ganz gravierendes Problem - welches nur zu gerne vergessen oder ignoriert wird - ist das sogenannte "Windows/Mac-Font-Size-Problem".
Windows arbeitet mit 96dpi und alle Unixoiden-OS' - dazu gehört auch MacOS - arbeiten wiederum mit 72dpi.
Ein sehr interessanter Artikel ist hier veröffentlich worden: Link zu selfhtml (http://aktuell.de.selfhtml.org/artikel/archiv/fontsize/index.htm)
Desweiteren entstehen häufig Probleme, wenn die Schriftart nicht festgelegt wurde oder nicht auf dem Server hinterlegt ist. Wenn jemand eine Seite unter Winblöd bastelt, kann er nicht erwarten, das seine TTFs Arial, Wingdings und Times auch unter einem anderen OS existieren (Wobei viele Distributionen liefern mittlerweile das Microsoft-Standard-TrueTypeFont-Pack mit).
Letztendlich führt kein Weg an einer Browserweiche/gescheitem CSS vorbei. Alles andere ist Zufall und Glücksspiel.
Habe erst vor ein paar Tagen eine Seite für den Kollegen Termic gebaut. Die meiste Zeit ging in das anschliessende Feintuning. Es sollte unter Win/Linux/Mac laufen und auch mit den Auflösungen ab 1024x768 sowie auch bei Laptopauflösungen (XXX x 800/ XXX x 960, etc.) noch ordentlich navigierbar und lesbar sein. Ebenfalls sollten die Browser IE6, IE7, Firefox, Opera und deren Derivate ordentlich laufen. All dies lässt sich aber nur über eine sehr umfangreiche Verwendung von CSS gestalten.
See ya, Maic.
m.bruehl
17.02.2008, 19:49
Wer seine Website in diversen verschiedenen Browsern testen möchte, sollte sich mal http://browsershots.org/ ansehen.
Wer seine Website in diversen verschiedenen Browsern testen möchte, sollte sich mal http://browsershots.org/ ansehen.
Danke fuer den Link - war mir bisher noch nicht bekannt. Bisher machen fast alle Browser bei meiner Seite eine gute Figur, nur der IE nicht :flop: ...
Viele Gruesse, Torsten.
duncan.blues
18.02.2008, 21:49
Ich habe mir angewöhnt, meine Webseiten grundsätzlich für den Firefox zu schreiben und danach für den IE anzupassen. Ist 1000x einfacher und zuverlässiger als andersherum.
Meistens komme ich mit einer Zusatz CSS-Datei für den IE mit weniger als 10 Einträgen aus.
Wichtig ist, dass die Webseite einen gültigen DOCTYPE Header hat, damit der IE nicht in den sogenannten "Quirks Mode" verfällt und das Rendering des IE 5 emuliert.
Des weiteren sollte man Font-Größen immer in "px" angeben, damit reduziert man Anzeigeprobleme über Betriebssystemgrenzen hinweg.
Beim Schreiben der CSS Dateien habe ich mir einige Standard-Vorgehensweisen angewöhnt, die sich im Laufe der Zeit als praktikabel erwiesen haben. Das sind Dinge die so in keinem Lehrbuch stehen. Trotzdem kann ich ein Buch dazu empfehlen: "CSS Praxis" von Galileo Computing. Das hat sehr gute Übersichten darüber, was wie mit welchem Browser funktioniert und was nicht.
Auch wenn ich den IE nicht sonderlich mag, muss ich zugeben, dass mit dem 7er ein paar Dinge besser geworden sind. So zum Beispiel, dass endlich PNG Dateien mit Alphakanal unterstützt werden. Das erleichtert das anspruchsvolle Gestalten von Webseiten ungemein.
Meine Prioritäten bei der Webseitenerstellung:
- sauber W3C konform
- perfekte Optik in Firefox
- sehr gute Optik in Internet Explorer 7
- gute Optik in Opera (selten ein Problem)
- sauberes Aussehen im Safari + Konqueror (klappt meist auch)
- passables Aussehen im IE6 (auf mangelnden PNG Support nehme ich keine Rücksicht mehr)
- Seite möglichst noch bedienbar im IE 5.5 und 5 (wer die noch benutzt ist selber Schuld)
[...]
Des weiteren sollte man Font-Größen immer in "px" angeben, damit reduziert man Anzeigeprobleme über Betriebssystemgrenzen hinweg.
Nein, absolute Groessen schaffen erst Probleme. Daher wird als Groesseneinheit, egal ob bei Schrift oder Elementen, die Verwendung von "em" angeraten. Eine 10px Schrift ist bei einer UXGA-Aufloesung kaum noch zu lesen.
Gruesse, Torsten.
dino the pizzaman
18.02.2008, 22:33
Nein, absolute Groessen schaffen erst Probleme. Daher wird als Groesseneinheit, egal ob bei Schrift oder Elementen, die Verwendung von "em" angeraten. Eine 10px Schrift ist bei einer UXGA-Aufloesung kaum noch zu lesen.
Gruesse, Torsten.
genau so ist es. und wenn man flüssige layouts macht eignet sich em gleich auch noch für das Definieren von gewissen Layout-Massen.
Ich hab früher akribisch alle Seiten so geamcht, dass sie auf allen Browsern perfekt benutzbar waren, sogar mit Optimierungen für Barrierefreiheit und Textbrowser etc. Heute bin ich soweit, dass ich für Firefox, Safari, Opera und ggf. Linux-Browser optimiere und darauf achte, dass es im IE7 passt. Das ist eignetlich alles kein grosses Ding. Den IE6 und tiefer hab ihc bewusst abgesägt, auch die Mühe für den png-Fix mache ich mir nicht mehr. Das ist ein Müllhaufen an Softwarecode. Aber ich kann mir ads auch leisten, da es eine private Seite ist und ich ja eigentlich nicht von den Besuchern der Seite abhängig bin. Wäre es eine Firmenseite oder ein Auftrag sieht die Sache anders aus. Aber zum Glück sind die Zeiten bei mir - zumindest vorerst - vorbei.
genau so ist es. und wenn man flüssige layouts macht eignet sich em gleich auch noch für das Definieren von gewissen Layout-Massen.
Richtig, mit "Elementen" bezog ich mich nicht nur auf length/width/height sondern auch solche Sachen wie margin/padding/line-height...
Gruesse, Torsten.
duncan.blues
19.02.2008, 01:16
Nein, absolute Groessen schaffen erst Probleme. Daher wird als Groesseneinheit, egal ob bei Schrift oder Elementen, die Verwendung von "em" angeraten. Eine 10px Schrift ist bei einer UXGA-Aufloesung kaum noch zu lesen.
Stimmt natürlich, aber dann kriegst du auf der anderen Seite Probleme mit komplexeren CSS Box-Layouts. Dann kannst du Layouts mit mehr als zwei nebeneinanderliegenden Blöcken effektiv vergessen. Einzige Möglichkeit dann wieder: Mit blinden Tabellen arbeiten, was auch mega-bäh ist.
Die Verwendung von "em" ist praktikabel, wenn man's richtig macht. Ist aber nicht so einfach. Wenn man das Layout auf sehr hochauflösenden Bildschirmen entsprechend skalieren will, dann muss man eigentlich mit Prozentwerten arbeiten, dabei steht einem aber meistens die sehr seltsame Definition von Breite und Höhe laut W3C (Margin, Padding und Border eines Elementes zählen nicht mit zur Breite bzw Höhe) im Wege.
Ist alles nicht so einfach. Entweder es passt nicht auf allen Browsern oder die Darstellung ist bei Displays mit hoher oder niedriger Auflösung suboptimal. Die Patentlösung gibt es IMHO (leider) nicht.
Naja...hauptsache man versucht nicht mit "pt" zu arbeiten ;)
Stimmt natürlich, aber dann kriegst du auf der anderen Seite Probleme mit komplexeren CSS Box-Layouts. Dann kannst du Layouts mit mehr als zwei nebeneinanderliegenden Blöcken effektiv vergessen.
Nicht unbedingt, wenn es ordentlich implementiert ist. Bei meinem Beispiel (http://www.d7d-impressions.de/gallery/LA/index.html) hast Du mindestens 4 oder mehr CSS Elemente nebeneinander angeordnet, welche bei Bedarf umgebrochen werden.
Einzige Möglichkeit dann wieder: Mit blinden Tabellen arbeiten, was auch mega-bäh ist.
Blinde Tabellen haben auch ihre Berechtigung. Man sollte sie gezielt einsetzen aber nicht als Alleskoenner ansehen. Sie versagen z.B. wenn eine variable Anzahl an Spalten und Reihen gefordert sind (siehe mein Thumbnail-Beispiel).
Die Verwendung von "em" ist praktikabel, wenn man's richtig macht. Ist aber nicht so einfach. Wenn man das Layout auf sehr hochauflösenden Bildschirmen entsprechend skalieren will, dann muss man eigentlich mit Prozentwerten arbeiten, dabei steht einem aber meistens die sehr seltsame Definition von Breite und Höhe laut W3C (Margin, Padding und Border eines Elementes zählen nicht mit zur Breite bzw Höhe) im Wege.
Prozentwerte als Groessenangaben habe ich bewusst nach Moeglichkeit aussen vor gelassen. diese beziehen sich auf die Groesse des Elternelements, waehrend "em" in Relation zur Schriftgroesse des Elternelements steht. Mit Width-Max oder Auto haben kaputte Broser, wie der IE, so ihre Probleme. Alle anderen kommen damit weitestgehend klar. Oder was meinst Du mit "seltsame Definition"?
Ist alles nicht so einfach. Entweder es passt nicht auf allen Browsern oder die Darstellung ist bei Displays mit hoher oder niedriger Auflösung suboptimal. Die Patentlösung gibt es IMHO (leider) nicht.
Naja...hauptsache man versucht nicht mit "pt" zu arbeiten ;)
... oder px ;) Wie bereits erwaehnt kann man von Browsern, welche sich bewusst nicht an die W3C Standards halten, nicht erwarten, dass eine W3C kompatible Seite zu 100% korrekt dargestellt wird. Die Schwaechen des IE habe ich hauptsaechlich bei CSS Formatanweisungen gefunden - Neben Netscape 4 schafft das kein kein anderer mir bekannter Browser der Windows/MAC/Linux/BSD-Welt :shock:.
Gruesse, Torsten.
duncan.blues
19.02.2008, 19:35
Was ich zum Beispiel meinte, waren dynamische Layouts (mit nicht-festen Block-Größen).
Wenn du schon das Beispiel mit dem extrem hochauflösenden Bildschirm bringst, dann muss auch erwähnt werden, dass du ein Layout dass auf eine Breite von 1000 oder 1200 Pixeln festgelegt ist genauso vergessen kannst.
Wenn du jetzt aber z.B ein dreispaltiges Layout machen willst mit sagen wir mal einer Aufteilung 20:60:20%, dann reicht es nicht, einfach die DIVs auf entsprechende width-Prozentwerte zu setzen, wenn du gleichzeitig z.B. ein Padding verwenden willst, damit zwischen den Inhalten der einzelnen DIVs etwas Freiraum ist.
Letztendlich läuft es leider allzu häufig auf einen DIV-Schachtelitis hinaus. :flop:
Hallo,
noch ein kleiner Tip, den ich in einer entsprechenden Newsgroup bekommen hatte. Wer sich bisher wunderte, warum sein CSS-Tabellenlayout in Browsern, wie zum Beispiel Opera, falsch ausgerichtet erscheint, kann ich folgendes empfehlen:
Den DOCTYPE von ggfls. Transitional nun auf Strict setzen.
Hat bei mir eine ueberschaubare Menge an "Schwierigkeiten" mit Opera beseitigt. :top:
Viele Gruesse,
Torsten.