Antworten:
HTML5 wird jetzt von allen Browsern unterstützt, sogar von IE5! (Wenn Sie das Skript html5shiv verwenden). Ich empfehle dringend, http://diveintohtml5.org zu lesen. Es ist eine der besten HTML5-Ressourcen, die es gibt.
Wenn Sie CSS3 verwenden, stellen Sie sicher, dass Sie zusätzlich zur regulären Syntax auch Vendor Predix verwenden. z.B
Grenzradius
-moz-border-radius
-webkit-border-radius
Ich glaube an eine fortschreitende Verbesserung. Die Unterstützung von IE9 für CSS3 klingt sehr vielversprechend.
Wahrscheinlich.
Es gibt Teile von HTML5, die Sie derzeit verwenden können. Formulare zum Beispiel. Wenn Sie <input type="email">
einen Browser haben, der HTML5 nicht unterstützt (ja, sogar IE6), sehen Sie einfach das Gleiche, was Sie sehen würden, wenn Sie es verwenden würden <input type="text">
. In einem Browser, der HTML5-Formularelemente unterstützt, profitieren Sie jedoch von den Vorteilen des email
Typs: Der Client überprüft den Wert fehlerfrei, ohne dass eine zusätzliche JS erforderlich ist. Ja, für Nicht-HTML5-Browser benötigen Sie weiterhin JS. In den unterstützten Browsern ist jedoch eine weitere Validierungsebene vorhanden.
Eine weitere Frage auf dieser Website bietet einen guten Überblick über die neuen Funktionen, die Ihnen über HTML5 und CSS3 zur Verfügung stehen. Auch in dieser Frage gibt es viele gute Daten zu Formularen.
Da Internet Explorer (und ältere Versionen von Safari und Firefox, wie selten sie auch sein mögen) viele dieser Funktionen nicht unterstützen, müssen Sie JavaScript-Bibliotheken verwenden, um die Lücke zu füllen. Dazu gehört ein Leistungseffekt (auch wenn dies nur für die Browser erforderlich ist). Achten Sie daher beim Einsatz auf Ihre Benutzer.
Verwenden Sie die folgenden Ressourcen, um die Probleme mit mangelnder Funktionsunterstützung zu beheben, falls Sie sich für diese neuen Funktionen entscheiden sollten:
.htc
Datei), mit dem Internet Explorer 6-8 mehrere der nützlichsten CSS3-Dekorationsfunktionen rendern kann. Wenn auf ein Element angewendet, ermöglicht esIE zu erkennen und Anzeigeborder-radius
,box-shadow
,border-image
, mehrere Hintergrundbilder undlinear-gradient
als Hintergrundbild.true
sofern dies unterstützt wird undfalse
nicht. Fügt Unterstützung für das Stylen und Drucken von HTML5-Elementen hinzu, sodass Sie Elemente wie<section>
,<header>
und verwenden können<nav>
.src
eines<img />
Elements oder alsbackground-image
Eigenschaft in CSS. Im GegensatzAlphaImageLoader
,background-position
undbackground-repeat
wie vorgesehen, und Elemente auf die reagierta:hover
pseudo-Klasse..htc
Datei), das dem IE 6 PNG-Unterstützung mit Alpha-Deckkraft hinzufügt. Vollständige Positionierung und Wiederholung des CSS-Hintergrunds werden (einschließlich CSS-Sprites) mit zusätzlichem (enthaltenem) JavaScript unterstützt..htc
Datei), das automatisch Patches für: Hover,: Active und: Focus für IE6-, IE7- und IE8-Macken erstellt, sodass Sie sie wie in jedem anderen Browser verwenden können. Ist mit AJAXUnterstützung, was bedeutetdass jeder HTMLCode, in das Dokument über Javascript eingefügt wird werden auch Auslöser:hover
,:active
und:focus
Stile imExplorer.Interessanterweise behebt DD_belatedPNG beide Probleme, die in Whatever: hover und TwinHelixs IE PNG Fix behoben wurden, mit reinem JavaScript. Whatever: hover und TwinHelixs IE PNG Fix verwenden eine Kombination aus JavaScript- und IE-angehängten Verhaltensweisen ( .htc files
).
Im Allgemeinen aktualisieren Benutzer von Nicht-IE-Browsern diese, wenn sie dazu aufgefordert werden, und der IE trägt die Hauptlast von "Aber einige Browser unterstützen diese Funktion nicht!". Beschwerden. Modernizr wird die Möglichkeit hinzufügen, HTML5 / CSS3 in jedem Browser zu verwenden, den Sie wahrscheinlich sehen, und nicht nur in IE. ie-css3.js führt dasselbe aus, Sie müssen es nur ohne einen IE-bedingten Kommentar implementieren (was bedeutet, dass alle Browser es erhalten, es sei denn, Sie fügen es bei den serverseitigen Benutzeragentenprüfungen hinzu - dies verringert die Leistung erheblich für alle Ihre Besucher und nicht nur für Ihre IE-Benutzer.)
Verwenden Sie die Technologie, die Ihren Anforderungen am besten entspricht.
Eric Meyer hat einen schönen Artikel darüber geschrieben, warum der Einstieg in die Verwendung herstellerspezifischer Präfixe für CSS-Regeln nicht mehr so lahm ist wie früher die Verwendung von CSS-Filter-Hacks.
Ich denke, das gilt auch für HTML5. Wenn Sie die Browserunterstützung auf verschiedene Funktionen prüfen können, verwenden Sie sie. Solange sich die Site anmutig verschlechtert, lebe sie.
Einige andere nützliche Links, wenn Sie entscheiden, welche CSS3-Funktionen Sie verwenden möchten: http://caniuse.com/ (enthält eine gute Aufschlüsselung der Elemente und Selektoren, die auf welchen Plattformen verwendet werden können)
http://css3please.com/ (eine in der Seite bearbeitbare Spielwiese, auf der Sie mit CSS3-Funktionen herumspielen können. Hier finden Sie auch Hinweise dazu, welche Techniken und Funktionen von welchen Plattformen für häufig angeforderte Stile wie abgerundete Ecken und Verlaufshintergründe unterstützt werden.) etc.)
Ich benutze es, um die Erfahrung auf modernen Browsern zu verbessern, so dass die Benutzer mit einem guten Browser mit besser aussehenden Benutzeroberflächen (abgerundete Ecken, Schatten, so etwas) "belohnt" werden. Ich denke, Sie sollten es nicht als Ersatz für Ihre aktuelle clientseitige Formularvalidierung verwenden, es sei denn, Sie haben eine Art JS-Fallback dafür.
Wenn Sie ein neues Projekt mit HTML5 starten, das auch in älteren Browsern unterstützt werden soll, ist die beste Option, Initializr - zu verwenden.
Es verwendet HTML5 Boilerplate im Backend und fügt einige eigene Optionen hinzu, um Ihnen eine Vorlage zu geben, die Sie auf Ihrer eigenen Site bereitstellen können. Es enthält die Javascript-Bibliotheken (wie HTML Shiv oder Modernizr), die Ihre Site mit älteren Browsern kompatibel machen.
Hängt davon ab, was das Publikum ist und welche Funktionen Sie verwenden möchten. Ich gehe davon aus, dass es noch einige Jahre dauern wird, bis das durchschnittliche Projekt die Unterstützung für ie6 fallen lässt :(
Wenn es sich bei Ihrer Website um ein privates Intranet handelt und Sie entweder den Browser steuern oder nur über eine begrenzte Anzahl von Browsern verfügen, können Sie auf dem neuesten Stand der Technik arbeiten.
Wenn nicht, egal was Sie verwenden, müssen Sie immer den kleinsten gemeinsamen Nenner berücksichtigen. In diesem Fall handelt es sich wahrscheinlich um eine Kombination aus IE 6 und einer Reihe von mobilen Browsern. Wenn Sie also mit HTML 5 weitermachen, müssen Sie zusätzlich sicherstellen, dass sich Ihre Website gut verschlechtert.