Cara membuat web seluruhnya memakai html5 full htm5

,

Gambar 0.1 HTML5 logo.

Html5...????? Apa itu HTML5 , html5 adalah html yang kelima hehe, bisa jadi sih. tapi arti yg benar yaitu HTML5 adalah suatu spesifikasi atau standard yang dikeluarkan oleh W3C (World Wide Web Consortium) sebagai revisi dari standard HTML. Saat ini ditulis kita banyak menjumpai aplikasi web yang masih menggunakan standard HTML4 namun beberapa sudah mulai migrasi ke standard web HTML5. revisi /perbaikan jadi yg pasti HTML5 ini lebih unggul dalam segala hal. penulisan kode yang lebih sederhana.
contoh <header>bla bla bla</header> mudah dan gampang dan untuk css berarti:
header{background:red}
css juga mudah. misal kalo pake html biasa kaya gini:

<div id='header' class='header'> bla bla bla</div>

lebih lama penulisannya karena lebih panjang.

Nah itu contoh penulisan html biasa dan HTML5. untuk itu yuk sama2 blognya di gabri dengan HTML5 yang lebih simple dab mungkin lebih seo friendly. blog saya sudah full html5 karena seluruh script saya rangkau sendiri jadi bisa diatur sesuka hati saya. oke berikut contoh script web HTML5:


<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'/>
<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>
<title> Halaman full HTML5 - VeriAsha </title>
<![if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]
>
<style>
*{margin:0;padding:0}
body{line-height:1}
header, footer{padding:10px 20px}
nav, article, aside{padding:20px}
header, nav, article, aside{
border-bottom:1px solid #ddd
}
</style>
</head>
<body>

<header>
<h1>VeriAsha</h1>
<p>Tutorial web desainer</p>
</header>

<nav>
<div class='menu'>
<ul>
<li>Lorem</li>
<li>Ipsum</li>
<li>Dolor</li>
<li>Amet</li>
</ul>
</div>
<div class='search'>
<form action='/search' method='get'>
<input type='text' placeholder='Search...'/>
<input type='submit' value='Search'/>
</form>
</div>
</nav>

<article>
<h1> Contoh post title </h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Summum ením bonum exposuit vacuitatem doloris; Non est igitur summum malum dolor. Duo Reges: constructio interrete. Contineo me ab exemplis. Tum Lucius: Mihi vero ista valde probata sunt, quod item fratri puto. Sic consequentibus vestris sublatis prima tolluntur. Sit enim idem caecus, debilis. Itaque sensibus rationem adiunxit et ratione effecta sensus non reliquit. Non enim ipsa genuit hominem, sed accepit a natura inchoatum. Ergo id est convenienter naturae vivere, a natura discedere.

Quae quo sunt excelsiores, eo dant clariora indicia naturae. Ut optime, secundum naturam affectum esse possit. Haec dicuntur fortasse ieiunius; Gerendus est mos, modo recte sentiat. Audax negotium, dicerem impudens, nisi hoc institutum postea translatum ad philosophos nostros esset. Tum mihi Piso: Quid ergo? Ne in odium veniam, si amicum destitero tueri.

Nec vero alia sunt quaerenda contra Carneadeam illam sententiam. Quae iam oratio non a philosopho aliquo, sed a censore opprimenda est. Zenonis est, inquam, hoc Stoici. Quid ergo attinet gloriose loqui, nisi constanter loquare? Non dolere, inquam, istud quam vim habeat postea videro; Dic in quovis conventu te omnia facere, ne doleas. Cur igitur easdem res, inquam, Peripateticis dicentibus verbum nullum est, quod non intellegatur? Deinde disputat, quod cuiusque generis animantium statui deceat extremum.
</p>
</article>

<aside>
<div class='container'>
<h2>Post Populer</h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Summum ením bonum exposuit vacuitatem doloris; Non est igitur summum malum dolor. Duo Reges: constructio interrete. Contineo me ab exemplis. Tum Lucius: Mihi vero ista valde probata sunt, quod item fratri puto. Sic consequentibus vestris sublatis prima tolluntur. Sit enim idem caecus, debilis. Itaque sensibus rationem adiunxit et ratione effecta sensus non reliquit. Non enim ipsa genuit hominem, sed accepit a natura inchoatum. Ergo id est convenienter naturae vivere, a natura discedere.
</p>
</div>
<div class='container'>
<h3>Label</h3>
<ul>
<li>Lorem</li>
<li>Ipsum</li>
<li>Dolor</li>
<li>Amet</li>
</ul>
</div>
</aside>

<footer>
Copyright © 2017 <a href='/'>VeriAsha</a>
</footer>

</body>
</html>



Simple kan. kalo menurut saya sih simple dan sederhana. maklum biasa liat yang ruwet2. semoga membantu sobat. trimakasih.

Tidak ada komentar:

Posting Komentar

Maaf, fitur koment hanya untuk pengguna akun goggle saja.
Dikarenakan untuk meminimalisir komentar spam.