Skäl för dig att byta till HTML5 och exempel som ytterligare förespråkar det

10

HTML5 är en virtuos del av innovation och är verkligen en teknik som har gett nytt blod till genren för webbutveckling. Oavsett om du vill att din webbplats ska ståta med formskiftande funktioner eller om du vill att den ska visa en överväldigande vacker visuell attraktionskraft, gör HTML5 jobbet åt dig, och det på ett mycket formidabelt sätt.

Även om den här plattformen gjorde sitt intåg i webbutvecklingssfären för ett tag sedan, finns det ingen brist på webbansvariga som inte har den på sin lista över "top 3 föredragna verktyg" när det gäller att bygga en webbplats. Och en stor del av dessa webbansvariga använder redan andra plattformar för sin webbplats, och gör därmed kompromisser med en rad funktioner som HTML5 kunde ha integrerat deras webbplatser.

1 Det ger fria tyglar till de kreativa själarna

Innovation är kännetecknet för de största formgivarna och utvecklarna, och när det kommer ett verktyg som låter dem utöva sin kreativitet utan gränser, måste det godkännas. HTML5 passar perfekt, och på det sundaste sättet. Som ett ramverk för webbutveckling är HTML5 super anpassningsbart, vilket gör att designande proffs kan uttrycka sig själva. Så när det är på din agenda att vara före kurvan är HTML5-vagnen där för att fånga.

2 Det mycket förbättrade videostödet är till för att ta vara på

Videostödet har förbättrats avsevärt med den nya HTML5-inbäddningsvideon för webbläsarna. Eftersom inte alla webbläsare stöder olika format som H.264 måste du använda följande när du vill visa en HTML5-video:

<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 Det låter dig skapa webbplatser "för mobil", istället för att tvinga dig att skapa flera versioner

Logga in på din webbplats analys, skrapa lite på ytan och observera de OS-plattformar du får de flesta av dina besök från. Du kommer att bli förvånad över att se att majoriteten av dina besök kommer från mobilanvändarna, till skillnad från de siffror som fanns för ett år sedan, då du förmodligen hade fler datoranvändare på din webbplats. Att göra en webbsida för mobilen är alltså mycket mer att rekommendera än att göra en skrivbordscentrerad webbplats och sedan skapa en mobilvänlig version av densamma. Och HTML5 gör det till en mycket effektiv övning att skapa webbplatser som är anpassade för mobila enheter som behåller sin okulära tilltalande när de öppnas på mindre skärmar och anpassar sig till den minskade storleken utan att slänga kompatibilitets- eller responsproblem åt dig.

4 invecklade XHTML doctype ger plats för en enklare, mindre krånglig version

För att uttrycka det utan tvekan, har XHTML doctype inte setts passionerat av utvecklarnas community. Och anledningen till detsamma är mer än tydlig med hur det skrivs som:

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

HTML5 har gjort deklarationen mycket kortare och mer begriplig för utvecklarna:

<!DOCTYPE html>
5 attribut kan upptäckas mer intuitivt

Först och främst bör de attribut du använder i ditt program sömlöst kunna avgöra om de upptäcks på lämpligt sätt av webbläsarna. HTML5 ger dessa attribut möjlighet att göra exakt det. Med Modernizr visar sig biblioteket vara ett fyndigt verktyg men det finns andra sätt som att skapa elementen innan de dissekeras. På så sätt blir det enkelt att utvärdera webbläsarens förmåga.

6 Det har sin uppsättning korrigeringar för IE

Nåväl, Internet Explorer ses ganska ohälsosamt av Internet-gemenskapen över hela världen, och av mycket motiverande skäl. Som förväntat har IE sina egna problem med att hantera de nya elementen som HTML 5 häller in. Därför är det viktigt att utforma dessa element på ett sätt så att de blir mer begripliga för den här webbläsaren för att ge en känsla av struktur till hur HTML5-elementen är justerade som blocknivåelement:

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

Nu finns det alla möjligheter att Internet Explorer kommer att fortsätta att vara jobbigt eftersom det kanske inte är ordentligt bekant med rubrikelementet. Så, stylingen i HTML5 riskerar att bli uppenbart ignorerad. Som sagt, det finns en enkel lösning för detsamma:

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

Geolokalisering är onekligen fångstfunktionen i HTML5. Vad den gör är att den kastar åt dig de matematiska värdena som representerar koordinaterna för din användares plats. Dessa platskoordinater beräknas med hjälp av webbläsaren som besökaren använder för att komma åt webbplatsen.

8-kod som är rörig och mycket mer begriplig

Det rekommenderas alltid att skriva program som är rena, lätta att förstå och skrivna på ett sätt som är mest återanvändbart. HTML5 gör allt detta möjligt, och mer genom att underlätta en kod som är mycket synkron, semantisk och ger dig friheten att dra en gräns mellan stil och innehåll så att de lätt kan förstås. En standardhuvudkod med navigering ser ut så här:

<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>

Även om du kanske hävdar att koden är enkel nog, men låt oss se vad HTML5 kan göra med den:

<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>

Tydligen lägger HTML5 till en hel del känsla för struktur till hela koden genom att göra den mer förtydligande och använda HTML-rubriker som bättre representerar ditt innehåll.

9 Du behöver inte ta itu med ‘Typ’ för skript och länkar

Det finns ingen brist på webbutvecklare som lutar sig mycket mot attributet Type, särskilt när de behöver utnyttja skriptets taggar. Med HTML 5 kan du bota dina typer, hellre ta bort dem helt och hållet. Koden blir som ett resultat beskrivande.

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

Med den uppsättning funktioner som markerats ovan är det inte svårt att sluta sig till att HTML5 är här för att förändra webbteknologisfären på ett sätt som är mest dominerande och inflytande. Och det har redan drivit några av de mest fantastiska webbplatserna och teman på Internet.

Utmärkta exempel på kraftfulla HTML5-webbplatser

Följande exempel förespråkar ytterligare att HTML5 är här för att skapa kraftfulla vågor av förändring:

1 Ghost Writer Art Studio

Ghost Writer Art Studio kanske inte förvirrar ditt sinne, men det kommer säkert att göra ett starkt uttalande, tack vare de smarta designerna som råkar vara minst sagt catchy. HTML5-verktygen har gett den en överklagande som är svår att matcha.

2 Valpolicella Negrar vingård

Webbplatsen för Cantina Valpolicella Negrar skapar en stämning som är svår att släppa på axlarna, snarare en känsla du vill hålla kvar. HTML5-funktionerna används mest intelligent för dessa minimalt designade webbplatser som ger maximal effekt.

3 Waterloo: The Film

Webbplatsen kopplar dig direkt in i striden, inget behov av tidsmaskin. Den gör sitt jobb med att ge dig en inblick i vad filmen handlar om mycket bra med sin fina användning av färger, layout, positionering av element och mer.

4 Zizzi

Om du ännu inte tror på det urgamla ordspråket, "en bild säger mer än tusen ord", kommer den här definitivt att övertyga dig. Drivs av HTML5, webbplatsen för Zizzi är ett fint bevis på hur kreativitet i kombination med en kraftfull plattform kan skapa magi. Skapat av den välrenommerade byrån Propeller Communications, den här ser till att Geolocation API-funktionen i HTML5 används rikligt.

5 Vattenduk

Och så är det det! Water Canvas är hisnande vackert, men fokus har också dragits på webbsidans responsivitet. Texturerna och den övergripande layouten kombineras tillräckligt bra för att få den här biten att sticka ut.

6 Lardini

Lardini-webbplatsen har tillräckligt med mode för att tala för sig själv och för varumärket. HTML 5 gav verkligen sina designers och utvecklare en hel ensemble av verktyg och möjligheter att utöva sin kreativitet på det mest frigående och potenta modet.

Dessa exempel bör ge dig en autentisk anledning till paus och ytterligare öka denna växande dragning mot HTML5; något som bara kommer att hålla webbutvecklingstekniken till godo.

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More