Skip to content Skip to sidebar Skip to footer
Selamat Datang Di Blog Artikel Kita, Semoga Bermanfaat.....
Home / HTML / Pemrograman / website

Pengenalan HTML: Membangun Dasar - dasar Situs Web

by TEKNISI TEMBUNG Post a Comment

Dalam era digital ini, situs web telah menjadi bagian tak terpisahkan dari kehidupan kita. Ketika kita menjelajah internet, kita berinteraksi dengan berbagai situs web yang menyajikan informasi, layanan, dan hiburan. Di balik tampilan menarik dan fungsionalitas yang kita nikmati, ada teknologi yang memungkinkan hal ini terjadi, salah satunya adalah HyperText Markup Language (HTML). Artikel ini akan membawa Anda melalui pengantar yang mendalam ke HTML, memberikan pemahaman dasar tentang cara membangun struktur dasar situs web.

Apa itu HTML?

Yaitu bahasa markup, bukan merupakan Bahasa pemrograman, sebab ciri Bahasa pemrograman setidaknya memiliki variable, function, pengkondisian, pengulangan dll, markup karena didalamnya berisi tag yang memberitahukan browser menampilkan sebuah text atau content yang akan kita jadikan seperti paragraph, halaman dll..

HTML, singkatan dari HyperText Markup Language, adalah bahasa markah standar untuk membangun dan merancang halaman web. Ini adalah dasar dari hampir setiap situs web yang Anda temui. HTML digunakan untuk merencanakan struktur dan tata letak suatu halaman web. Markup dalam HTML merujuk pada penggunaan tag atau kode yang ditempatkan dalam teks untuk memberikan instruksi kepada browser tentang bagaimana cara menampilkan konten.

Html diciptakan oleh Tim Berners Lee yang menciptakan web browser pertama dimana beliau saat ini menjadi direktur dari konsorsium w3C, selain menciptakan html, beliau juga penemu protocol http, www, web server serta web page.



W3C merupakan konsorsium yang memperhatikan standard standard untuk perkembangan website.

Dasar-Dasar HTML

Untuk memulai membangun sebuah halaman web, kita membutuhkan sebuah editor dimana saat ini banyak editor – editor yang dapat kita temukan yang memiliki fasilitas serta plugin – plugin yang sangat lengkap seperti Sublime Text, Visual Studio Code dan – lain -lain.

Untuk system operasi windows kita dapat menggunakan notepad dan untuk linux kita dapat menggunakan terminal, namun kita tidak merekomendasikan untuk membangun sebuah halaman web menggunakan editor notepad dan terminal. 

Disini kami akan memberikan contoh bagaimana membangun sebuah halaman web yang sangat sederhana menggunakan notepad.

Semua elemen di dalam halaman web dibangun menggunakan tag HTML. Tag HTML dikelilingi oleh tanda kurung sudut (angle brackets) dan biasanya datang dalam pasangan: tag pembuka dan tag penutup. Tag pembuka memiliki format `<nama_tag>` sedangkan tag penutup memiliki format `</nama_tag>`. Elemen di antara tag pembuka dan penutup adalah konten yang akan ditampilkan di halaman web.

Contoh sederhana dari tag HTML adalah `<p>` yang digunakan untuk membuat paragraf. Berikut adalah contoh penggunaannya:

<p>Ini adalah contoh paragraf dalam HTML.</p>

Selain itu, tag juga dapat memiliki atribut yang memberikan informasi tambahan tentang elemen tersebut. Atribut ditempatkan di dalam tag pembuka dan biasanya memiliki nama dan nilai. Contoh penggunaan atribut dalam tag `<a>` (anchor/link) adalah:

<a href="https://www.contohwebsite.com">Kunjungi Contoh Website</a>

Dalam contoh di atas, atribut `href` digunakan untuk menentukan URL tujuan ketika tautan tersebut diklik.

Struktur Dasar HTML

Setiap halaman web memiliki struktur dasar yang diatur oleh HTML. Struktur ini terdiri dari elemen-elemen seperti `<html>`, `<head>`, dan `<body>`. Berikut adalah struktur dasar dari halaman web:

<!DOCTYPE html>

<html>

<head>

    <title>Judul Halaman</title>

</head>

<body>

    <h1>Selamat Datang di Situs Saya</h1>

    <p>Ini adalah contoh halaman web menggunakan HTML.</p>

</body>

</html>


  • <!DOCTYPE html>`: Deklarasi tipe dokumen yang menunjukkan bahwa halaman ini adalah dokumen HTML5.
  • `<html>`: Elemen akar yang mengelilingi semua isi halaman.
  • `<head>`: Bagian yang berisi informasi tentang halaman, seperti judul yang akan ditampilkan di jendela browser.
  • `<title>`: Menentukan judul halaman yang ditampilkan di tab browser.
  • `<body>`: Konten utama halaman web yang akan ditampilkan kepada pengunjung.



Penggunaan Elemen-Elemen Umum dalam HTML

HTML memiliki banyak elemen yang dapat digunakan untuk merancang dan mengorganisasi konten di halaman web. Beberapa elemen umum yang perlu Anda ketahui adalah:

  1. Heading (`<h1>`, `<h2>`, `<h3>`, dst.): Digunakan untuk judul dan subjudul halaman.
  2. Paragraf (`<p>`): Digunakan untuk menampilkan teks paragraf.
  3. Tautan (`<a>`): Membuat tautan ke halaman lain atau sumber eksternal.
  4. Gambar (`<img>`): Menampilkan gambar di halaman web.
  5. Daftar (`<ul>`, `<ol>`, `<li>`): Membuat daftar tak berurutan (unordered) atau berurutan (ordered).
  6. Formulir (`<form>`) dan Input: Membuat formulir untuk mengumpulkan informasi dari pengguna.


Kesimpulan

Dalam artikel ini, kita telah menjelajahi dasar-dasar HyperText Markup Language (HTML) yang merupakan landasan dalam membangun halaman web. Dengan menggunakan tag dan elemen HTML, Anda dapat merancang struktur dan tampilan halaman sesuai kebutuhan Anda. Dengan memahami konsep dasar yang dijelaskan di atas, Anda sudah memiliki pondasi yang kuat untuk melangkah lebih jauh dalam memahami dan mengembangkan situs web yang lebih kompleks.


Jika Anda ingin belajar lebih lanjut, Anda dapat mengacu pada sumber-sumber online seperti dokumentasi resmi HTML di https://www.w3.org/TR/html52/ yang akan memberikan pemahaman lebih dalam tentang elemen-elemen dan atribut-atribut HTML.

Post a Comment for "Pengenalan HTML: Membangun Dasar - dasar Situs Web"