this → Artikel Baru – ( Atrikel Lama ↓ )

5 Bagian Dasar dalam Pembuatan Dokumen HTML

Pada artikel ini akan dipelajari segala dasar dari Kode HTML. Ada berbagai tag-tag dasar yang harus dipahami dan dimasukkan ketika membuat kode HTML. Dimana tag-tag dasar tersebut membantu dalam pengorganisasian dan pemformatan dasar dari elemen dalam skrip atau laman web. 

Dasar dokumen HTML
Berikut ini akan disebutkan dasar-dasar dari tag HTML yang akan membagi kode program ke dalam beberapa variasi seperti headbody, dan lain sebagainya.
  • satu, Setiap dokumen HTML selalu diawali dengan sebuah tag dokumen HTML. Meskipun bukan sebuah keharusan tetapi ini merupakan permulaan yang bagus untuk memulai membuat dokumen dengan menyebutkan atau memanggil tag tersebut: <!DOCTYPE html>
  • dua, <html>: setiap kode HTML harus berada diantara kedua tag dasar HTML. Tag tersebut dimulai dengan <html> dan diakhiri dengan </html>.
  • tiga, <head>: tag head muncul setelah tag <html> yang mengandung semua informasi header dari laman web atau dokumen seperti title dan berbagai informasi lainnya. Informasi tersebut terletak diantara tag head yang dimulai dengan <head> dan diakhiri dengan </head>. Konten dari tag head akan dijelaskan pada sesi lain dari materi HTML.
  • empat, <title>: Judul dari sebuah laman web dapat dipanggil menggunakan tag <title>. Ini adalah informasi yang terdapat pada header yang dipanggil bersamaan dengan tag headerTag judul diawali dengan <title> dan diakhiri dengan </title>.
  • lima, <body>: Tahap selanjutnya adalah tahapan yang paling penting dari semua tag yang kita pelajari sejauh ini. Tag body mengandung bentuk aktual dari laman web yang terlihat langsung oleh pengguna. Bagian ini diawali dengan <body> dan diakhiri dengan </body>. Setiap konten yang terletak diantara tag akan ditampilkan pada laman web baik itu tulisan, gambar, audio, ataupun link. Selanjutnya akan dijelaskan bagaimana menggunakan berbagai jenis tag untuk memanggil konten pada laman web.

Secara umum seluruh kode HTML akan terlihat sebagai berikut:

<!DOCTYPE html>

<html>

<!-- Dasar HTML -->

  

<head>

<!-- Informasi tentang halaman -->

<!-- Ini adalah tag komentar -->

<title>

Muhammad Nasution

</title>

</head>

 

<body>

<!-- Komentar bagian konten web -->

</body>

</html>


Kode html yang telah ditulis sebelum ini tidak akan menampilkan apapun pada browser. Kode tersebut hanya menampilkan bentuk dasar dari cara menulis kode HTML dan akan dinamai dengan judul dari page sebagai Muhammad Nasution<!-- comment here--> adalah tag komentar pada HTML dan tidak akan dibaca apapun yang terdapat didalamnya (tag komentar).

Pahami pula, tentang semua konsep desain Web untuk tingkat pemula melalui materi lengkap HTML [klik].


HTML Heading
Tag ini membantu untuk memberikan heading ke konten dari laman webTag tersebut umumnya ditulis di dalam tag body. HTML menyediakan enam jenis heading tag, mulai dari <h1> hingga <h6>. Setiap tag akan menampilkan heading dengan gaya dan ukuran huruf yang berbeda.

Contoh:

<!DOCTYPE html>

<html>

<!-- Dasar HTML -->

  

<head>

<title>

Html Judul

</title>

</head>

 

<body>

<h1>

Selamat data di Indomaret, Selamat berbelanja!

</h1>

 

<h2>

Selamat data di Indomaret, Selamat berbelanja!

</h2>

 

<h3>

Selamat data di Indomaret, Selamat berbelanja!

</h3>

 

<h4>

Selamat data di Indomaret, Selamat berbelanja!

</h4>

 

<h5>

Selamat data di Indomaret, Selamat berbelanja!

</h5>

 

<h6>

Selamat data di Indomaret, Selamat berbelanja!

</h6>

</body>

</html>

Output: 

Selamat data di Indomaret, Selamat berbelanja!

Selamat data di Indomaret, Selamat berbelanja!

Selamat data di Indomaret, Selamat berbelanja!

Selamat data di Indomaret, Selamat berbelanja!

Selamat data di Indomaret, Selamat berbelanja!
Selamat data di Indomaret, Selamat berbelanja!

HTML Paragraph
Tag ini membantu membuat statement paragraf pada sebuah laman web. Dimulai dengan tag <p> dan diakhiri dengan </p>Tag <br> digunakan untuk keluar barisan (enter). <br> adalah sebuah tag kosong. 

Baca juga, tentang materi bahasa pemrograman lainnya melalui Materi Lengkap Bahasa Pemrograman [klik].



Contoh:

<!DOCTYPE html>

<html>

<!-- Dasar HTML -->

 

<head>

<title>

Dasar HTML

</title>

</head>

 

<body>

<h1>

Selamat datang di Indomaret, Selamat berbelanja!

</h1>

 

<p>

Rotinya sekalian kak?<br>

Rotinya sekalian kak?<br>

Rotinya sekalian kak?<br>

</p>

</body>

</html>

Output:

Selamat datang di Indomaret, Selamat berbelanja!

Rotinya sekalian kak?
Rotinya sekalian kak?
Rotinya sekalian kak?


HTML garis horizontal
Tag <hr> digunakan untuk keluar dari laman menjadi beberapa bagian berbeda dengan cara menciptakan margin horizontal dengan bantuan dari garis horizontal yang membentang dari kiri ke kanan sisi dari laman webTag <hr> adalah tag kosong dan tidak membutuhkan penambahan statement apapun. 

Contoh:

<!DOCTYPE html>

<html>

<!-- Dasar HTML -->

 

<head>

<title>

Bukan kaleng-kaleng

</title>

</head>

 

<body>

<h1>

Aku adalah seorang raja bajak laut!

</h1>

 

<p>

kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.<br>

kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.<br>

kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.<br>

</p>

 

<hr>

 

<p>

kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.<br>

kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.<br>

kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.<br>

</p>

 

<hr>

 

<p>

kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.<br>

kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.<br>

kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.<br>

</p>

 

<hr>

 

</body>

</html>

Output:

Aku adalah seorang raja bajak laut!

kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.
kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.
kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.


kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.
kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.
kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.


kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.
kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.
kakekku adalah seorang kapiten, tapi pedangnya tidak panjang.



HTML image
Tag image digunakan untuk memasukkan gambar ke dalam laman web. Sumber dari gambar yang akan dimasukkan adalah terletak didalam tag <img src=" sumber alamat gambar pada komputer">.

Contoh:

<!DOCTYPE html>

<html>

<!-- Dasar HTML -->

 

<head>

<title>

Jumanji

</title>

</head>

 

<body>

 

<img src="https://3.bp.blogspot.com/-zNO07fkjK6k/YHqJPdHNfiI/AAAAAAAANrI/DtkJcA7aZU0qijCblBJ9cB9DZUSujN7RACK4BGAYYCw/s113/IMG-20190205-WA0015.jpg">

 

</body>

</html>

Output: 

Komentar

  1. Apa yang dimaksud dengan tag pada HTML?

    BalasHapus
    Balasan
    1. Tag HTML umumya didefinisikan sebagai sekumpulan karakter yang membentuk perintah yang diformat untuk halaman web. Pada inti HTML, tag tersebut akan memberikan arahan-arahan atau resep untuk konten visual yang akan ditampilkan atau yang akan dilihat oleh user pada web.

      Hapus
  2. Secara sederhana apa yang dimaksud dengan tag html?

    BalasHapus
    Balasan
    1. Tag juga dapat dimaksud sebagai label, dimana label tersebut digunakan sebagai penanda dari tampilan apa yang akan diperlihatkan pada halaman web.

      Hapus
  3. Ada berapa banyak tag yang terdapat dalam html?

    BalasHapus
    Balasan
    1. Umumnya terdapat 10 jenis tag yang paling sering atau paling umum digunakan pada HTML, namun demikian dalam perkembangannya ada lebih dari 100 tag pada HTML5, dimana umumnya hanya sebagian kecil saja dari keseluruhan tag tersebut yang digunakan.

      Hapus

Posting Komentar

Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung. :D

Catatan: setiap iklan yang ditayangkan pada blog ini bersumber dari google adsense. Dengan jenis iklan yang dipilih adalah, sebagai berikut.

POIN 1, Iklan yang ditampilkan hanya boleh berbahasa indonesia atau berbahasa inggris. Tidak menerima jenis iklan dalam bahasa yang lain selain yang telah disebutkan karena blog ini dibuat untuk para pengunjung dari negara atau orang yang berbahasa Indonesia.

POIN 2, Setiap gambar yang ditampilkan pada iklan sifatnya tidak mengganggu para pengunjung yang melihat blog, atau tidak boleh menampilkan gambar yang bersifat menjijikkan atau merangsang rasa mual.

POIN 3, Jenis iklan yang dipasang bukan merupakan iklan spam, atau berisi dan mengarahkan pengunjung ke alamat yang berbahaya atau bersifat penipuan.

POIN 4, Segala bentuk iklan tunduk dan patuh pada ketentuan dari pihak Adsense google dan pemilik blog.

POIN 5, Segala jenis iklan yang tidak bertentangan dengan poin 1-4 yang dijelaskan sebelumnya, maka iklan tersebut dapat ditampilkan pada blog.



~ Ikatlah Ilmu dengan Memostingkannya ~

Hot Artikel

Enkapsulasi pada Java

Perbedaan stdio.h dan stdlib.h pada Bahasa C

Penjelasan Singkat tentang Konsep Asosiasi, Komposisi, dan Agregasi pada Java

2 Jenis Utama Kegiatan Penelitian Berdasarkan Waktunya, Crosssectional Salah Satunya