publikuj: Opublikuj w wykop.pl Opublikuj we flaker.pl Opublikuj na OSnews.pl Opublikuj w delicious wydrukuj
skomentuj »

TAGI: internet explorer , artur żarski

2008-08-26 14:05:00, dodał Artur Żarski

Co zrobić, aby Twoja witryna WWW działała prawidłowo z Internet Explorer 8 Beta 1Co zrobić, aby Twoja witryna WWW działała prawidłowo z Internet Explorer 8 Beta 1

Zostałem ostatnio poproszony o przygotowanie dokumentu na temat IE8 oraz poprawnego wyświetlania stron WWW. W chwili obecnej dostępna jest wersja Beta 1 i tej wersji dotyczy ten opis, natomiast wielkimi krokami zbliża się wersja Beta 2, w której troszkę się pozmienia. Póki co mam nadzieję, że tekst trochę pomoże użytkownikom, administratorom i programistom w wejściu w "świat" IE8. Z góry uprzedzam, że wpis powstał na bazie innych tekstów ze stron MSDN i witryny produktowej IE - ja natomiast zebrałem to razem i opracowałem wersję polską.

 

Podczas przeglądania stron WWW użytkownik może doświadczyć nieoczekiwanego zachowania danej witryny w przeglądarce. Mogą nastąpić następujące efekty:

  • Złe wyrównanie elementów na stronie
  • Nakładanie się tekstów lub obrazów
  • Problemy i błędy z JavaScript

Spowodowane jest to tym, że Internet Explorer 8 Beta 1 wyświetla standardowo strony przy użyciu trybu zgodnego z najnowszymi standardami, a większość witryn zostało stworzonych do pracy ze standardem Internet Explorer 7.

Aby użytkownik mógł prawidłowo wyświetlać w IE8 strony, które zostały przystosowane do standardu poprzednich wersji powinien wykonać następujące czynności:

  • Otworzyć przeglądarkę Internet Explorer 8 Beta 1.
  • Wcisnąć przycisk Emulate IE 7 w menu a następnie ponownie uruchomić przeglądarkę.
  • Aby powrócić do pracy ze standardem IE8 należy ponownie wcisnąć przycisk Emulate IE 7 i wyłączyć tą opcję.

 

Dla programisty.

Powyższa opcja ta jest dostępna dla użytkownika końcowego. Warto jednak, aby użytkownicy nie musieli sami każdorazowo uruchamiać i wyłączać tej opcji. Możliwe jest wymuszenie, aby nasza, już istniejąca witryna, wyświetlała się prawidłowo w przeglądarce IE8. Wystarczy, że do naszej witryny zostanie dopisany odpowiedni meta-tag. Dopisanie tego Tagu powoduje, że strona jest wyświetlana w trybie Internet Explorer 7 Standards (Strict) lub Internet Explorer 5 (Quirks). Nagłówek, który należy dopisać to X-UA-Compatible: IE=EmulateIE7. Deklaracja powinna wyglądać następująco:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

Przykład:

<html>

<head>

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

      <title>My Web Page</title>

 </head>

<body>

<p>Content goes here.</p>

</body>

</html>

Atrybut IE może przyjąć kilka wartości: IE=5, IE=7 lub IE=8 aby określić tryb zgodności. Dostępna jest również wartość IE=edge, która mówi IE8 aby używał najwyższy z dostępnych trybów.

X-UA-compatible nie jest case sensitive, ale musi być umieszczony wewnątrz element <HEAD>. Poszczególne tryby pracy opisane zdefiniowane są następująco:

  • Tryb EmulateIE7 – wymusza na przeglądarce użycie dyrektywy <!DOCTYPE> w celu określenia jak wyświetlić zawartość. W przeciwieństwie do trybu IE7, tryb Emulate IE7 bierze pod uwagę właśnie dyrektywę <!DOCTYPE>. Dla wielu witryn jest to preferowany tryb zgodności.
  • Tryb IE5 – wyświetla zawartość w sposób jak i był wyświetlany przez Internet Explorer 7 w trybie pracy quirks, który jest bardzo podobny do sposobu wyświetlania stron przez Internet Explorer 5.
  • Tryb IE7 – wyświetla zawartość w sposób jak i był wyświetlany przez Internet Explorer 7 w trybie pracy standard, bez względu na to czy strona zawierała dyrektywę <!DOCTYPE>.
  • Tryb IE8 – dostarcza najwyższe dostępne wsparcie dla standardów przemysłowych, włączając w to specyfikację W3C dla CSS Level 2.1 oraz W3C Selectors API oraz ograniczone wsparcie dla specyfikacji W3C dla CSS Level 3 (aktualnie specyfikacja jest opracowywana).
  • Tryb Edge – informuje przeglądarkę Internet Explorer do wyświetlania zawartości w najwyższym dostępnym trybie. Dla Internet Explorer 8 jest to ekwiwalent trybu IE8. Hipotetycznie, jeśli będziemy pracować z następnymi wersjami przeglądarki IE to strona będzie wyświetlana automatycznie zgodnie z trybem tej wersji przeglądarki.

Czasami konieczne jest określenie przez programistę, w jakim trybie pracuje nasza przeglądarka. Do tego celu posłuży nam JavaScript. Aby wyświetlić aktualny tryb pracy wystarczy wykonać następujące polecenie:

javascript:alert(document.documentMode);

Właściwość documentMode zwraca numeryczną wartość odpowiadającą trybowi pracy strony. Jeśli dana strona wspiera tryb IE8 to właściwość documentMode zwróci wartość 8.

Przykładowy fragment kodu określa tryb zgodności, z jakim pracuje nasza strona, włączając w to starsze wersje przeglądarek.

tryb = null;
if (window.navigator.appName == "Microsoft Internet Explorer")
{
   // Pracujemy z Internet Explorer – określamy tryb pracy.
   if (document.documentMode) // IE8
      tryb = document.documentMode;
   else // IE 5-7
   {
      tryb = 5; // Przyjmujemy tryb pracy quirks o ile nie udowodnimy 
                // pracy w innym trybie poprzez sprawdzenie 
                // trybu pracy przeglądarki 
      if (document.compatMode)
      {
         if (document.compatMode == "CSS1Compat")
            tryb = 7; // standard. Przeglądarka IE7
      }
   }
}

 

Dla administratora serwera WWW

Możliwe jest również określenie sposobu wyświetlania strony poprzez odpowiednią konfigurację serwera WWW i wymuszenie na nim wyświetlania strony w trybie zgodności z IE7 (EmulateIE7). Poniższa procedura określa kroki, jakie należy wykonać, aby skonfigurować serwer IIS7 na Windows Server 2008:

  • Uruchamiamy Internet Information Services (IIS) Manager dostępny w narzędziach administracyjnych (Administrative Tools).
  • Na liście dostępnych stron na wybranym serwerze WWW wybieramy odpowiednią witrynę
  • W sekcji IIS klikamy dwukrotnie na HTTP Response Headers.
  • W sekcji Actions klikamy Add.
  • W polu Name wpisujemy X-UA-Compatible.
  • W polu Value wpisujemy IE=EmulateIE7.
  • Klikamy OK.

Innym sposobem jest odpowiedni wpis do pliku Web.config dla danej witryny:

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <system.webServer>
    <httpProtocol>
      <customHeaders>
        <clear />
        <add name="X-UA-Compatible" value="IE=EmulateIE7">
      </customHeaders>
    </httpProtocol>
  <system.webServer>
</configuration> 

 

Dla serwera II6 musimy wykonać następujące kroki:

  • Z wiersza poleceń wpisując inetmgr.exe uruchamiamy konsolę administracyjną.
  • Klikamy Właściwości (Properties) dla wybranej witryny
  • W opcji Custom http headers, klikamy Add.
  • W polu Custom header name wpisujemy X-UA-Compatible.
  • W polu Custom header value wpisujemy IE=EmulateIE7.
  • Dwukrotnie klikamy OK.

 

 

Dodatkowe zasoby w Internecie:

Internet Explorer 8 main site:  http://www.microsoft.com/ie/ie8

Internet Explorer Team Blog:  http://blogs.msdn.com/ie

Internet Explorer Developer Center:  http://msdn2.microsoft.com/en-us/ie/default.aspx

Internet Explorer 8 Readiness Toolkit (for web designers and developers): http://www.microsoft.com/windows/products/winfamily/ie/ie8/readiness/default.htm

Microsoft Interoperability Principles:  http://www.microsoft.com/interop/principles/default.mspx

publikuj: Opublikuj w wykop.pl Opublikuj we flaker.pl Opublikuj na OSnews.pl Opublikuj w delicious wydrukuj
skomentuj »

Polecane książki

Czytaj Webhosting

Chcesz być na bieżąco z naszymi informacjami? Zapisz się na Newsletter.

Zarejestruj domenę

Sprawdź dostępność swojej domeny:

.pl: 0 zł   .com: 19.90 zł
.com.pl: 0 zł   .eu: 19.90 zł