Innovatsioonivirtuoosne HTML5 on tõepoolest tehnoloogia, mis on toonud veebisaitide arendamise žanrisse uut verd. Olenemata sellest, kas soovite, et teie veebisait saaks uhkeldada kuju muutvate funktsioonidega, või soovite, et see uhkeldaks valdavalt kauni visuaalse atraktiivsusega, HTML5 teeb selle töö teie eest ja kõige kohutavamal viisil.

Kuigi see platvorm tungis veebiarenduse valdkonda juba mõnda aega tagasi, pole puudust veebimeistritest, kellel pole seda veebisaidi loomisel 3 parima eelistatud tööriistade loendis. Ja suur osa neist veebimeistritest kasutavad juba oma veebisaidi jaoks muid platvorme, tehes seega kompromisse paljude funktsioonide osas, mida HTML5 oleks võinud nende veebisaite integreerida.

1 See annab loovatele hingedele vabad käed

Innovatsioon on suurimate disainerite ja arendajate tunnus ning kui tuleb tööriist, mis võimaldab neil piiramatult oma loovust kasutada, tuleb seda toetada. HTML5 sobib ideaalselt ja kõige usaldusväärsemal viisil. Veebiarenduse raamistikuna on HTML5 ülimalt kohandatav, võimaldades seega disaineritel end väljendada. Seega, kui teie päevakorras on eesotsas olemine, on HTML5 vagun olemas, mida püüda.

2 Palju täiustatud videotugi on teie jaoks olemas

Brauseritele mõeldud uue HTML5 manustatud videoga on videotuge oluliselt täiustatud. Kuna mitte kõik brauserid ei toeta H.264-ga sarnaseid erinevaid vorminguid, peate HTML5-video kuvamiseks kasutama järgmist.

<video controls preload>
    <source src="cohagenPhoneCall.ogv" type="video/ogg; codecs='vorbis, theora'" />
    <source src="cohagenPhoneCall.mp4" type="video/mp4; 'codecs='avc1.42E01E, mp4a.40.2'" />
    <p>Your browser does not support the format. <a href="cohagenPhoneCall.mp4">Download this format.</a></p>
</video>

3 See võimaldab teil luua veebisaite mobiili jaoks, selle asemel, et sundida teid looma mitut versiooni

Logige sisse oma saidi analüütikasse, kraapige pinda veidi ja jälgige OS-i platvorme, millelt saate enamiku külastusi. Olete üllatunud, kui näete, et suurem osa teie külastusi pärineb mobiilikasutajatelt, mitte aasta tagasi, kui teie veebisaidil oli tõenäoliselt rohkem lauaarvutite kasutajaid. Seega on mobiilile mõeldud veebisaidi tegemine palju soovitatavam kui töölauakeskse veebisaidi tegemine ja seejärel sellest mobiilisõbraliku versiooni loomine. Ja HTML5 muudab selle väga tõhusaks harjutuseks mobiilseadmete jaoks mõeldud veebisaitide loomiseks, mis säilitavad oma silmanägemise, kui neid kasutatakse väiksematel ekraanidel, ja kohanduvad väiksema suurusega, ilma et see tekitaks teile ühilduvus- või reageerimisprobleeme.

4 Keeruline XHTML doctype loob võimaluse lihtsamaks ja vähem tülikaks versiooniks

Ilma kahemõtteliselt öeldes ei ole arendajate kogukond XHTML-dokumenditüüpi kirglikult vaadanud. Ja sama põhjus on enam kui ilmne sellest, kuidas see on kirjutatud järgmiselt:

<!DOCTYPE html PUBLIC "-//KKK//DTD XHTML 1.0 Transitional//EN"
    "http://www.xyz.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

HTML5 on muutnud deklaratsiooni palju lühemaks ja arendajatele arusaadavamaks:

<!DOCTYPE html>

5 atribuuti saab intuitiivsemalt tuvastada

Eelkõige peaksid programmis kasutatavad atribuudid suutma sujuvalt kindlaks teha, kas brauserid tuvastavad need õigesti. HTML5 annab neile atribuutidele võimaluse täpselt seda teha. Modernizri teek osutub leidlikuks tööriistaks, kuid on ka teisi viise, näiteks elementide loomine enne nende tükeldamist. Nii on brauseri võimekust lihtne hinnata.

6 Sellel on IE jaoks oma paranduste komplekt

Ahjaa, Internet Explorerit suhtub Interneti-kogukond kogu maailmas üsna kiretult ja seda vägagi õigustavatel põhjustel. Ootuspäraselt on IE-l oma probleemid uute elementidega, mida HTML 5 sisse valab. Seetõttu on nende elementide kujundamine nii, et need muutuksid selle brauseri jaoks arusaadavamaks, et anda HTML5 elementide struktuuri tunnetus. on joondatud plokitaseme elementidena:

header, footer, article, section, nav, menu {
   display: block;
}

Nüüd on kõik võimalused, et Internet Explorer on jätkuvalt valus, kuna see ei pruugi päiseelemendiga korralikult tutvuda. Seega on HTML5 stiilil oht, et seda ignoreeritakse. Sellegipoolest on sama jaoks lihtne lahendus:

document.createElement("article");
document.createElement("footer");
document.createElement("header");
document.createElement("nav");
document.createElement("menu");

7 Geolokatsioon

Geolokatsioon on vaieldamatult HTML5 peamine funktsioon. See loob teile matemaatilised väärtused, mis tähistavad teie kasutaja asukoha koordinaate. Need asukoha koordinaadid arvutatakse brauseriga, mida külastaja kasutab veebisaidile juurdepääsuks.

8 kood, mis on segadusevaba ja palju arusaadavam

Alati on soovitatav kirjutada programme, mis on puhtad, kergesti arusaadavad ja kõige korduvkasutatavamal viisil kirjutatud. HTML5 teeb selle kõik võimalikuks ja veelgi enam, hõlbustades koodi, mis on väga sünkroonne, semantiline ja annab teile vabaduse tõmmata piir stiili ja sisu vahele, et neid oleks lihtne mõista. Standardne päisekood koos navigeerimisega näeb välja selline:

<div id="header">
 <h1>Header Text</h1>
 <div id="nav">
  <ul>
   <li><a href="x">Link</a></li>
   <li><a href="x">Link</a></li>
   <li><a href="x">Link</a></li>
  </ul>
 </div>
</div>

Kuigi võite väita, et kood on piisavalt lihtne, vaatame, mida HTML5 sellega teha saab:

<header>
 <h1>Header Text</h1>
 <nav>
  <ul>
   <li><a href="x">Link</a></li>
   <li><a href="x">Link</a></li>
   <li><a href="x">Link</a></li>
  </ul>
 </nav>
</header>

Ilmselt lisab HTML5 kogu koodile palju struktuuritaju, muutes selle selgemaks ja kasutades HTML-i päiseid, mis esindavad paremini teie sisu.

9 Skriptide ja linkide puhul ei pea te tegelema tüübiga

Pole puudust veebiarendajatest, kes kalduvad tugevalt atribuudi Type poole, eriti kui neil on vaja skriptide silte kasutada. HTML 5 abil saate oma tüüpe ravida, pigem eemaldada need üldse. Selle tulemusena muutub kood kirjeldavaks.

<link rel="stylesheet" href="path/to/stylesheet.css" />
<script src="path/to/script.js"></script>

Eespool esile tõstetud funktsioonide komplekti abil pole raske järeldada, et HTML5 on siin selleks, et muuta veebitehnoloogia sfääri kõige domineerivamal ja mõjukamal viisil. Ja see on juba käivitanud mõned Interneti kõige hämmastavamad veebisaidid ja teemad.

Suurepärased näited võimsatest HTML5 veebisaitidest

Järgmised näited toetavad veelgi tõsiasja, et HTML5 on siin selleks, et tekitada võimsaid muutustelaineid:

1 Ghost Writeri kunstistuudio

Ghost Writer Art Studio ei pruugi teie meelt segada, kuid see annab kindlasti tugeva avalduse tänu nutikatele kujundustele, mis on pehmelt öeldes meeldejäävad. HTML5 tööriistad on andnud sellele veetluse, mida on raske võrrelda.

2 Valpolicella Negrari veinitehast

Cantina Valpolicella Negrari veebisait loob meeleolu, mida on raske õlgu kehitada, pigem selline, mida soovite säilitada. HTML5 funktsioone kasutatakse kõige nutikamalt nende minimaalselt kujundatud veebisaitide jaoks, millel on maksimaalne mõju.

3 Waterloo: film

Veebisait ühendab teid otse lahingusse, ajamasinat pole vaja. See täidab oma ülesannet, andes teile suurepärase värvikasutuse, paigutuse, elementide paigutuse ja muuga suurepärase pilgu filmi sisule.

4 Zizzi

Kui te pole veel uskunud vanasse vanasõnasse: "Pilt räägib tuhat sõna", veenab see teid kindlasti. HTML5-l töötav Zizzi veebisait on suurepärane tunnistus, kuidas loovus koos võimsa platvormiga võib luua maagiat. See, mille on loonud mainekas agentuur Propeller Communications, tagab, et HTML5 geograafilise asukoha API funktsiooni kasutatakse ohtralt.

5 Vesilõuend

Ja siis on see! Water Canvas on hingematvalt ilus, kuid tähelepanu on pööratud ka veebisaidi reageerimisvõimele. Tekstuurid ja üldine paigutus sobivad piisavalt hästi, et see tükk silma paistaks.

6 Lardini

Lardini veebisaidil on piisavalt moodi, et rääkida enda ja kaubamärgi eest. HTML 5 andis oma disaineritele ja arendajatele tõepoolest terve komplekti tööriistu ja võimalusi, et rakendada oma loovust kõige vabamal ja võimsamal moel.

Need näited peaksid andma teile tõelise põhjuse pausiks ja veelgi suurendama seda kasvavat tõmmet HTML5 poole. midagi, mis hoiab veebiarendustehnoloogiat heas kohas.