Pengertian HTML
HTML merupakan singkatan dari Hypertext Markup Language yaitu suatu bahasa yang digunakan untuk membuat halaman web. Ciri utama yang menandakan bahasa HTML adalah tag dan elemen.
HTML merupakan singkatan dari Hypertext Markup Language yaitu suatu bahasa yang digunakan untuk membuat halaman web. Ciri utama yang menandakan bahasa HTML adalah tag dan elemen.
Elemen
Dalam HTML, elemen dikategorikan menjadi dua yaitu :
Dalam HTML, elemen dikategorikan menjadi dua yaitu :
- HEAD : yang berfungsi memberikan informasi tentang suatu dokumen HTML, seperti judul web page, descripsi situs, keyword dan lain sebagainya.
- BODY : elemen yang digunakan untuk menentukan isi yang akan ditampilkan oleh browser seperti paragrap, list, tabel, dan lain sebagainya
Tag
Dalam HTML tag dinyatakan dengan tanda "<" dan diakhiri dengan ">". Sebagian besar kode HTML terdapat diantara tag kontainer, artinya selalu ada tag pembuka misalkan <namatag> dan ada tag penutup misalkan </namatag>. Tetapi ada sebagian tag HTML yang tidak menggunakan tag penutup misalkan tag <br>.
Contoh tag kontainer :
<table boder=”1”>
<tr>
<td>Contoh tag kontainer</td>
</tr>
</table>
Contoh tag tanpa penutup
<image src="gambarku.gif">
<br>
<table boder=”1”>
<tr>
<td>Contoh tag kontainer</td>
</tr>
</table>
Contoh tag tanpa penutup
<image src="gambarku.gif">
<br>
Ada tiga tag utama dalam HTML yaitu :
1. tag <HTML> : berfungsi menyatakan dokumen HTML
2. tag <HEAD> : berfungsi memberikan informasi tentang dokumen HTML
3. tag <BODY> : berfungsi memberikan informasi data yang akan ditampilkan
secara umum penulisan HTML adalah sebagai berikut :
<HTML>
<HEAD>
.....
.....
....
</HEAD>
<BODY>
......
......
......
</BODY>
</HTML>
1. tag <HTML> : berfungsi menyatakan dokumen HTML
2. tag <HEAD> : berfungsi memberikan informasi tentang dokumen HTML
3. tag <BODY> : berfungsi memberikan informasi data yang akan ditampilkan
secara umum penulisan HTML adalah sebagai berikut :
<HTML>
<HEAD>
.....
.....
....
</HEAD>
<BODY>
......
......
......
</BODY>
</HTML>
Atribut
Setiap tag terkadang mempunyai atribut tersendiri yang menentukan informasi atau bentuk tampilan dari tag yang digunakan sebagai contoh tag <image> mempunyai atribut "src" sebagai informasi file image yang ingin ditampilkan.
Contoh :
<image src="gambarku.gif">
src adalah atibut dari tag <image>, sedang “gambarku.gif” adalah nilai dari atribut src.
Setiap tag terkadang mempunyai atribut tersendiri yang menentukan informasi atau bentuk tampilan dari tag yang digunakan sebagai contoh tag <image> mempunyai atribut "src" sebagai informasi file image yang ingin ditampilkan.
Contoh :
<image src="gambarku.gif">
src adalah atibut dari tag <image>, sedang “gambarku.gif” adalah nilai dari atribut src.
Tag-tag HTML yang sering digunakan
Pada elemen HEAD
TITLE
Digunakan untuk menentukan judul halaman web
Contoh :
TITLE
Digunakan untuk menentukan judul halaman web
Contoh :
<TITLE>My Web Site</TITLE>
Tulisan diantara tag <title> di atas akan dimunculkan di title bar “My Web Site”
Tulisan diantara tag <title> di atas akan dimunculkan di title bar “My Web Site”
META
Tag meta berfungsi sebagai bagian yang digunakan dalam pencarian, misalkan search engine, seperti yahoo, atau google. Kata-kata yang pertama kali dicari oleh search engine adalah kata-kata yang terdapat di tag <meta>.
Tag meta berfungsi sebagai bagian yang digunakan dalam pencarian, misalkan search engine, seperti yahoo, atau google. Kata-kata yang pertama kali dicari oleh search engine adalah kata-kata yang terdapat di tag <meta>.
Dalam tag meta terbagi menjadi beberapa elemen, misalkan untuk keyword, deskripsi web dan lain sebagainya.
Contoh :
memberikan informasi tentang keyword situs :
<meta name="keyword" content="situs pribadi, situs indah">
memberikan informasi tentang penjelasan situs :
<meta name="description" content="Situs pribadi ku, memberikan segudang informasi bermanfaat">
memberikan informasi tentang keyword situs :
<meta name="keyword" content="situs pribadi, situs indah">
memberikan informasi tentang penjelasan situs :
<meta name="description" content="Situs pribadi ku, memberikan segudang informasi bermanfaat">
Pada Elemen BODY:
Heading
Membuat heading menggunakan tag <h1></h1>, <h2></h2>, <h3></h3>,
dan seterusnya.
contoh :
<h1>Heading 1</h1>
Heading
Membuat heading menggunakan tag <h1></h1>, <h2></h2>, <h3></h3>,
dan seterusnya.
contoh :
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
Paragraf
membuat paragraf menggunakan tag <p></p>
contoh :
<p>
HTML merupakan kepanjangan dari Hipertext MarkUp Language yaitu suatu bahasa yang digunakan untuk membuat Web Page. HTML terdiri dari elemen dan tag.
</p>
membuat paragraf menggunakan tag <p></p>
contoh :
<p>
HTML merupakan kepanjangan dari Hipertext MarkUp Language yaitu suatu bahasa yang digunakan untuk membuat Web Page. HTML terdiri dari elemen dan tag.
</p>
Pindah Baris
Untuk pindah baris menggunakan ke baris berikutnya menggunakan tag <br>
contoh :
<p>
Nama : Vidieyanto <br>
Alamat : Sempati<br>
e-mail : vidie_k5ks@yahoo.com<br>
</p>
Untuk pindah baris menggunakan ke baris berikutnya menggunakan tag <br>
contoh :
<p>
Nama : Vidieyanto <br>
Alamat : Sempati<br>
e-mail : vidie_k5ks@yahoo.com<br>
</p>
Blockqoute
Tag <BLOCKQOUTE> digunakan untuk menulis kutipan teks. Di browser akan menampilkan tulisan yang menjorok ke dalam.
Contoh :
<h3>Sepintas HTML</h3>
<blockqoute>
HTML merupakan kepanjangan dari Hipertext MarkUp Language yaitu
suatu bahasa yang digunakan untuk membuat Web Page. HTML terdiri
dari elemen dan tag.
</blockqoute>
Tag <BLOCKQOUTE> digunakan untuk menulis kutipan teks. Di browser akan menampilkan tulisan yang menjorok ke dalam.
Contoh :
<h3>Sepintas HTML</h3>
<blockqoute>
HTML merupakan kepanjangan dari Hipertext MarkUp Language yaitu
suatu bahasa yang digunakan untuk membuat Web Page. HTML terdiri
dari elemen dan tag.
</blockqoute>
Center
Tag <center> digunakan untuk menengahkan tulisan di dalam halaman
contoh :
<center>Teks di tengah</center>
Tag <center> digunakan untuk menengahkan tulisan di dalam halaman
contoh :
<center>Teks di tengah</center>
Membuat List
Ordered List <ol> : membuat daftar item dengan tiap item dengan menggunakan angka
Unordered List <ul> : membuat daftar item dengan menggunakan tanda bullet.
Contoh :
Ordered List <ol> : membuat daftar item dengan tiap item dengan menggunakan angka
Unordered List <ul> : membuat daftar item dengan menggunakan tanda bullet.
Contoh :
<p>Jenis-Jenis Olahraga</p>
<ol>
<li> Basket </li>
<li> Sepak Bola </li>
<li> Bulu Tangkis </li>
<li> Volly </li>
</ol>
<p>Menu Hari ini</p>
<ul>
<li> Nasi Putih </li>
<li> Tahu </li>
<li> Tempe </li>
<li> Ayam Bakar </li>
</ul>
<ol>
<li> Basket </li>
<li> Sepak Bola </li>
<li> Bulu Tangkis </li>
<li> Volly </li>
</ol>
<p>Menu Hari ini</p>
<ul>
<li> Nasi Putih </li>
<li> Tahu </li>
<li> Tempe </li>
<li> Ayam Bakar </li>
</ul>
Hypertext Link
Hypertext Link, yaitu informasi yang satu dengan yang lainnya dapat berhubungan dalam jaringan. Karena kemajuan teknologi hypertext link bukan lagi hanya menggunakan teks biasa, melainkan sudah bisa dalam bentuk multimedia sehingga disebut Link.
Untuk membuat Link menggunakan tag <a> ... </a>. Tag ini menggunakan atribut HREF yang digunakan untuk menghubungkan dokumen lain, bentuk penulisannya sebagai berikut :
<a href=”http://www.belajar-gratis.com”>Situs Belajar-Gratis.com</a>
<a href=”dok.htm”> Dokumen Lain </a>
Hypertext Link, yaitu informasi yang satu dengan yang lainnya dapat berhubungan dalam jaringan. Karena kemajuan teknologi hypertext link bukan lagi hanya menggunakan teks biasa, melainkan sudah bisa dalam bentuk multimedia sehingga disebut Link.
Untuk membuat Link menggunakan tag <a> ... </a>. Tag ini menggunakan atribut HREF yang digunakan untuk menghubungkan dokumen lain, bentuk penulisannya sebagai berikut :
<a href=”http://www.belajar-gratis.com”>Situs Belajar-Gratis.com</a>
<a href=”dok.htm”> Dokumen Lain </a>
Tidak ada komentar:
Posting Komentar