Download - I18n e web i18n: internationalization l10n: localization g11n: globalization.

i18n e webi18n e web

i18n: internationalizationi18n: internationalization

l10n: localizationl10n: localization

g11n: globalizationg11n: globalization

i18n nelle URLi18n nelle URL

URI, URL, URNURI, URL, URN

RFC 1738, 2141, 2396, 2616, 2717, 2732, 3305, RFC 1738, 2141, 2396, 2616, 2717, 2732, 3305, 39863986

URI – Uniform Resource IdentifierURI – Uniform Resource Identifier• URL: Uniform Resource LocatorURL: Uniform Resource Locator• URN: Uniform Resource NameURN: Uniform Resource Name

Uniform Resource Locator (URL)Uniform Resource Locator (URL)• Sottoinsieme di URI che identifica una risorsa Sottoinsieme di URI che identifica una risorsa

attraverso la rappresentazione del meccanismo attraverso la rappresentazione del meccanismo primario di accesso alla risorsa (network location)primario di accesso alla risorsa (network location)

Uniform Resource Name (URN)Uniform Resource Name (URN)• Sottoinsieme di URI che rimane globalmente unico e Sottoinsieme di URI che rimane globalmente unico e

persistente anche quando la risorsa cessa di esistere persistente anche quando la risorsa cessa di esistere o non è più disponibileo non è più disponibile

• Gli URN non sono necessariamente “recuperabili”Gli URN non sono necessariamente “recuperabili”

RisorsaRisorsa Qualunque cosa che abbia un’identitàQualunque cosa che abbia un’identità Mapping concettuale a un’entità (o insieme di entità):Mapping concettuale a un’entità (o insieme di entità):

• Non necessariamente l’entità stessaNon necessariamente l’entità stessa• Non necessariamente rintracciabile via reteNon necessariamente rintracciabile via rete• La risorsa non deve esistere fisicamente (è concettuale)La risorsa non deve esistere fisicamente (è concettuale)• Il contenuto può cambiareIl contenuto può cambiare

Esempi di risorseEsempi di risorse• File di qualunque tipo (.txt, .html, .pdf, .jpg, etc..)File di qualunque tipo (.txt, .html, .pdf, .jpg, etc..)• Dispositivi (stampanti, ...)Dispositivi (stampanti, ...)• Database, contenuti di databaseDatabase, contenuti di database• Share di reteShare di rete• Applicazioni, serviziApplicazioni, servizi• Persone, aziendePersone, aziende• Libri, DVD, etc..Libri, DVD, etc..

Resource Identifier: un oggetto che può agire come riferimento Resource Identifier: un oggetto che può agire come riferimento per qualcosa che ha un identità:per qualcosa che ha un identità:• Un nomeUn nome• Un localizzatoreUn localizzatore• EntrambiEntrambi

Esempi di URIEsempi di URIhttp://www.unicode.org/http://www.unicode.org/

https://www.google.com/search?q=unicodehttps://www.google.com/search?q=unicode

mailto:[email protected]:[email protected]

ftp://ftp.unicode.org/Public/6.2.0/charts/CodeCharts.pdfftp://ftp.unicode.org/Public/6.2.0/charts/CodeCharts.pdf

file:///M:/maurizio/Copyright.txt#tocfile:///M:/maurizio/Copyright.txt#toc

imaps://username%[email protected]/INBOX imaps://username%[email protected]/INBOX

urn:ietf:rfc:2648 urn:ietf:rfc:2648

urn:isbn:0201700522urn:isbn:0201700522

tel:+39-055-5272864tel:+39-055-5272864

URI: sintassi e componentiURI: sintassi e componenti

URL in Ambito Web:URL in Ambito Web: SchemeScheme: metodo per accedere alla risorsa : metodo per accedere alla risorsa AuthorityAuthority: nome host o IP addess: nome host o IP addess PathPath: nome della risorsa definito come un : nome della risorsa definito come un

percorsopercorso QueryQuery: informazioni interpretate dalla risorsa: informazioni interpretate dalla risorsa FragmentFragment: identificazione indiretta di una : identificazione indiretta di una

risorsa secondaria tramite riferimento a una risorsa secondaria tramite riferimento a una risorsa primariarisorsa primaria

N.B.: ogni parte ha la sua sintassiN.B.: ogni parte ha la sua sintassi

<scheme>:<scheme-specific-part><scheme>://<authority><path>?<query>#<fragment>

Lo schemaLo schema

Dichiara il tipo di risorsa e la Dichiara il tipo di risorsa e la modalità di accessomodalità di accesso

Definisce la sintassi e la semantica Definisce la sintassi e la semantica del resto dell’URIdel resto dell’URI

Le definizioni dei vari schemi sono Le definizioni dei vari schemi sono negli RFC IETFnegli RFC IETF

Il registro ufficiale degli schemi:Il registro ufficiale degli schemi:• http://www.iana.org/assignments/uri-http://www.iana.org/assignments/uri-

schemes.htmlschemes.html

Schemi (IANA)Schemi (IANA)aaa, aaas, about, acap, cap, cid, crid, data, dav, dict, dns, file, ftp, geo, go, gopher, h323, http, https, iax, icap, im, imap, info, ipp, iris, iris.beep, iris.xpc, iris.xpcs, iris.lwz, ldap, mailto, mid, msrp, msrps, mtqp, mupdate, news, nfs, ni, nih, nntp, opaquelocktoken, pop, pres, rtsp, service, session, shttp, sieve, sip, sips, sms, snmp, soap.beep, soap.beeps, tag, tel, telnet, tftp, thismessage, tn3270, tip, tv, urn, vemmi, ws, wss, xcon, xcon-userid, xmlrpc.beep, xmlrpc.beeps, xmpp, z39.50r, z39.50sadiumxtra, afp, afs, aim, apt, attachment, aw, beshare, bitcoin, bolo, callto, chrome, chrome-extension, com-eventbrite-attendee, content, cvs, dlna-playsingle, dlna-playcontainer, dtn, dvb, ed2k, facetime, feed, finger, fish, gg, git, gizmoproject, gtalk, hcp, icon, ipn, irc, irc6, ircs, itms, jar, jms, keyparc, lastfm, ldaps, magnet, maps, market, message, mms, ms-help, msnim, mumble, mvn, notes, oid, palm, paparazzi, platform, proxy, psyc, query, res, resource, rmi, rsync, rtmp, secondlife, sftp, sgn, skype, smb, soldat, spotify, ssh, steam, svn, teamspeak, things, udp, unreal, ut2004, ventrilo, view-source, webcal, wtai, wyciwyg, xfire, xri, ymsgr, fax, mailserver, modem, pack, prospero, snews, videotex, wais, z39.50

Authority (URL)Authority (URL)

<scheme>://<scheme>://<authority><authority><path>?<query>#<fragment><path>?<query>#<fragment>

authority = server | reg_nameauthority = server | reg_name server = [[ userinfo “@” ] host [“:” port ]server = [[ userinfo “@” ] host [“:” port ] host = hostname | IP addresshost = hostname | IP address hostname = * (domainlabel “.”) toplabel [“.”]hostname = * (domainlabel “.”) toplabel [“.”] Le label:Le label:

• consistono esclusivamente di (LDH)consistono esclusivamente di (LDH) lettere (letters)lettere (letters) cifre decimali (digits)cifre decimali (digits) trattini (hyphens)trattini (hyphens)

• ogni label può essere al massimo 63 caratteriogni label può essere al massimo 63 caratteri• l’hostname può essere al massimo 255 caratteril’hostname può essere al massimo 255 caratteri

Path, Query, FragmentPath, Query, Fragment<scheme>://<authority><scheme>://<authority><path><path>??<query><query>##<fragment><fragment>

path: specifico rispetto all’authority (o allo path: specifico rispetto all’authority (o allo schema, in mancanza di authority) e identifica la schema, in mancanza di authority) e identifica la risorsa nell’ambito dello schema e dell’authorityrisorsa nell’ambito dello schema e dell’authority• path = segment *(“/” segment)path = segment *(“/” segment)

query: una stringa di informazioni che devono query: una stringa di informazioni che devono essere intepretate dalla risorsaessere intepretate dalla risorsa• query = *( pchar / "/" / "?" ) query = *( pchar / "/" / "?" )

fragment: riferimento a una risorsa secondariafragment: riferimento a una risorsa secondaria• può essere una porzione o una “vista” della risorsa può essere una porzione o una “vista” della risorsa

primariaprimaria• la semantica dipende dalla risorsa primaria e dal suo la semantica dipende dalla risorsa primaria e dal suo

media type ed è indipendente dallo schemamedia type ed è indipendente dallo schema• fragment = *( pchar / "/" / "?" ) fragment = *( pchar / "/" / "?" )

Caratteri nelle URI (Caratteri nelle URI (RFC 3986)RFC 3986) Sottoinsieme di ASCIISottoinsieme di ASCII Caratteri riservati:Caratteri riservati:

: / ? # [ ] @ ! $ & ' ( ) * + , ; =: / ? # [ ] @ ! $ & ' ( ) * + , ; = Caratteri non riservati:Caratteri non riservati:

A B C D E F G H I J K L M N O P Q R S T U V W X Y Z A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z a b c d e f g h i j k l m n o p q r s t u v w x y z 0 1 2 3 4 5 6 7 8 9 - _ . ~0 1 2 3 4 5 6 7 8 9 - _ . ~

Uso ambiguo (sostanzialmente vietati):Uso ambiguo (sostanzialmente vietati):{ } | \ ^ `{ } | \ ^ `

Caratteri sicuramente VIETATI:Caratteri sicuramente VIETATI:Control codes, spazio, , < > % "␡Control codes, spazio, , < > % "␡

Percent encoding (%HH)Percent encoding (%HH)• Case insensitiveCase insensitive• Da non usare per i caratteri non riservatiDa non usare per i caratteri non riservati• Da usare con:Da usare con:

Caratteri riservati (con dipendenza dal contesto)Caratteri riservati (con dipendenza dal contesto) Caratteri vietatiCaratteri vietati Tutto il resto (ottetti sopra il 7F esadecimale)Tutto il resto (ottetti sopra il 7F esadecimale)

• Ottetti > 7F... Quale encoding?Ottetti > 7F... Quale encoding?• Implementazioni non standard (%uXXXX, funzione js escape)Implementazioni non standard (%uXXXX, funzione js escape)• application/x-www-form-urlencoded (+ application/x-www-form-urlencoded (+ ⇄⇄ %20) %20)

Mancanza di encodingMancanza di encoding

http://www.google.com/search?q=caffèhttp://www.google.com/search?q=caffè• http://www.google.com/search?q=caff%C3%A8http://www.google.com/search?q=caff%C3%A8• http://www.google.com/search?q=caff%E8http://www.google.com/search?q=caff%E8

http://www.aperion.it/caffè.htmlhttp://www.aperion.it/caffè.html• http://www.aperion.it/caff%C3%A8.htmlhttp://www.aperion.it/caff%C3%A8.html• http://www.aperion.it/caff%E8.htmlhttp://www.aperion.it/caff%E8.html

http://www.caffè.it/http://www.caffè.it/• ????????

IRI (RFC 3987)IRI (RFC 3987) Internationalized Resource IdentifiersInternationalized Resource Identifiers Uso di caratteri non ASCII nelle URIUso di caratteri non ASCII nelle URI Backward compatibilityBackward compatibility

IRI ⇄ URIIRI ⇄ URI schema: solo ASCIIschema: solo ASCII authority: IDN (internazionalized domain authority: IDN (internazionalized domain

names)names) path: Unicode, NFC, codifica UTF-8 e path: Unicode, NFC, codifica UTF-8 e

percent encoding percent encoding query e fragment?? (dipende)query e fragment?? (dipende)

Da IRI a URIDa IRI a URI

IRI trascrivibile

URI come sequenza di caratteri consentiti dalla sintassi

URI come sequenza di

ottetti

napkin,radio, tv,

voce, mnemonic

o

mapping schema specifico,

IDNA,encoding UTF-8,

percent encoding UC

IRI come sequenza di caratteri Unicode consentiti e

normalizzati NFC

IDN: internationalizedIDN: internationalizeddomain namesdomain names

I record DNS possono contenere qualsiasi I record DNS possono contenere qualsiasi ottetto, tuttavia...ottetto, tuttavia...

Le label utilizzate per gli hostname:Le label utilizzate per gli hostname:• possono essere solo LDH (letter, digit, hyphen)possono essere solo LDH (letter, digit, hyphen)• non possono cominciare con hyphennon possono cominciare con hyphen• le risposte del DNS devono trattarle case le risposte del DNS devono trattarle case

insensitiveinsensitive• ““_” consentito in certe implementazioni_” consentito in certe implementazioni

IDNA introduce un livello di astrazione sopra IDNA introduce un livello di astrazione sopra il DNSil DNS

Precedenti: ThayURLPrecedenti: ThayURL

IDNAIDNA

中国 .imanetti.net

Conversione a Unicode

Nameprep: case folding, mapping, NFKC, rimozione caratteri non consentiti

ACE (Punycode)prepende “xn--”

xn--fiqs8s.imanetti.net

IDNA: problemiIDNA: problemi

2 versioni: 2 versioni: • IDNA2003 (2003) RFC 3490, 3491, 3492, 3454IDNA2003 (2003) RFC 3490, 3491, 3492, 3454• IDNA2008 (2010) RFC 5890, 5891, 5892, 5893, IDNA2008 (2010) RFC 5890, 5891, 5892, 5893,

58945894• http://unicode.org/reports/tr46/http://unicode.org/reports/tr46/• http://unicode.org/cldr/utility/idna.jsphttp://unicode.org/cldr/utility/idna.jsp• http://punycode.phlymail.de/http://punycode.phlymail.de/

IDN homograph attack IDN homograph attack • http://www.раураӏ.com/http://www.раураӏ.com/• Esiste anche in ASCII: G00GLE.com, PayPaI.comEsiste anche in ASCII: G00GLE.com, PayPaI.com

IDNA: ulteriori limitazioni IDNA: ulteriori limitazioni sui caratterisui caratteri

ccTLD e TLD in generale:ccTLD e TLD in generale:• Decide l’ICANNDecide l’ICANN• Esempi: .Esempi: . 中国中国 .. 香港香港 .. 台灣台灣 .рф .рф مصرمصر..

Domini di 2° livello:Domini di 2° livello:• Decide il gestore del TLDDecide il gestore del TLD• Ad esempio in Italia il Nic consente i caratteri:Ad esempio in Italia il Nic consente i caratteri:

à, â, ä, è, é, ê, ë, ì, î, ï, ò, ô, ö, ù, û, ü, æ, œ, ç, ÿ, ßà, â, ä, è, é, ê, ë, ì, î, ï, ò, ô, ö, ù, û, ü, æ, œ, ç, ÿ, ß Domini oltre il 2° livello:Domini oltre il 2° livello:

• Decide il detentore del dominio Decide il detentore del dominio (ed eventualmente chi gestisce il DNS per quel (ed eventualmente chi gestisce il DNS per quel dominio)dominio)

Visualizzazione nell’address barVisualizzazione nell’address bar In generale i browser:In generale i browser:

• mostrano caratteri ASCII xn--... al posto dell’IDN nella barra mostrano caratteri ASCII xn--... al posto dell’IDN nella barra dell’indirizzo (convertono a Punycode anche in visualizzazione la dell’indirizzo (convertono a Punycode anche in visualizzazione la parte dell’autorithy nell’IRI)parte dell’autorithy nell’IRI)

Internet Explorer (7+) mostra il Punycode se:Internet Explorer (7+) mostra il Punycode se:• Il dominio contiene caratteri di uno script che non è utilizzato nelle Il dominio contiene caratteri di uno script che non è utilizzato nelle

lingue incluse nelle preferenze di lingua dell’utentelingue incluse nelle preferenze di lingua dell’utente• Un label del dominio contiene un mix di caratteri di script diversi Un label del dominio contiene un mix di caratteri di script diversi

(con un’eccezione per alcuni script misti ad ASCII)(con un’eccezione per alcuni script misti ad ASCII)• Il dominio contiene caratteri che non fanno parte di nessun script, Il dominio contiene caratteri che non fanno parte di nessun script,

es. www.I♥NY.museum (obsoleto con IDNA2008)es. www.I♥NY.museum (obsoleto con IDNA2008) Firefox Firefox

• mostra sempre il Punycode tranne per certi whitelisted TLD mostra sempre il Punycode tranne per certi whitelisted TLD http://www.mozilla.org/projects/security/tld-idn-policy-list.htmlhttp://www.mozilla.org/projects/security/tld-idn-policy-list.html

OperaOpera• non chiaro: dovrebbe funzionare come Firefox, ma poi mostra quasi non chiaro: dovrebbe funzionare come Firefox, ma poi mostra quasi

sempre il testo Unicodesempre il testo Unicode SafariSafari

• preferenze dell’utente sugli script ammessipreferenze dell’utente sugli script ammessi ChromeChrome

• preferenze utente + meccanismi di blacklistingpreferenze utente + meccanismi di blacklisting

i18n nel pathi18n nel path Da parte del browser:Da parte del browser:

• Conversione a UnicodeConversione a Unicode• NFCNFC• Encoding UTF-8Encoding UTF-8• Percent encodingPercent encoding

Web server:Web server:• Il web server può riconvertire ad un altro encoding per servire la Il web server può riconvertire ad un altro encoding per servire la

risorsa richiestarisorsa richiesta• IIS e Windows: nomi dei file in UTF-16, espone in UTF-8IIS e Windows: nomi dei file in UTF-16, espone in UTF-8• Apache e Linux: i nomi dei file contengono semplicemente byte Apache e Linux: i nomi dei file contengono semplicemente byte

(alcuni vietati)(alcuni vietati)• Apache e mod_rewrite, posso giocare con le richiesteApache e mod_rewrite, posso giocare con le richieste

Attenzione: Attenzione: • un link con un IRI potrebbe essere scritto correttamente in un un link con un IRI potrebbe essere scritto correttamente in un

documento con codifica diversa da UTF-8 (ad es. Latin-1) benché documento con codifica diversa da UTF-8 (ad es. Latin-1) benché ciò sia esplicitamente sconsigliato dal W3Cciò sia esplicitamente sconsigliato dal W3C

• cliccandoci il browser deve convertire a UTF-8, effettuare il percent cliccandoci il browser deve convertire a UTF-8, effettuare il percent encoding e quindi effettuare la chiamataencoding e quindi effettuare la chiamata

• http://www.aperion.it/caffè.html è un IRI, il cui URI èhttp://www.aperion.it/caffè.html è un IRI, il cui URI è• http://www.aperion.it/caff%C3%A8.htmlhttp://www.aperion.it/caff%C3%A8.html• http://www.aperion.it/caff%E8.html è diverso ed è già un URIhttp://www.aperion.it/caff%E8.html è diverso ed è già un URI

Query e fragment?Query e fragment?

In teoria potrebbero seguire lo stesso meccanismo In teoria potrebbero seguire lo stesso meccanismo del pathdel path

In realtà è meno chiaro cosa debba essere fatto: la In realtà è meno chiaro cosa debba essere fatto: la risorsa stessa dovrebbe dettare le regole, infatti...risorsa stessa dovrebbe dettare le regole, infatti...• la query potrebbe essere processata da uno script che la query potrebbe essere processata da uno script che

esegue ricerche su un DB Latin-1esegue ricerche su un DB Latin-1• il fragment è un riferimento interno alla risorsa, può il fragment è un riferimento interno alla risorsa, può

dipendere dalla sua codificadipendere dalla sua codifica Se non è la risorsa stessa a creare URI con query e Se non è la risorsa stessa a creare URI con query e

fragment, i browser manifestano comportamenti fragment, i browser manifestano comportamenti diversi nel passaggio da IRI a URIdiversi nel passaggio da IRI a URI

N.B.:N.B.:• la query viene inviata al serverla query viene inviata al server• il fragment è processato dal browser quando la richiesta è il fragment è processato dal browser quando la richiesta è

servita (può essere rielaborato da Javascript)servita (può essere rielaborato da Javascript)

EsempioEsempio IRI:IRI:

http://http:// 中国中国 .imanetti.net/.imanetti.net/ 中国中国 .php?s=.php?s=पू�र्ति��पू�र्ति��#caffè #caffè

URI corrispondente:URI corrispondente:http://xn--fiqs8s.imanetti.net/%E4%B8%AD%E5%9B%BD.php?http://xn--fiqs8s.imanetti.net/%E4%B8%AD%E5%9B%BD.php?s=%E0%A4%AA%E0%A5%82%E0%A4%B0%E0%A5%8D%E0%A4%A4%E0%A4%BF#caffs=%E0%A4%AA%E0%A5%82%E0%A4%B0%E0%A5%8D%E0%A4%A4%E0%A4%BF#caff%C3%A8%C3%A8

Come costruisco questo link nella mia pagina? Come costruisco questo link nella mia pagina? <a href=“...???”><a href=“...???”>

URI sempre ammesso, HTML5: UTF-8 o UTF-16 per URI sempre ammesso, HTML5: UTF-8 o UTF-16 per scriverlo come IRI, altrimenti scriverlo come IRI, altrimenti dovreidovrei inserire l’URI inserire l’URI corrispondentecorrispondente

Se creo il link all’IRI...Se creo il link all’IRI...• Quando faccio “copia e incolla” del testo dovrei ottenere l’IRIQuando faccio “copia e incolla” del testo dovrei ottenere l’IRI• Quando faccio “copia collegamento” dovrei ottenere l’URIQuando faccio “copia collegamento” dovrei ottenere l’URI

Copia e incolla collegamento...Copia e incolla collegamento... FirefoxFirefox

http://xn--fiqs8s.imanetti.net/%E4%B8%AD%E5%9B%BD.php?http://xn--fiqs8s.imanetti.net/%E4%B8%AD%E5%9B%BD.php?s=%E0%A4%AA%E0%A5%82%E0%A4%B0%E0%A5%8Ds=%E0%A4%AA%E0%A5%82%E0%A4%B0%E0%A5%8D%E0%A4%A4%E0%A4%BF#caff%C3%A8%E0%A4%A4%E0%A4%BF#caff%C3%A8

ChromeChromehttp://xn--fiqs8s.imanetti.net/%E4%B8%AD%E5%9B%BD.php?http://xn--fiqs8s.imanetti.net/%E4%B8%AD%E5%9B%BD.php?s=%E0%A4%AA%E0%A5%82%E0%A4%B0%E0%A5%8Ds=%E0%A4%AA%E0%A5%82%E0%A4%B0%E0%A5%8D%E0%A4%A4%E0%A4%BF#caffè%E0%A4%A4%E0%A4%BF#caffè

Internet ExplorerInternet Explorerhttp://http:// 中国中国 .imanetti.net/.imanetti.net/ 中国中国 .php?s=.php?s=पू�र्ति��पू�र्ति��#caffè#caffè

OperaOperahttp://http:// 中国中国 .imanetti.net/.imanetti.net/ 中国中国 .php?.php?s=%E0%A4%AA%E0%A5%82%E0%A4%B0%E0%A5%8Ds=%E0%A4%AA%E0%A5%82%E0%A4%B0%E0%A5%8D%E0%A4%A4%E0%A4%BF#caffè%E0%A4%A4%E0%A4%BF#caffè

Charset in HTTP, HTML, Charset in HTTP, HTML, XML, CSSXML, CSS

HTTPHTTP Mime Content-type nelle intestazioniMime Content-type nelle intestazioni

200 OK HTTP/1.1200 OK HTTP/1.1

Content-Type: text/html;charset=UTF-8Content-Type: text/html;charset=UTF-8

---Blank line---Blank line

Corpo della rispostaCorpo della risposta

Apache / IIS (configurazione base), .htaccessApache / IIS (configurazione base), .htaccess Apache mod_mime: Apache mod_mime: AddDefaultCharset, AddCharset, AddDefaultCharset, AddCharset,

AddTypeAddType PHP: PHP: header("Content-type: text/html; charset=UTF-8")header("Content-type: text/html; charset=UTF-8") Altri linguaggi (CGI, Asp, moduli Apache) possono Altri linguaggi (CGI, Asp, moduli Apache) possono

riscrivere le intestazioni: il web server fa il merge con riscrivere le intestazioni: il web server fa il merge con quelle di default e privilegia quelle impostate dal quelle di default e privilegia quelle impostate dal programma programma

HTML, XML, XHTML, CSSHTML, XML, XHTML, CSS HTML 4: non esiste un defaultHTML 4: non esiste un default<META HTTP-EQUIV="Content-type" <META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=UTF-8">CONTENT="text/html; charset=UTF-8">

XML: default UTF-8XML: default UTF-8<?xml version="1.0" encoding="UTF-8"?><?xml version="1.0" encoding="UTF-8"?>• Dichiarazione alternativa con il BOM Dichiarazione alternativa con il BOM

(UTF-8 e UTF-16)(UTF-8 e UTF-16)• Se UTF-16 DEVE cominciare col BOMSe UTF-16 DEVE cominciare col BOM

XHTML ??XHTML ??• DipendeDipende

HTML 5: HTML 5: <meta charset="UTF-8"><meta charset="UTF-8">, , BOMBOM CSS:CSS: @charset "UTF-8";@charset "UTF-8";

BOM ammesso dalla versione 2.1BOM ammesso dalla versione 2.1 http://www.w3.org/International/questions/qa-html-encoding-declarations.enhttp://www.w3.org/International/questions/qa-html-encoding-declarations.en

Dichiarazione del charset nel linkDichiarazione del charset nel link

HTMLHTML<LINK title="Arabic text" type="text/html" <LINK title="Arabic text" type="text/html" charset="ISO-8859-6" rel="alternate" charset="ISO-8859-6" rel="alternate" href="arabic.html">href="arabic.html"><A href="http://www.unicode.org" <A href="http://www.unicode.org" charset="UTF-8"> Unicode</A>charset="UTF-8"> Unicode</A>

XMLXML<?xml–stylesheet href="..." type="..." <?xml–stylesheet href="..." type="..." charset="UTF-16"?>charset="UTF-16"?>

Non supportato dai browser principali (tranne che Non supportato dai browser principali (tranne che per i CSS)per i CSS)

Deprecato in HTML 5Deprecato in HTML 5

Priorità di codifica HTML4

Dall’alto verso il basso, con priorità decrescente, i browser utilizzano le seguenti regole:

User override HTTP “Content-Type” charset <META HTTP-EQUIV=“...” ... Link o altra sintassi di documento

esterno Metodi euristici

Priorità di codifica HTML5 Dall’alto verso il basso, con priorità

decrescente, i browser utilizzano le seguenti regole:

1. User override2. HTTP “Content-Type” charset3. BOM 4. Uno dei meta tag (DEVE essere uno solo):

<META HTTP-EQUIV=“Content-Type” CONTENT=“...”>

<meta charset=“UTF-8”>5. Metodi euristici

http://www.whatwg.org/specs/web-apps/current-work/multipage/parsing.html#determining-the-character-encoding

Priorità di codifica CSS 2.1 Dall’alto verso il basso, con priorità

decrescente, i browser utilizzano le seguenti regole:

1. HTTP “Content-Type” charset2. BOM / @charset rule (non possono

essere in conflitto)3. Tag <LINK ...> nel documento

referente4. Charset del documento referente5. Assumere UTF-8

In-document declarationsIn-document declarationsFormato Cosa fare

HTML5 Usare il nuovo meta tag charset nella sezione head del documento. Deve essere entro i primi 1024 byte.<meta charset="UTF-8">

HTML5 in UTF-16 Usare il BOM. Il W3C sta ancora discutendo se è il caso di metterci anche il meta tag o no. Per il momento no.

HTML4 Usare il meta tag http-equiv come prima riga della sezione head:<meta http-equiv="Content-type" content="text/html;charset=UTF-8">

XHTML 1.x servito con MIME type text/html

Come sopra, ma se non usate UTF-8 o UTF-16 dovreste anche effettuare la dichiarazione di encoding XML

XHTML 1.x servito con MIME type application/xhtml+xml

Dichiarazione di encoding XML (BOM non necessario se UTF-8)<?xml version="1.0" encoding="UTF-8"?>

Raccomandazioni W3C in breveRaccomandazioni W3C in breve Salvare le pagine in UTF-8, quando è possibileSalvare le pagine in UTF-8, quando è possibile Dichiarare sempre l’encoding del documento:Dichiarare sempre l’encoding del documento:

• Utilizzare le intestazioni HTTP se possibileUtilizzare le intestazioni HTTP se possibile• Includere ANCHE la dichiarazione in-document come da tabella Includere ANCHE la dichiarazione in-document come da tabella

precedenteprecedente• Utilizzare il “preferred MIME name” dell’encoding IANA registryUtilizzare il “preferred MIME name” dell’encoding IANA registry

Usare la @charset rule per fogli CSS esterni al documento nel caso Usare la @charset rule per fogli CSS esterni al documento nel caso in cui ci sia contenuto non-ASCII (font names, ids o class names, in cui ci sia contenuto non-ASCII (font names, ids o class names, etc.)etc.)

Evitare se possibile il BOM in UTF-8, e assicurasi che il codice sia Evitare se possibile il BOM in UTF-8, e assicurasi che il codice sia in NFC (n.b.: la notazione NCR è ammessa purché faccia in NFC (n.b.: la notazione NCR è ammessa purché faccia riferimento a caratteri NFC [Fully normalized text]).riferimento a caratteri NFC [Fully normalized text]).

Evitare i codici di escape, ad eccezione dei caratteri invisibili o Evitare i codici di escape, ad eccezione dei caratteri invisibili o ambigui. ambigui.

Non utilizzare “Non utilizzare “caratteri di controllocaratteri di controllo” Unicode dove si può usare il ” Unicode dove si può usare il markup HTML.markup HTML.

http://www.w3.org/International/tutorials/tutorial-char-enc/http://www.w3.org/International/tutorials/tutorial-char-enc/Overview.enOverview.en

Character encoding negotiation

Accept-charset

Content-type: text/html; charset=x

Web serverWeb client

Forms

Il browser accetta contenuto immesso dall’utente Il browser accetta contenuto immesso dall’utente nei form, in quale charset li invia ??nei form, in quale charset li invia ??

Ci sono fondamentalmente 3 metodi di Ci sono fondamentalmente 3 metodi di submission dei form:submission dei form:• GETGET• POST in “application/x-www-form-urlencoded”POST in “application/x-www-form-urlencoded”• POST in “multipart/form-data”POST in “multipart/form-data”

GET o POST application/x-www-form-urlencoded Nella GET nella parte query dell’URL... ...nella POST nel corpo della richiesta avremo: Name=Value&Name2=Value2&... Coppie nome=valore Nomi separati dai valori dal carattere = Coppie separate dal carattere & Spazi sostituiti dal carattere + Line breaks come CR LF percent-encoded: %0D

%0A Caratteri non consentiti nelle URL e riservati in

questo contesto (+,&,=) sono anche percent-encoded

Ma quale codifica di carattere?

Esempio di FORMName: François René Strauß SEND

Nel corpo della richiesta POST application/x-www-form-urlencoded o nella query della richiesta GET potremmo trovare:• Name=Fran%E7ois+Ren%E9+Strau%DF

(Charset=ISO-8859-1)

• Name=Fran%C3%A7ois+Ren%C3%A9+Strau%C3%9FWeb (Charset=UTF-8)

Nella pratica i browser inviano al server i dati x-www-form-urlencoded nel charset in cui il form è stato interpretato, qualunque sia stata la scelta di questa interpretazione (HTTP header, meta tag, default, user override)

Questa scelta non è necessariamente una soluzione valida in generale

multipart/form-data Content-type più efficiente del application/x-www-form-

urlencoded per dati non-ASCII, file e dati binari in generale Non ha limiti (teorici) di lunghezza a livello client come accade

invece per le URL Ogni coppia nome/valore è una parte mime separata,

teoricamente potrebbe avere un charset diverso Il browser invia direttamente gli ottetti codificati nel corpo della

richiesta Di fatto anche con questa codifica i browser NON inviano alcuna

informazione sul charset utilizzato Esempio con il form precedente:

Content-Length: 399Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryl3cH5oGYSXtKMawr

------WebKitFormBoundaryl3cH5oGYSXtKMawrContent-Disposition: form-data; name=“name"

François René Strauß

Risolvere le ambiguità di charset nei form L’attributo ACCEPT-CHARSET:

<form accept-charset="ISO-8859-1">• Deve essere valorizzato con il preferred MIME name di un IANA

charset• Forza il browser ad utilizzare la codifica richiesta• Ora standard in HTML5: supportato da tutti i browser ad eccezione

di Internet Explorer (almeno fino alla versione 8 inclusa) dove però funziona se il valore è UTF-8

Il campo hidden _charset_• Inventato dalla Microsoft• Viene popolato con il nome del charset utilizzato per la submission• Supportato da tutti i browser moderni, adesso standard HTML5

Inventate il vostro controllo:• Utilizzate un campo hidden con una stringa precompilata non ASCII

Possibili problemi:• Inserimento di caratteri teoricamente non consentiti dall’accept-

charset o dall’encoding della pagina• Programmi che ricevono richieste da diversi form su siti diversi il

cui charset è ignoto e/o di cui è difficile controllare la sorgente (lead.aperion.it)

Reference processing modelReference processing model Differenti codifiche richiedono metodi diversi di Differenti codifiche richiedono metodi diversi di

decodifica/parsing/processazione:decodifica/parsing/processazione:• Encoding single byte e multibyteEncoding single byte e multibyte• Encoding con switching (ISO 2022)Encoding con switching (ISO 2022)• Forward combining ( ` + e = è)Forward combining ( ` + e = è)• Backward combining ( e + ` = è)Backward combining ( e + ` = è)• Logical order / Visual order (scritture RTL)Logical order / Visual order (scritture RTL)

Del resto adottare un encoding universale (ad.es. UTF-8) Del resto adottare un encoding universale (ad.es. UTF-8) renderebbe obsoleti dati già esistentirenderebbe obsoleti dati già esistenti

Si usa un modello di astrazione:Si usa un modello di astrazione:• Tutti i caratteri sono caratteri UnicodeTutti i caratteri sono caratteri Unicode• Le specifiche si danno in termini di caratteri UnicodeLe specifiche si danno in termini di caratteri Unicode• Le implementazioni non devono necessariamente utilizzare caratteri Le implementazioni non devono necessariamente utilizzare caratteri

Unicode, ma si comportano come se i caratteri lo fosseroUnicode, ma si comportano come se i caratteri lo fossero BeneficiBenefici

• Rimozione delle ambiguità, semplificazione delle specificheRimozione delle ambiguità, semplificazione delle specifiche• Consente flessibilità per l‘uso di encoding locali comunemente utilizzatiConsente flessibilità per l‘uso di encoding locali comunemente utilizzati• Backward compatibility per browser obsoletiBackward compatibility per browser obsoleti• Supporto all‘internazionalizzazioneSupporto all‘internazionalizzazione• Indipendenza dall‘endiannessIndipendenza dall‘endianness

Web client

Rappresentazione interna con un

qualsiasi encoding...

nella pratica spesso è UTF-16

HTML, CSS, XML: tutti i caratteri HTML, CSS, XML: tutti i caratteri sono caratteri Unicodesono caratteri Unicode

Internamente le implementazioni possono usare Internamente le implementazioni possono usare qualunque encoding (di fatto un qualche encoding qualunque encoding (di fatto un qualche encoding Unicode)Unicode)

Questo significa in sostanza che Questo significa in sostanza che “in RAM“ “in RAM“ tutti i tutti i caratteri che vedo nel browser sono Unicode, anche caratteri che vedo nel browser sono Unicode, anche se il documento è in un encoding non Unicode (ISO-se il documento è in un encoding non Unicode (ISO-8859-1, GB2312, etc..)8859-1, GB2312, etc..)

Quindi in un documento HTML posso inserire Quindi in un documento HTML posso inserire qualunque carattere Unicode (ammesso che abbia i qualunque carattere Unicode (ammesso che abbia i font per vederlo) indipendentemente dalla codifica font per vederlo) indipendentemente dalla codifica utilizzata per quel documentoutilizzata per quel documento

Ma non posso utilizzare una sequenza di byte se Ma non posso utilizzare una sequenza di byte se l‘encoding non prevede quel caratterel‘encoding non prevede quel carattere

Per esempio in un documento HTML ISO-8859-1 non Per esempio in un documento HTML ISO-8859-1 non posso scrivere direttamente posso scrivere direttamente 中中 (in teoria neanche €)(in teoria neanche €)

Come faccio?Come faccio?

Character escapingCharacter escaping NCR (numeric character references)NCR (numeric character references)

• HTML e XMLHTML e XML Decimale: &#dddd; Decimale: &#dddd; èè = è = è Esadecimale: &#xhhhh; Esadecimale: &#xhhhh; èè = è La "x“ deve essere minuscola nella notazione esadecimale in XMLLa "x“ deve essere minuscola nella notazione esadecimale in XML

• CSSCSS \hh spazio finale, oppure \hhhhhh (6 cifre esadecimali) \0000E8\hh spazio finale, oppure \hhhhhh (6 cifre esadecimali) \0000E8

Named character reference (character entities): HTMLNamed character reference (character entities): HTML• Definizione esplicita (case sensitive) nel DTDDefinizione esplicita (case sensitive) nel DTD• èè = è• HTML 4 definisce 252 named entities• HTML 5 definisce 2231 named entities (working draft)

5 Predefined entities (XML):• " = "• & = &• ' = '• < = <• > = >

Utilità dell’escapingUtilità dell’escaping Aggirare le limitazioni di charsetAggirare le limitazioni di charset Utilizzare caratteri propri della sintassi del Utilizzare caratteri propri della sintassi del

markup: markup: < > & "< > & " Eliminare ambiguità visive: Eliminare ambiguità visive: Usa ASCII per fare riferimento ai code point e Usa ASCII per fare riferimento ai code point e

non agli encoding (stesso valore sempre)non agli encoding (stesso valore sempre) Semplifica la transcodifica (per i browser)Semplifica la transcodifica (per i browser) Aggirare i problemi di charset:Aggirare i problemi di charset:

• p.e.: HTML in ISO-8859-1, CSS in UTF-8, nomi di p.e.: HTML in ISO-8859-1, CSS in UTF-8, nomi di classe con lettere accentateclasse con lettere accentate

p.caff\e8 { color: maroon;}p.caff\e8 { color: maroon;}

N.b.: non si può usare negli script e negli N.b.: non si può usare negli script e negli style embeddedstyle embedded

Altri aspettiAltri aspettii18n e Webi18n e Web

Language information: perché?

Charset: è sostanzialmente “ortogonale” alla lingua

Classificazione, ricerca, ordinamento Sillabazione, quoting, spazi e legature Sintesi vocale Ambiguità di glifo (undo della

unificazione Han) SEO (??)

I tag di lingua

HTML5: TUTTI i tag adesso supportano gli attributi:• dir (direzione)• lang (lingua)

lang adesso può avere un valore vuoto ad indicare che la lingua principale è ignota

xml:lang è supportato, a patto che abbia lo stesso valore di lang

hreflang applicabile ai tag a, link ed area

Language identification

Identificativi di lingua definiti dall’RFC 3066

Codice ISO-639 di 2 lettere o 3 lettere, seguito opzionalmente dal country code di 2 lettere ISO-3166 separati dal carattere – (e non _)

Case insensitive L’attributo di lingua è ereditato dagli

elementi figli


RFC 3066 non copre tutte le necessità

p.es. Spagnolo dell’America Latina, distinzione di Script–Addressed

Non c’è una chiara distinzione tra l’identificazione di una “lingua” e di un “locale”

BCP47: RFC 4646, 4647, 5646• language-country diventa language-

script-country• considera molti altri aspetti

HTTP: intestazione Content-Language HTML4: attributo lang (p.es. in <html>) XML: attributo xml:lang XHTML 1.0 e HTML5: sia lang che xml:langVerba volant, scripta manent.

XHTML 1.1: xml:lang

Utilizzo di lang / xml:lang Funzione lang() di XPath Pseudo-classe in CSS*:lang(zh) {font-family: SimSun}

Selettore di attributo CSS*[lang|=fr] {font-weight: bold}

Quoting specifico per lingua:q:before { content: open-quote; }q:after { content: close-quote; }blockquote:before { content: open-quote; }blockquote:after { content: close-quote; }[lang|='en'] > * { /* English */quotes: "\201C" "\201D" }[lang|='fr'] > * { /*guillemets*/quotes: "\AB\A0" "\A0\BB" }[lang|='fi'] > *{/*same direction*/ quotes: "\201D" "\201D" }[lang|='de'] > * { /* German */quotes: "\201E" "\201C" }[lang|='ja'] > * { /* Japanese */quotes: "\300C" "\300D" }[lang|='nl'] > * { /* Dutch */quotes: "\2018" "\2019" }[lang|='pl'] > * { /* Polish */quotes: "\201E" "\201D" }

English text with <q>English quoted text</q>. Text en Français avec <q>English quoted text</q>. Text en Français avec <q lang="en">English quoted text

containing a <q>quote</q> itself</q>. <q>Quotes</q> in Finnish. <q>Quotes</q> in Polish. <q>Quotes</q> in Japanese. <q>Quotes</q> in German. <q>Quotes</q> in Dutch. <blockquote lang="fr">A paragraph using blockquote.</blockquote>

Altre dipendenze dalla lingua CSS text-transform (uppercase,

lowercase, capitalize, none, inherit) CSS 2 consente ai browser di ignorare

la regola per i caratteri non Latin-1 e per altri casi particolari

CSS 3 forza il rispetto delle regole Unicode di casing (lingua specifiche)Casi speciali:• ß tedesca : SS• i turca: İ

Bi-di in HTML Sarebbe possibile utilizzare direttamente il

testo Unicode e le regole inerenti i caratteri Tuttavia a causa delle ambiguità e per il fatto

che HTML è un linguaggio strutturato è preferibile utilizzare • l’attributo dir• l’elemento <BDO>

L’attributo dir può valere ltr (default) o rtl Ha effetto sul valore di default

dell’allineamento Elementi figli lo ereditano L’elemento BDO effettua l’override delle

proprietà direzionali implicite del contenuto Richiede l’attributo dir

Bi-di in CSS Esistono le proprietà (da usare insieme):

• direction: { ltr | rtl } ;• unicode-bidi: { bidi-override | embed | normal | inherit } ;

direction ha lo stesso significato dell’attributo dir di HTML

unicode-bidi specifica il comportamento degli elementi in linea (max 15 livelli di annidamento)

Mal supportato in Internet Explorer fino alla versione 7 inclusa

N.B.: il markup HTML è sufficiente e raccomandato

http://www.w3.org/International/tutorials/bidi-xhtml/

Altre aspetti di i18n e web (da approfondire)

descrittore unicode-range nella dichiarazione @font-face

Numbered list in stile (ebraico, georgiano, armeno, cinese, katakana, etc...)

Testo verticale ltr, rtl (mongolo, cinese) Testo bustrofedico Annotazioni Ruby (giapponese) Sorting XSL What else??