Back to site
Since 2004, our University project has become the Internet's most widespread web hosting directory. Here we like to talk a lot about web development, networking and server security. It is, after all, our expertise. To make things better we've launched this science section with the free access to educational resources and important scientific material translated to different languages.

HTML5 ili XHTML? "Polyglot Documents" znači da više ne morate da birate

Svaki web programer je uzbuđen zbog HTML5 — i to sa punim pravom. On dodaje nove funkcije primarnom programskom jeziku koji se koristi na web-u, i dizajniran je tako da pruži bolje korisničko iskustvo, i bolju praktičnost u radu sa njim.

Ipak, HTML5 još uvek nije završen. Do dan danas proizvođači web pretraživača mukotrpno rade na njegovoj implementaciji, ali je još uvek rano da pretpostavimo da HTML5 ima potpunu podršku u svim web pretraživačima koji su u upotrebi. Dokumenta sa specifikacijama su u završnoj fazi "Last call", što znači da radna grupa koja je zadužena za projekat veruje da HTML5 završen prema komentarima koj dolaze od strane programerske zajednice. Nakon toga preostala je kritična faza, izaći pred javnosti i reći da "HTML5 ima W3C preporuke". (Nemojte me držati za reč, ali mislim da se to neće desiti pre početka 2013,)

Ono što je stabilno i implementirano u potpunosti je XHTML (Nadam se da će te mi dozvoliti da izostavim specifičnosti Internet Explorer-a ili ćemo o tome raspravljati celu noć). Dakle šta bi ste trebali da koristite — ne baš stabilan, ali uzbudljiv HTML5 ili stariji, stabilan XHTML?

Prilićno sam siguran da možete koristiti oba istovremeno.

Upravo se spremam da napravim svoj web sajt. Merite mi vreme, sada je; 12:22:55.

12:25:32 — završeno!

Trebalo mi je manje od 3 minuta da moj web sajt koji je napisan isključivo korišćenjem HTML5 pepravim da bude napisan uporedo sa HTML5 i XML, a to se naziva "polyglot document".

OK, možda nisam bio potpuno iskren u vezi potrebnog vremena. Znao sam šta je sve trebalo da uradim i verovatno ste primetili da sam naveo HTML5 i XML, a ne HTML5 i XHTML, i sve je unapred bilo pripremljeno pre nego što sam počeo da radim, ali hajde da vidimo kako sam to uradio.

Kao što ste primetili 23 Aprila , napravio sam par promena da bi web sajt izmenio iz XHTML 1.0 u isključivo HTML5. To je bila laka tranzicija pošto sam već radio u striktnom metajeziku (markup language) koji već duže vreme koristim za proveru mojih web strana. Tako da je svaki element propisno zatvoren, ampersandsi su propisno kodirani, imena elemenata su napisana malim slovima i tako dalje. Vi to ne morate da radite u HTML5, ali možete, ja to radim iz navike. Moj savet vam je da nastavite kako ste već krenuli. Drugim rečima meni bi sada prestavljalo pogrešan pristup da prestanem da koristim: zatvaranje oznaka (tags), navođenja vrednosti atributa, malih slova za imena elemenata — nisam prestao da radim bilo koju stvar koju sam radio striktno za HTML 1.0.

Zbog toga, sve što je aprila meseca bilo potrebno da uradim da bi iz HTML 1.0 prešo na HTML5 je da promenim šablon (template) na web strani tako što su početne linije prepravljene iz:

<?xml version="1.0" encoding="windows-1252"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en-GB">
<head>
  <meta http-equiv="content-language" content="en-GB" />
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />

to:

<!doctype html>
<html  lang="en-GB">
<head>
  <meta charset="windows-1252" />

I to bi bilo to. Nakon toga sam se igrao sa novim zanimljivim HTML elementima kao što su: "aside" i " articlebut" samo da bi naglasio poentu, nastavio sam da obraćam pažnju da je svaki element propisno zatvoren, tako da je svako < p> praćeno sa < p/>.

Ono što sam želeo da uradim danas je da napravim nekoliko izmena tako da moja web strana može biti obrađena pomoću HTML5 ili XML (zapamtite da je XHTML HTML kodiran u XML). Moja preporuka za to je Polyglot Markup: HTML-kompatibilni XHTML dokumenti (Polyglot Markup: HTML-Compatible XHTML Documents) . Pošto su W3C dokumenta veoma kratka. Prva linija " abstract" vam govori o čemu se radi.

Dokumenta koja koristi "polyglot markup" su niz bajtova koji se obrađuju u identičnom algoritmu (sa izuzetkom xmlns atributa na osnovnom elementu) kada se obrađuju u HTML i kada se obrađuju u XML.

Tako da ako web pretraživač koji obrađuje XML kod slučajno zaluta u moj deo web prostora, ja ću biti srećan, zato što će i biti slučaj i sa web pretraživačem koji obrađuje HTML kod. Ono što je bitno je da će oni proizvesti identičan DOM "Document Object Model". Upamtite da web pretraživači ne kreiraju web stranu direktno iz HTML-a. Oni kreiraju DOM iz HTML.a i nakon toga iz njega kreiraju web stranu (Vi zapravo DOM-om manipulišete JavaScript-om).

Uzgred, cilj nam je da ispunimo zahteve koji su neophodni za web pretrazivače koji obrađuju HTML i XML kod, a ne XHTML. Polyglot dokumenta nisu validna za XHTML.

Sve ovo zvuči veoma komplikovano, da ne kažem tajanstveno, ali da pređem na stvar. Prvi koraci koje sam danas napravio su:

  1. dodajte "XHTML namespace" u osnovi elementa, odnosno html element;
  2. dodajte xml:lang atribut;
  3. napišite "doctype" velikim slovima.

Tako da nekoliko početnih redova sada izgledaju ovako:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-GB" xml:lang="en-GB">
<head>

Primetili smo da smo ubacili elemente html zaglavlja i tela. To je opcija u HTML5 ali je neophodno za "polyglot documents".

Ipak bilo je još par stvari na koje je trebalo obratiti pažnju.

Primetiće te da ja ne koristim kodiranje karaktera u UTF-8 koje je jako poželjno. To je iz razloga što koristim PC sa Windows operativnim sistemom i navikao sam da radim u HTML editoru koji ne podržava UTF-8. Naravno da mogu da koristim drugi editor, ali ovaj koji sada koristim je meni najkomforniji za rad već duži niz godina (CuteHTML). Gledajući najčešće postavljena pitanja WHATWG's FAQ primetio sam da je za "polyglot documents" UTF-8 jedini način za kodiranje karaktera koji može biti upotrebljen korišćenjem <meta charset="…" /> elementa. To je iz razloga što je XML kodiranje karaktera deklarisano u uputstvu za procesiranje "Processing Instruction" (<?xml version="1.0" encoding="UTF-8"?>). Ne postoji meta element pomoću koga možete da odredite skup karaktera za XML. Da bi smo zaobišli ovaj problem uradio sam ono što sam trebao da uradim još pre par godina, da podesim kodiranje karaktera na nivou servera, samo jedna komandna linija ".htaccess file" (konfiguracioni fajl na nivou direktorijuma koji služi za decentralizaciju menadžmenta web servera) u kojoj stoji:

AddDefaultCharset windows-1252.

Koristio sam HTTP pregledač zaglavlja (HTTP Header viewer) za proveru da sve funkcioniše na način na koji je i zamišljeno. Prilikom toga dobićemo još jedno upozorenje u W3C validatoru koji daje preporuku da primenimo kodiranje karaktera na nivou dokumenta. Ja imam razlog zašto to ne radim, i držim se toga. Zato produžimo dalje!

Skripte i definicije dokumenta mogu da budu uključene u "polyglot documents" ali postoje ograničenja u vezi karaktera koje možete koristiti i veoma je lako previditi takve detalje, tako da je savet veoma jasan: definišite stilove i skripte u eksternim fajlovima.

Na ovom veoma jednostavnom web sajtu ja ne koristim "document.write()" ili "document.writeln()" u ono malo JavaScript-a koji se tu nalazi, ali da sam to koristio bilo bi potrebno da napravim izmene i da omogućim upisivanje u "innerHTML" pošto "document.writeln()" nije važeća komanda u XML.

Ipak uključujem "Google Analytics" kod koji je napisan u skripti. Ali to više ne radim na taj način, to je sada eksterni fajl. Ovo je dobar način, pogotovu ako imate na umu mobilne uređaje. Skripta je u sastavu svake web strane, tako da je bolje da "Google Analytics" imate kao zaseban fajl, koji može biti keširan, umesto da se ponovo učitava sa svakom novom web stranom. Uzgred u "polyglot"-u postoji "noscript" element.

Napokon, imam dve različite definicije stila za početne strane koje su ugrađene na nivou dokumenta. Taj pristup, definicije na nivou dokumenta čini mi se ispravan, pa ipak zarad kopiranja sadržaja u mali tekstualni fajl i njegova zamena sa linkom nije vredna rasprave. Ono što nismo uradili je kopiranje stilova u primarni "stylesheet" za web sajt pošto bi to značilo slanje dodatnih par bajtova čak i kada to nije neophodno. Imajte na umu da je za web sajtove koji su namenjeni i mobilnim uređajima svaki bajt veoma bitan.

Tabele

Pokrili smo sve što sam trebao da uradim na ovom web sajtu da bih ga napravio podesnim za "polyglot". Kao što možete da vidite i nije moralo mnogo tog da se uradi. Ali to je samo u slučaju kao što je ovaj, kada imamo jednostavan web sajt, koji je ručno kodiran, sa malom upotrebom PHP šablona. Nije bilo potrebe da koristim tabele bilo gde na web sajtu, ali da je to bilo neophodno morao bih da se postaram da su svi "tr" elementi obuhvaćeni u jednom "thead"-u, "tbody"-u ili "tfoot"-u. Takođe i ostali "col" elementi bi trebali da budu obuhvaćeni u col grupu (colgroup).

SVG i MathML

Ovo je veoma jednostavan web sajt i ne sadrži SVG ili MathML, ali da je to slučaj morali bi smo da ispoštujemo par dodatnih pravila u vezi toga. Detaljnije informacije možete videti u Polyglot Markup standardima.

Rezime

Konvertovanje XHTML dokumenta u "polyglot" dokument je jednostavno. Poštovanjem par prostih pravila — od kojih neka pretstavljaju dobru praksu, vaš kod će biti obrađen od strane web pretraživača koji podržavaju XML ili HTML5. Dodajte "HTML5 shiv" (ja koristim HTML5 shiv koji je kreirao Remy Sharp ) I imaćete dokument koji će vrlo verovatno raditi na način kako želite u skoro svakom web pretraživaču.

8 Jun 2011
Početna strana
Dnevnik

Zahvalan sam polaznicima kursa W3C web za mobilne uređaje Peter Thomas-u, David Moulton-u i Graham Armfield-u, zbog rada sa mnom na popularisanju pitanja kodiranja karaktera. To je dovelo do novog teksta 10. juna.





Published (Last edited): 16-02-2013 , source: http://philarcher.org/diary/2011/#html5