Pietro Brambati

Pietro Brambati - Description

Developer Evangelist, Microsoft. Blogs.msdn.com/. pietrobr. Internet Explorer 8. Compatibilità. . e standard. Agenda. Approcci. . alla. . compatibilità. Document compatibility. Concetti. e . Tecniche. ID: 378405 Download Presentation

43K - views

Pietro Brambati

Developer Evangelist, Microsoft. Blogs.msdn.com/. pietrobr. Internet Explorer 8. Compatibilità. . e standard. Agenda. Approcci. . alla. . compatibilità. Document compatibility. Concetti. e . Tecniche.

Similar presentations


Download Presentation

Pietro Brambati




Download Presentation - The PPT/PDF document "Pietro Brambati" is the property of its rightful owner. Permission is granted to download and print the materials on this web site for personal, non-commercial use only, and to display it on your personal computer provided you do not modify the materials and that you retain all copyright notices contained in the materials. By downloading content from our website, you accept the terms of this agreement.



Presentation on theme: "Pietro Brambati"— Presentation transcript:

Slide1

Pietro BrambatiDeveloper Evangelist, MicrosoftBlogs.msdn.com/pietrobr

Internet Explorer 8

Compatibilità

e standard

Slide2

Agenda

Approcci

alla

compatibilità

Document compatibility

Concetti

e

Tecniche

Meta Tag, Header

Come

determinare

la

Versione

del browser

Version Vector

User Agent

Determinare

la document compatibility

da

codice

Slide3

Approcci

alla

compatibilità

Slide4

Cos’è la document compatibility

Internet Explorer 6:

Quirk Mode: (default),

visualizzava

come le

versioni

precedenti

Standard Mode: segue

gli

standard

<!DOCTYPE> per la

scelta

della

modalità

Internet Explorer 7:

Supporta

due

modalità

Necessaria

una

migrazione

da

un

sito

pensato

per IE 6

Internet Explorer 8: introduce la document compatibility

Controllo

in IE8

quale

motore

di

layout

usare

in base a come è

fatto

il

sito

Quirk

IE 7 Standard

IE 8 Standard (

nuova

)

Slide5

Approcci alla compatibilità

1.

sviluppare

per IE8 Standards

4. Affidarsi alla Compat. List

2. Implementare il tag X-UA-Compatible

5.

Affidarsi

all’utente: Compat. Button

User Experience

limitata

User Experience

migliorata

Minor

sforzo

per il sito

Maggior impegno

3.

Visualizzare

siti

Intranet Compatibility Mode

Slide6

1. Sviluppare per IE8 Standard Mode

HTML

ACID 2

CSS 2.1

CSS 2.1 compliance

DOM:

miglioramenti

HTML:

miglioramenti

Acid2 Test compliance

Slide7

2. Usare X-UA-Compatible Tag

Gli sviluppatori di siti web possono dire a IE8 per quale versione di IE il sito è stato sviluppato. Impostabile a livello di sito, a livello di pagina, includendo un tag

Valore TagSignificatoIE=5“Quirks” modeIE=7Usare sempre IE7 Standard modeIE=EmulateIE7In IE7 Standard mode a meno che il sito abbia “Quirks” DOCTYPEIE=8Usare sempre IE8 modeIE=EmulateIE8Usare questo tag per sovrascrivere quanto impostato dall’utente e forzare IE8 modeIE=EdgeVisualizzare nella modalità più avanzata; Al rilascio di IE8 è equivalente a IE=8

Consigliato

Slide8

3. Visualizzare i siti della Intranet in Compatibility Mode

Per default, IE8

visualizza i siti della “Intranet” in IE7 modeL’utente la può disabilitareIT Pro può usare una Group Policy per visualizzare un sito della intranet in IE8 mode

Slide9

4. La “Compatibility View List"

Se uno tra i siti più grandi ha riportato dei problemi di compatibiltità a MicrosoftIE8 visualizzerà il sito in compatibility mode

Slide10

5. L’utente può premere il Compatibility Button

Vicino al bottone di refreshSimile a X-UA-Compatible tag (IE=EmulateIE7), ma la User-Agent String visualizza come browser IE7

Slide11

Compatibility View

Sito aggiunto alla lista di compatibilitàPer rimuove il sito dalla listaContent=“IE=EmulateIE8”UA String DetectionMozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; Trident/4.0; SLCC1; .NET CLR 3.5.21022)

Slide12

Concetti

e

tecniche

per la

compatibilità

Slide13

Passi verso la compatibilità

Nel

breve

:

usare

il

tag

IE=EmulateIE7

Testare

il

vostro

sito

con IE8

Virtual Machine

IE8 Developer Toolbar

Identificare

gli

elementi

del

vostro

sito

che

non

funzionano

in IE8,

anche

con

il

tag

di

compatibilità

XSS Filter–

Impedisce

al

JScript

di

essere

eseguito

DEP/NX

impedisce

al

codice

di

non

essere

eseguito

in

aree

di

memoria

non-executable

Il tool ACT (

vedere

link

utili

)

traccia

alcuni

problemi

A

lungo

termine

:

sviluppare

per IE8 in

modalità

Standard

Slide14

X-UA-Compatible

IIS 7: Windows Vista, Windows Server 2008

Slide15

X-UA-Compatible

A

livello

di

sito

,

aggiungere

un HTTP Header:

X-UA-Compatible: IE=EmulateIE7

<?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>

Slide16

X-UA-Compatible

A

livello

di

pagina

,

aggiungere

un tag

subito

dopo

<head>:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN">

<html>

<head>

<title>My Web Page</title>

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

</head>

<body>

<p>Content goes here.</p>

</body>

</html>

Slide17

Esempi di DocType

Quirks

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN>

(o

nessun

DOCTYPE)

Standards

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Strict//EN>

Slide18

Version Vector

Funzionalità

specifica

di

Internet Explorer

Chiave

di

registry

Usato

per

elaborare

commenti

condizionali

in base

alle

versioni

del browser

<!—[if

gte

IE 5.5002]>

<p>you are using IE 5 or higher</p>

<![

endif

]-->

Slide19

Version Vector

<!—[if IE 6]><linkrel=“stylesheet” type=“text/css” href=“/stylesheets/ie6.css”/><![endif]--><!—[if IE 7]><linkrel=“stylesheet” type=“text/css” href=“/stylesheets/ie7.css”/><![endif]--><!—[if gte IE 8]><linkrel=“stylesheet” type=“text/css” href=“/stylesheets/standards.css”/><![endif]-->

Slide20

La User Agent String

Rappresenta l’identità del BrowserMandata al web server via HTTP headerDisponibile client-side via script javascript:alert(navigator.userAgent)

Slide21

Parsing della User Agent String

function

getInternetExplorerVersion

()

// Returns the version of Windows Internet Explorer or a -1

// (indicating the use of another browser).

{

var

rv

= -1; // Return value assumes failure.

if (

navigator.appName

== 'Microsoft Internet Explorer')

{

var

ua

=

navigator.userAgent

;

var

re = new

RegExp

("MSIE ([0-9]{1,}[\.0-9]{0,})");

if (

re.exec

(

ua

) != null)

rv

=

parseFloat

( RegExp.$1 );

}

return

rv

;

}

Slide22

Controllare la versione del browser

function

checkVersion(){ var msg = "You're not using IE."; var ver = getInternetExplorerVersion(); if ( ver> -1 ) { if ( ver>= 8.0 ) msg = "You're using a recent copy of IE." else msg = "You should upgrade your copy of IE"; } alert( msg );}

http://msdn.microsoft.com/en-us/library/cc817582.aspx

Slide23

UA String vs. Version Vector

La User Agent String

può

essere

usata

per

qualsiasi

browser

Il Version vector per

emettere

codice

di

markup in

modo

condizionale

con IE

La User Agent String è

usata

per

differenziare

la

logica

di

business

Slide24

Come Determinare la Document Compatibility Mode

document.compatMode

Values

CSS1Compat – Standards Mode

BackCompat

– Quirks Mode

da

IE6:

deprecato

,

usare

ora

documentMode

document.documentMode

Values

5 – Quirks

7 – Strict

8 – Internet Explorer 8 Standards Mode

In IE8

influenzata

solo

da

X-UA-Compatible

tag

Non

dal

DOCTYPE

Slide25

Determiare la Document Compatibility

engine

=

null

;

if

(

window.navigator.appName

== "Microsoft Internet Explorer")

{   

//

This

is

an

IE browser

.   

if

(

document.documentMode

)

// IE8  

    

engine

=

document.documentMode

;   

else // IE 5-7   

{      

engine

= 5;

// Assume

quirks

mode

unless

 

    

if

(

document.compatMode

)      

{         

if

(

document.compatMode

== "CSS1Compat")

      

engine

= 7;

//

standards

mode

     

}}}

Slide26

Link utili

Defining Document Compatibility: Step-by-step instructions for

meta tag placement

http://msdn.microsoft.com/en-us/library/cc288325(VS.85).aspx

Internet Explorer 8

Compatibility Test Guide

http://msdn.microsoft.com/en-us/library/cc848857(VS.85).aspx

IE8 Compatibility – Meta tags, HTTP headers, User Agent Strings on

from Mike Ormond's (DPE) Blog

http://blogs.msdn.com/mikeormond/archive/2008/09/25/ie-8-compatibility-meta-tags-http-headers-user-agent-strings-etc-etc.aspx

Application Compatibility Toolkit 5.0 with the

IE Compatibility Test Tool

http://www.microsoft.com/downloads/details.aspx?familyid=24DA89E9-B581-47B0-B45E-492DD6DA2971&displaylang=en

Slide27

Link Utili

Internet Explorer

Compatibility Center

http://msdn.com/iecompat

Internet Explorer

Developer Center

 

http://msdn2.microsoft.com/en-us/ie/default.aspx

Internet Explorer 8

Readiness Toolkit

http://www.microsoft.com/windows/internet-explorer/beta/readiness/

Internet Explorer 8

Home Page

http://www.microsoft.com/ie/ie8

Slide28

© 2009 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS SUMMARY.

Slide29

Slide30

Slide31

Slide32