HTML5 Dan CSS3

HTML5

HTML5 adalah versi terbaru dari bahasa pemrograman markup ini, Sejak versi terdahulu HTML pada tahun 1999, web telah banyak perubahan, maka dari itu Word Wide Web Consortium(W3C) bekerja sama dengan Hypertext Application Technology Working Group (WHATWG) menciptakan HTML versi baru yaitu HTML5 yang akan menjadi standar baru untuk HTML(Hyper Text Markup Language) itu sendiri serta XHTML ( EXtensible HyperText Markup Language), dan DOM HTML (Document Object Model Hyper Text Markup Language).

Beberapa fitur terbaru yang menarik dari HTML5 yaitu unsur kanvas untuk menggambar, video dan audio untuk media pemutaran, dukungan yang lebih baik untuk penyimpanan offline local, elemen-elemen baru tertentu, seperti artikel, footer, header, nav, serta bentuk control baru, seperti kalender, tanggal, dan waktu.

HTML5 belum standar resmi, dan tidak ada browser yang memiliki dukungan penuh terhadap HTML5. Tapi semua browser utama (Safari, Chrome, Firefox, Opera, Internet Explorer ) terus menambahkan fitur HTML5 ke dalam versi barunya.

Video

Dengan HTML5 menampilkan video menjadi lebih mudah dengan tag video saja tidak memerlukan plugin khusus.Sampai saat ini HTML5 hanya dapat menampilakan video berformat MPG4,Ogg,WebM yang ukurannya dapat sesuaikan dengan mudah

<video width="400" height="288" controls="controls">

      <source src="D:\video1.mp4" type="video/mp4"/>

</video>

Audio

Untuk memutar audio dapat menggunakan Tag <audio> da nada beberapa atribut yang dapat digunakan antara lain autoplay, control, loop, preload dan src.

<audio src="D:\SEAMOLEC\HTML5\lagu1.mp3" controls="controls"></audio>

Header
Untuk membuat header sekarang dipermudah dengan adanya tag <header>

<header>

<h1> SEAMEO SEAMOLEC </h1>

<p> To be a center of expertise in open and distance learning </p>

</header>

Footer
ada header ada juga footer, footer pun dipermudah dengan adanya tag <footer>

<footer>Dokumen Pelatihan ini di buat pada tahun 2011</footer>

Nav
Nav merupakan fungsi navigasi yang telah dipermudah pemakaiannya dengan menggunakan tag <tag>

<nav>

<a href="http://www.seamolec.org">HOME</a>

<a href="http://www.facebook.com">Lanjut</a>

<a href="http://www.yahoo.com">Kembali</a>

</nav>

untuk mengetahui web brwoser kamu udah support HTML5 tau belum bisa di cek di alamat ini HTML5 Web Browser Compare

CSS3
Cascading Style Sheet 3 (CSS3) adalah versi terbaru dari css yang digunakan unutk memperindah tampilan dan tata letak web. Sebagian besar web browser sudah mendukung CSS3 kecuali IE. CSS3 dibagi menjadi beberapa fungsi untuk membatasi desainnya, yaitu:

• Selektor
• Kotak Model
• Latar belakang dan Border
• Efek text
• 2D/3D Tranformasi
• Animasi
• Bebenrapa kostum layout
• User Interface

Border

Ada beberpa macam border baru pada CSS3 yaitu border radius, shadow, dan image.

Border Radius

Border Shadow

Border dengan gambar

Text Effect

Untuk mempermanis tampilan text ditambah beberapa effect pada text di CSS3

Text Overflow

Text Shadow

Untuk mempermudah membuat CSS3 code kamu bisa googling ja dengan key "CSS3 code generator". Ada banyak situs yang menyediakan script2 CSS3 yang keren - keren untuk mempercantik web anda.

ex : CSS3 Generator

Selamat mencoba

Semoga membantu =)