10 najboljših razlik HTML v primerjavi z HTML5 (Infographics)

Kazalo:

Anonim

Standard HTML5 je bil dokončan in izdan leta 2014, in to je tisto, kar bi moral biti HTML, ko je bila pred leti predstavljena prva različica. HTML 2.0 je bil prvi pravi "standard", ki je bil objavljen vse do leta 1995. Dve leti pozneje je bil objavljen HTML 3. Še dve leti pozneje je bil predstavljen HTML 4.01, ki je od takrat delovni konj interneta.

Prvi „delovni osnutek“ HTML5 je bil predstavljen že leta 2008, presenetljivo široka podpora brskalnika pa je bila takrat. HTML5, ki ga poznamo danes, se močno razlikuje od HTML-ja v preteklosti, tukaj pa bomo razpravljali o tem, kaj se je z njegovo izdajo spremenil najnovejši standard. Odkar je bil predstavljen HTML5, je bil splošno sprejet, vse njegove funkcije in zmogljivosti pa zdaj podpirajo vsi večji brskalniki. Tu in tam je še nekaj kolcanja, a celotni HTML5 se je dobro izenačil s sodobno spletno izkušnjo.

Kot spletni razvijalec ste lahko bodisi stari strokovnjak, ki je obvladal starejše standarde, bodisi novinec radovedno opazoval razvoj novih standardov v stranskem tiru. Kakor koli že, sčasoma morate začeti prehod na HTML5.

HTML Vs HTML5 Infographic

Prvi korak k prehodu na HTML5 ali učenje je razumevanje razlike med starejšim in zadnjim standardom. Tu je nekaj ključnih razlik med HTML in HTML5:

  1. HTML5 je živ jezik

HTML5 je živ jezik, delo v teku. Neverjetno je videti, kaj lahko HTML5 naredi, pomembno pa je tudi vedeti, da HTML5 ni popolnoma standardizirana različica, kot je HTML4, ki je stara več kot deset let in je postavljen standard nespremenljiv.

Če vstopate v HTML5, boste morali posodobiti nekaj. Atributi in elementi se vsako leto dodajajo in redno spreminjajo. To je odvisno tudi od tega, koliko uporabljate bogate elemente, vsekakor pa je to eno od tveganj pri uporabi tekočega, spreminjanja jezika, kot je HTML5.

  1. HTML5 je preprostejši

Čeprav ima HTML5 tveganja, kot so nenehne posodobitve, je na splošno enostavno slediti spremembam in posodobitvam zaradi enostavnejše skladnje v primerjavi s HTML4. Na primer, na začetku strani imate zelo preprosto izjavo, da jo nastavite kot stran HTML5:

Preprosta izjava Doctype je ena od poenostavitev v sintaksi HTML, ki je združljiva z vsemi različicami HTML4 in vse do XHTML1. Vendar HTML5 ni združljiv s SGML.

Priporočeni tečaji

  • Brezplačno usposabljanje za programiranje Python-a
  • Brezplačni tečaj za testiranje programske opreme
  • Brezplačni tečaji programiranja Java
  • Popoln tečaj PERL
  1. Novi element

HTML5 prihaja s številnimi novimi elementi in odpravlja več drugih (ki jih bomo pokrivali čez čas), vendar je eden njegovih ključnih elementov dodan element, ki je močno vplival na uporabo Adobe Flash na spletnih mestih. Čeprav Flash še vedno uporablja več spletnih strani, je HTML5 sprejelo veliko ljudi in veliko ljudi misli, da bo Flash sčasoma zastaral. Samo čas se bo odločil za to; do takrat se je kaskadni element HTML5 izkazal kot dobra alternativa Flashu.

Element lahko uporabimo za risanje grafik z različnimi oblikami in barvami s pomočjo skript, običajno JavaScript. Element je preprosto posoda za grafiko; za definiranje grafike morate uporabiti skript. Platno je privzeto pravokotno območje brez vsebine ali obrob. Trg je tak:

Pomembno je določiti atribut id ter širino in višino za določitev velikosti platna. Za določitev meja lahko dodate atribut sloga.

Uporabite lahko tudi JavaScript, kot je naslednji primer:

var c = document.getElementById ("myCanvas");

var ctx = c.getContext ("2d");

ctx.fillStyle = "# FF0000";

ctx.fillRect (0, 0, 150, 75);

  1. Novo in Elementi

Še en velik dodatek, ki ga ponuja HTML5, so novi elementi in elementi, ki kažejo na novo spletno anatomijo. S temi novimi oznakami ni treba več identificirati obeh elementov z oznako.

Specifikacije definirajo element glave kot predstavlja skupino "navigacijskih" ali "uvodnih" pripomočkov. Element se lahko uporabi za določitev uvoda v del strani ali na celotno stran. Tu je delček kode, ki uporablja element glave.

Naslov

Avtor Pila v Splet 2.0

Telo besedila

Specifikacije HTML5 se nanašajo na nožni element, ki predstavlja "nogo za vsebino odseka najbližjega prednika ali koreninski element razdelka" in na splošno vsebuje informacije o razdelku, kot so ime avtorja, podatki o avtorskih pravicah, povezave do dokumentov itd.

Logično je, da je noga postavljena na dnu spletne strani. Lahko pa ga postavite tudi na konec razdelka strani. Tu je nekaj primerov kodiranja, ki uporablja element podnožja:

Naslov vsebine

Avtor Pila v Splet 2.0

Telo besedila.

Oznake: Ukazni poziv, Kompas, CSS, Sass, Terminal

10 všečkov

Tukaj v spodnji nogi so objavljene oznake objav in objava »Facebook všeč«.

  1. Elementi in elementi

Če bi šli skozi zgornje primere, bi opazili še nekaj novih elementov, kot je. Ta element vam skupaj z elementom omogoča označevanje določenih delov vaše postavitve in je zelo koristen za optimizacijo iskalnikov. Element članka je določen kot predstavlja samostojen sestavni del spletne strani, ki ga je treba neodvisno uporabiti ali distribuirati. To je lahko časopis, objava na forumu, članek iz revije, vnos v blog ali kaj drugega.

Element članka ima na splošno svoj naslov v elementu glave in morda celo nogi, kot ste videli v zgornjem primeru. Element si lahko preprosto omislite kot vnos v blog ali neodvisen del vsebine; zapleten del je prepoznavanje tistega, kar je neodvisno. Preprosto povedano, neodvisen del vsebine je tisti, ki ima smisel sam po sebi.

Dober način, da veste, ali je del vsebine neodvisen, je z vprašanjem, ali je smiselno v RSS-viru. Članki v spletnem dnevniku in statične strani imajo smisel, nekatera spletna mesta pa imajo vire komentarjev. Toda odstavek v članku ne bi imel smisla ločen od ostale vsebine. Tu je delček kode s podnožjem in objavo oznak.

Naslov vsebine

Objavljeno: 2016-02-24

Telo besedila

Licenca Creative Commons Attribution-ShareAlike

Element odseka v skladu s specifikacijami W3C, ki predstavlja „splošni odsek“ vloge ali dokumenta. Lahko bi ga zamenjali z oznako, zato takoj razčistimo zmedo. Oznaka odseka se uporablja, kadar mora biti vsebina v njej ločena od preostale strani z eno temo in kadar jo je treba obravnavati kot vnos v oris strani. Element div pa je določen kot "generični vsebnik", kar pomeni, da ni ločen od same glavne strani, razen lastnih atributov naslova, jezika in razreda.

  1. Novo in elementi

Novi in ​​elementi HTML5 so del specifikacij Interaktivnih elementov, vendar pa razvijalci sodijo med elemente, ki jih najmanj govori. Glede na dejstvo, da se je splet spremenil v bolj samo povezane strani in dokumente, so ti elementi dobrodošli dodatek za večjo interaktivnost v spletu.

Elementa ni mogoče zamenjati z elementom, ki je opredeljen kot navigacijska oznaka HTML, ki predstavlja blok za krmarjenje po strani. Običajno vsebuje povezave, da lahko uporabniki preskočijo razdelke na strani ali na drugo stran. Po drugi strani oznaka menija predstavlja ukaze menijev za preprostost v namiznih in mobilnih aplikacijah. Tu je primer elementa v akciji:

Pozdravljen, svet

Medtem je element še en način urejanja slik in besedila. Uporablja se skupaj z elementom za označevanje ilustracij, diagramov in fotografij. Spodaj je kratek delček kode, ki vsebuje oba elementa v akciji.

"Opis

  1. Novo in elementi

To sta dve glavni dopolnitvi standarda HTML5. Zvočna oznaka, kot video oznaka, razvijalcem omogoča vstavljanje glasbe in zvoka na svoje spletno mesto. Za razliko od prejšnjega standarda niste omejeni na dodajanje midi glasbe, čeprav še vedno obstajajo nekatere omejitve glede vrste uporabljenih datotek. Večina brskalnikov, povezanih z Webkitom, podpira navadne datoteke MP3, drugi pa podpirajo samo format OGG. Dobra novica je, da obstaja veliko pretvornikov datotek in preprosto lahko ponudite dve različici zvočne datoteke; prava različica bo izbrana samodejno.

Zvočno oznako lahko uporabite kot kateri koli drug element. Tu je primer delčka:

Zvočna oznaka ima tudi številne atribute za dodatne kontrole, vključno z atributi dogodkov, dogodki pa vključujejo okenske dogodke, forme, medijske dogodke in miške. Video element ima tudi številne atribute vsebine, med drugim SRC, globalne atribute, zanko, nadzor, prednaložitev in plakat. Atributi SRC, zanke, samodejnega igranja in nadzora so precej samoumevni in enaki za vse medijske elemente, medtem ko so globalni atributi skupni za vse elemente. Vključujejo dir, skriti, kontekstni meni in še več.

Obstaja nekaj drugih multimedijskih atributov in elementov, ki so priloženi HTML5, na primer element skladbe, ki omogoča video besedilo za video element.

  1. Nove oblike

HTML5 zdaj vsebuje obliko in elemente. Če na strani ne nameravate uporabljati veliko tabel, lahko atribut tudi odstranite in si oglejte spremembe, ki so bile izvedene, preden greste naprej.

  1. Nič več in elementov

To pomeni, da vsi atributi, ki razvijalcem omogočajo, da ustvarijo odlično postavljeno, tonirano tabelo, na primer obrobo, bgcolor, poravnavo, višino, pravila in drugo. Vse te atribute nadomešča CSS.

  1. Nič več, in

To je super za tiste razvijalce, ki so delali HTML do prvih dni. Atributi frameset, frame in noframes so bili v celoti odstranjeni, skupaj z drugimi, kot so blink, basefont in drugo. Za postavitev boste morali upravljati brez uporabe tabel. Tabele so še vedno del HTML5, vendar niso več namenjene slikovnim pikam. Specifikacije pravijo, da tabel ne bi smeli uporabljati za pripomočke za postavitev in za nadzor postavitve strani.

Zaključek

Kot lahko vidite, je v HTML5 veliko sprememb, zato ga morate uporabljati previdno in previdno. Prav tako morate posodobiti svoje znanje o jeziku, saj se sčasoma spreminja in dobiva več posodobitev. Morate ustaviti uporabo elementov, ki jih je HTML5 odstranil iz sebe, in uporabiti nove elemente HTML5, ki bodo zagotovo ostali, na primer oznake glave ali noge.

Zgoraj ste videli le poenostavljeno različico sprememb, ki jih je HTML5 opravil z uvedbo. Ampak bodimo tukaj iskreni; Pri sprejemanju HTML5 ni nič preprostega ali počasnega, novi standard pa dodaja številne zmogljivosti, ki so ključne za sodobno uporabniško izkušnjo. Morate biti v koraku z novim jezikom in se tudi naučiti nekaj CSS-ja, ki ima večjo vlogo kot prej.

Dobra stvar teh sprememb je, da so, čeprav so velike, na bolje in to razumejo vse zainteresirane strani, ki so tukaj vključene. Brskalniki bodo močnejši, ko se premikajo proti oblaku, z zmožnostjo več vodenja sami. S stvarmi, kot je Ajax, z vdelavo video in zvoka in tako naprej, bo tako veliko lažje kodirati na preprost način in omogočiti brskalniku, da prevzame velike zahteve. Na primer, novi elementi strukture, kot so slika, podnožje, povzetek in razdelek, se nanašajo na strukturo dokumenta, upodabljanje pa je prepuščeno brskalniku.

Povezani članki:-

Tukaj je nekaj člankov, ki vam bodo pomagali, da boste dobili več podrobnosti o HTML-ju v primerjavi z HTML5, zato pojdite po povezavi.

  1. HTML in XML
  2. HTML5 v primerjavi z Flash Top 9 (z Infografiko)
  3. HTML v primerjavi z XHTML
  4. HTML5 vs Flash
  5. Neverjetne razlike HTML5 in JavaScript
  6. 10 odličnih uporabnih nasvetov o programiranju Python-a (triki)