Trước kia, Internet Explorer ( IE ) là một trình duyệt tiến bộ nhất. Nhưng sau một khoảng thời gian ngưng phát triển, IE đã trở thành ‘thảm họa’ đối với các nhà thiết kế web như chúng ta. Microsoft đã cải tiến và cập nhật trình duyệt của họ, nhưng sự thật là IE vẫn đang tụt hậu một chút so với các trình duyệt dựa trên WebKit và Firefox. Khi làm việc, chúng ta vẫn cần phải để ý đến sự phù hợp với các phiên bản trước của IE. Sau đây mình sẽ hướng dẫn làm thế nào để trang web của bạn làm việc tốt hơn trong các trình duyệt của Microsoft.
htmlshiv.js
HTML5shiv của Remy tạo ra các yếu tố HTML5 như main, header, footer… thông qua JavaScript. Bằng cách nào đó các yếu tố được tạo ra thông qua JavaScript và bạn có thể dễ dàng style cho chúng.
<!--[if lt IE 9]> <script src="dist/html5shiv.js"></script> <![endif]-->
selectivizr.js
Selectivizr.js là một nguồn tài nguyên đáng kinh ngạc, polyfilling sẽ load các selector và property không được hỗ trợ CSS, bao gồm các last-child sử dụng !important. Trên một mẫu thiết kế lại gần đây, mình đã nhúng selectivizr vào và nó hoạt động rất tốt trên các trình duyệt IE cũ. Đây là cách sử dụng:
<!--[if lte IE 8]><script src="js/libs/selectivizr.js"></script><![endif]-->
Bạn chỉ nên sử dụng load nó ra trên các trình duyệt IE cũ.
Sử dụng các <html> Conditinal Comment
Các conditional comment này trong có vẻ xấu xí thật, nhưng xấu hay không, sự thật là chúng hoạt động rất hiệu quả và chính xác:
<!DOCTYPE html> <!--[if lt IE 7 ]> <html class="ie6" lang="en"> <![endif]--> <!--[if IE 7 ]> <html class="ie7" lang="en"> <![endif]--> <!--[if IE 8 ]> <html class="ie8" lang="en"> <![endif]--> <!--[if IE 9 ]> <html class="ie9" lang="en"> <![endif]--> <!--[if (gt IE 9)|!(IE)]><!--> <html lang="en"> <!--<![endif]-->
Đoạn mã này ( snippet ) không yêu cầu hoặc phải chờ tải JavaScript, các style này được xác định ngay lập tức.
Trong khi Internet Explorer đang dần bắt kịp các đối thủ cạnh tranh, nhưng sự thật là các trình duyệt IE cũ vẫn còn được sử dụng rất nhiều, đặc biệt là các nước đang phát triển ( Việt Nam chẳng hạn ). Tin tốt là các nguồn tài nguyên này sẽ làm việc tốt cho tất cả các trình duyệt.
