SlideShare a Scribd company logo
1 of 18
Materi :
1. Konsep Dasar HTML
2. Elemen pada Tag Head
3. Elemen pada tag Body
 HyperText Markup Language (HTML) adalah suatu
bahasa pengkodean (Script) yang digunakan untuk
membangun sebuah halaman web.
 “HTML merupakan standar bahasa yang digunakan
untuk menampilkan dokumen web”.
 Ekstensi File : ‘html’ atau ‘htm’.
 Editor HTML: Notepad, atau aplikasi khusus scripting
(Macromedia Dreamweaver, dll).
 Tag adalah Unsur bahasa atau elemen HTML
dinyatakan dengan tanda khusus
 Bentuk umum penulisan sintak tag HTML :
<ELEMENT [ATRIBUT1 =”value” … ATRIBUTN=”value”] > … </ELEMENT>
Keterangan :
ELEMENT : Nama Tag HTML
ATRIBUT : Atribut dari Tag HTML (optional)
VALUE : Nilai dari Atribut Tag HTML (optional)
Contoh :
< BODY BGCOLOR =”red”> ……… </BODY>
 Open Element
Merupakan elemen-elemen (tag) HTML yang bersifat terbuka, atau tidak
memiliki elemen penutup. Format penulisan <name element />
Contoh : <hr/>, <br/>
 Close Element
Merupakan elemen-elemen (tag) HTML yang bersifat tertutup, atau memiliki
elemen penutup.
Format penulisan : <name element > ….. </name element>
Contoh : <body>…<body/>, <div>…</div>, dll.
 Comment
Merupakan baris yang tidak akan dieksekusi oleh penerjemah. Biasanya
digunakan untuk informasi script .
Format Penulisan : < ! - - comment text -- >
Contoh : < ! - - Hallo saya adalah baris yang tidak akan diekskusi -- >
Struktur elemen dalam dokumen HTML adalah struktur dasar penulisan
script untuk dokumen HTML. Berikut ini adalah gambar struktur
dokumen HTML, dan hubungannya dengan output pada halaman web
browser.
 Elemen-elemen pada tag HEAD HTML, adalah
elemen-elemen yang didefinisikan dan ditulis diantara
Tag <HEAD> dan </HEAD>. Ada beberapa macam
elemen pada tag HEAD HTML, yaitu antara lain :
 TITLE
Tag yang digunakan untuk menampilkan judul homepage/ halaman web pada
title browser area.
Contoh :
< TITLE > halaman web pertamaku </TITLE>
 META
Tag yang digunakan untuk mendefinisikan informasi (keywords, http
header, dll) dan
identitas (author, copyright, dll) pada sebuah halaman web (dokumen HTML).
Contoh :
< META keywords = “web, pemrograman”/>
< META name =”author” content =”eko win kenali”/>
< META name =”copyright” content =”2006”/>
 LINK
tag yang digunakan untuk menyertakan dokumen lain ke dalam halaman web
untuk tujuan khusus. Dokumen lain tersebut biasa berupa file dengan format
CSS, PHP, ICO dan lain- lain.
Contoh :
<link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon“/>
<link rel="stylesheet" href="../css/style.css" media="screen" type="text/css“/>
 Elemen-elemen pada tag BODY HTML, adalah
elemen-elemen yang didefinisikan dan ditulis diantara
Tag <BODY> dan </BODY>.
 HEADING
Heading adalah elemen tag yang digunakan untuk mendefinisikan sebuah teks
sebagai kepala (judul/title). Ada 6 macam elemen heading, yaitu H1, H2, H3,
H4, H5 dan H6.
Contoh :
< H1 > Contoh Heading 1 </H1>
 PARAGRAPH
Paragraph adalah elemen tag yang digunakan untuk mendefinisikan sebuah
teks atau lebih sebagai paragraph. Elemen Paragraph ditandai dengan close tag
<p>..</p>.
Contoh :
<p>
HyperText Markup Language (HTML) adalah suatu bahasa pengkodean
(coding/scripting) yang digunakan untuk membangun sebuah halaman web.
Script HTML akan diinterpretasikan dan diterjemahkan olehbrowser, kemudian
browser akan menampilkan hasil ke pengguna.
</p>
 LIST ITEMS
List Item adalah tag digunakan untuk mengelompokkan data (teks) baik
dengan metode pengelompokan tidak berurutan (unordered list) maupun
pengelompokan berurutan (ordered list).
Contoh :
 DEFINITON LIST
Definition List fungsinya sama dengan list item. Elemen Definition List
ditandai oleh tag
<DL> … </DL>. Didalam tag Definition List terdapat tag Definition Term
<DT>, yaitu tag untuk menentukan definition term. Serta tag Definition
<DD>, yaitu tag untuk menentukan definition itu sendiri. Contoh :
 HORIZONTAL RULE
Horizontal rule adalah tag digunakan untuk menggambar garis horizontal
dalam document
HTML. Elemen Horizontal Rule ditandai dengan tag <hr>. Contoh :
<hr/>
 BREAK LINE
Break Line adalah tag di gunakan untuk memulai/ganti baris baru
pada document HTML. Elemen Break Line ditandai dengan tag <br>.
Contoh :
<br/>
 FONT
Font adalah tag di gunakan untuk menentukan format font pada
dokumen html. Elemen
Font ditandai dengan tag <font>…</font>.
dokumen.tips_presentasi-konsep-dasar-html.pptx

More Related Content

Similar to dokumen.tips_presentasi-konsep-dasar-html.pptx

Pertemuan 1 b
Pertemuan 1 bPertemuan 1 b
Pertemuan 1 bf fr
 
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.pptPraktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.pptNansyeDeboraLitaay
 
Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML fikrinurfahmi1
 
Dasar-dasar penggunaan elemen dan tagging dalam html
Dasar-dasar penggunaan elemen dan tagging dalam htmlDasar-dasar penggunaan elemen dan tagging dalam html
Dasar-dasar penggunaan elemen dan tagging dalam htmloyie76
 
PWPB pertemuan 5 XII SMK Al Falah Bandung
PWPB pertemuan 5 XII SMK Al Falah BandungPWPB pertemuan 5 XII SMK Al Falah Bandung
PWPB pertemuan 5 XII SMK Al Falah Bandungabdurrochim41
 
Materi_8_-_Pengenalan_HTML_-_Revisi1.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi1.pptMateri_8_-_Pengenalan_HTML_-_Revisi1.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi1.pptAkbarGiLang
 
01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.pptEdiyono3
 
01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.pptAkhmadAlbari1
 
01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.pptsopi20
 
01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.pptreskieki4
 
01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.pptcigugurfree
 
Dasar-dasar HTML.ppt
Dasar-dasar HTML.pptDasar-dasar HTML.ppt
Dasar-dasar HTML.pptandresept0186
 

Similar to dokumen.tips_presentasi-konsep-dasar-html.pptx (20)

Pertemuan 1 b
Pertemuan 1 bPertemuan 1 b
Pertemuan 1 b
 
PPT_HTML_DASAR.pptx
PPT_HTML_DASAR.pptxPPT_HTML_DASAR.pptx
PPT_HTML_DASAR.pptx
 
Html Dasar#1_ANFALAB.pdf
Html Dasar#1_ANFALAB.pdfHtml Dasar#1_ANFALAB.pdf
Html Dasar#1_ANFALAB.pdf
 
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.pptPraktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
Praktikum_Pengenalan_HTML oleh STMIK AMIKOM Yogyakarta.ppt
 
Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML Praktikum_Pengenalan_HTML
Praktikum_Pengenalan_HTML
 
Training HTML
Training HTMLTraining HTML
Training HTML
 
Modul HTML5
Modul HTML5Modul HTML5
Modul HTML5
 
Laporan pratikum 1
Laporan pratikum 1Laporan pratikum 1
Laporan pratikum 1
 
Dasar-dasar penggunaan elemen dan tagging dalam html
Dasar-dasar penggunaan elemen dan tagging dalam htmlDasar-dasar penggunaan elemen dan tagging dalam html
Dasar-dasar penggunaan elemen dan tagging dalam html
 
PWPB pertemuan 5 XII SMK Al Falah Bandung
PWPB pertemuan 5 XII SMK Al Falah BandungPWPB pertemuan 5 XII SMK Al Falah Bandung
PWPB pertemuan 5 XII SMK Al Falah Bandung
 
Web diktat html
Web diktat htmlWeb diktat html
Web diktat html
 
Bab i. html
Bab i. htmlBab i. html
Bab i. html
 
Pertemuan1
Pertemuan1Pertemuan1
Pertemuan1
 
Materi_8_-_Pengenalan_HTML_-_Revisi1.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi1.pptMateri_8_-_Pengenalan_HTML_-_Revisi1.ppt
Materi_8_-_Pengenalan_HTML_-_Revisi1.ppt
 
01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt
 
01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt
 
01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt
 
01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt
 
01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt01. Dasar-dasar HTML.ppt
01. Dasar-dasar HTML.ppt
 
Dasar-dasar HTML.ppt
Dasar-dasar HTML.pptDasar-dasar HTML.ppt
Dasar-dasar HTML.ppt
 

dokumen.tips_presentasi-konsep-dasar-html.pptx

  • 1. Materi : 1. Konsep Dasar HTML 2. Elemen pada Tag Head 3. Elemen pada tag Body
  • 2.  HyperText Markup Language (HTML) adalah suatu bahasa pengkodean (Script) yang digunakan untuk membangun sebuah halaman web.  “HTML merupakan standar bahasa yang digunakan untuk menampilkan dokumen web”.  Ekstensi File : ‘html’ atau ‘htm’.  Editor HTML: Notepad, atau aplikasi khusus scripting (Macromedia Dreamweaver, dll).  Tag adalah Unsur bahasa atau elemen HTML dinyatakan dengan tanda khusus
  • 3.  Bentuk umum penulisan sintak tag HTML : <ELEMENT [ATRIBUT1 =”value” … ATRIBUTN=”value”] > … </ELEMENT> Keterangan : ELEMENT : Nama Tag HTML ATRIBUT : Atribut dari Tag HTML (optional) VALUE : Nilai dari Atribut Tag HTML (optional) Contoh : < BODY BGCOLOR =”red”> ……… </BODY>
  • 4.  Open Element Merupakan elemen-elemen (tag) HTML yang bersifat terbuka, atau tidak memiliki elemen penutup. Format penulisan <name element /> Contoh : <hr/>, <br/>  Close Element Merupakan elemen-elemen (tag) HTML yang bersifat tertutup, atau memiliki elemen penutup. Format penulisan : <name element > ….. </name element> Contoh : <body>…<body/>, <div>…</div>, dll.  Comment Merupakan baris yang tidak akan dieksekusi oleh penerjemah. Biasanya digunakan untuk informasi script . Format Penulisan : < ! - - comment text -- > Contoh : < ! - - Hallo saya adalah baris yang tidak akan diekskusi -- >
  • 5. Struktur elemen dalam dokumen HTML adalah struktur dasar penulisan script untuk dokumen HTML. Berikut ini adalah gambar struktur dokumen HTML, dan hubungannya dengan output pada halaman web browser.
  • 6.  Elemen-elemen pada tag HEAD HTML, adalah elemen-elemen yang didefinisikan dan ditulis diantara Tag <HEAD> dan </HEAD>. Ada beberapa macam elemen pada tag HEAD HTML, yaitu antara lain :
  • 7.  TITLE Tag yang digunakan untuk menampilkan judul homepage/ halaman web pada title browser area. Contoh : < TITLE > halaman web pertamaku </TITLE>  META Tag yang digunakan untuk mendefinisikan informasi (keywords, http header, dll) dan identitas (author, copyright, dll) pada sebuah halaman web (dokumen HTML). Contoh : < META keywords = “web, pemrograman”/> < META name =”author” content =”eko win kenali”/> < META name =”copyright” content =”2006”/>
  • 8.  LINK tag yang digunakan untuk menyertakan dokumen lain ke dalam halaman web untuk tujuan khusus. Dokumen lain tersebut biasa berupa file dengan format CSS, PHP, ICO dan lain- lain. Contoh : <link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon“/> <link rel="stylesheet" href="../css/style.css" media="screen" type="text/css“/>
  • 9.  Elemen-elemen pada tag BODY HTML, adalah elemen-elemen yang didefinisikan dan ditulis diantara Tag <BODY> dan </BODY>.
  • 10.  HEADING Heading adalah elemen tag yang digunakan untuk mendefinisikan sebuah teks sebagai kepala (judul/title). Ada 6 macam elemen heading, yaitu H1, H2, H3, H4, H5 dan H6. Contoh : < H1 > Contoh Heading 1 </H1>  PARAGRAPH Paragraph adalah elemen tag yang digunakan untuk mendefinisikan sebuah teks atau lebih sebagai paragraph. Elemen Paragraph ditandai dengan close tag <p>..</p>. Contoh : <p> HyperText Markup Language (HTML) adalah suatu bahasa pengkodean (coding/scripting) yang digunakan untuk membangun sebuah halaman web. Script HTML akan diinterpretasikan dan diterjemahkan olehbrowser, kemudian browser akan menampilkan hasil ke pengguna. </p>
  • 11.  LIST ITEMS List Item adalah tag digunakan untuk mengelompokkan data (teks) baik dengan metode pengelompokan tidak berurutan (unordered list) maupun pengelompokan berurutan (ordered list). Contoh :
  • 12.
  • 13.
  • 14.  DEFINITON LIST Definition List fungsinya sama dengan list item. Elemen Definition List ditandai oleh tag <DL> … </DL>. Didalam tag Definition List terdapat tag Definition Term <DT>, yaitu tag untuk menentukan definition term. Serta tag Definition <DD>, yaitu tag untuk menentukan definition itu sendiri. Contoh :
  • 15.
  • 16.  HORIZONTAL RULE Horizontal rule adalah tag digunakan untuk menggambar garis horizontal dalam document HTML. Elemen Horizontal Rule ditandai dengan tag <hr>. Contoh : <hr/>
  • 17.  BREAK LINE Break Line adalah tag di gunakan untuk memulai/ganti baris baru pada document HTML. Elemen Break Line ditandai dengan tag <br>. Contoh : <br/>  FONT Font adalah tag di gunakan untuk menentukan format font pada dokumen html. Elemen Font ditandai dengan tag <font>…</font>.