Câu trả lời:
HTML5 hiện được hỗ trợ bởi tất cả các trình duyệt, ngay cả IE5! (Nếu bạn sử dụng tập lệnh html5shiv). Tôi đặc biệt khuyên bạn nên đọc http://diveintohtml5.org Đây là một trong những tài nguyên HTML5 tốt nhất hiện có.
Đối với CSS3, nếu bạn sử dụng nó, hãy đảm bảo sử dụng tiền tố của nhà cung cấp, bên trên cú pháp thông thường. ví dụ
bán kính biên giới
-moz-biên giới-bán kính
-webkit-Border-radius
Tôi tin vào sự tăng cường tiến bộ. Hỗ trợ css3 của IE9 nghe có vẻ rất hứa hẹn.
Có lẽ.
Có những phần của HTML5 mà bạn có thể sử dụng ngay bây giờ, ngay hôm nay. Các hình thức ví dụ. Nếu bạn có <input type="email">
trong một trình duyệt không hỗ trợ HTML5 (có, thậm chí IE6), bạn sẽ chỉ thấy điều tương tự bạn thấy nếu bạn sử dụng <input type="text">
. Tuy nhiên, trên một trình duyệt hỗ trợ các thành phần biểu mẫu HTML5, bạn có được các lợi thế của email
loại: cụ thể là máy khách sẽ kiểm tra lỗi giá trị mà không cần thêm JS. Mặc dù có, bạn vẫn sẽ cần JS cho các trình duyệt không phải là HTML5, bạn sẽ có thêm một lớp xác thực trong các trình duyệt hỗ trợ.
Một câu hỏi khác trên trang web này cung cấp một cái nhìn tổng quan tốt về các tính năng mới có sẵn cho bạn thông qua HTML5 và CSS3. Có rất nhiều dữ liệu tốt về các hình thức trong câu hỏi đó.
Bởi vì Internet Explorer (và các phiên bản cũ hơn của Safari và Firefox, tuy nhiên hiếm khi chúng có thể) không hỗ trợ nhiều tính năng trong số các tính năng mà bạn còn lại với các thư viện JavaScript để lấp đầy khoảng trống. Chúng bao gồm một cú đánh hiệu suất (mặc dù nó chỉ dành cho các trình duyệt cần sử dụng chúng), vì vậy hãy chú ý đến người dùng của bạn khi sử dụng chúng.
Để giảm thiểu các vấn đề thiếu hỗ trợ tính năng, bạn nên quyết định rằng các tính năng mới này có giá trị hay không, hãy sử dụng các tài nguyên sau:
.htc
tệp) làm cho Internet Explorer 6-8 có khả năng hiển thị một số tính năng trang trí CSS3 hữu ích nhất. Khi áp dụng cho một phần tử, nó cho phép IE để nhận ra và hiển thịborder-radius
,box-shadow
,border-image
, nhiều hình ảnh nền, vàlinear-gradient
như hình nền.true
nếu được hỗ trợ vàfalse
nếu không. Thêm hỗ trợ để tạo kiểu và in các phần tử HTML5 để bạn có thể sử dụng các phần tử như<section>
,<header>
và<nav>
.src
một<img />
yếu tố hoặc là mộtbackground-image
tài sản trong CSS. Không giống nhưAlphaImageLoader
,background-position
vàbackground-repeat
hoạt động như dự định, và các phần tử sẽ đáp ứng với lớpa:hover
giả..htc
tệp) có thêm hỗ trợ PNG với độ mờ alpha cho IE 6. Định vị và lặp lại nền CSS đầy đủ đang hỗ trợ (bao gồm cả các họa tiết CSS) với JavaScript (bao gồm) bổ sung..htc
tệp) tự động vá: hover ,: active và: tập trung cho các quirks IE6, IE7 và IE8, cho phép bạn sử dụng chúng như bạn làm trong bất kỳ trình duyệt nào khác. Bao gồm hỗ trợ AJAX, có nghĩa là bất kỳ html mà được chèn vào tài liệu qua javascript cũng sẽ kích hoạt:hover
,:active
và:focus
phong cách trong IE.Thật thú vị khi lưu ý rằng DD_belatedPNG giải quyết cả hai vấn đề được giải quyết bằng Any: hover và TwinHelix's IE PNG Fix với JavaScript thuần túy, trong khi Any: hover và Twin PNGel của TwinHelix sử dụng kết hợp các hành vi đính kèm JavaScript và IE ( .htc files
).
Nói chung, những người sử dụng trình duyệt không phải IE nâng cấp chúng khi được yêu cầu và vì vậy IE chịu trách nhiệm "Nhưng một số trình duyệt không hỗ trợ tính năng này!" khiếu nại. Modernizr sẽ thêm khả năng sử dụng HTML5 / CSS3 cho bất kỳ trình duyệt nào bạn có thể thấy và không chỉ IE. tức là-css3.js sẽ làm điều tương tự, bạn chỉ cần thực hiện nó mà không cần bình luận có điều kiện IE (có nghĩa là tất cả các trình duyệt sẽ nhận được nó trừ khi bạn đưa nó vào kiểm tra tác nhân người dùng phía máy chủ - điều này sẽ làm giảm hiệu suất rất nhiều cho tất cả khách truy cập của bạn, thay vì chỉ người dùng IE của bạn.)
Sử dụng bất cứ công nghệ nào phù hợp với nhu cầu của bạn nhất.
Eric Meyer đã viết một bài viết hay về lý do tại sao bắt đầu sử dụng tiền tố dành riêng cho nhà cung cấp cho các quy tắc CSS không bị khập khiễng như sử dụng các bộ lọc css được sử dụng.
Tôi nghĩ điều tương tự cũng áp dụng cho HTML5. Nếu bạn có thể kiểm tra hỗ trợ trình duyệt cho các tính năng khác nhau, tại sao không sử dụng nó. Miễn là trang web xuống cấp một cách duyên dáng, hãy sống hết mình.
Một số liên kết hữu ích khác, khi quyết định các tính năng CSS3 nào bạn có thể muốn sử dụng: http://caniuse.com/ (cung cấp phân tích tốt về các yếu tố và bộ chọn nào có thể sử dụng trên các nền tảng nào)
http://css3please.com/ (một sân chơi có thể chỉnh sửa trong trang để gây rối với các tính năng CSS3, điều này cũng đưa ra một số lời khuyên về các kỹ thuật và tính năng được hỗ trợ bởi nền tảng nào cho các kiểu dáng thường được yêu cầu, như góc tròn, nền gradient, Vân vân.)
Tôi sử dụng nó để nâng cao trải nghiệm trên các trình duyệt hiện đại để người dùng có trình duyệt tốt sẽ được "thưởng" với giao diện người dùng đẹp hơn (Các góc tròn, bóng tối, loại công cụ đó). Tôi đoán bạn không nên sử dụng nó như một sự thay thế cho giả sử xác thực mẫu khách hàng hiện tại của bạn, trừ khi bạn có một loại dự phòng JS cho nó.
Nếu bạn đang bắt đầu một dự án mới bằng HTML5, cũng nên được hỗ trợ trong các trình duyệt cũ hơn, tùy chọn tốt nhất là sử dụng Initializr -
Nó sử dụng HTML5 Boilerplate ở phần phụ trợ và thêm một vài tùy chọn của riêng nó để cung cấp cho bạn một mẫu mà bạn có thể triển khai trên trang web của riêng mình. Nó bao gồm các thư viện Javascript (như HTML Shiv hoặc Modernizr), sẽ làm cho trang web của bạn tương thích với các trình duyệt cũ hơn.
Nếu trang web của bạn là mạng nội bộ riêng tư và bạn có thể kiểm soát trình duyệt hoặc có một phạm vi trình duyệt hạn chế để xử lý, thì hãy thoải mái làm việc trên công nghệ mới.
Nếu không, bất kể bạn sử dụng cái gì, bạn sẽ luôn phải tính đến mẫu số chung thấp nhất. Trong trường hợp này, nó có thể là sự kết hợp của IE 6 và một loạt các trình duyệt di động. Vì vậy, nếu bạn tiến lên với HTML 5, bạn có thêm vấn đề về việc đảm bảo trang web của bạn 'xuống cấp' độc đáo.