parserblockquote

CopyrightIBMCorporation2010TrademarksThinkingXML:TheXMLflavorofHTML5Page1of9ThinkingXML:TheXMLflavorofHTML56recommendationsfordevelopersusingthenextgenerationoftheweb'snativelanguageUcheOgbujiJuly08,2010(FirstpublishedJuly06,2010)Forawhile,therehasbeenastruggleforthefutureofmarkupontheweb,astrugglebetweentheW3C'sXHTML2andHTML5,developedbythemajorbrowservendorsunderaseparateorganizationalumbrella.
First,theW3CtookoverHTML5,andnowitrecentlyannouncedthesunsetoftheXHTML2effort.
ThismakesasignificantdifferencetothefutureofXMLontheweb,andfurthermore,becauseofHTML5'smomentum,itisnowatechnologythateveryXMLdeveloperalreadyhastodealwith.
ButfansofXMLneednotdespair:HTML5supportsaproperXMLserialization.
LearnabouttheXMLformofHTML5includingsomekeydifferencesfromolderXHTMLconventionsandlearnhowtopracticallyapplythisvocabularyinmodernwebbrowsers.
Viewmorecontentinthisseries08Jul2010:AddedtwoRelatedtopicsperauthorrequest:Tip:AlwaysuseanXMLdeclarationandthankstoMichaelSmith.
FrequentlyusedacronymsAPI:ApplicationProgrammingInterfaceDOM:DocumentObjectModelHTML:HypertextMarkupLanguageHTTP:HypertextTransferProtocolMIME:MultipurposeInternetMailExtensionsSGML:StandardGeneralizedMarkupLanguageURL:UniformResourceLocatorW3C:WorldWideWebConsortiumXHTML:ExtensibleHypertextMarkupLanguageExtensibleMarkupLanguageXML:ExtensibleMarkupLanguageThehistoryofHTMLhasbeencontroversialateveryturn.
Despitethebesteffortsofwebarchitects,thewebhasalwaysbeenawildfrontierofmessy,confusing,andsometimesjustdiabolicallybrokenmarkup(nicknamedtagsoup).
OneambitionofXMLhasalwaysbeentohelpdeveloperWorksibm.
com/developerWorks/ThinkingXML:TheXMLflavorofHTML5Page2of9cleanupthismess,henceXML'sdesignationas"SGMLfortheweb"(SGMListhemeta-languageofwhichHTMLisjustoneflavor).
XMLcameonthesceneandimmediatelymadealotofwaves.
TheW3Cexpected,reasonablyenough,thatXMLmightalsofindsuccessinthebrowser,andsetupXHTMLasthemostnaturalevolutionfromHTMLtosomethingmorecoherent.
Unfortunately,unexpectedproblemskeptpoppinguptosabotagethisambition.
Deceptivelysimpleconceptssuchasnamespacesandlinkingturnedintofirestormsoftechnologicalpolitics.
TheresultingcontroversiesanddelaysweremorethanenoughtoconvincebrowserdevelopersthatXMLmighthelpescapetheknownproblems,butitwasofferingupplentyofnewandpossiblyunknownonesofitsown.
EvenwithoutthemountingevidencethatXMLisnotapanacea,browserdeveloperswerealwaysgoingtohavedifficultymigratingtoastrictXML-basedpathforthewebgiventheenormouslegacyofpagesusingtagsoup,andconsideringPostel'sLaw,namedafterlegendarycomputerscientistJohnPostel.
Thislawstates:Beconservativeinwhatyoudo;beliberalinwhatyouacceptfromothers.
ThestricturesofXMLarecompatiblewiththislawontheserverordatabaseside,wheremanagerscanimposeconservatismasamatterofpolicy.
Asaresult,thisiswhereXMLhasthrived.
Awebbrowserisperhapstheultimateexampleofhavingtoacceptinformationfromothers,sothat'swheretensionisthegreatestregardingXMLandPostel'slaw.
XHTMLisdead.
LongliveXHTMLAllthistensioncametoaheadinthepastfewyears.
BrowservendorshadbeenlargelyignoringtheW3C,andhadformedtheWebHypertextApplicationTechnologyWorkingGroup(WHATWG)inordertoevolveHTML,creatingHTML5.
SupportforW3CXHTMLwasstagnant.
TheW3CfirstrecognizedthepracticalitiesbyprovidingaplacetocontinuetheHTML5work,anditaccepteddefeatbyretiringXHTMLeffortsin2009.
There'snosimplewaytoassesswhetherornotthismeanstheendofXHTMLinpractice.
HTML5certainlyisnotatalldesignedtobeXMLfriendly,butitdoesatleastgivelipserviceintheformofanXMLserializationforHTML,which,inthisarticle,I'llcallXHTML5.
Nevertheless,thematterisfarfromsettled,asoneoftheHTML5FAQentriesdemonstrates:IfI'mcarefulwiththesyntaxIuseinmyHTMLdocument,canIprocessitwithanXMLparserNo,HTMLandXMLhavemanysignificantdifferences,particularlyparsingrequirements,andyoucannotprocessoneusingtoolsdesignedfortheother.
However,sinceHTML5isdefinedintermsoftheDOM,inmostcasestherearebothHTMLandXHTMLserializationsavailablethatcanrepresentthesamedocument.
Thereare,however,afewdifferencesexplainedlaterthatmakeitimpossibletorepresentsomeHTMLdocumentsaccuratelyasXHTMLandviceversa.
ThesituationisveryconfusingforanydeveloperwhoisinterestedinthefutureofXMLontheweb.
Inthisarticle,IshallprovideapracticalguidethatillustratesthestateofplaywhenitcomestoXMLintheHTML5world.
ThearticleiswrittenforwhatIcallthedesperatewebhacker:someonewhoisnotaW3Cstandardsguru,butinterestedineithergeneratingXHTML5ontheweb,orconsumingitinasimpleway(thatis,toconsumeinformation,ratherthanworryingabouttheibm.
com/developerWorks/developerWorksThinkingXML:TheXMLflavorofHTML5Page3of9enormouscomplexityofrendering).
I'lladmitthatsomeofmyrecommendationswillbepainfulformetomake,asalong-timeadvocateforprocessingXMLtherightway.
RememberthatHTML5isstillaW3Cworkingdraft,anditmightbeawhilebeforeitbecomesafullrecommendation.
Manyofitsfeaturesarestable,though,andalreadywell-implementedontheweb.
ServingupdocumentstoberecognizedasXHTML5Unfortunately,Ihavemorebadnews.
YoumightnotbeabletouseXHTML5asofficiallydefined.
Thatisbecausesomespecificationssaythat,inordertobeinterpretedasXHTML5,itmustbeservedupusingtheapplication/xhtml+xmlorapplication/xmlMIMEtype.
Butifyoudoso,allfullyreleasedversionsofMicrosoftInternetExplorerwillfailtorenderit(you'refinewithallothermajor,modernwebbrowsers).
YouronlypragmaticsolutionistoserveupsyntacticXHTML5usingthetext/htmlMIMEtype.
ThisistechnicallyaviolationofsomeversionsoftheHTML5spec,butyoumightnothavemuchchoiceunlessyoucanexcludesupportforInternetExplorer.
Toaddtotheconfusionthisisaverycontentiouspointintherelevantworkinggroup,andinatleastsomedraftsthislanguagehasbeentoneddown.
InternetExplorer9beta(alsoknownasa"platformpreview")doeshavefullsupportforXHTMLservedwithanXMLMIMEtype,sooncethisversioniswidespreadamongyourusers,thisproblemshouldgoaway.
Meanwhile,ifyouneedtosupportInternetExplorer6orolder,eventheworkaroundsintroducedinthisarticlearenotenough.
YouprettymuchhavetosticktoHTML4.
x.
Recommendationforthedesperatewebhacker:ServeupsyntacticXHTML5usingthetext/htmlMIMEtype.
FunwithDOCTYPEOnepieceofgoodnews,fromadesperatewebhackerperspective,isthatXHTML5bringsfewerworriesaboutdocumenttypedeclaration(DTDecl).
XHTML1.
xand2requiredtheinfamousconstructsuchas:.
ThebiggestproblemwiththiswasthatanaiveprocessorislikelytoloadthatDTDURL,whichmightbeanunwantednetworkoperation.
Furthermore,thatoneURLincludesmanyothers,anditwasn'tuncommonforyoutounnecessarilyendupdownloadingdozensoffilesfromtheW3Csite.
Everynowandthen,theW3C-hostedfilesevenhadproblems,whichleadtoextraordinarilyhard-to-debugproblems.
InXHTML5,theXMLnatureofthefileisentirelydeterminedbyMIMEtype,andanyDTDecliseffectivelyignored,soyoucanomitit.
ButHTML5doesprovideaminimalDTDecl,.
IfyouusethisDTDecl,thenalmostallbrowserswillswitchto"standards"mode,which,evenifnotfullyHTML5,isgenerallymuchmorecompliantandpredictable.
NoticethattheHTML5DTDecldoesnotreferenceanyseparatefileandsoavoidssomeoftheearlierXHTMLproblems.
Recommendationforthedesperatewebhacker:UsetheHTMLminimaldocumenttypedeclaration,,inXHTML5.
SinceyouarenotusinganyexternalDTDcomponents,youcannotusecommonHTMLentitiessuchas or©.
ThesearedefinedinXHTMLDTDswhichyouarenotdeclaring.
Ifyoutrytousethem,anXMLprocessorwillfailwithanundefinedentityerror.
TheonlysafenameddeveloperWorksibm.
com/developerWorks/ThinkingXML:TheXMLflavorofHTML5Page4of9characterentitiesare:<,>,&,",and'.
Usenumericalequivalentsinstead.
Forexample,use ratherthan and©ratherthan©.
Recommendationforthedesperatewebhacker:Donotuseanynamedcharacterentitiesexceptfor:<,>,&,",and'Technicallyspeaking,ifyouserveupthedocumentastext/html,accordingtothefirstrecommendation,youwon'tgeterrorsfrommostbrowsersusingHTMLnamedcharacterentities,butrelyingonthisaccidentisverybrittle,andrememberthatbrowsersarenottheonlyconsumerofXML.
OtherXMLprocessorswillchokeonsuchdocuments.
FunwithnamespacesThelastlayerintheover-elaboratecakeofmechanismsforrecognizingtheXMLformat,afterMIMEtypeandDTDecl,isthenamespace.
You'reprobablyusedtostartingXHTMLdocumentswithalinesuchasthefollowing.
Thepartinboldtype(xmlns="http://www.
w3.
org/1999/xhtml")isthenamespace.
InXHTML5,thisnamespaceisstillrequired.
IfyouincludeotherXMLvocabularies,suchasScalableVectorGraphics(SVG),puttheseintheirrespective,requirednamespaces.
Recommendationforthedesperatewebhacker:AlwaysincludethedefaultnamespaceatthetopofXHTML5documentsandusetheappropriatenamespacesforother,embeddedXMLformats.
Ifyoudoincludeothervocabularies,theirnamespacedeclarationsmustbeintheoutermoststarttagsoftheembeddedsections.
Ifyoudeclarethemonthehtmlelement,youcommitatext/htmldocument-conformanceerror.
WorkingwithXHTML5contentXHTML5requiresthatyouspecifythemediatypeeitherinaprotocolheader,suchasHTTPContent-Typeheader,usingaspecialcharactermarkercalledaUnicodeByteOrderMark(BOM)orusingtheXMLdeclaration.
Youcanuseanycombinationoftheseaslongastheydonotconflict,butthebestwaytoavoidproblemsistobecarefulinhowyoucombinemechanisms.
Unfortunately,usinganXMLdeclarationisapotentialproblem,becauseitcausesallInternetExplorerversions8andbelowtoswitchtoquirksmode,resultingintheinfamousrenderinganomaliesforwhichthatbrowserisfamous.
Recommendationforthedesperatewebhacker:OnlyuseUnicodeencodingsforXHTML5documents.
OmittheXMLdeclaration,andusetheUTF-8encoding,oruseaUTF-16UnicodeByteOrderMark(BOM)atthebeginningofyourdocument.
UsetheContent-TypeHTTPheaderwhileservingthedocumentifyoucan.
ThefollowingisanexampleofsuchanHTTPheader:ibm.
com/developerWorks/developerWorksThinkingXML:TheXMLflavorofHTML5Page5of9Content-Type:"text/html;charset=UTF-8"ThenewsemanticmarkupelementsHTML5introducesnewelementsthatprovideclearersemanticsforcontentstructure,suchassectionandarticle.
ThesearethepartsofHTML5thatmightstillbesubjecttochange,butchangeswillnotlikelybedrastic,andtheriskisbalancedbytheimprovedexpressionprovidedbythenewelements.
OneproblemisthatInternetExplorerdoesn'tconstructtheseelementsinDOM,so,ifyouuseJavaScript,you'llneedtoemployanotherworkaround.
RemySharpmaintainsaJavaScriptfixthatyoucandeploybyincludingthefollowingsnippetinyourdocumenthead(seeRelatedtopicsforalink).
YoumightalsoneedtodefineCSSrulesfortheelementsjustincaseanybrowsersdorenderyourdocumentinHTML4stylewhichdefaultsunknownelementstoinlinerendering.
ThefollowingCSSshouldwork.
header,footer,nav,section,article,figure,aside{display:block;}Recommendationforthedesperatewebhacker:UsethenewHTML5elements,butincludetheHTML5shivJavaScriptanddefaultCSSrulestosupportthem.
BringingitalltogetherI'vemademanyseparaterecommendations,soI'llbringthemalltogetherintoacompleteexample.
Listing1isXHTML5thatmeetstheserecommendations.
WhenservingitoverHTTP,usetheheaderContent-Type:"text/html;charset=UTF-8"unlessyoucanaffordtorefusesupportforInternetExplorer,inwhichcaseusetheheaderContent-Type:"application/xhtml+xml;charset=UTF-8".
Listing1.
CompleteXHTML5exampleAmicroblog,inXHTML5header,footer,nav,section,article,figure,aside{display:block;}OtherJavaScriptgoeshere.
.
.
-->developerWorksibm.
com/developerWorks/ThinkingXML:TheXMLflavorofHTML5Page6of9AmicroblogThereissomethingimportantIwanttosay:Astitchintimesavesnine.
Bytheway,areyouasexcitedabouttheWorldCupasIamWelcometomynewXHTML5weblogArchivesApril2010May2010June2010©2010byUcheOgbujiHomeAboutHomeListing1usestheHTML5DTDeclanddeclaresthedefaultnamespaceatthetop.
Thestyleandscriptelementsinthisexamplejustprovideworkaroundsforreal-worldbrowserissues.
ThescriptelementisonlyneededifyouareusingotherJavaScript.
ThedocumentusesalotofthenewHTML5elements,whichIwon'tgointoindetailsincetheyarenotspecifictotheXMLnature.
SeeRelatedtopicsformoreinformationabouttheseelements.
Noticethe"self-closed"syntaxusedfortheimgelement(inotherwords,itendsin/>),andtheuseofnumericentityformforthecopyrightsymbol,©.
YoucanrefertoTable1forasummaryofhowtheaboveexamplewillbehavewithvariousbrowsers.
Table1.
BrowsersupportforXHTML5thatmeetstherecommendationsinthisarticleBrowserBehaviorLegacybrowser(forexampleInternetExplorer6.
xorlower,Netscape,Firefox1.
x)Renderingwillbeunpredictable.
Forexample,"self-closed"elementsmightbemistakenforendtags.
YouwillnotgetanyerrorsifyouuseHTMLnamedentities.
ibm.
com/developerWorks/developerWorksThinkingXML:TheXMLflavorofHTML5Page7of9InternetExplorer7or8Renderingwillberegular"tagsoup"HTML,becauseoftext/htmlMIMEtype,butthepresenceofanyDTDeclwilltrigger"standardsmode,"suchasInternetExploreroffersit.
NoerrorreportforHTMLnamedentities.
Modern,HTML5-awarebrowser,suchasFirefox3.
x,Safari4,orrecentOperaorGoogleChromeRenderingwillbeHTML5(notXHTML5)becauseoftheMIMEtype,butin"standardsmode.
"NoerrorreportforHTMLnamedentities.
AnystandardXML1.
xprocessorTheMIMEtypewillnotbeconsidered.
Theparserwillseeallelementsgenerically,intheXHTMLnamespace.
YouwillreceiveerrormessagesifyouuseanybogusHTMLnamedentities.
WrapupOneimportant,recentdevelopmentisthattheW3CHTMLWorkingGrouppublishedaFirstPublicWorkingDraft,"PolyglotMarkup:HTML-CompatibleXHTMLDocuments,"(seeRelatedtopicsforalink)withtheintentionofgivingXHTML5amorethorough,accurateandup-to-datebasis.
Again,ithasbeenverypainfulformetomakemanyoftherecommendationsinthisarticle.
Suchhack-aroundscomefromlong,painfulexperience,andaretheonlywaytoavoidanightmareofhard-to-reproducebugsandstrangeincompatibilitieswhenmixingXMLintotherealHTMLworld.
ThiscertainlydoesnotmeanthatIhavestoppedadvocatingcarefulXMLdesignandbestpractices.
ItisbesttosaveXHTML5fortheveryoutermostcomponentsthatconnecttobrowsers.
AllflavorsofXHTMLarebetterseenasrenderinglanguagesthaninformation-bearinglanguages.
YoushouldcarrythemaininformationthroughoutmostofyoursysteminotherXMLformats,andthenconverttoXHTML5onlyatthelastminute.
YoumightwonderwhatisthepointofcreatingXHTML5evenatthelastminute,butrememberPostel'slaw,whichrecommendsbeingstrictinwhatyouproduce.
ByproducingXHTML5forbrowsers,youmakeiteasierforotherstoextractinformationfromyourwebsitesandapplications.
Inthisageofmash-ups,webAPIs,anddataprojects,thatisavaluablecharacteristic.
ThankstoMichaelSmithforbringingmyattentiontorecentdevelopmentsinthisspace.
developerWorksibm.
com/developerWorks/ThinkingXML:TheXMLflavorofHTML5Page8of9RelatedtopicsTheHTML5syntaxissuessectionoftheWHATWGFAQ:JointhediscussionofXMLissues.
TheW3CworkingdraftstandardforXHTML5:KeepupwithsyntaxforusingHTMLwithXML,whetherinXHTMLdocumentsorembeddedinotherXMLdocuments.
"PolyglotMarkup:HTML-CompatibleXHTMLDocuments"(W3CHTMLWorkingGroup,June2010):ReadthisrecentlypublishedWorkingDraftwithamorerigorousbasisforXHTML5.
Newelements,attributesandotherlanguagefeaturesinHTML5:LearnaboutthenewelementsavailableinXHTML5.
Tip:AlwaysuseanXMLdeclaration(UcheOgbuji,developerWorks,June,2007):Unfortunately,becauseofbrowserinconsistencies,thisarticlerecommendsnotusingtheXMLdeclarationinXHTML5filesservedforbrowsers.
Readwhyitisalwaysagoodideatodosoingeneralinthistip.
ThankstoMichaelSmithforbringingmyattentiontorecentdevelopmentsinthisspace.
LearnmoreaboutHTML5indeveloperWorksarticlesandtutorials:NewelementsinHTML5Structureandsemantics(ElliotteRustyHarold,August2007):ExplorenewstructuralandinlineelementsinHTML5.
CreatemodernwebsitesusingHTML5andCSS3(JoeLennon,March2010):ImplementthecanvasandvideoelementsofHTML5inthishands-onintroductiontoHTML5andCSS3.
BuildwebapplicationswithHTML5(MichaelGalpin,March2010):Createtomorrow'swebapplicationstodaywithpowerfulHTML5featuressuchasmulti-threading,geolocation,embeddeddatabases,andembeddedvideo.
HTML5—XML'sStealthWeapon(JonnyAxelsson,July2009):ReadareasonablesummaryofthehistorythatledtoXHTML5.
Postel'slaw:Learnmoreaboutthis.
Itisalsocalledtherobustnessprinciple.
html5libproject:IfyouwanttoeasilyconsumeHTMLorXHTML5,checkoutPythonandPHPimplementationsofaHTMLparser,whichincludesbindingsforPython,C,PHPandRuby.
NewtoXML:IfyouarenewtoXML,startexploringXMLandallyoucandowithit.
Readersofthiscolumnmightbetooadvancedforthispage,butit'sagreatplacetogetyourcolleaguesstarted.
AllXMLdeveloperscanbenefitfromtheXMLzone'scoverageofmanyXMLstandards.
IBMcertification:FindouthowyoucanbecomeanIBM-CertifiedDeveloper.
ThedeveloperWorksXMLzone:FindmoreXMLresources,includingpreviousinstallmentsoftheThinkingXMLcolumn.
Ifyouhavecommentsonthisarticle,oranyothersinthiscolumnpleasepostthemontheThinkingXMLforum.
XMLtechnicallibrary:SeethedeveloperWorksXMLZoneforawiderangeoftechnicalarticlesandtips,tutorials,standards,andIBMRedbooks.
IBMproductevaluationversions:Getyourhandsonapplicationdevelopmenttoolsandmiddlewareproducts.
ibm.
com/developerWorks/developerWorksThinkingXML:TheXMLflavorofHTML5Page9of9CopyrightIBMCorporation2010(www.
ibm.
com/legal/copytrade.
shtml)Trademarks(www.
ibm.
com/developerworks/ibm/trademarks/)