Conditional Comments effizient nutzen

bueltge.de [by:ltge.de] wird von Frank Bültge geführt, administriert und gestaltet. Alle Inhalte sind persönlich von mir ausgewählt und erstellt, nach bestem Gewissen und Können, was die Möglichkeit von Fehlern nicht ausschließt.

Kommentare

  
  1. Christoph sagt:

    was wäre das netz ohne conditional comments. der ie8 kann sie ja leider nicht mehr, allerdings zickt er auch nicht mehr so rum.

    ich nutze das übrigens ähnlich mit dem iphone (per php), so läd das iphone ne alternatives stylesheet. spart die ollen mobile themes:
    http://www.nasendackel.de/2008/11/mobile-version-ohne-plugin/

    aber ne schöne übersicht. super 😀

    • @Christoph: Ich habe überlegt, ob ich das aufnehme, da ich es ähnlich mache und auch bei dir gelesen hatte. Aber dann hätte ich auch die Abfragen für andere Mobiel Endgeräte aufnehmen müssen, da es nicht immer um das iPhone gehen sollte und dann wäre es eventuell zu viel des guten, da es es ja an sich um Conditional Comments gehen sollte und ob man das Stylesheet zum default addiert oder ein eigenes für den IE macht.

      @Peter: die Klasse wäre super, das einbinden wäre natürlich viel einfacher und sieht im Markup besser aus. Die Funktionalität ist aber dann die gleiche.

  2. Peter sagt:

    Hallo Frank,

    ansich spricht nichts gegen Deine PHP-Version der Browserabfrage, aber ich denke sie ist etwas codelastig, damit meine ich, das man in der Browserabfrage jeden Browser erwähnen muss damit jeweils das richtige CSS-File geladen wird. Wir haben es bei uns in der Agentur mittels einer PHP-Klasse gelöst. Diese wird eingebunden und mehr ist nicht nötig, da sie sich immer das richtige Stylesheet raussucht und lädt. Ich schau mal ob ich den Codeschnipsel hier anbiete.Muss ich abklären.

    Peter

  3. Wishu sagt:

    Es gibt mal was, worin ich nicht mit dir übereinstimme? Ich bin überrascht.

    Auf jeden Fall kann ich nichts aus deinem Beitrag unterstützen. Ein einfacher Starhack spart wesentlich mehr Platz, als wenn ich ein zweites CSS habe und dann auch noch im head dazu 3 Zeilen Code packen muss.

    Auch der Gedanke, dass der IE und Non-IE komplett unterschiedliche Designs bekommt ist schwachsinnig. Es macht schon genug Arbeit die einzelnen Sachen anzupassen, damit der IE die Seite vernünftig darstellt - sowohl ich das mittlerweile alles fast schon ohne Hacks ausbügeln kann - dann aber extra für den IE noch mehr Arbeit machen, um ein eigenes Design zu spendieren?
    Da finde ich es ja schon sinnvoller für den IE das CSS komplett zu deaktivieren, in der Zeit der sinnvollen Auszeichnung sollte das ja kein Problem sein.

    Auf jeden Fall bin ich komplett dagegen mir extra für den IE eine PHP-Klasse einzubauen oder CCs zu benutzen. Zusätzlicher Aufwand, welcher mit einem einfach Starhack oder Star-Plushack unnötig wird.

    Gruß
    Wishu

  4. Gute Auflistung. Die Comments nutze ich bei größeren Projekten ebenfalls. Bei kleinen Websites verwende ich gerne CSS-Hacks, da sehr smart in der Umsetzung.

    Auf eine PHP-Abfrage versuche ich zu verzichten, damit die Seiten nach Möglichkeit statisch bleiben. Wenn ich ein paar Pixel browserabhängig schieben möchte, dann mach ich es mit jQuery, da die Lib meist sowieso geladen wird.

  5. ^Nicki^ sagt:

    Toller Beitrag! Ich lade immer einen Standartstylesheet und ergänze diesen einfach mit mit einem IE Style, falls die Website mit "Redmond" angesurft wird. So brauche ich nur die relevanten Tags ändern, das sind in der Regel nur einige wenige. Und: wenn die Seite valide ist, sind riesige Styles für diverse Browser einfach hinfällig. Mittlerweile tendiere ich auch immer mehr dazu IE6 User zu ignorieren, nachdem mir die Statistik unter 1% Besucher, die noch Oldschool surfen, signalisiert.

  6. Ralf sagt:

    Conditional Comments wurden, so glaube ich, nicht erfunden um unterschiedliche Style-Sheets einzubinden. Es war eher das Problem mit ActiveX und JavaScript. Microsoft wollte mit den Conditional Comments sein ActiveX fördern indem es Nicht-IE-Browsern ermöglichte alternativ zum ActiveX-Script JavaScripte zu laden.
    Microsoft hat nun eingesehen das ihr properitäres ActiveX mittlerweile im Museum steht und somit die Conditional Comments auch irgendwie überflüssig sind. Wohl mit einer der Gründe warum Conditional Comments im IE8 nicht mehr unterstützt werden.

    Ich bin übrigens auch kein Freund der Conditional Comments. Denn das Problem der CSS-Hacks betrifft nicht nur IE- und Nicht-IE-Browser. Dies musste ich zumindest vor kurzem feststellen als ich versuchte einen Transparenz-Effekt umzusetzen.
    Die neuesten (Nicht-IE-) Browser unterstützen bereits opacity: x. Ältere Nicht-IE-Browser hingegen hätten gerne jeder seine spezielle Angabe (-mozilla-opacity, -khtml-opacity, filter: alpha).

    Um einfach mal einen Blick in die Zukunft zu wagen, dann erwartet uns folgendes Szenario: Man darf dann CSS-Styles speziell für
    - IE kleiner 8
    - IE größer gleich 8
    - Nicht-IE kompatibel zu CSS3
    - Nicht-IE nicht kompatibel zu CSS3
    - Nicht IE nicht kompatibel zu CSS2
    - Apple-Mobilgeräte
    - Google-Mobilgeräte
    - Handys
    - Netbooks
    - usw.
    anbieten.

    Conditional Comments gehören wirklich ins Museum da sie nur der IE verarbeitet. Die Realität sieht allerdings jetzt schon so aus, dass man für verschiedene Endgeräte spezielle Anforderungen erfüllen muss. Von daher ist es sinnvoller sich schon jetzt Techniken zu überlegen (und vor allem anzuwenden) die dieses Problem halbwegs sinnvoll in den Griff bekommen. Denkbar wäre ja auch das CSS dynamisch erzeugen zu lassen. Also in Abhängigkeit des Browsers ein komplett anderes CSS auszuliefern.
    Eine weitere Möglichkeit wäre es mittels javaScript zu ermitteln ob JS aktiviert ist. Ist es deaktiviert, gibt es nur ein rudimentäres, möglichst mit allen Geräten kompatibles CSS. Ist JS aktiviert, wird ein entsprechend, z.B. an die Bildschirmauflösung, angepasstes CSS ausgeliefert.

    • @ralf: zum letzten Punkt: ich sehe es eher in der Aufgabe der Browserhersteller sich um die Anpassung zu kümmern. Es kann nicht sein, dass der Webentwickler für jedes Endgerät ein das entsprechende CSS erstellt. Natürlich kann man das, aber ich wünsche mir, dass die Arbeit durch die Browser erledigt wird bzw. dass die Bedienung ähnlich gut wie dem iPhone ist.

  7. Ralf sagt:

    Das wäre natürlich die optimalste Lösung. Die Hersteller kümmern sich darum das eine Webseite immer optimal dargestellt wird. Aber hat das auch nur ansatzweise was mit Realität zu tun?
    Microsoft hat darauf verzichtet sich an Webstandards zu halten und hat kurzerhand seine eigenen Standards geschaffen inkl. Conditional Comments. Und Microsoft war bzw. ist ja nicht der einzige Hersteller der sich nicht um Webstandards kümmert. Ich kann dieses Verhalten in sofern verstehen, als das es unglaublich lange dauert bis so ein Webstandard erst einmal verabschiedet ist. Wie lange wird denn nun schon an CSS3 gebastelt? Wie lange hatte es von HTML1.1 bis HTML4 gedauert? Als Hersteller möchte man in relativ kurzer Zeit ein Produkt entwickeln und weiß dann nicht wie die Zukunft aussehen wird. Entweder man entwickelt dann ins Blaue hinein oder entwickelt seine eigenen Standards. So gesehen wälzen die Hersteller die Problematik auf die Webentwickler ab. Sollen die doch zusehen das ihre Webseiten mit möglichst vielen Produkten zusammen arbeiten.

    Als Webentwickler hast du eigentlich nur zwei Möglichkeiten: Entweder du bastelst so lange an deinen Webseiten rum bis sie irgendwann in allen Produkten so halbwegs gut dargestellt werden.
    Oder du hältst dich konsequent an gegebene Standards und versuchst so die Hersteller dazu zu bringen sich ebenfalls daran zu halten. Kein Hersteller wird es auf Dauer riskiren können das sein Produkt nur bestimmte Webseiten darstellen kann. Microsoft musste sich auch der Masse an Webseiten beugen die JavaScript und nicht ActivX einsetzen bzw. die eine Rendering-Engine voraussetzen, die CSS korrekt umsetzt.

    Verwendest du nun Conditional Comments, dann kriechst du den Herstellern quasi in den Popo. Eine langfristige Lösung kann es einfach nicht sein, ansonsten kommt morgen der nächste Hersteller mit dem nächsten Gimmick an.
    Eine langfristige Lösung kann nur so aussehen, dass Browser, die bestimmte Standards nicht unterstützen, einfach nur eine leere Seite zu sehen bekommen. Das hatte schon einmal mit Frames geklappt. Es gibt heutzutage keinen Browser mehr der keine Frames unterstützt. Schuld war wohl einzig und alleine der berühmte Satz "Ihr Browser unterstützt leider keine Frames..." der wohl in fast jeden Frameset so oder so ähnlich zu lesen ist.
    Vielleicht wird die Zukunft so aussehen, dass immer häufiger Besucher einen Satz wie z.B. "Ihr Browser unterstützt leider kein CSS2. Bitte verwenden Sie einen Browser der CSS2 unterstützt." lesen werden.

    • @Ralf: volle Zustimmung. Daher versuche ich möglichst am Standard zu bleiben und nicht für diverse Browser extra Umsetzungen zu tätigen. Aber ich denke, dass das im offenen Feld nicht so einfach ist. Viele Kunden schauen nach und wollen quasi in jedem Browser das gleiche Ergebnis. Es gibt noch immer sehr viele Nutzer, für die das Web kein eigenes Medium - man vergleicht immer wieder mit Print. Für mich als Hobbybastler ist das egal, ich kann Nutzergruppen ignorieren, aber im Dienstleistungsgewerbe sieht das anders aus, vermute ich.

  8. datenkind sagt:

    Mehrwert CC > CSS-Hacks

    Period.

    Klar, proprietärer Müllkram, der das obsoluete „made for IE“ in gewisser Weise ad absurdum führt, dennoch ist der sauberste Weg, den IE in die richtige Bahn zu lenken.
    Natürlich stellen CCs keine langfristige Lösung dar. Aber wie ist denn hier bitte der Vergleich zu Hacks zu ziehen? Das ist doch Käse. Es ist wesentlich zukunftsträchtiger, eine, maximal drei Zeilen aus dem Head einer Seite zu werfen, als sich nach getaner Arbeit wieder durch viele viele Zeilen CSS zu wursteln, um dann relativ verstrickte Hacks zu entfernen.

    Das Problem ist, dass viele wohl eher privater Natur an Websites bauen oder noch nie im Team gearbeitet haben. Hier führt der kleinste gemeinsame Nenner auf CCs, denn sollte es dazu kommen, dass mehrere Leute am CSS einer Seite arbeiten, verfängt man sich schnell in persönlichen Coding-Gewohnheiten. Schafft man hier keine Basisrichtlinien, wird’s echt mühselig. Vor allem, wenn der Wissensstand der Mitarbeiter variiert.
    Letztlich kann ich nur dazu raten, dass, wenn man kein Freund von CCs ist, zumindest die Hacks auslagert. Macht es einfach, es ist wesentlich entspannender. Man weiß nie, wann man mal wieder an einer Seite schraubt, dann ist jede gesparte Minute willkommen.

    Abschließend für die, die’s einfach noch nicht verstehen: Klick it, baby.

  9. Ralf sagt:

    CCs haben den gravierenden Nachteil das sie nur den IE berücksichtigen. Was ist aber mit CSS-Hacks für andere Browser? Sollten sie jetzt noch keine Rolle spielen, dann könnten sie in Zukunft eine spielen. Und dann fängt man wieder an auf drei Baustellen rum zu tanzen.
    Also lieber gleich von vorne rein eine Lösung die auch andere Browser berücksichtigt.

    Eine Alternative wären z.B. Server Side Includes.

  10. datenkind sagt:

    Das stimmt ja auch, absolut. Aber welche Browser unter welchen Umständen brauchen denn heute noch Hacks außer der IE? Mir ist in den letzten vier Jahren keine Konstellation untergekommen, die durch eine komplette Analyse von Struktur und Visalisierung korrigiert werden konnte. Und ich glaube auch nicht, dass Entwickler wie Mozilla, Apple oder Opera sich „schlechte“ Schlagzeilen einfangen wollen, weil sie die Standards nicht einhalten.

    Ich verabscheue es ebenso, ewig die ")$%&/!"§$ der IEs zu fixen, immer und immer wieder. Aber durch CCs hast du eben die an sich elegantere Art. Sozusagen mit dem Finger draufzeigen: Guck mal, der Affenbrowser kann’s einfach nicht. Aber wie ne blöde Grippe isolieren wir diesen Bazillus; fertig.
    Und deswegen steht auch in der ersten Kommentarzeile meiner CC-CSS-Files „Bugfixing-Stylesheets für IE“ – der geneigte Quelltextleser wird’s nachvollziehen können.

    Inwiefern hältst du SSI für eine Alternative? Kenne mich mit SSI leider überhaupt nicht aus.

  11. Ralf sagt:

    Bisher hatte man immer nur verschiedenen Browsern auf dem PC Beachtung geschenkt. Mittlerweile kann man aber nicht nur mit PCs im Internet surfen, sondern mit einer ganzen Reihe von anderen Endgeräten (z.B. Handy, Spielekonsole, TV-Geräte, usw).
    Ein Bekannter hatte vor zwei oder drei Jahren alle seine auf 800x600 abgestimmten Designs gelöscht weil er sich sicher war das mit dieser Auflösung bald niemand mehr surfen würde. Tja, jetzt sind Netbooks für nen Apple&Ei zu bekommen und die haben ungefähr welche Bildschirmauflösung? 😉

    Die IE-Hacks sind ja nichts anderes als eine Anpassung an eine bestimmte Darstellung eines Browsers. Ich denke mal das wir uns in Zukunft noch mit z.B. Mobile-Hacks, Konsolen-Hacks oder Hacks für hochauflösende Medien beschäftigen müssen. Die Webseiten müssen natürlich nicht in allen Browsern gleich aussehen, sie sollten aber auf unterschiedlichen Endgeräten noch lesbar sein.

    SSI sind im Prinzip so etwas wie CCs. Der große Unterschied ist allerdings, dass sie vom Server verarbeitet werden und das sie ein paar Möglichkeiten mehr bieten. Im Grunde genommen kann man mit SSI ein paar Dinge in einem HTML-Dokument machen, die man ansonsten in der .htaccess umsetzen müsste.

  12. thomas sagt:

    Also ich finde dieses Thema sehr intressant da ich gra ne eigene Webseite aufbaue aber über solche sachen habe ich mir noch nicht wirklich viele Gedanken gemacht.
    Aber das war wohl nen grosser Fehler ,also nochmal zur webseiten fertig Stellung gehen 😉

  13. datenkind sagt:

    Ralf: Ja, in der Tat, die Bandbreite der möglichen Endgeräte wächst. Jedoch muss man bei der Vielfalt auch an ein Aufwand-/Nutzenverhältnis denken. Ganz ehrlich, wen interessiert der Netfront der PSP/PS3? Doch sicherlich nur den Gamerzirkel. Surft man damit ernst- und dauerhaft durch die Netzwelt? Ich kenne keinen, der sich das längere Zeit freiwillig antut.
    Und hier greift halt die blöde Situation, dass der IE nunmal der meistgenutzte Browser ist. Und da der IE die meisten Fehler hat … Ergo: simpler Dreisatz 😉
    Auch wenn’s nervt, aber um gewisse Tweaks einer Seite kommt man nicht rum. Wie man diese erreicht, ist letzlich egal, Hauptsache es ist halbwegs sauber und macht keine Probleme – aktuell und bei zukünftiger Wartungsarbeit.

Trackbacks

  1. [...] verschiedenen Hydra Versionen zu werfen. Ob aber die typische Art wie sie benutzt werden wirklich effizient ist, daran sind mir in letzter Zeit Zweifel [...]

© 2016, since 2005 bueltge.de [by:ltge.de] · Theme is built by ThemeShift