Pengenalan Dasar HTML dan Contohnya

Pengenalan Dasar HTML dan Contohnya - HTML (Hypertext Markup Language) adalah salah satu bahasa dasar yang digunakan untuk membangun sebuah halaman web pada browser (penjelajah web). Dalam membangun sebuah halaman web dengan menggunakan bahasa HTML itu sendiri hanya dapat menghasilkan halam web yang dibangun sangat sederhana, dan kurang menarik. HTML bekerja untuk membuat dan menyusun berbagai bagian seperti paragraf, heading, tautan, atau link dan blockquote untuk halaman web dan aplikasi. Berikut ini Pengenalan Dasar HTML dan Contohnya.

Pengertian HTML (Hypertext Markup Language)

Sebelum membangun sebuah halaman web kita harus memahami beberapa dasar-dasar seperti mengerti HTML. Selain itu biasanya bahasa HTML akan dimanipulasi dengan menggabungkan script (code) seperti bahasa pemrograman lain diantaranya yaitu: JavaScript, PHP, CSS, dan masih banyak lagi. Maka dengan itu, diperlukan juga keterampilan untuk membangun sebuah web untuk menguasai bahasa yang satu ini. Walaupun terkesan sederhana tapi sangat diperlukan juga untuk kemampuan dasar belajar pemrograman.

Bahasa HTML merupakan bahasa Markup bukanlah sebuah bahasa pemrograman karena jika anda pernah menggunakan bahasa pemrograman maka anda akan mengerti mengapa bahasa tersebut bukan disebuat sebagai bahasa pemrograman. Di dalam HTML anda tidak akan menemukan struktur-struktur yang biasanya terdapat pada sebuah bahasa pemrograman seperti: IF, Loop, pembuatan variabel dan lain sebagainya.

Contoh : Jika anda membuat sebuah paragraf dan menempatkan enclosed text pada bagian tag pembuka seperti <p> dan diakhiri dengan tag penutup seperti </p>

<p>Ini adalah cara menambahkan paragraf dalam HTML.</p>

<p>Anda dapat membuat lebih dari satu pada kotak postingan ini!</p>

Kesimpulannya bahwa HTML itu sebagai bahasa mark up dan sangatlah mudah untuk dipelajari dan dipahami bahkan bagi webmaster pemula di bidang web development sekalipun.

Berikut beberapa penyusunan atau struktur dalam penulisan pada HTML sebagai berikut:

<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>

Pastinya sobat sudah mengerti dengan tag di atas kan? kita lanjut dan bahas satu persatu yuk ikuti terus ulasan berikut ini.

Penjelasan Dari Tag HTML

Berikut ini adalah penjelasan dari beberapa tag pada HTML:

1. <!DOCTYPE HTML> merupakan tag awal pada setiap struktur HTML, tag tersbut berfungsi untuk menginformasikan pada web browser, bahwa file yang akan kita buka saat ini adalah file HTML.

2. <HTML> </HTML> merupakan tag awal pada setiap tag HTML dan seluruh tag HTML yang akan di buat akan di tulis didalam tag ini.

3. <HEAD> </HEAD> merupakan tag Head yang akan digunakan untuk menyimpan berbagai informasi tentang dokumen HTML, isi dari tag Head ini tidak akan tampak pada web browser.

4. <TITLE> </TITLE> merupakan tag yang berada di dalam tag Head, tag ini adalah salah satu contoh tag informasi yang di simpan dalam tag Head, tag Title akan menampilkan teks pada judul browser atau pada tab browser.

5. <BODY> </BODY> merupakan tag Body yang akan menampilkan pada web browser pada keseluruhan tag tag yang telah di tulis di dalamnya.

Contoh Percobaan HTML

Berikut ini adalah beberapa contoh percobaan menggunakan HTML sebagai berikut:

1. Percobaan satu (Dokumen HTML)

Buka text editor notepad dan ketikkan script di bawah ini ke dalam notepad:

<!DOCTYPE html>
<html>
<head>
<title> Dokumen HTML </title>
</head>
<BODY bgcolor="skyblue">
Berikut ini adalah sebuah dokumen HTML dengan judul "Dokumen HTML" dan warna latar/background biru langit.
Terima Kasih.
</body>
</html>

Setelah itu simpan dengan nama dokumen.html lalu buka file yang telah disimpan menggunakan browser.

2. Percobaan dua (Heading)

Buka text editor notepad dan ketikkan script di bawah ke dalam notepad:

<!DOCTYPE html>
<HTML>
<HEAD><TITLE>HEADING</TITLE></HEAD>
<BODY>
<h1><b>Teks dengan ukuran heading one</b></h1>
<h2><i>Teks dengan ukuran heading two</i></h2>
<hr> <br>
<h3>Teks dengan ukuran heading three</h3>
<h4>Teks dengan ukuran heading four</h4>
<hr width="500">
<h5>Teks dengan ukuran heading five</h5>
<h6>Teks dengan ukuran heading six</h6>
</BODY>
</HTML>

Simpan dengan nama heading.html dan buka file yang disimpan menggunakan browser.

Berikut ini merupakan cara penggunaan tag untuk membuat garis miring contohnya sobat ingin membuat huruf miring pada HTML. Kode <i> adalah sebuah tag yang berfungsi untuk membuat huruf miring pada HTML seperti berikut:

<i>Belajar HTML</i> Dasar

Dari perintah di atas dapat kita lihat bahwa tag <i> di akhiri dengan </i> yang berarti perintah tersebut menandakan bahwa "Belajar HTML" adalah text yang di buat menjadi miring. Berbeda dengan "Dasar" tidak menjadi miring karena tag <i> pada printah tersebut telah di akhiri setelah kata "HTML" menggunakan tag </i> atau tag penutup.

Anda juga dapat mempelajari Kamus Html Lengkap daan juga mengenal berbagai jenis metode tentang pembelajaran dari Karakter dan Simbol Lengkap dari dasar bahasa pemrograman Html tersebut.

Kesimpulan

Seperti yang sudah dijelaskan diatas HTML itu sendiri memiliki suatu ketentuan, yaitu setiap tag penutup harus ditutup dengan tanda garis miring (/ ) yang berfungsi untuk menandakan bahwa printah tersebut di akhiri dengan tag penutup. Demikian penjelasan tentang pengenalan bahasa HTML semoga sobat dapat memahami dan mudah untuk mengerti dari apa yang sudah di jelaskan di blog codinglan ini. Terimakasih