Generativ dataintelligens

Skriv HTML, HTML-måden (ikke XHTML-måden)

Dato:

Du må ikke bruge XHTML (længere), men når du skriver HTML, kan du være mere påvirket af XHTML, end du tror. Du skriver meget sandsynligt HTML, XHTML-måden.

Hvad er XHTML-måden at skrive HTML, og hvad er HTML-måden at skrive HTML? Lad os kigge på det.

HTML, XHTML, HTML

I 1990'erne var der HTML. I 2000'erne var der XHTML. Så, i 2010'erne, skiftede vi tilbage til HTML. Det er den simple historie.

Du kan også mærke efter de grove datoer for specifikationerne: HTML "1" 1992, HTML 2.0 1995, HTML 3.2 1997, HTML 4.01 1999; XHTML 1.0 2000, XHTML 1.1 2001; "HTML5" 2007.

XHTML blev populær, da alle troede på, at XML og XML-derivater var fremtiden. "XML alle tingene." For HTML havde dette en dyb effekt: Den effekt, at vi lærte at skrive det på XHTML-måden.

XHTML-måden at skrive HTML på

XHTML-måden er veldokumenteret, fordi XHTML 1.0 beskriver meget detaljeret i sit afsnit om "Forskelle med HTML 4":

  • Dokumenter skal være velformede.
  • Element- og attributnavne skal være med små bogstaver.
  • For ikke-tomme elementer kræves sluttags.
  • Attributværdier skal altid anføres.
  • Attributminimering understøttes ikke.
  • Tomme elementer skal lukkes.
  • Håndtering af hvide rum i attributværdier udføres i henhold til XML.
  • Script- og stilelementer har brug for CDATA-sektioner.
  • SGML-ekskluderinger er ikke mulige.
  • Elementerne med id , name egenskaber, som a, applet, form, frame, iframe, imgog map, bør kun bruge id.
  • Attributter med foruddefinerede værdisæt skelner mellem store og små bogstaver.
  • Enhedsreferencer som hex-værdier skal være med små bogstaver.

Ser det bekendt ud? Med undtagelse af markering af CDATA-indhold samt håndtering af SGML-ekskluderinger, følger du sandsynligvis alle disse regler. Alle sammen.

Selvom XHTML er død, er mange af disse regler aldrig blevet stillet spørgsmålstegn ved igen. Nogle er endda blevet ophøjet til "bedste praksis" for HTML.

Det er XHTML-måden at skrive HTML på, og dens varige indvirkning på feltet.

HTML-måden at skrive HTML på

En måde at lede os tilbage på er at ophæve reglerne pålagt af XHTML. Lad os faktisk gøre dette (uden SGML-delen, fordi HTML er ikke længere baseret på SGML):

  • Dokumenter er muligvis ikke korrekt udformet.
  • Element- og attributnavne må ikke stå med små bogstaver.
  • For ikke-tomme elementer er sluttags ikke altid påkrævet.
  • Attributværdier er muligvis ikke altid citeret.
  • Attributminimering understøttes.
  • Tomme elementer behøver ikke lukkes.
  • Håndtering af hvide rum i attributværdier udføres ikke i henhold til XML.
  • Script- og stilelementer behøver ikke CDATA-sektioner.
  • Elementerne med id , name attributter må ikke kun bruge id.
  • Attributter med foruddefinerede værdisæt skelner ikke mellem store og små bogstaver.
  • Enhedsreferencer som hex-værdier er muligvis ikke kun med små bogstaver.

Lad os fjerne de esoteriske ting; de ting, der ikke virker relevante. Dette inkluderer håndtering af XML-hvidrum, CDATA-sektioner, fordobling af name attributværdier, tilfældet med foruddefinerede værdisæt og hexadecimale enhedsreferencer:

  • Dokumenter er muligvis ikke korrekt udformet.
  • Element- og attributnavne må ikke være med små bogstaver.
  • For ikke-tomme elementer er sluttags ikke altid påkrævet.
  • Attributværdier er muligvis ikke altid citeret.
  • Attributminimering understøttes.
  • Tomme elementer behøver ikke lukkes.

Når man skræller væk fra disse regler, ligner det meget mindre, at vi arbejder med XML, og mere som at arbejde med HTML. Men vi er ikke færdige endnu.

"Dokumenter er muligvis ikke veludformet" antyder, at det var fint, hvis HTML-koden var ugyldig. Det var fint for XHTML at pege på velformethed på grund af XMLs strenge fejlhåndtering. Men selvom HTML-dokumenter fungerer, selv når de indeholder alvorlige syntaks- og velformede problemer, er det hverken nyttigt for fagfolk - eller vores felt - at bruge og misbruge denne modstandskraft. (Jeg har argumenteret for denne sag før i min artikel, "Til kritisk forsvar for frontend-udvikling.")

HTML-måden ville derfor ikke foreslå "dokumenter er muligvis ikke velformede." Det ville også være klart, at ikke kun slut-, men også start-tags er ikke altid påkrævet. Omformulering og omarrangering, dette er essensen:

  • Start- og sluttags er ikke altid påkrævet.
  • Tomme elementer behøver ikke lukkes.
  • Element- og attributnavne kan være små eller store bogstaver.
  • Attributværdier er muligvis ikke altid citeret.
  • Attributminimering understøttes.

Eksempler

Hvordan ser det ud i praksis? For start- og sluttags skal du være opmærksom på det mange tags er valgfri. Et afsnit og en liste, for eksempel, er skrevet sådan i XHTML:

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<ul> <li>Praesent augue nisl</li> <li>Lobortis nec bibendum ut</li> <li>Dictum ac quam</li>
</ul>

I HTML kan du dog skrive dem ved kun at bruge denne kode (som er gyldig):

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<ul> <li>Praesent augue nisl <li>Lobortis nec bibendum ut <li>Dictum ac quam
</ul>

Udviklere lærte også at skrive ugyldige elementer, som sådan:

<br />

Dette er noget XHTML bragt til HTML, men som skråstreget har ingen effekt på ugyldige elementer, du behøver kun dette:

<br>

I HTML kan du også bare skrive alt med store bogstaver:

<A HREF="https://css-tricks.com/">CSS-Tricks</A>

Det ser ud til, at du råber, og du kan måske ikke lide det, men det er okay at skrive det sådan her.

Når du ønsker at kondensere det link, giver HTML dig mulighed for at udelad visse citater:

<A HREF=https://css-tricks.com/>CSS-Tricks</A>

Som en tommelfingerregel, når attributværdien ikke indeholder et mellemrum eller et lighedstegn, er det normalt fint at droppe anførselstegnene.

Endelig giver HTML-HTML - ikke XHTML-HTML - også mulighed for at minimere attributter. Altså i stedet for at markere en input element efter behov og skrivebeskyttet, som dette:

<input type="text" required="required" readonly="readonly">

Du kan minimere egenskaberne:

<input type="text" required readonly>

Hvis du ikke kun udnytter det faktum, at citaterne ikke er nødvendige, men det text er standard for type attribut her (der er flere sådanne unødvendige attribut-værdi-kombinationer), får du et eksempel, der viser HTML i al sin minimale skønhed:

<input required readonly>

Skriv HTML, HTML-måden

Ovenstående er ikke en repræsentation af, hvor HTML var i 90'erne. HTML var dengang fyldt med <table> elementer til layout, pakket med præsentationskode, stort set ugyldige (som det stadig er i dag), med vildt varierende support af brugeragenter. Alligevel er det Essensen af, hvad vi ville have ønsket at beholde, hvis XML og XHTML ikke var kommet.

Hvis du er åben over for et forslag til, hvordan en mere omfattende, moderne måde at skrive HTML på kunne se ud, har jeg en. (HTML er mit hovedfokusområde, så jeg udvider dette med links til nogle af mine artikler.)

  1. Respekter syntaks og semantik.
  2. Brug de muligheder, HTML giver dig, så længe du gør det konsekvent.
    • Husk at element- og attributnavne kan være små eller store.
  3. Hold brugen af ​​HTML til det absolutte minimum
    • Husk, at præsentations- og adfærdsmarkup skal håndteres af CSS og JavaScript i stedet.
    • Husk at start- og sluttags er ikke altid kræves.
    • Husk at tomme elementer ikke skal lukkes.
    • Husk, at nogle attributter har standardindstillinger, der tillader disse attribut-værdi-par skal udelades.
    • Husk at attributværdier evt ikke altid blive citeret.
    • Husk, at attributminimering understøttes.

Det er ikke en tilfældighed, at det ligner de tre grundregler for HTML, at det arbejder med præmissen om en mindre nyttelast fører også til hurtigere websteder, og at dette følger skolen for minimal webudvikling. Intet af dette er nyt - vores felt kunne blot beslutte at genopdage det. Værktøj er også tilgængeligt: html-minifier er nok den mest etablerede og i stand til at håndtere alle HTML-optimeringer.

Du har lært HTML på XHTML-måden. HTML er ikke XHTML. Genopdag HTML, og vær med til at forme en ny, moderne måde at skrive HTML på - som anerkender, men ikke nødvendigvis er baseret på XML.


Skriv HTML, HTML-måden (ikke XHTML-måden) oprindeligt udgivet den CSS-tricks. Du burde få nyhedsbrevet.

spot_img

Seneste efterretninger

spot_img