Internet Explorer 8 von Microsoft
- kurz IE8
Neuerungen Internet Explorer 8
Was bringt die anstehende Version vom Internet Explorer 8? Warum von anderen Browsern umsteigen und was bedeutet die neue Internet Explorer 8 Version für Nutzer und Entwickler?
Auf der MIX 08 in Las Vegas wurde der Internet Explorer 8 und seine Neuerungen vorstellt. Folgende Schwerpunkte wurden für den IE8 (der sich noch im Beta-Status zur Zeit befindet) vorgestellt:
- Benutzer und Entwickler zufriedenstellen
- Entwickler wollen, dass Standards einhalten werden. Kompatibilität zu den Standards wurde stark verbessert. Nun besteht der IE8 den Acid-2-Tage.
- Sicherheit wurde für Benutzer verbessert.
- Erweiterte Add-Ons für Benutzer
- Stabilität, falls Absturz wird am letzten Punkt fortgesetzt. Dies nennt sich Automatic Crash Recovery (ACR)
- Geschwindigkeit wurde optimiert. Nun ist die Geschwindigkeit mit anderen Browser vergleichbar.
- Neue Möglichkeiten über Activites
- Neue Möglichkeiten und Vereinfachung über WebSlices
- Bessere Unterstützung der Entwickler durch die Standardmäßig integrierten Entwicklerwerkzeuge
Dazu gab es auf der MIX 08 mehrere Sessions (mindestens 3).
Sicherheit für Benutzer
Manchmal sind die Sichbaren Dinge für den "einfachen" Benutzer wichtiger als ein großes im Hintergrund werkelndes Programm (das es natürlich auch gibt). Für den Nutzer ist nun der Domainnamen in der Adress-Zeile einfach ersichtlich und hervorgehoben. In hellgrau erscheint dann Subdomain und Pfad-Angaben, also http://www. In Schwarz die eigentliche Domain - somit kann der Nutzer schneller kontrollieren, ob er auf der gewünschten Domain ist.
Usability vereinfacht für Benutzer
Erweiterter Zoomen - das Layout wird nun geändert und neu umgebrochen. Dadurch ist eine wesentlich besser Benutzererfahrung möglich - sprich, es macht mehr Spaß, den Browser zu nutzen, da dieser Intelligent mitdenkt.
für Entwickler
W3C ARIA - ARIA macht Internetinhalte zugänglich. Das ARIA steht für "Accessible Rich Internet Applications". Dynamische Inhalte schließen viele Nutzer aus. Um das zu ändern werden unterstützende Techniken wie Spracherkennungssoftware, virtuelle Tastatur und Screen Reader eingebunden. Dazu wurde bereits vor 2006 die W3C Web Accessibility Initiative (WAI) ins Leben gerufen.
Activities: Standardmäßige einbinden von Webservices von Haus aus. Beispiele sind Karten (Windows Live), Blogs, E-Mail wie Yahoo, Hotmail und Gmail, Produktivität (Suchen, Übersetzen, Wörterbücher). Dazu wurden die Activities (engl. für Aktionen, Aktivitäten, Tätigkeiten) integriert. Durch die Activities haben Nutzer die bisher benutzten Internetdienste einfacher im Zugriff. Für Entwickler ist die Integration einfach, da keinerlei Client Code notwendig ist.
Beispiel: Adresse markieren, es erscheint ein POP-Up mit verschiedenen Möglichkeiten - Live Maps und man erhält eine Vorschau, die man in einem Tab im IE. Der Entwickler kann diese Activites durch das "OpenService Format" anbieten. In einer XML-Datei werden dazu die Angaben gemacht, die dann auf der Website hinterlegt sind.
WebSlices
Nutzer sind an täglich wechselnde Informationen interessiert (z.B. Wetter, Auktionen, Aktienkurse) und surfen jeweils die entsprechenden Webseiten an. Um dies zu vereinfachen und zu automatisieren, wurden die WebSlices eingeführt. Website-Betreiber können Bereiche von Webseiten definieren, die für Nutzer interessant sind. Diese Bereiche einer Webseite kann der Nutzer dann abonnieren und so einfach Änderungen verfolgen (Auktionen, Wetter, etc.)
Wenn man mit der Maus dann über einen WebSlice Bereich fährt, erscheint ein Button, um diesen Informationsbereich (sprich dieses WebSlice) zu abonnieren. Diese taucht dann oben in der Windows Feed Platform. So können die wichtigsten Daten von Webseiten beobachtet werden. Dieses Verfahren spart dem Website-Betreiber dann Webtraffic. Realisiert wird dies über das hAtom Microformat - der Unterschied zwischen hAtom ist, das dieser statischen Inhalt repräsentieren kann, WebSlices steht für dynamischen Inhalt.
WebSlices verwendet Bestandteiledes hAtom-Format wie beispielweise das ttl (time-to-live value), endtime (ab wann der Inhalts veraltet ist - z. B. abgelaufene Auktion), feedurl (der alternative Pfad um neueste Informationen zu erhalten)
Beispiel: eBay unter: http://ie8.ebay.com
Für Entwickler Möglichkeit alte IE7 rendern zu erzwingen
Der Entwickler kann nun über ein entsprechendes <meta>-Tag vorgeben, wenn nach dem alten IE7 der Inhalt einer Website gerendert werden soll. Ansonsten wird nach aktuellem Standard die Website gerendert. Der aktuelle Standard wird automatisch vom IE8 zur Vorgabe.
Warum überhaupt die Möglichkeit für Entwickler ihre Internetseiten nach dem alten IE7 Verhalten rendern (anzeigen) zu lassen? Damit der Entwickler in aller Ruhe seine Umstellungen machen kann und dann durch das herausnehmen dieses "do-it-the-old-way"-<meta>-Tags die Seiten schlagartig umstellen kann. Der Autor wählt also den Zeitpunkt, wenn die Seiten umgestellt sind - um Klartext diese so Standard-konform sind, dass diese sauber angezeigt werden.
Voraussagbares Layout
Ziel des IE8 ist eine komplette CSS 2.1 Unterstützung. Dazu wurde eine komplette neue Layout-Engine von MS programmiert. Es gibt nun neue CSS-Features (bereits in Beta 1)
- neues "display"-Wert bei Tabellen
- Box-Größen-Werte
- senkrechte (vertikale) Textausrichtung (siehe CSS3) - wichtig für internationale Gepflogenheiten (Japan)
Dazu wurden zahlreiche Testseiten erstellt - 700 Tests. Diese sind Interessant zu analysiere. Die Tests sind und BSD open License veröffentlich.
Im Browser ist nun Prüfwerkzeug (Validator) standardmäßig integriert. HTML, CSS und JavaScript-Debugger ist mit dabei bei der Standardinstallation des IE 8.
Dazu hat man bei HTML und CSS folgende Möglichkeiten:
- view effective styles
- view applied rules
- trace styles - verfolgen des Styles, um herauszubekommen, wo ein Element Werte und Attribute zugewiesen bekommt.
- Layout anzeigen über das Box-Modell
- Ändern von HTML und CSS um sofort die Effekte ansehen zu können
Bei JavaScript komm zu Debuggen:
- ausführkontrolle eingesetzt werden (breakpoints, step into, und mehr)
- Variablen können überprüft werden (kontrolliert, ausgegeben)
- direkteingabe Fenster
Entwickler-Werkzeuge
Das Developer Tool ist als kleines Symbol rechts untergebracht, da der normale Anwender ist i.d.R. nicht benötigt, geschweige denn etwas damit anfangen kann.
Baumanzeige, Elemente auf der Seite können angewählt werden und im Developer Tool wird an die entsprechende Stelle gesprungen.
Das Layout des Elements im Box-Modell kann angezeigt werden - Position, Größen, etc.
Bei den CSS Styles kann anzeigt werden woher diese kommen, wo welche Attribute zugewiesen werden. Das Trace Style ist sehr geschickt, um die Herkunft der Zuweisungen herauszubekommen.
Im Script-Debugger: ein Klick auf "Start Debugger" schaltet den Debugger ein. Refresh Page kann notwendig werden. Einen Breakpoint kann einfach gesetzt werden, indem auf die Zeilennummer geklickt wird. Es erscheint ein roter Punkt dort. Das Script wird bei der Ausführung an diesem Punkt unterbrochen. Wird nun auf der Seite die entsprechende Funktion aufgerufen, wird bei Erreichen des Breakpoint das Debugger-Tool-Fenster in den Vordergrund geholt. Man sieht auf einen Blick den Inhalt der lokalen Variablen. Über den Button kann man nun Schritt für Schritt durch das Programm gehen und sieht die entsprechenden Änderungen (je nach Programm ändert sich Variablenwerte bzw. das Layout der Website).
Elemente können zum Watch-Windows hinzugefügt werden. Element markieren und rechte Maustaste dann "…." auswählen. Im zweiten Reiter mit der Aufschrift "Watch" auf der rechten Seite taucht nun die Variable auf. Diese kann nun auch von Hand geändert werden. Der Callstack kann kontrolliert werden.
Es soll kein Ersatz für andere Tools sein - wichtig war, dass im Browser integriert ist und man somit sieht, was im IE 8 vorgeht.
Anwendungs-Herausforderungen
Der Rückwärtsbutton reagiert nun, wie der Nutzer es erwartet. Bei Ajax-Anwendungen wird nun nicht eine Seite zurückgesprungen, sondern ein Schritt zurückgesprungen.
Element-Baum query
CSS Selector API nun integriert, was 50x schneller ist, als per JavaScript schrittweise dies durchzugehen.
.querySelectorAll() .querySelector()
Als Beispiel wird der Inhalt einer vcard ausgelesen und in Variablen bereitgestellt
<div class="vcard">
<span class="websiteurl">www.webmaster-crashkurs.de</span>
<span class="letztesupdate">2008-04-10</span>
</div>
var vcard;
var weburl;
var aenderungsdatum;
// alle Inhalte aufnehmen
var vcards = document.querySelectorAll(´.vcard´);
für (vcard un vcards)
{
weburl = vcard.querySelector(´.websiteurl´);
aenderungsdatum = vcard.querySelector(´.letztesupdate´);
}
Lokaler Speicher von Inhalten
Bisher mit Cookies und anderen Möglichkeiten - nun über HTML5 über sessionStore und localStore - dadurch ist ein Speicher von 10MB pro Domain und insgesamt 100MB komplett für Nutzerdaten verfügbar.
HTML5 gibt es nun Offline-Events und einen Status-Indikator
<!-- fügt ein online/offline Event dazu --> <body ononline="go_online()" onoffline="go_offline()"> // online-offline Status herausfinden online = window.navigator.onLine;
Dies ist wichtig, wenn beispielsweise die Netzwerkverbindung unterbrochen wird. Somit findet dann bei Integration eine lokale Speicherung statt und wenn die Netzwerkverbindung wieder steht, werden die Daten online übertragen.
Download IE8
http://www.microsoft.com/germany/windows/internet-explorer/
Während des Setups können schon Activites eingerichtet werden, die man gerne benutzen möchte. Ein Safety-Filter gegen Schadseiten ist aktiviert. Dadurch sollen persönliche Daten gesichert werden gegen online phising und Scams.
hier klicken für
mehr Informationen