Modernizacja, html5shiv, ie7.js i CSS3 Pie. Które użyć i kiedy?

Question

Właśnie zaczynam używać HTML5 i CSS3 w moich dokumentach. Rozumiem potrzebę JavaScriptu, aby przyspieszyć działanie Internet Explorera dzięki nowym tagom i stylom, ale nie wiem, którego użyć i kiedy!

Mój plan polegał na tym, aby używać html5shiv i IE9.js do dbania o tagi HTML5, a także przezroczyste pngs (i inne brzydkie błędy, które naprawiają), ale wtedy Modernizr i CSS3 Pie zostały mi zwrócone.

Moje pytanie brzmi: czy używam Modernizr, czy dba o moją html5shiv i IE9.js? Czy powinienem też je uwzględnić? Co to jest nakładanie się, jeśli takie istnieje?

A co robi CSS3 Pie tego Modernizatora, a inni nie? Lub odwrotnie?

Doceniam twoich pomocników. Daj mi znać, co robisz !?

Answer 1

Posiadam bogate doświadczenie w zakresie wszystkich tych zagadnień, wykorzystując je od kilku lat.

modernizr

Zawiera funkcjonalność HTML5shiv też robi dużo więcej - jeśli nie korzystać z innych możliwości, to nie należy go używać, to nie spowolni strona ładuje się, ale warto, jeśli Potrzebujesz tego!

HTML5shiv

Bardzo mały, tylko naprawia elementy HTML5 w IE, nic innego.

CSS3PIE

Pozwala użyć border-radius, gradienty i cień pudełko w starszych wersjach IE. Można również zezwolić na PNG w IE 6. Dodaje zauważalne opóźnienie do ładowania strony.

ie7.js (i ie9.js)

daje wiele selektorów CSS3, minimalna i maksymalna szerokość, wiele klas i stałe ustawienie. Również może mieć png naprawić, jeśli chcesz. Wydaje się, że nie spowalniało to zbytnio.

Wnioski

Moja rada to można podzielić na dwie kategorie:

Jeśli tylko przy użyciu nowych (2 lata nowy w internecie ?!) elementów i selektorów CSS3, a następnie użyć IE9 .js + the html5shiv. Jest to lekki i pozwala ci na wszystko, bez konieczności pamiętania, że ​​IE6 nie obsługuje niczego.

Jeśli używasz wielu rzeczy CSS3, to CSS3PIE będzie porządkować granice i cienie. Obsługa gradientów wydaje się trochę niestabilna, więc zawsze używałam obrazu zastępczego. Modernizr umożliwia łatwe dostarczanie różnych właściwości do przeglądarek z różnym wsparciem. Używałem tego głównie do określenia, czy przeglądarka ma przejścia i transformacje CSS, ponieważ są one użyteczne dla dowolnych suwaków obrazu lub karuzeli treści. Warto skorzystać z narzędzia do dostosowywania, aby włączyć tylko tę funkcję, która jest potrzebna - elementy formularzy internetowych wyświetlają pole tekstowe z 50-cioma przez kilka milisekund, więc warto je wyłączyć, jeśli tego nie chcesz.

Mam nadzieję, że to pomocne!

Answer 2

Zalecam, abyś używał tylko tego, czego potrzebujesz. Zbuduj swoją aplikację w przeglądarce, która obsługuje funkcje, których używasz, i okresowo testuj w innych obsługiwanych przeglądarkach. Jeśli coś nie działa poprawnie, znajdź odpowiednią poprawkę, czy to html5shiv, IE9.js, Modernizr, czy CSS3 Pie. Nie użyjesz wszystkich nowych funkcji w HTML5 i CSS3 na jednej stronie, więc nie musisz uwzględniać każdej istniejącej biblioteki polyfill. Poczekaj, aż znajdziesz problemy z funkcjami, których próbujesz użyć, a następnie spróbuj znaleźć bibliotekę niezbędną do tego.

Answer 3

Użyłem głównie CSS3Pie ... działa świetnie. Ale dziś po południu przetestowałem to na moim laptopie z I.E8 i był problem z tym ... to wyłączało niektóre linie css ... kiedy usunąłem kod css3pie moja strona zyskała dwa razy większą prędkość ... wtedy przyszedłem po drugiej stronie postów z ludźmi kłócącymi się o spowolnienie css3 ... W tej chwili jestem zajęty, aby znaleźć inny sposób dla IE7 & IE8, aby mieć promień i cienie graniczne.

Jeśli chcesz go używać ... proszę przetestować dużo jak to jest nieoficjalne poprawki