Hallo Webentwickler und Webdesigner

Website für den Internet Explorer 7 optimieren

bleibt nicht aus... -

ist Ihre Website für den IE7 optimiert?

Diese IE7 optimierungs Seite ist sehr veraltet, mittlerweile ist es genau umgekehrt, man muss hie und da noch für den IE7 "mit" optimieren.

Falls trotzdem Fragen zum IE7 offen sind, mich einfach anschreiben. So und nun weiter im altem IE7 Text:

Das alle über den IE7 sprechen, ist längst vergangenheit. Der neue Internet Explorer Version 7 ist schon längst da.

Er verbreitet sich wie ein Virus und ehe Sie sich versehen, haben Sie den IE7 mit dem nächsten Windows - Update automatisch auf dem Rechner.

IE7 Splash

Microsoft zieht gnadenlos seine Marketingstrategie durch und lässt einem Normalbürger kaum die Wahl.

Aber ist Ihre Site auch schon für diesen neuen Browser gerüstet? Haben die Entwickler der damaligen Agentur damals daran gedacht, als Ihre Website erstellt wurde, dass es jemals einen anderen Internet Explorer außer den IE6 geben würde und das man schlussendlich für den neuen Internet Explorer optimieren müsste?

Wahrscheinlich wurde es die ganze Zeit verdrängt. Und wenn nicht? Wie sollte man vorher wissen, was Micros.....t sich wieder ausgefallenes einfallen lässt

 

Je nach Aufwand und Größe der Site, ist das Problem nach maximal einer Woche vom Tisch. Doch für eine normale nicht optimierte Seite, ist im Schnitt mit 2-3 Tagen zu rechnen.

 

Oder Sie entscheiden sich für das Rundumsorglospaket mit Optimierung nach W3C Standard im Bereich XHTML und CSS, der für die Zukunft auf jeden Fall eine Garantie bietet, da die Tendenz, sich an die Regeln des W3C zu halten, steigt. Auch im Hause Micros.....t!

Bugs vom IE7:


Bisher ist mir ein sehr spezieller Bug aufgefallen, der auftritt, wenn man dynamisch Elternobjekten von ul-li-Linklisten den Style auf visibility:hidden setzt - während des ladens - also dynamisch im HEAD-Bereich selbst einen <link - Tag setzt, dessen href-CSS-Datei das visibility:hidden beinhaltet und onload eine Animation anzeigt und dann den Style visibility auf visible rückgängig macht.


Für schöne JS - Effekte beim Laden per JS, um non-js Kandidaten ein visible anzuzeigen, denn die bekommen nur das Visible zu sehen, man will sie ja nicht ausschließen (man könnt ja gleich auf hidden setzen und die Ani vorführen. Ein Beispiel: Die Seite soll Hineinfahren und standardmäßig steht Sie aber schon komplett da. Wenn man jetzt onload auf hidden setzen würde, würde man einen kurzen augeblick die Endversion sehen, dann die Animation. Um das zu umgehen, muss schon im Head Bereich eine CSS-Datei laden, die die betroffenen Ariale auf Hidden setzt, quasi den Standard überschreibt.

Der Bug:
Wenn jetzt auch Elternteile der ul-li-a-Linkliste davon betroffen sind, und ein ul-li-a-Link dabei ist, der font-style:italic im CSS-Rule beinhaltet und innerhalb dieser Liste sitzt, kann es passieren, dass der a-Link nach dem Laden der Seite und nach dem letzten Toggle auf visible ganz verschwindet und muss dann selbst explizit auf visibility:visible gesetzt werden.


Merkwürdiges verhalten, denn bisher stellten diese dynamischen Einbindungen der CSS-Dateien kein Problem für mich und meine Scripte dar. Wenn man aus dem a-Tag in der standard.css das font-style:italic herausnimmt, dann läuft alles, wie immer, oder man verstellt die standard security Einstellung von medium-high auf medium. Hatte nur keine Luste herauszufinden welcher von diesem Punkten dafür Verantwortlich ist.
Ich weiß nicht, ob jemand anderes diesen Bug schon entdeckt hat, wenn (noch) nicht und es kommt dann - nicht wundern - sondern einfach das a-Element auf visble setzen.



Falls jemand bisher mit CSS Weichen gearbeitet hat und sich wundert, dass das Layout gerade im Formularbereich im IE7 plötzlich abweicht, dem wird das folgende CSS IE7 - Hack sicher helfen können.

Die neue CSS-Weiche für den IE7:

Beispiel: color für den DIV - Tag mit der ID = "content" für die gängisten Browser (reihenfolge und Leerzeichen unbedingt einhalten)

div[id="content"]{/* für die Geckos */
   color:#00ff00;
}
h\tml:f\irst-child>body div#content{/*für Opera and Safari( < Version 3)*/
   color:#ffff00;
}
* html div#content{/* für die IEs 4 - 6 */
   color:#999999;
}
html + body div#content{/* für den IE 5 */
   color:#cc0000;
}
* html div#content{/* für den IE6 */
   colo\r:#000099;
}
*+html div#content{/* für den IE7 */
   color:#ff00ff;
}

alles valide, nach W3C

Ein besonders guter Einsatzort dieser CSS Hacks sind CMS Systeme, die sowieso deren eigenes HTML überall
reinprügeln, ob man will, oder nicht. Ein Paradebeispiel ist Typo3 und besonders seine Extensions.
Man kommt sehr schwer an das generierte HTML ran und so lässt es sich wunderbar Crossbrowser lösen,
ohne dass JavaScript ins Spiel kommen muss.

Desweiteren möchte ich hier noch einen schönen CSS Hack loswerden, der ganz nützlich ist,
wenn man eine zentrierte Webseite hat, um den rechten Scroller zu erzwingen.

Nur für NON-IE's, da der IE automatisch einen rechten Scrollbalken hat, egal, ob der gebraucht wird, oder nicht.

Meistens stört dann der rechte Scroller in den anderen Browsern, da er mal
da ist und mal fehlt, je nach länge der Seite. Dadurch entsteht ein "Ruckeln", wenn man auf der Site am
surfen ist. Wenn man aber einen rechten Scroller erzwingt, wie es im Internet Explorer standard ist,
dann verschwindet auch das lästige Ruckeln.

CSS-Hack erzwingt den Rechten Scroller ( XHTML - alter Fix):

(XHTML-Doctype und folgender html-tag: <html xmlns="//www.w3.org/1999/xhtml">)

html[xmlns="//www.w3.org/1999/xhtml"]{/* Gecko right-scroller-Fix */
   height:100%;
   padding-bottom:0.1px;;
}
h\tml:f\irst-child>body{/*Opera and Safari( < version 3)*/
   height:100%;
   padding-bottom:1px;
}

 

Für den Safari 3.x habe ich nur eine Javascript Lösung parat, die sich leicht finden lässt, wenn man etwas "googelt"... ;o)
Ich werde die demnächst hier vorstellen....

 

CSS-Hack erzwingt den Rechten Scroller ( neuer Fix):

html{/* alle Browser */
   overflow-y:scroll;
}

 

Es gibt noch ein Problem in der Gecko Familie, was den FireFox 3.0 betrifft Gecko 2008.07.02. In diesem Firefox funktioniert der Right Scroller Fix nicht mehr. Wahrscheinlich liegt es aber am Firefox selbst, da im Seamonkey 1.1.11 die selbe Gecko Engine sitzt, der Fix dort aber noch funktioniert, muss es was im Firefox aufgesetztes sein, was den RightScroller Fix verhindert. Wahrscheinlich wird die Erscheinung des Scrollers unterdrückt, solange es nix zu scrollen gibt. Das bedeutet, dass ich jetzt den Fix für alle ausgenommen die IEs mit der CSS Anweisung für den HTML Tag padding-bottom:1px; realisieren muss, wodurch der Scroller aber um 1 Pixel verschiebbar bleibt. Ich hoffe, dass Firefox genug beschwerden diesebezüglich bekommt und deren unsinnige "schönheitskorrektur wieder entfernen"

 

Und hier einmal draufgeklickt ein Beispiel in einem Link vom Rollover Effekt per CSS ohne
Javascript und ohne nachladen der Bilder im IE trotz "caching aus". Was soviel bedeutet, dass
diese Rollover Effekte immer 100%ig sauber sind, nicht ruckeln und völlig unabhängig jeder gängigen
Browserkonfiguration sind. IE 5.01, IE 5.5, IE6, IE 7, Opera, Netscape 7 und Firefox getestet.
Wenn man nicht für den IE 5.0 optimieren will, kann man sich 7 CSS-Rules sparen (30 Zeilen Code).

Link mit Bild und Rollover Effekt mit CSS ohne Javascript und Caching deaktiviert ohne nachladen der Bilder

 

NEU!! Die entsprechende .htaccess Lösung, ohne großartige CSS Jonglage gefunden im CMS MODx NEU!!

 

Linkfocus tastaturfreundlich verstecken:

Falls Ihr zu den bisherigen, folgenden oder verwandten Themen Fragen habt,
dann schreibt mich doch einfach unter webentwicklung@tomislav.net an.




 

Oder wie gewohnt, einfach auf die folgende E-Mail Adresse klicken: webentwicklung@tomislav.net

 

Ich werde sobald möglich Eure Fragen beantworten und einiger dieser Fragen und
Antorten auf meiner(dieser) Site veröffentlichen, es sei denn Ihr möchtet es ausdrücklich nicht.
Es gibt ja einschägige Foren, ich weiß.. Nur dass dort immer wieder unqualifizierte Fragen auftauchen und
ich neben meiner Arbeit als Entwickler keine Lust habe Fragen hier zu veröffentlichen, die schon zig mal beantwortet
wurden. Es sollen hier tatsächlich nur anspruchsvolle Themen auftauchen, die noch nicht, unzureichend oder gar
unzufiedenstellend behandelt wurden. Desahalb auch eine "Zensur" meinerseits um die Spreu vom Weizen zu trennen, damit
hier ein kleines Nachschlagewerk für ernstzunehmende Probleme entsteht.. Ich hoffe auf eure Zusammenarbeit.
Nichts desto trotz beantworte ich gerne auch Themen, die nicht meinem "Raster" entsprechen, doch werde ich diese
hier nicht veröffentlichen, sondern in solchen Fällen jedem einzeln persönlich die Antwort zusenden,
sobald es meine Zeit erlaubt.

 

Da man mich auch unter "ie7 cookies aktivieren" findet, hier nochmal die Erklärung, wie es funktioniert, damit Sie von mir nicht enttäuscht werden:
Wenn der IE7 ersteinmal installiert ist, steht er ungewohnt nackt dar (zumindestens war das bei mir so).....
Erst geht man mit der Maus rechts neben den Tab - Reiter in der Tabs Bar und klickt einen rechtsklick mit der Maus drauf. Dabei öffnet sich ein Contextmenü.
Dann klickt man auf "Menü Bar" und schon hat man die bekannte Menübar vor Augen. Oder alternativ ganz rechts in der Tabsbar befindet sich ein "Schraubenrad"
welches nach dem Anklicken auch in das Extras Menü (engl: Tools) führt..(was ich erst relativ spät entdeckt hatte)
Dann (englische Version) "Tools"->"Internet options"->"Privacy". Dann wie üblich gibt es die Standardeinstellungen,
die für Ihre Zwecke eigentlich ausreichen sollten.
Wenn sie wert auf Privatsphäre legen, gehen sie noch auf "Advanced" und klicken auf "Override automatic cookie handling".
Dann "First party cookies" auf "accept" clicken und "Third party cookies" auf "block" klicken.
Zum Schluss noch zwei mal auf "ok" klicken - fertig.

Ansonsten habe ich auch hierfür auch eine Seite für die deutsche Internet Explorer 7 Version gefunden, in der das schön bildhaft dargestellt wird:
//www.5-sms.de/cookiesaktivieren.htm
Dort wird das gleiche empfohlen, die Cookies von Drittanbietern nicht anzunehmen.
Es ist eine Sicherheitsfrage, und inwieweit man sich "durchleuchten" lassen will.
Ich möchte Cookies von Drittanbietern nicht annehmen.
Denn das bedeutet, dass man zulässt, dass Verschiedene Websitebetreiber mit Ihrer Zustimmung die Informationen austauschen und angleichen können.
Dementsprechend kann Ihnen die "richtige" Werbung angeboten werden...
Nein! Nichts für mich.