SlideShare una empresa de Scribd logo
1 de 18
HTML 
DI SUSUN OLEH : 
Siti Nur Aisyah 
2114R0797 
Teknik Infomatika
PENGERTIAN HTML 
HTML merupakan singkatan dari Hypertext Markup 
Language. HTML digunakan untuk membangun halaman web. 
HTML digunakan untuk melakukan mark-up (penandaan) 
terhadap sebuah dokumen teks. Tanda tersebut digunakan 
untukmenentukan format atau style dari teks yang ditandai 
halaman web dibangun oleh kode-kode HTML. 
HTML adalah bahasa markup yang umum digunakan. 
Kepopuleran HTML disebakan karena HTML ini mudah 
digunakan. Pembuatan dokumen web dengan HTML dapat 
dilakukan dengan mudah dan cepat. Dokumen web dapat tersaji 
dengan cepat ke banyak pembaca di seluruh dunia sekaligus. 
HTML mudah melakukan kontrol terhadap tampilan halaman web 
baik berupa teks, gambar, suara, animasi maupun video.
SEJARAH HTML 
Hypertext Markup Language (HTML) adalah bahasa yang digunakan untuk 
menulis halaman web. HTML merupakan pengembangan dari standar 
pemformatan dokumen teks yaitu Standard Generalized Markup Language 
(SGML). HTML sebenarnya adalah dokumen ASCII atau teks biasa, yang 
dirancang untuk tidak tergantung pada suatu sistem operasi tertentu. 
HTML dibuat oleh Tim Berners-Lee ketika masih bekerja untuk CERN dan 
dipopulerkan pertama kali oleh browser Mosaic. Selama awal tahun 1990 HTML 
mengalami perkembangan yang sangat pesat. Setiap pengembangan HTML pasti 
akan menambahkan kemampuan dan fasilitas yang lebih baik dari versi 
sebelumnya. Namun perkembangan resmi dikeluarkan pada bulan November 
1995 oleh IETF (Internet Engineering Task Force). 
HTML 2.0 ini merupakan penyempurnaan dari HTML+ (1993). 
HTML 3.0 (1995) memberikan kemampuan lebih daripada versi sebelumnya. 
Sebuah usaha dari World Wide Web Consortium’s (W3C) HTML Working Group 
pada tahun 1996 menghasilkan HTML 3.2. HTML versi ini secara resmi diterbitkan 
pada bulan Januari 1997. HTML versi terbaru adalah HTML 4.01 yang dikeluarkan 
secara resmi oleh W3C pada tanggal 24 April 1998. HTML merupakan perbaikan 
dari HTML 4.0 yang lebih dulu diterbitkan. (18 Desember 1997).
PERKEMBANGAN HTML 
Pada tahun 1980 IBM mulai untuk mengembangkan sebuah 
bahasa pemograman dimana text dan format sebuah dokumen 
dijadikan satu dalam bahasa pemrograman yang sering kita 
sebut sebagai HTML (Hyper Text Markup Language) akan tetapi 
pada saat itu pihak IBM memberikan sebuah nama GML 
(Generalized Markup Language). 
Pada tahun 1986 ISO mengeluarkan sebuah standarisasi 
tentang bahasa pemograman tersebut dan menyatakan sebuah 
nama baru dari GML tersebut dengan sebutan SGML (Standard 
Generalized Markup Language). 
Pada tahun kelahiran saya yaitu tahun 1989, Sebuah nama 
HTML muncul dari pemikiran Caillau Tim yang bekerja sama 
dengan Banners Lee Robert yang ketika itu masih bekerja di CERN 
memulai mengembangkan bahasa pemrograman ini, dan 
dipopulerkan pertama kali dengan browser Mosaic. Nah mulailah 
dari tahun 1990 HTML sangat berkembang dengan cepat hingga 
mencapai versi HTML versi 5.0 yang digarap pada 4 Maret 2010 
kemarin oleh W3C
 HTML versi 1.0 ini adalah versi pertama sejak lahirnya nama html 
tersebut, memiliki sebuah kemampuan untuk heading, paragraph, 
hypertext, bold dan italic text, wrapping serta memiliki dukungan 
dalam peletakan sebuah gambar. 
 HTML versi 2.0 pada 14 Januari 1996, pada versi ini ada beberapa 
tambahan kemampuan diantaranya penambahan form 
comment, hal ini menyebabkan adanya sebuah interaktif dan 
mulai dari versi ini yang menjadikan sebuah pioneer dalam 
perkembangan homepage interaktif. 
 Tak lama kemudian HTML versi 3.0 dirilis pada 18 Desember 1997 
yang sering disebut sebut sebagai HTML+ yang mempunyai 
kemampuan dalam beberapa fasilitas diantaranya adalah 
penambahan fitur table dalam paragraph, akan tetapi versi ini 
tidak bertahan lama. 
 Dan pada bulan Mei 1996 dikeluarkan versi baru sebagai 
pengganti dan penyampurnaan versi 3.0 ini yaitu HTML versi 3.2, 
keluarnya versi ini dikarenakan adanya beberapa kasus yang 
timbul pada pengembang browser yang telah melakukan 
pendekatan dengan cara lain yang justru hal tersebut menjadi 
popular, maka di bakukan versi 3.2 untuk mengakomodasi 
praktek yang banyak digunakan oleh pengembang browser dan 
diterima secara umum, dapat dikatakan bahwa versi 3.2 ini 
merupakan versi 3.0 yang dikembangkan oleh beberapa 
pengembang browser seperti Netscape dan Microsoft.
 Terakhir perombakan terjadi pada tahun 1999 
tepatnya tanggal 24 Desember yaitu HTML versi 4.0, 
seperti yang kita kenal HTML pada saat ini 
penambahan link, meta, imagemaps , image dan 
lain lain sebagai penyempurnaan versi 3.2 
 Pada tanggal 4 Maret 2010, terdapat sebuah 
informasi bahwasanya HTML versi 5.0 masih 
dikembangkan oleh W3C (World Wide Web 
Consortium) dan IETF (Internet Engineering Task 
Force) yaitu sebuah organisasi yang menangani 
HTML sejak versi 2.0
MENDESAIN HTML 
Mendesain HTML dapat dilakukan dengan dua cara, yaitu : 
 Menggunakan HTML Editor, seperti Microsoft FrontPage, Adobe 
Dreamweaver, dan lain-lain. Dapatkan editor HTML lainnya disini. 
Cara ini kelebihannya adalah HTML Editor merupakan sebuah 
program yang khusus didesain untuk membuat, melakukan editing bahkan 
mem-publish ke internet. Dengan kemampuannya menggabungkan 
kemudahan dan kecanggihan teknologi internet ke dalam dokumen HTML 
maka cara ini sangat disukai oleh para pemula dan desainer yang tidak 
ingin belajar lebih mendalam mengenai HTML. 
 Dengan cara menuliskan sendiri secara manual satu persatu tag-tag HTML 
ke dalam dokumen HTML. 
cara ini adalah menuliskan secara manual satu persatu tag-tag 
HTML. Hal ini sangat disarakan sulit dikarenakan akan memakan tenaga 
dan waktu ekstra untuk melakukannya, ditambah lagi Anda harus 
melakukan cara-cara konvensional untuk melihat hasilnya pada web 
browser. Namun pada cara kedua adalah dasar dari segala bentuk HTML 
yang akan Anda pelajari, karena dengan cara itulah Anda akan lebih 
paham mengenai cara kerja dan berbagai perintah yang biasa dipakai 
pada bahasa HTML.
KELEBIHAN HTML 
Merupakan bahasa penkodean yang lintas platform (cross 
platform), maksudnya HTML dapat digunakan pada berbagai 
jenis mesin komputer yang berbeda dan berbagai macam 
sistem operasi yang berbeda. Jadi bersifat fleksibel karena 
ditulis cukup dengan menggunakan editor karakter ASCII. 
 Dapat disisipi gambar baik gambar statis atau dinamis 
(animasi) termasuk menggunakan gambar untuk dijadikan 
hyperlink. Gambar di sini digunakan untuk merujuk pada suatu 
halaman web, dimana setiap titik-titik yang sudah didefinisikan 
berupa rectangular (kotak), poligon (kurva tak beraturan) atau 
lingkaran digunakan untuk ‘jump’ ke halaman lain, atau link ke 
halaman di luar web yang bersangkutan. 
 Dapat disisipi animasi berupa Java Applet atau file-file animasi 
dari Macromedia Flash atau Macromedia Shockwave (untuk 
keperluan ini, browser harus memiliki plug-in khusus untuk 
menjalankan file-file animasi ini).
Dapat disisipi bahasa pemrograman untuk 
mempercantik halaman web seperti Javascript, 
VBScript, Active Server Pages, Perl, Tcl, PHP 
dan sebagainya. 
Bukan merupakan bahasa pemrograman jadi 
tidak memerlukan kompiler. Cara 
menjalanakannya cukup dengan menggunakan 
browser.
KEKURANGAN DARI HTML 
 Menghasilkan halaman yang statis, yang saya tahu untuk 
memperoleh halaman yang dinamis harus menggunakan 
bahasa pemrograman tertentu seperti Javascript atau 
VBScript dan animasi seperti Flash atau Shockwave. 
 Memiliki tag-tag yang begitu banyak sehingga susah dipelajari 
untuk yang masih awam. 
 Tidak dapat menghasilkan halaman yang interaktif. Interaktif 
di sini maksudnya client dapat berinteraksi dengan server. 
Untuk keperluan itu, HTML harus disisipi bahasa 
pemrograman yang dapat menangani hal tersebut, contohnya 
Perl atau Tcl.
TAG HTML 
Tag adalah penanda atau teks khusus yang berguna 
untuk menandai elemen-elemen dalam halaman html 
dengan simbol lebih kecil dari "<" dan lebih besar dari ">", 
semua tag harus di apit oleh dua simbol "<" ">". Secara 
umum tag ditulis berpasangan, yaitu tag pembuka dan tag 
penutup. Tag pembuka menandakan awal dari elemen 
sebagai contoh <body> dan tag penutup menandakan 
akhir dari elemen, untuk penulisan tag akhir ada 
penambahan karakter "/" setelah karakter "<" sebagai 
</body>, inilah bentuk tag berpasangan dalam html. 
Meskipun demikian, ada beberapa elemen dalam 
halaman html yang tidak berpasangan seperti tag <br> 
dan lain-lain.
TAG DASAR HTML 
HTML 
Memberitahukan pada browser bahwa dokumen web yang 
digunakan adalah HTML.Untuk penulisannya : 
<html> "Tag pembuka html di letakkan pada awal dokumen" 
........ 
</html> "Tag penutup html di letakkan pada akhir dokumen" 
Head 
Kepala dokumen html atau tentang dokumen yang akan 
ditampilkan 
Penulisan : 
<head> "Tag pembuka head di letakkan pada awal setelah tag 
<html>" 
........ 
</head> "Tag penutup head di letakkan di akhir section head"
Pada bagian head akan mengerjakan tugas-tugas sebagai 
berikut : 
 Menyediakan judul dokumen 
 Menjembatani hubungan antar dokumen 
 Memberitahu browser untuk membuat form pencarian 
 Menyediakan metode untuk mengirim pesan ke tipe browser 
Body 
Menampilkan isi dokumen html. Penulisannya : 
<body> "Tag pembuka body terletak di bawah tag penutup 
</head>" 
........ 
</body> "Tag penutup </body> terletak di atas tag penutup 
</html>" 
Setiap ada tag pembuka maka harus ada tag penutup yang 
ditandai dengan tanda "/". Contoh :<title></title>, <body> 
</body>,<html></html>.
Antara tag <title> </title> digunakan untuk menulis judul 
halaman web yang bersangkutan. Contohnya adalah tulisan 
"ahmadamirudin.jw.lt" yang ada pada pojok kiri atas halaman 
ini maka penulisannya menjadi : 
<html> 
<head> 
<title>ahmadamirudin.jw.lt 
</title> 
</head> 
<body> 
</body> 
</html> 
Sedangkan antara tag <body> </body> digunakan untuk 
mengisi apa yang akan ditampilkan pada halaman anda, bisa 
berupa tulisan, gambar, link dan sebagainya.
Adapun beberapa tambahan yang dapat ditambahkan pada 
tag <body> adalah sebagai berikut: 
Meberikan warna background pada halaman web : 
<body bgcolor="blue"> 
Atau dapat juga menggunakan kode warna Hexa (RGB /red-green- 
blue) yang terdiri dari 6 karakter yang terdiri dari gabungan 
angka dan huruf, dan penulisannya juga harus diawalai dengan 
tanda "#"(pagar). 2 karakter pertama mewakili warna merah yang 
dimulai dari paling rendah 00 sampai paling tinggi ff, atau bisa juga 
kombinasi huruf dan angka tadi. Begitu juga 2 karakter berikutnya 
mewakili warna hijau dan 2 karakter berikutnya mewakili warna 
biru. 
contoh penulisan kode untuk warna hitam #000000, putih #ffffff, 
merah #ff0000, abu-abu #d3d3d3 dan lain lain sesuai dengan 
keinginan anda. 
Memberikan background gambar 
<body background="gambar.jpg"> 
Penulisan format gambar juga harus disertakan seperti *.jpg, 
*.gif, *.bmp dan lain-lain
Jika ingin menginginkan warrna background transparan 
maka ditulis dengan : 
<body bgcolor="transparent"> 
Memberikan warna teks 
<body text="#000000"> 
Mengatur margin halaman 
<body leftmargin="20" topmargin="20"> 
Mengatur warna link 
<body link="#ff0000"vlink="#00ff00" 
alink="#0000ff"> 
Dan jika semuanya ditulis bersamaan maka menjadi : 
<body bgcolor="blue"text="#000000" 
leftmargin="20" topmargin="20" 
link="#ff0000"vlink="#00ff00"alink="#0000ff">
STRUKTUR DASAR HTML
Sekian Dan Terima Kasih 
Semoga Bermanfaat 
DOSEN PENGAMPU

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

CSS Layouting #3 : Box Model
CSS Layouting #3 : Box ModelCSS Layouting #3 : Box Model
CSS Layouting #3 : Box Model
 
Laporan pembuatan aplikasi my so untuk android ppt
Laporan pembuatan aplikasi my so untuk android pptLaporan pembuatan aplikasi my so untuk android ppt
Laporan pembuatan aplikasi my so untuk android ppt
 
PENULISAN NASKAH FILM
PENULISAN NASKAH FILMPENULISAN NASKAH FILM
PENULISAN NASKAH FILM
 
Power point materi blog
Power point materi blogPower point materi blog
Power point materi blog
 
Materi Dasar Microsoft Word
Materi Dasar Microsoft WordMateri Dasar Microsoft Word
Materi Dasar Microsoft Word
 
Ayo Mengenal Scratch.pdf
Ayo Mengenal Scratch.pdfAyo Mengenal Scratch.pdf
Ayo Mengenal Scratch.pdf
 
Algoritma & Pemrograman
Algoritma & PemrogramanAlgoritma & Pemrograman
Algoritma & Pemrograman
 
Layout dan komposisi desain grafis
Layout dan komposisi desain grafisLayout dan komposisi desain grafis
Layout dan komposisi desain grafis
 
Power point materi seo
Power point materi seoPower point materi seo
Power point materi seo
 
PowerPoint perangkat keras
PowerPoint perangkat kerasPowerPoint perangkat keras
PowerPoint perangkat keras
 
Desain grafis-kls-xii
Desain grafis-kls-xiiDesain grafis-kls-xii
Desain grafis-kls-xii
 
Elemen teks dalam multimedia
Elemen teks dalam multimediaElemen teks dalam multimedia
Elemen teks dalam multimedia
 
Dasar dasar coreldraw 1
Dasar dasar coreldraw 1Dasar dasar coreldraw 1
Dasar dasar coreldraw 1
 
PPT Informatika bab 3
PPT Informatika bab 3PPT Informatika bab 3
PPT Informatika bab 3
 
OPERASI INPUT OUTPUT di Linux
OPERASI INPUT OUTPUT di LinuxOPERASI INPUT OUTPUT di Linux
OPERASI INPUT OUTPUT di Linux
 
Konsep dasar UI/UX
Konsep dasar UI/UXKonsep dasar UI/UX
Konsep dasar UI/UX
 
Materi lengkap tentang power point
Materi lengkap tentang power pointMateri lengkap tentang power point
Materi lengkap tentang power point
 
Pertemuan 3 - Konsep Dasar Pemrograman
Pertemuan 3 - Konsep Dasar PemrogramanPertemuan 3 - Konsep Dasar Pemrograman
Pertemuan 3 - Konsep Dasar Pemrograman
 
Prinsip User Interface Design
Prinsip User Interface DesignPrinsip User Interface Design
Prinsip User Interface Design
 
Jobsheet Pemrograman
Jobsheet Pemrograman Jobsheet Pemrograman
Jobsheet Pemrograman
 

Destacado

Pengenalan HTML ( Bambang Sugianto, S.T., M.Kom - UMNU KEBUMEN )
Pengenalan HTML ( Bambang Sugianto, S.T., M.Kom - UMNU KEBUMEN )Pengenalan HTML ( Bambang Sugianto, S.T., M.Kom - UMNU KEBUMEN )
Pengenalan HTML ( Bambang Sugianto, S.T., M.Kom - UMNU KEBUMEN )Bambang Sugianto
 
Html Power Point 3
Html Power Point 3Html Power Point 3
Html Power Point 3JenniferHinz
 
Belajar html untuk pemula 1
Belajar html untuk pemula 1Belajar html untuk pemula 1
Belajar html untuk pemula 1Ridwan Ajjh
 
Materi 1 Kuliah Pemrograman Web
Materi 1 Kuliah Pemrograman Web Materi 1 Kuliah Pemrograman Web
Materi 1 Kuliah Pemrograman Web Antonius Manginsela
 
Tips Mempublikasikan File Power Point Ke Dalam Website
Tips Mempublikasikan File Power Point Ke Dalam WebsiteTips Mempublikasikan File Power Point Ke Dalam Website
Tips Mempublikasikan File Power Point Ke Dalam Website31312
 
Manajemen konstruksi 1 iman soeharto
Manajemen konstruksi 1 iman soehartoManajemen konstruksi 1 iman soeharto
Manajemen konstruksi 1 iman soehartoTaufick Max Ir
 

Destacado (9)

Pengenalan HTML ( Bambang Sugianto, S.T., M.Kom - UMNU KEBUMEN )
Pengenalan HTML ( Bambang Sugianto, S.T., M.Kom - UMNU KEBUMEN )Pengenalan HTML ( Bambang Sugianto, S.T., M.Kom - UMNU KEBUMEN )
Pengenalan HTML ( Bambang Sugianto, S.T., M.Kom - UMNU KEBUMEN )
 
Html Power Point 3
Html Power Point 3Html Power Point 3
Html Power Point 3
 
Belajar html untuk pemula 1
Belajar html untuk pemula 1Belajar html untuk pemula 1
Belajar html untuk pemula 1
 
Materi 1 Kuliah Pemrograman Web
Materi 1 Kuliah Pemrograman Web Materi 1 Kuliah Pemrograman Web
Materi 1 Kuliah Pemrograman Web
 
Tips Mempublikasikan File Power Point Ke Dalam Website
Tips Mempublikasikan File Power Point Ke Dalam WebsiteTips Mempublikasikan File Power Point Ke Dalam Website
Tips Mempublikasikan File Power Point Ke Dalam Website
 
Htmltag.ppt
Htmltag.pptHtmltag.ppt
Htmltag.ppt
 
Manajemen konstruksi 1 iman soeharto
Manajemen konstruksi 1 iman soehartoManajemen konstruksi 1 iman soeharto
Manajemen konstruksi 1 iman soeharto
 
HTML CSS Basics
HTML CSS BasicsHTML CSS Basics
HTML CSS Basics
 
Html Ppt
Html PptHtml Ppt
Html Ppt
 

Similar a HTML Pengenalan

Similar a HTML Pengenalan (20)

Html 5
Html 5Html 5
Html 5
 
Html5
Html5Html5
Html5
 
Makalah html5
Makalah html5Makalah html5
Makalah html5
 
H t m l
H t m lH t m l
H t m l
 
Html5
Html5Html5
Html5
 
Makalah html 5
Makalah html 5Makalah html 5
Makalah html 5
 
H t m l PPT
H t m l PPTH t m l PPT
H t m l PPT
 
Makalah html
Makalah htmlMakalah html
Makalah html
 
Makalah internet dan html
Makalah internet dan htmlMakalah internet dan html
Makalah internet dan html
 
Html to-blog
Html to-blogHtml to-blog
Html to-blog
 
Modul web programing
Modul web programingModul web programing
Modul web programing
 
Modul web programing
Modul web programingModul web programing
Modul web programing
 
Bahasa HTML - 01.pdf
Bahasa HTML - 01.pdfBahasa HTML - 01.pdf
Bahasa HTML - 01.pdf
 
Html5
Html5Html5
Html5
 
Ilmuwebsite.com html css-dari_akar_ke_daun
Ilmuwebsite.com html css-dari_akar_ke_daunIlmuwebsite.com html css-dari_akar_ke_daun
Ilmuwebsite.com html css-dari_akar_ke_daun
 
Ilmuwebsite.com html css-dari_akar_ke_daun-libre
Ilmuwebsite.com html css-dari_akar_ke_daun-libreIlmuwebsite.com html css-dari_akar_ke_daun-libre
Ilmuwebsite.com html css-dari_akar_ke_daun-libre
 
Apa itu html
Apa itu htmlApa itu html
Apa itu html
 
Modul webdesign
Modul webdesignModul webdesign
Modul webdesign
 
storyboard pemrograman web.pptx
storyboard pemrograman web.pptxstoryboard pemrograman web.pptx
storyboard pemrograman web.pptx
 
PPT HTML5
PPT HTML5PPT HTML5
PPT HTML5
 

Último

PPT Penjumlahan Bersusun Kelas 1 Sekolah Dasar
PPT Penjumlahan Bersusun Kelas 1 Sekolah DasarPPT Penjumlahan Bersusun Kelas 1 Sekolah Dasar
PPT Penjumlahan Bersusun Kelas 1 Sekolah Dasarrenihartanti
 
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKA
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKAMODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKA
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKAAndiCoc
 
POWER POINT MODUL 1 PEBI4223 (PENDIDIKAN LINGKUNGAN HIDUP)
POWER POINT MODUL 1 PEBI4223 (PENDIDIKAN LINGKUNGAN HIDUP)POWER POINT MODUL 1 PEBI4223 (PENDIDIKAN LINGKUNGAN HIDUP)
POWER POINT MODUL 1 PEBI4223 (PENDIDIKAN LINGKUNGAN HIDUP)PUNGKYBUDIPANGESTU1
 
LATAR BELAKANG JURNAL DIALOGIS REFLEKTIF.ppt
LATAR BELAKANG JURNAL DIALOGIS REFLEKTIF.pptLATAR BELAKANG JURNAL DIALOGIS REFLEKTIF.ppt
LATAR BELAKANG JURNAL DIALOGIS REFLEKTIF.pptPpsSambirejo
 
Keterampilan menyimak kelas bawah tugas UT
Keterampilan menyimak kelas bawah tugas UTKeterampilan menyimak kelas bawah tugas UT
Keterampilan menyimak kelas bawah tugas UTIndraAdm
 
PPT AKSI NYATA KOMUNITAS BELAJAR .ppt di SD
PPT AKSI NYATA KOMUNITAS BELAJAR .ppt di SDPPT AKSI NYATA KOMUNITAS BELAJAR .ppt di SD
PPT AKSI NYATA KOMUNITAS BELAJAR .ppt di SDNurainiNuraini25
 
Modul Projek - Batik Ecoprint - Fase B.pdf
Modul Projek  - Batik Ecoprint - Fase B.pdfModul Projek  - Batik Ecoprint - Fase B.pdf
Modul Projek - Batik Ecoprint - Fase B.pdfanitanurhidayah51
 
Pendidikan-Bahasa-Indonesia-di-SD MODUL 3 .pptx
Pendidikan-Bahasa-Indonesia-di-SD MODUL 3 .pptxPendidikan-Bahasa-Indonesia-di-SD MODUL 3 .pptx
Pendidikan-Bahasa-Indonesia-di-SD MODUL 3 .pptxdeskaputriani1
 
Membuat Komik Digital Berisi Kritik Sosial.docx
Membuat Komik Digital Berisi Kritik Sosial.docxMembuat Komik Digital Berisi Kritik Sosial.docx
Membuat Komik Digital Berisi Kritik Sosial.docxNurindahSetyawati1
 
bab 6 ancaman terhadap negara dalam bingkai bhinneka tunggal ika
bab 6 ancaman terhadap negara dalam bingkai bhinneka tunggal ikabab 6 ancaman terhadap negara dalam bingkai bhinneka tunggal ika
bab 6 ancaman terhadap negara dalam bingkai bhinneka tunggal ikaAtiAnggiSupriyati
 
Latsol TWK Nasionalisme untuk masuk CPNS
Latsol TWK Nasionalisme untuk masuk CPNSLatsol TWK Nasionalisme untuk masuk CPNS
Latsol TWK Nasionalisme untuk masuk CPNSdheaprs
 
MODUL P5 KEWIRAUSAHAAN SMAN 2 SLAWI 2023.pptx
MODUL P5 KEWIRAUSAHAAN SMAN 2 SLAWI 2023.pptxMODUL P5 KEWIRAUSAHAAN SMAN 2 SLAWI 2023.pptx
MODUL P5 KEWIRAUSAHAAN SMAN 2 SLAWI 2023.pptxSlasiWidasmara1
 
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdf
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdfMODUL 1 Pembelajaran Kelas Rangkap-compressed.pdf
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdfNurulHikmah50658
 
PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptx
PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptxPPT AKUNTANSI KEUANGAN MENENGAH DUA.pptx
PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptxssuser8905b3
 
ppt-akhlak-tercela-foya-foya-riya-sumah-takabur-hasad asli.ppt
ppt-akhlak-tercela-foya-foya-riya-sumah-takabur-hasad asli.pptppt-akhlak-tercela-foya-foya-riya-sumah-takabur-hasad asli.ppt
ppt-akhlak-tercela-foya-foya-riya-sumah-takabur-hasad asli.pptAgusRahmat39
 
aksi nyata penyebaran pemahaman merdeka belajar
aksi nyata penyebaran pemahaman merdeka belajaraksi nyata penyebaran pemahaman merdeka belajar
aksi nyata penyebaran pemahaman merdeka belajarHafidRanggasi
 
PELAKSANAAN + Link2 Materi BimTek _PTK 007 Rev-5 Thn 2023 (PENGADAAN) & Perhi...
PELAKSANAAN + Link2 Materi BimTek _PTK 007 Rev-5 Thn 2023 (PENGADAAN) & Perhi...PELAKSANAAN + Link2 Materi BimTek _PTK 007 Rev-5 Thn 2023 (PENGADAAN) & Perhi...
PELAKSANAAN + Link2 Materi BimTek _PTK 007 Rev-5 Thn 2023 (PENGADAAN) & Perhi...Kanaidi ken
 
Modul Ajar Pendidikan Pancasila Kelas 5 Fase C
Modul Ajar Pendidikan Pancasila Kelas 5 Fase CModul Ajar Pendidikan Pancasila Kelas 5 Fase C
Modul Ajar Pendidikan Pancasila Kelas 5 Fase CAbdiera
 
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...Kanaidi ken
 
UT PGSD PDGK4103 MODUL 2 STRUKTUR TUBUH Pada Makhluk Hidup
UT PGSD PDGK4103 MODUL 2 STRUKTUR TUBUH Pada Makhluk HidupUT PGSD PDGK4103 MODUL 2 STRUKTUR TUBUH Pada Makhluk Hidup
UT PGSD PDGK4103 MODUL 2 STRUKTUR TUBUH Pada Makhluk Hidupfamela161
 

Último (20)

PPT Penjumlahan Bersusun Kelas 1 Sekolah Dasar
PPT Penjumlahan Bersusun Kelas 1 Sekolah DasarPPT Penjumlahan Bersusun Kelas 1 Sekolah Dasar
PPT Penjumlahan Bersusun Kelas 1 Sekolah Dasar
 
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKA
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKAMODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKA
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKA
 
POWER POINT MODUL 1 PEBI4223 (PENDIDIKAN LINGKUNGAN HIDUP)
POWER POINT MODUL 1 PEBI4223 (PENDIDIKAN LINGKUNGAN HIDUP)POWER POINT MODUL 1 PEBI4223 (PENDIDIKAN LINGKUNGAN HIDUP)
POWER POINT MODUL 1 PEBI4223 (PENDIDIKAN LINGKUNGAN HIDUP)
 
LATAR BELAKANG JURNAL DIALOGIS REFLEKTIF.ppt
LATAR BELAKANG JURNAL DIALOGIS REFLEKTIF.pptLATAR BELAKANG JURNAL DIALOGIS REFLEKTIF.ppt
LATAR BELAKANG JURNAL DIALOGIS REFLEKTIF.ppt
 
Keterampilan menyimak kelas bawah tugas UT
Keterampilan menyimak kelas bawah tugas UTKeterampilan menyimak kelas bawah tugas UT
Keterampilan menyimak kelas bawah tugas UT
 
PPT AKSI NYATA KOMUNITAS BELAJAR .ppt di SD
PPT AKSI NYATA KOMUNITAS BELAJAR .ppt di SDPPT AKSI NYATA KOMUNITAS BELAJAR .ppt di SD
PPT AKSI NYATA KOMUNITAS BELAJAR .ppt di SD
 
Modul Projek - Batik Ecoprint - Fase B.pdf
Modul Projek  - Batik Ecoprint - Fase B.pdfModul Projek  - Batik Ecoprint - Fase B.pdf
Modul Projek - Batik Ecoprint - Fase B.pdf
 
Pendidikan-Bahasa-Indonesia-di-SD MODUL 3 .pptx
Pendidikan-Bahasa-Indonesia-di-SD MODUL 3 .pptxPendidikan-Bahasa-Indonesia-di-SD MODUL 3 .pptx
Pendidikan-Bahasa-Indonesia-di-SD MODUL 3 .pptx
 
Membuat Komik Digital Berisi Kritik Sosial.docx
Membuat Komik Digital Berisi Kritik Sosial.docxMembuat Komik Digital Berisi Kritik Sosial.docx
Membuat Komik Digital Berisi Kritik Sosial.docx
 
bab 6 ancaman terhadap negara dalam bingkai bhinneka tunggal ika
bab 6 ancaman terhadap negara dalam bingkai bhinneka tunggal ikabab 6 ancaman terhadap negara dalam bingkai bhinneka tunggal ika
bab 6 ancaman terhadap negara dalam bingkai bhinneka tunggal ika
 
Latsol TWK Nasionalisme untuk masuk CPNS
Latsol TWK Nasionalisme untuk masuk CPNSLatsol TWK Nasionalisme untuk masuk CPNS
Latsol TWK Nasionalisme untuk masuk CPNS
 
MODUL P5 KEWIRAUSAHAAN SMAN 2 SLAWI 2023.pptx
MODUL P5 KEWIRAUSAHAAN SMAN 2 SLAWI 2023.pptxMODUL P5 KEWIRAUSAHAAN SMAN 2 SLAWI 2023.pptx
MODUL P5 KEWIRAUSAHAAN SMAN 2 SLAWI 2023.pptx
 
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdf
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdfMODUL 1 Pembelajaran Kelas Rangkap-compressed.pdf
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdf
 
PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptx
PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptxPPT AKUNTANSI KEUANGAN MENENGAH DUA.pptx
PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptx
 
ppt-akhlak-tercela-foya-foya-riya-sumah-takabur-hasad asli.ppt
ppt-akhlak-tercela-foya-foya-riya-sumah-takabur-hasad asli.pptppt-akhlak-tercela-foya-foya-riya-sumah-takabur-hasad asli.ppt
ppt-akhlak-tercela-foya-foya-riya-sumah-takabur-hasad asli.ppt
 
aksi nyata penyebaran pemahaman merdeka belajar
aksi nyata penyebaran pemahaman merdeka belajaraksi nyata penyebaran pemahaman merdeka belajar
aksi nyata penyebaran pemahaman merdeka belajar
 
PELAKSANAAN + Link2 Materi BimTek _PTK 007 Rev-5 Thn 2023 (PENGADAAN) & Perhi...
PELAKSANAAN + Link2 Materi BimTek _PTK 007 Rev-5 Thn 2023 (PENGADAAN) & Perhi...PELAKSANAAN + Link2 Materi BimTek _PTK 007 Rev-5 Thn 2023 (PENGADAAN) & Perhi...
PELAKSANAAN + Link2 Materi BimTek _PTK 007 Rev-5 Thn 2023 (PENGADAAN) & Perhi...
 
Modul Ajar Pendidikan Pancasila Kelas 5 Fase C
Modul Ajar Pendidikan Pancasila Kelas 5 Fase CModul Ajar Pendidikan Pancasila Kelas 5 Fase C
Modul Ajar Pendidikan Pancasila Kelas 5 Fase C
 
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...
 
UT PGSD PDGK4103 MODUL 2 STRUKTUR TUBUH Pada Makhluk Hidup
UT PGSD PDGK4103 MODUL 2 STRUKTUR TUBUH Pada Makhluk HidupUT PGSD PDGK4103 MODUL 2 STRUKTUR TUBUH Pada Makhluk Hidup
UT PGSD PDGK4103 MODUL 2 STRUKTUR TUBUH Pada Makhluk Hidup
 

HTML Pengenalan

  • 1. HTML DI SUSUN OLEH : Siti Nur Aisyah 2114R0797 Teknik Infomatika
  • 2. PENGERTIAN HTML HTML merupakan singkatan dari Hypertext Markup Language. HTML digunakan untuk membangun halaman web. HTML digunakan untuk melakukan mark-up (penandaan) terhadap sebuah dokumen teks. Tanda tersebut digunakan untukmenentukan format atau style dari teks yang ditandai halaman web dibangun oleh kode-kode HTML. HTML adalah bahasa markup yang umum digunakan. Kepopuleran HTML disebakan karena HTML ini mudah digunakan. Pembuatan dokumen web dengan HTML dapat dilakukan dengan mudah dan cepat. Dokumen web dapat tersaji dengan cepat ke banyak pembaca di seluruh dunia sekaligus. HTML mudah melakukan kontrol terhadap tampilan halaman web baik berupa teks, gambar, suara, animasi maupun video.
  • 3. SEJARAH HTML Hypertext Markup Language (HTML) adalah bahasa yang digunakan untuk menulis halaman web. HTML merupakan pengembangan dari standar pemformatan dokumen teks yaitu Standard Generalized Markup Language (SGML). HTML sebenarnya adalah dokumen ASCII atau teks biasa, yang dirancang untuk tidak tergantung pada suatu sistem operasi tertentu. HTML dibuat oleh Tim Berners-Lee ketika masih bekerja untuk CERN dan dipopulerkan pertama kali oleh browser Mosaic. Selama awal tahun 1990 HTML mengalami perkembangan yang sangat pesat. Setiap pengembangan HTML pasti akan menambahkan kemampuan dan fasilitas yang lebih baik dari versi sebelumnya. Namun perkembangan resmi dikeluarkan pada bulan November 1995 oleh IETF (Internet Engineering Task Force). HTML 2.0 ini merupakan penyempurnaan dari HTML+ (1993). HTML 3.0 (1995) memberikan kemampuan lebih daripada versi sebelumnya. Sebuah usaha dari World Wide Web Consortium’s (W3C) HTML Working Group pada tahun 1996 menghasilkan HTML 3.2. HTML versi ini secara resmi diterbitkan pada bulan Januari 1997. HTML versi terbaru adalah HTML 4.01 yang dikeluarkan secara resmi oleh W3C pada tanggal 24 April 1998. HTML merupakan perbaikan dari HTML 4.0 yang lebih dulu diterbitkan. (18 Desember 1997).
  • 4. PERKEMBANGAN HTML Pada tahun 1980 IBM mulai untuk mengembangkan sebuah bahasa pemograman dimana text dan format sebuah dokumen dijadikan satu dalam bahasa pemrograman yang sering kita sebut sebagai HTML (Hyper Text Markup Language) akan tetapi pada saat itu pihak IBM memberikan sebuah nama GML (Generalized Markup Language). Pada tahun 1986 ISO mengeluarkan sebuah standarisasi tentang bahasa pemograman tersebut dan menyatakan sebuah nama baru dari GML tersebut dengan sebutan SGML (Standard Generalized Markup Language). Pada tahun kelahiran saya yaitu tahun 1989, Sebuah nama HTML muncul dari pemikiran Caillau Tim yang bekerja sama dengan Banners Lee Robert yang ketika itu masih bekerja di CERN memulai mengembangkan bahasa pemrograman ini, dan dipopulerkan pertama kali dengan browser Mosaic. Nah mulailah dari tahun 1990 HTML sangat berkembang dengan cepat hingga mencapai versi HTML versi 5.0 yang digarap pada 4 Maret 2010 kemarin oleh W3C
  • 5.  HTML versi 1.0 ini adalah versi pertama sejak lahirnya nama html tersebut, memiliki sebuah kemampuan untuk heading, paragraph, hypertext, bold dan italic text, wrapping serta memiliki dukungan dalam peletakan sebuah gambar.  HTML versi 2.0 pada 14 Januari 1996, pada versi ini ada beberapa tambahan kemampuan diantaranya penambahan form comment, hal ini menyebabkan adanya sebuah interaktif dan mulai dari versi ini yang menjadikan sebuah pioneer dalam perkembangan homepage interaktif.  Tak lama kemudian HTML versi 3.0 dirilis pada 18 Desember 1997 yang sering disebut sebut sebagai HTML+ yang mempunyai kemampuan dalam beberapa fasilitas diantaranya adalah penambahan fitur table dalam paragraph, akan tetapi versi ini tidak bertahan lama.  Dan pada bulan Mei 1996 dikeluarkan versi baru sebagai pengganti dan penyampurnaan versi 3.0 ini yaitu HTML versi 3.2, keluarnya versi ini dikarenakan adanya beberapa kasus yang timbul pada pengembang browser yang telah melakukan pendekatan dengan cara lain yang justru hal tersebut menjadi popular, maka di bakukan versi 3.2 untuk mengakomodasi praktek yang banyak digunakan oleh pengembang browser dan diterima secara umum, dapat dikatakan bahwa versi 3.2 ini merupakan versi 3.0 yang dikembangkan oleh beberapa pengembang browser seperti Netscape dan Microsoft.
  • 6.  Terakhir perombakan terjadi pada tahun 1999 tepatnya tanggal 24 Desember yaitu HTML versi 4.0, seperti yang kita kenal HTML pada saat ini penambahan link, meta, imagemaps , image dan lain lain sebagai penyempurnaan versi 3.2  Pada tanggal 4 Maret 2010, terdapat sebuah informasi bahwasanya HTML versi 5.0 masih dikembangkan oleh W3C (World Wide Web Consortium) dan IETF (Internet Engineering Task Force) yaitu sebuah organisasi yang menangani HTML sejak versi 2.0
  • 7. MENDESAIN HTML Mendesain HTML dapat dilakukan dengan dua cara, yaitu :  Menggunakan HTML Editor, seperti Microsoft FrontPage, Adobe Dreamweaver, dan lain-lain. Dapatkan editor HTML lainnya disini. Cara ini kelebihannya adalah HTML Editor merupakan sebuah program yang khusus didesain untuk membuat, melakukan editing bahkan mem-publish ke internet. Dengan kemampuannya menggabungkan kemudahan dan kecanggihan teknologi internet ke dalam dokumen HTML maka cara ini sangat disukai oleh para pemula dan desainer yang tidak ingin belajar lebih mendalam mengenai HTML.  Dengan cara menuliskan sendiri secara manual satu persatu tag-tag HTML ke dalam dokumen HTML. cara ini adalah menuliskan secara manual satu persatu tag-tag HTML. Hal ini sangat disarakan sulit dikarenakan akan memakan tenaga dan waktu ekstra untuk melakukannya, ditambah lagi Anda harus melakukan cara-cara konvensional untuk melihat hasilnya pada web browser. Namun pada cara kedua adalah dasar dari segala bentuk HTML yang akan Anda pelajari, karena dengan cara itulah Anda akan lebih paham mengenai cara kerja dan berbagai perintah yang biasa dipakai pada bahasa HTML.
  • 8. KELEBIHAN HTML Merupakan bahasa penkodean yang lintas platform (cross platform), maksudnya HTML dapat digunakan pada berbagai jenis mesin komputer yang berbeda dan berbagai macam sistem operasi yang berbeda. Jadi bersifat fleksibel karena ditulis cukup dengan menggunakan editor karakter ASCII.  Dapat disisipi gambar baik gambar statis atau dinamis (animasi) termasuk menggunakan gambar untuk dijadikan hyperlink. Gambar di sini digunakan untuk merujuk pada suatu halaman web, dimana setiap titik-titik yang sudah didefinisikan berupa rectangular (kotak), poligon (kurva tak beraturan) atau lingkaran digunakan untuk ‘jump’ ke halaman lain, atau link ke halaman di luar web yang bersangkutan.  Dapat disisipi animasi berupa Java Applet atau file-file animasi dari Macromedia Flash atau Macromedia Shockwave (untuk keperluan ini, browser harus memiliki plug-in khusus untuk menjalankan file-file animasi ini).
  • 9. Dapat disisipi bahasa pemrograman untuk mempercantik halaman web seperti Javascript, VBScript, Active Server Pages, Perl, Tcl, PHP dan sebagainya. Bukan merupakan bahasa pemrograman jadi tidak memerlukan kompiler. Cara menjalanakannya cukup dengan menggunakan browser.
  • 10. KEKURANGAN DARI HTML  Menghasilkan halaman yang statis, yang saya tahu untuk memperoleh halaman yang dinamis harus menggunakan bahasa pemrograman tertentu seperti Javascript atau VBScript dan animasi seperti Flash atau Shockwave.  Memiliki tag-tag yang begitu banyak sehingga susah dipelajari untuk yang masih awam.  Tidak dapat menghasilkan halaman yang interaktif. Interaktif di sini maksudnya client dapat berinteraksi dengan server. Untuk keperluan itu, HTML harus disisipi bahasa pemrograman yang dapat menangani hal tersebut, contohnya Perl atau Tcl.
  • 11. TAG HTML Tag adalah penanda atau teks khusus yang berguna untuk menandai elemen-elemen dalam halaman html dengan simbol lebih kecil dari "<" dan lebih besar dari ">", semua tag harus di apit oleh dua simbol "<" ">". Secara umum tag ditulis berpasangan, yaitu tag pembuka dan tag penutup. Tag pembuka menandakan awal dari elemen sebagai contoh <body> dan tag penutup menandakan akhir dari elemen, untuk penulisan tag akhir ada penambahan karakter "/" setelah karakter "<" sebagai </body>, inilah bentuk tag berpasangan dalam html. Meskipun demikian, ada beberapa elemen dalam halaman html yang tidak berpasangan seperti tag <br> dan lain-lain.
  • 12. TAG DASAR HTML HTML Memberitahukan pada browser bahwa dokumen web yang digunakan adalah HTML.Untuk penulisannya : <html> "Tag pembuka html di letakkan pada awal dokumen" ........ </html> "Tag penutup html di letakkan pada akhir dokumen" Head Kepala dokumen html atau tentang dokumen yang akan ditampilkan Penulisan : <head> "Tag pembuka head di letakkan pada awal setelah tag <html>" ........ </head> "Tag penutup head di letakkan di akhir section head"
  • 13. Pada bagian head akan mengerjakan tugas-tugas sebagai berikut :  Menyediakan judul dokumen  Menjembatani hubungan antar dokumen  Memberitahu browser untuk membuat form pencarian  Menyediakan metode untuk mengirim pesan ke tipe browser Body Menampilkan isi dokumen html. Penulisannya : <body> "Tag pembuka body terletak di bawah tag penutup </head>" ........ </body> "Tag penutup </body> terletak di atas tag penutup </html>" Setiap ada tag pembuka maka harus ada tag penutup yang ditandai dengan tanda "/". Contoh :<title></title>, <body> </body>,<html></html>.
  • 14. Antara tag <title> </title> digunakan untuk menulis judul halaman web yang bersangkutan. Contohnya adalah tulisan "ahmadamirudin.jw.lt" yang ada pada pojok kiri atas halaman ini maka penulisannya menjadi : <html> <head> <title>ahmadamirudin.jw.lt </title> </head> <body> </body> </html> Sedangkan antara tag <body> </body> digunakan untuk mengisi apa yang akan ditampilkan pada halaman anda, bisa berupa tulisan, gambar, link dan sebagainya.
  • 15. Adapun beberapa tambahan yang dapat ditambahkan pada tag <body> adalah sebagai berikut: Meberikan warna background pada halaman web : <body bgcolor="blue"> Atau dapat juga menggunakan kode warna Hexa (RGB /red-green- blue) yang terdiri dari 6 karakter yang terdiri dari gabungan angka dan huruf, dan penulisannya juga harus diawalai dengan tanda "#"(pagar). 2 karakter pertama mewakili warna merah yang dimulai dari paling rendah 00 sampai paling tinggi ff, atau bisa juga kombinasi huruf dan angka tadi. Begitu juga 2 karakter berikutnya mewakili warna hijau dan 2 karakter berikutnya mewakili warna biru. contoh penulisan kode untuk warna hitam #000000, putih #ffffff, merah #ff0000, abu-abu #d3d3d3 dan lain lain sesuai dengan keinginan anda. Memberikan background gambar <body background="gambar.jpg"> Penulisan format gambar juga harus disertakan seperti *.jpg, *.gif, *.bmp dan lain-lain
  • 16. Jika ingin menginginkan warrna background transparan maka ditulis dengan : <body bgcolor="transparent"> Memberikan warna teks <body text="#000000"> Mengatur margin halaman <body leftmargin="20" topmargin="20"> Mengatur warna link <body link="#ff0000"vlink="#00ff00" alink="#0000ff"> Dan jika semuanya ditulis bersamaan maka menjadi : <body bgcolor="blue"text="#000000" leftmargin="20" topmargin="20" link="#ff0000"vlink="#00ff00"alink="#0000ff">
  • 18. Sekian Dan Terima Kasih Semoga Bermanfaat DOSEN PENGAMPU