際際滷

際際滷Share a Scribd company logo
HTML 5
By Dyah Noviati Kusumaningrum
PENGERTIAN, KONSEP ,SEJARAH DAN
FUNGSI HTML

Pengertian dan konsep HTML itu sendiri adalah bahasa
dari Worl Wide Web (www) yang dipergunakan utntuk
menyusun dan membentuk dokumen agar dapat
ditampilkan pada program web browser. HTML juga
dapat disebut sebagai protocol yang digunakan untuk
mentransfer data atau dokumen dari web server ke
browser.
HTML dibuat oleh kolaborasi Caillau TIM dengan
Berners-lee robert ketika mereka bekerja di CERN pada
tahun 1989 (CERN adalah lembaga penelitian fisika
energi tinggi di Jenewa).
Ada 2 fungsi utama dalam HTML yaitu :
1. Membentuk tata letak document, dalam hal ini
menentukan jenis huruf, gambar, dan komponen
dokumen lainnya.
2. Menentukan hubungan ke dokumen lain, HTML
merupakan suatu bahasa pemrograman yang termasuk
dalam kategori SGML (Standart Generalized Markup
Language) dimana bentuknya merupakan standar ASCII
yang berisi kode-kode untuk mengatur dokumen.
DEFINISI, SEJARAH DAN TUJUAN
HTML5

HTML5 adalah sebuah bahasa markah untuk menstrukturkan dan
menampilkan isi dari Waring Wera Wanua, sebuah teknologi inti
dari Internet. HTML5 adalah revisi kelima dari HTML yang
pertama kali diciptakan pada tahun 1990 dan versi keempatnya,
HTML4, pada tahun 1997) dan hingga bulan Juni 2011 masih
dalam pengembangan.
Tujuan utama pengembangan HTML5 adalah untuk memperbaiki
teknologi HTML agar mendukung teknologi multimedia terbaru,
mudah dibaca oleh manusia dan juga mudah dimengerti oleh
mesin.
PERBEDAAN HTML5, APLIKASI, FITURFITUR DALAM HTML5 DAN
IMPLEMENTASINYA

Beberapa peraturan untuk HTML5 telah ditubuhkan:
a)
Ciri-ciri baru perlu berdasarkan HTML, CSS, DOM, dan JavaScript
b)
Mengurangkan keperluan untuk plugins luaran (seperti Flash)
c)
Kesilapan yang lebih baik pengendalian
d)
Markup Lebih untuk menggantikan skrip
e)
HTML5 harus peranti bebas
f)
Proses pembangunan perlu dilihat kepada orang awam
Aplikasi HTML5
Dengan HTML5, pembangunan aplikasi web adalah lebih mudah
berbanding sebelum ini :
a)
Penyimpanan data Lokal
b)
Fail akses tempatan
c)
Tempatan SQL pangkalan data
d)
Cache aplikasi
e)
Javascript pekerja
f)
XHTML HttpRequest 2
Pengembangan pada HTML 5 meliputi fitur - fitur yang
telah di perbaharui dan diganti dengan yang lebih baik
seperti :

Canvas

Video dan Audio

Local Storage

Web Workers

Semantics
KELEBIHAN DAN MANFAAT SERTA
KEKURANGAN PENGGUNAAN HTML5

Manfaat dan kelebihan HTML5 antara lain :

Dukungan suara dan video

Peningkatan membentuk elemen objek

Geo-Lokasi

User-friendly interface
Kekurangan HTML5 adalah :
HTML5 tidak dapat diandalkan dalam hal format karena
web browser yang berbeda karena mereka tidak
mendukung salah satu format tunggal. diambil dari situs
orang pandai cerita
ELEMEN HTML5 YANG SERING DIGUNAKAN:
1. <header>
Elemen header sebagaimana dengan terjemahannya yang
berkaitan dengan kepala memiliki arti atas, bagian atas dari
dokumen, layout dlsb. Di dalam header ini bisa saja berisi elemen
lain seperti <hgroup>, <h1> sampai <h6>, <nav>, metadata
dlsb
2. <hgroup>
Elemen <hgroup> digunakan untuk title dan subtitle dengan tag
heading seperti <h1>-<h6>.
3. <nav>
Elemen baru ini digunakan untuk menu navigasi. <nav> dapat digunakan
diluar maupun didalam elemen lainnya, seperti didalam <aside> atau
<header> maupun <footer>.
4. <section>
Seperti <div> yang berfungsi sebagai box atau pengelompokan beberapa
elemen, akan tetapi sebenernya tidak sama dengan <div>. section adalah
elemen yang digunakan untuk ngelompokkan beberapa elemen yang sejenis.
5. <article>
Tag ini digunakan untuk menampilkan satu artikel penuh dalam halaman html.
Untuk memepermudah pemahaman, bayangkan saja perngertian dari artikel.
Artikel biasanya terdiri dari Judul, mungkin sub judul, catatan dan deskripsi.
6. <footer>
Tag <footer>, berlawanan arti dengan tag <header>. Tag ini memang
digunakan di bagian bawah sebuah halaman html dokumen maupun
didalam elemen html. Isi dari tag <footer> bisa berupa info konten
seperti copyright, author website atau navigasi.

7. <figure> dan <figcaption>
Menampilkan gambar dapat memanfaatkan tag <figure>, sedangkan tag
<figcaption> adalah caption dari gambar tersebut. Jika mengkiuti
aturan semantik yang sebenarnya <figure> ini digunakan untuk
menampilkan gambar dalam suatu artikel, dimana gambar terbut
berkaitan/ada hubungannya dengan konten artikel.
Bagian Head
Bagian head HTML5 digunakan untuk menyimpan berbagai
informasi mengenai isi dokumen tersebut. Paling sedikit, bagian head harus
mengandung judul dokumen. Judul dokumen ini diapit oleh tag <title> dan
</title> serta akan ditampilkan pada bagian title bar browser.
Selain judul dokumen, bagian head dapat mengandung informasi-informasi
berikut:
 Metadata: berisi berbagai data tambahan tentang dokumen HTML5 seperti
nama pengarang/penulis, tanggal publikasi, deskripsi isi dokumen, kata kunci,
dan lain-lain. Informasi ini dinyatakan oleh tag <meta> saja, tanpa tag
penutup </meta>.
 Base URL: menentukan basis lokasi untuk link-link yang ada pada dokumen.
Informasi ini dinyatakan oleh tag <base> saja, tanpa tag penutup </base>.
 Link: menentukan link ke dokuman lain yang terkait erat dengan dokumen
HTML5, misalnya skrip CSS yang digunakan dalam desain halaman web.
Informasi ini dinyatakan oleh tag <link> saja, tanpa tag penutup </link>.
 Objek: berisi informasi mengenai objek yang mungkin ada pada dokumen
HTML5. Objek yang mungkin terkandung pada dokumen HTML5 antara lain
adalah video, audio, dan animasi flash. Informasi ini dinyatakan dengan diapit
oleh tag <object> dan </object>.
 Skrip: berisi informasi mengenai skrip pemrograman yang mungkin ada pada
dokumen HTML5. Skrip pemrograman ini umumnya bersifat client-side
seperti JavaScript. Informasi ini dinyatakan dengan diapit oleh tag <script>
dan </script>.
 Style: berisi informasi mengenai desain halaman web dalam format CSS yang
langsung dituliskan di bagian head, bukan pada dokumen terpisah. Jika hendak
dituliskan pada dokumen terpisah, gunakan link. Informasi ini dinyatakan
dengan diapit oleh tag <style> dan </style>.
Bagian Body
Bagian body HTML5 merupakan bagian yang nantinya
diterjemahkan dan ditampilkan oleh browser. Di bagian inilah
terkandung berbagai tag yang menyatakan desain dokumen HTML. Jadi
bisa dibayangkan pastilah akan banyak terdapat tag HTML yang bisa
digunakan di bagian ini.
Yang pertama adalah paragraf. Sebuah dokumen yang terstruktur dengan
baik pastilah terdiri dari beberapa paragraf. Untuk memisahkan antara satu
paragraf dengan paragraf yang lain digunakan tag <p>. Tag ini harus ditutup
dengan pasangannya, yaitu </p>.
Untuk sekedar ganti baris tanpa ganti paragraf, digunakan tag <br>.
Karena tag ini tidak memiliki pasangan maka ditulis dengan <br />. Ganti baris
pada dokumen HTML5 perlu diberi tag sendiri karena meski pada kode HTMLnya ganti baris tetapi browser tidak akan menampilkannya pada baris terpisah.
THANKS

More Related Content

What's hot (17)

PDF
Dasar html
Reno Bastian Syah
PDF
Homepage untuk informasi dan komunikasi
Resa Firmansyah
PPT
Penggunaan html
Fajar Baskoro
PDF
Modul 2a html
Siigit Aziz
PPT
Mengelolaisihalamanweb1 (ind)
Sayugo
PPT
Pengenalan struktur elemen html
Deka M Wildan
PPTX
Html for xi grade
Julie Anggre
PDF
Langkah demi langkah menguasai html 5 (versi alpha)
T Ghazali
PDF
Webprograming
andreboys
PPTX
Ppt materi
Novita Cahyani
PPT
Mengenal Struktur Web dan Bahasa Pemerograman HTML
Nurdin Al-Azies
PPT
01 html
Amiroh S.Kom
PPSX
Pengenalan internet 10
Suparno Oke
PDF
Modul 2-form html-css
Fajar Baskoro
PPTX
Tugas 2 rekayasa web
Filsaf Kurniawan
DOC
Pertemuan1
Muhammad Romadhon
PPT
Introduction to xhtml
gueste0c708
Dasar html
Reno Bastian Syah
Homepage untuk informasi dan komunikasi
Resa Firmansyah
Penggunaan html
Fajar Baskoro
Modul 2a html
Siigit Aziz
Mengelolaisihalamanweb1 (ind)
Sayugo
Pengenalan struktur elemen html
Deka M Wildan
Html for xi grade
Julie Anggre
Langkah demi langkah menguasai html 5 (versi alpha)
T Ghazali
Webprograming
andreboys
Ppt materi
Novita Cahyani
Mengenal Struktur Web dan Bahasa Pemerograman HTML
Nurdin Al-Azies
01 html
Amiroh S.Kom
Pengenalan internet 10
Suparno Oke
Modul 2-form html-css
Fajar Baskoro
Tugas 2 rekayasa web
Filsaf Kurniawan
Pertemuan1
Muhammad Romadhon
Introduction to xhtml
gueste0c708

Similar to Html 5 (20)

PPTX
Html5 ppt
menghilang
PPTX
Html5 ppt
044249
PPTX
Ppt html5
rizki pradana
PPTX
Ppt html5
mutianb
PDF
Makalah html5
utia yahya
DOCX
Makalah html5
utia yahya
PPTX
PPT HTML5
utia yahya
PPTX
Makalah html5
utia yahya
PPTX
Makalah html5
utia yahya
PDF
Makalah html5
utia yahya
PDF
Makalah html5
utia yahya
DOCX
Html5
asutenankoe
PPTX
Ppt html5 rully_amrizal_1102412020
mutia902
DOCX
Html5
agus248
DOCX
Html 5
Ikhsan Harpendi
PDF
Fundamental HTML5
Achmad Solichin
PPTX
HTML5
ucienmapcu
PPTX
html
Keenandya
DOCX
Html 5
Sabbihis Maulana
PDF
Html5
Fajar Baskoro
Html5 ppt
menghilang
Html5 ppt
044249
Ppt html5
rizki pradana
Ppt html5
mutianb
Makalah html5
utia yahya
Makalah html5
utia yahya
PPT HTML5
utia yahya
Makalah html5
utia yahya
Makalah html5
utia yahya
Makalah html5
utia yahya
Makalah html5
utia yahya
Html5
asutenankoe
Ppt html5 rully_amrizal_1102412020
mutia902
Html5
agus248
Fundamental HTML5
Achmad Solichin
HTML5
ucienmapcu
html
Keenandya
Ad

Html 5

  • 1. HTML 5 By Dyah Noviati Kusumaningrum
  • 2. PENGERTIAN, KONSEP ,SEJARAH DAN FUNGSI HTML Pengertian dan konsep HTML itu sendiri adalah bahasa dari Worl Wide Web (www) yang dipergunakan utntuk menyusun dan membentuk dokumen agar dapat ditampilkan pada program web browser. HTML juga dapat disebut sebagai protocol yang digunakan untuk mentransfer data atau dokumen dari web server ke browser. HTML dibuat oleh kolaborasi Caillau TIM dengan Berners-lee robert ketika mereka bekerja di CERN pada tahun 1989 (CERN adalah lembaga penelitian fisika energi tinggi di Jenewa).
  • 3. Ada 2 fungsi utama dalam HTML yaitu : 1. Membentuk tata letak document, dalam hal ini menentukan jenis huruf, gambar, dan komponen dokumen lainnya. 2. Menentukan hubungan ke dokumen lain, HTML merupakan suatu bahasa pemrograman yang termasuk dalam kategori SGML (Standart Generalized Markup Language) dimana bentuknya merupakan standar ASCII yang berisi kode-kode untuk mengatur dokumen.
  • 4. DEFINISI, SEJARAH DAN TUJUAN HTML5 HTML5 adalah sebuah bahasa markah untuk menstrukturkan dan menampilkan isi dari Waring Wera Wanua, sebuah teknologi inti dari Internet. HTML5 adalah revisi kelima dari HTML yang pertama kali diciptakan pada tahun 1990 dan versi keempatnya, HTML4, pada tahun 1997) dan hingga bulan Juni 2011 masih dalam pengembangan. Tujuan utama pengembangan HTML5 adalah untuk memperbaiki teknologi HTML agar mendukung teknologi multimedia terbaru, mudah dibaca oleh manusia dan juga mudah dimengerti oleh mesin.
  • 5. PERBEDAAN HTML5, APLIKASI, FITURFITUR DALAM HTML5 DAN IMPLEMENTASINYA Beberapa peraturan untuk HTML5 telah ditubuhkan: a) Ciri-ciri baru perlu berdasarkan HTML, CSS, DOM, dan JavaScript b) Mengurangkan keperluan untuk plugins luaran (seperti Flash) c) Kesilapan yang lebih baik pengendalian d) Markup Lebih untuk menggantikan skrip e) HTML5 harus peranti bebas f) Proses pembangunan perlu dilihat kepada orang awam
  • 6. Aplikasi HTML5 Dengan HTML5, pembangunan aplikasi web adalah lebih mudah berbanding sebelum ini : a) Penyimpanan data Lokal b) Fail akses tempatan c) Tempatan SQL pangkalan data d) Cache aplikasi e) Javascript pekerja f) XHTML HttpRequest 2
  • 7. Pengembangan pada HTML 5 meliputi fitur - fitur yang telah di perbaharui dan diganti dengan yang lebih baik seperti : Canvas Video dan Audio Local Storage Web Workers Semantics
  • 8. KELEBIHAN DAN MANFAAT SERTA KEKURANGAN PENGGUNAAN HTML5 Manfaat dan kelebihan HTML5 antara lain : Dukungan suara dan video Peningkatan membentuk elemen objek Geo-Lokasi User-friendly interface Kekurangan HTML5 adalah : HTML5 tidak dapat diandalkan dalam hal format karena web browser yang berbeda karena mereka tidak mendukung salah satu format tunggal. diambil dari situs orang pandai cerita
  • 9. ELEMEN HTML5 YANG SERING DIGUNAKAN: 1. <header> Elemen header sebagaimana dengan terjemahannya yang berkaitan dengan kepala memiliki arti atas, bagian atas dari dokumen, layout dlsb. Di dalam header ini bisa saja berisi elemen lain seperti <hgroup>, <h1> sampai <h6>, <nav>, metadata dlsb 2. <hgroup> Elemen <hgroup> digunakan untuk title dan subtitle dengan tag heading seperti <h1>-<h6>.
  • 10. 3. <nav> Elemen baru ini digunakan untuk menu navigasi. <nav> dapat digunakan diluar maupun didalam elemen lainnya, seperti didalam <aside> atau <header> maupun <footer>. 4. <section> Seperti <div> yang berfungsi sebagai box atau pengelompokan beberapa elemen, akan tetapi sebenernya tidak sama dengan <div>. section adalah elemen yang digunakan untuk ngelompokkan beberapa elemen yang sejenis. 5. <article> Tag ini digunakan untuk menampilkan satu artikel penuh dalam halaman html. Untuk memepermudah pemahaman, bayangkan saja perngertian dari artikel. Artikel biasanya terdiri dari Judul, mungkin sub judul, catatan dan deskripsi.
  • 11. 6. <footer> Tag <footer>, berlawanan arti dengan tag <header>. Tag ini memang digunakan di bagian bawah sebuah halaman html dokumen maupun didalam elemen html. Isi dari tag <footer> bisa berupa info konten seperti copyright, author website atau navigasi. 7. <figure> dan <figcaption> Menampilkan gambar dapat memanfaatkan tag <figure>, sedangkan tag <figcaption> adalah caption dari gambar tersebut. Jika mengkiuti aturan semantik yang sebenarnya <figure> ini digunakan untuk menampilkan gambar dalam suatu artikel, dimana gambar terbut berkaitan/ada hubungannya dengan konten artikel.
  • 12. Bagian Head Bagian head HTML5 digunakan untuk menyimpan berbagai informasi mengenai isi dokumen tersebut. Paling sedikit, bagian head harus mengandung judul dokumen. Judul dokumen ini diapit oleh tag <title> dan </title> serta akan ditampilkan pada bagian title bar browser. Selain judul dokumen, bagian head dapat mengandung informasi-informasi berikut: Metadata: berisi berbagai data tambahan tentang dokumen HTML5 seperti nama pengarang/penulis, tanggal publikasi, deskripsi isi dokumen, kata kunci, dan lain-lain. Informasi ini dinyatakan oleh tag <meta> saja, tanpa tag penutup </meta>. Base URL: menentukan basis lokasi untuk link-link yang ada pada dokumen. Informasi ini dinyatakan oleh tag <base> saja, tanpa tag penutup </base>. Link: menentukan link ke dokuman lain yang terkait erat dengan dokumen HTML5, misalnya skrip CSS yang digunakan dalam desain halaman web. Informasi ini dinyatakan oleh tag <link> saja, tanpa tag penutup </link>.
  • 13. Objek: berisi informasi mengenai objek yang mungkin ada pada dokumen HTML5. Objek yang mungkin terkandung pada dokumen HTML5 antara lain adalah video, audio, dan animasi flash. Informasi ini dinyatakan dengan diapit oleh tag <object> dan </object>. Skrip: berisi informasi mengenai skrip pemrograman yang mungkin ada pada dokumen HTML5. Skrip pemrograman ini umumnya bersifat client-side seperti JavaScript. Informasi ini dinyatakan dengan diapit oleh tag <script> dan </script>. Style: berisi informasi mengenai desain halaman web dalam format CSS yang langsung dituliskan di bagian head, bukan pada dokumen terpisah. Jika hendak dituliskan pada dokumen terpisah, gunakan link. Informasi ini dinyatakan dengan diapit oleh tag <style> dan </style>.
  • 14. Bagian Body Bagian body HTML5 merupakan bagian yang nantinya diterjemahkan dan ditampilkan oleh browser. Di bagian inilah terkandung berbagai tag yang menyatakan desain dokumen HTML. Jadi bisa dibayangkan pastilah akan banyak terdapat tag HTML yang bisa digunakan di bagian ini. Yang pertama adalah paragraf. Sebuah dokumen yang terstruktur dengan baik pastilah terdiri dari beberapa paragraf. Untuk memisahkan antara satu paragraf dengan paragraf yang lain digunakan tag <p>. Tag ini harus ditutup dengan pasangannya, yaitu </p>. Untuk sekedar ganti baris tanpa ganti paragraf, digunakan tag <br>. Karena tag ini tidak memiliki pasangan maka ditulis dengan <br />. Ganti baris pada dokumen HTML5 perlu diberi tag sendiri karena meski pada kode HTMLnya ganti baris tetapi browser tidak akan menampilkannya pada baris terpisah.