HTML

PENGERTIAN HTML

adalah singkatan dari Hypertext Markup Language. HTML memungkinkan seorang user untuk membuat dan menyusun bagian paragraf, heading, link atau tautan, dan blockquote untuk halaman web dan aplikasi.
HTML bukanlah bahasa pemrograman, dan itu berarti HTML tidak punya kemampuan untuk membuat fungsionalitas yang dinamis. Sebagai gantinya, HTML memungkinkan user untuk mengorganisir dan memformat dokumen, sama seperti Microsoft Word.
Ketika bekerja dengan HTML, kami menggunakan struktur kode yang sederhana (tag dan attribute) untuk mark up halaman website. Misalnya, kami membuat sebuah paragraf dengan menempatkan enclosed text di antara tag pembuka <p>  dan tag penutup </p>.
Sejarah HTML
HTML dibuat oleh Tim Berners-Lee, seorang ahli fisika di lembaga penelitian CERN yang berlokasi di Swiss. Dia memiliki ide tentang sistem hypertext yang berbasis internet.
Hypertext merujuk pada teks yang memuat referensi (link) ke teks lain yang bisa diakses langsung oleh viewer. Tim merilis versi pertama HTML pada tahun 1991, dan di dalamnya terdiri atas 18 HTML tag. Sejak saat itu, setiap kali bahasa HTML merilis versi teranyarnya, selalu ada tag dan attribute (tag modifier) terbaru.
Berdasarkan HTML Element Reference milik Mozilla Developer Network, untuk saat ini, ada 140 HTL tag meskipun sebagiannya sudah usang (tidak lagi didukung oleh versi terbaru browser).
Berkat popularitasnya yang terus meningkat, HTML kini dianggap sebagai web standard yang resmi. Spesifikasi HTML di-maintain dan dikembangkan oleh World Wide Web Consortiumm (W3C). Cek versi terbaru dari bahasa ini di website W3C.
Upgrade HTML besar-besaran terjadi pada tahun 2014, dan hasilnya adalah pengenalan HTML5. Pada upgrade tersebut, terdapat semantic baru yang memberitahukan arti dari kontennya sendiri, seperti <artcile>, <header>, dan <footer>.

Berikut contoh kode dari susunan atau struktur HTML:


  1. <div>
  2. <h1>The Main Heading</h1>
  3. <h2>A catchy subheading</h2>
  4. <p>Paragraph one</p>
  5. <img src="/" alt="Image">
  6. <p>Paragraph two with a <a href="https://example.com">hyperlink</a></p>
  7. </div>

  1. <div>
  2. <h1>The Main Heading</h1>
  3. <h2>A catchy subheading</h2>
  4. <p>Paragraph one</p>
  5. <img src="/" alt="Image">
  6. <p>Paragraph two with a <a href="https://example.com">hyperlink</a></p>
  7. </div>

  • Elemen teratas dan terbawah adalah division sederhana (<div></div>) yang bisa Anda gunakan untuk mark up bagian konten yang lebih besar.
  • Susunan HTML di atas terdiri atas heading (<h1></h1>), subheading (<h2></h2), dua paragraf (<p></p>), dan satu gambar (<img>).
  • Paragraf kedua meliputi sebuah link (<a></a>) dengan attribute href yang terdiri atas URL tujuan.
  • Tag gambar memiliki dua attribute, src untuk path gambar dan alt untuk deskripsi gambar.
Gambaran Umum Tentang Tag HTML yang Paling Sering Digunakan
Tag HTML memiliki dua tipe utama: block-level dan inline tags.
  1. Elemen block-level memakai semua space yang tersedia dan selalu membuat line baru di dalam dokumen. Contoh dari tag block adalah heading dan paragraf.

  1. Elemen inline hanya memakai space sesuai dengan kebutuhannya dan tidak membuat line baru di halaman. Biasanya elemen ini akan memformat isi konten dari elemen block-level. Contoh dari tag inline adalah link dan emphasized strings.

Tag Block-Level
Tiga tag block-level yang harus dimiliki oleh setiap dokumen HTML adalah <html>, <head>, dan <body>.
  1. Tag <html></html> adalah elemen level tertinggi yang menyertakan setiap halaman HTML.
  2. Tag <head></head> menyimpan informasi meta, seperti judul dan charset halaman.
  3. Tag <body></body> melampirkan semua konten yang muncul pada suatu halaman.
  1. <html>
  2. <head>
  3. <!-- META INFORMATION -->
  4. </head>
  5. <body>
  6. <!-- PAGE CONTENT -->
  7. </body>

Kelebihan dan Kekurangan HTML
Sama seperti hal teknis lainnya dalam dunia web, HTML juga punya kelebihan dan kekurangannya.
Kelebihan:
  • Bahasa yang digunakan secara luas dan memiliki banyak sumber serta komunitas yang besar.
  • Dijalankan secara alami di setiap web browser.
  • Memiliki learning curve yang mudah.
  • Open-source dan sepenuhnya gratis.
  • Bahasa markup yang rapi dan konsisten.
  • Standard web yang resmi di-maintain oleh World Wide Web Consortium (W3C).
  • Mudah diintegrasikan dengan bahasa backend, seperti PHP dan Node.js.
Kekurangan:
  • Paling sering digunakan untuk halaman web statis. Untuk fitur dinamis, Anda bisa menggunakan JavaScript atau bahasa backend, seperti PHP.
  • HTML tidak memungkinkan user untuk menjalankan logic. Alhasil, semua halaman web harus dibuat terpisah meskipun menggunakan elemen yang sama, seperti header dan footer.
  • Fitur-fitur baru tidak bisa digunakan secara cepat di sebagian browser.
  • Terkadang perilaku browser susah untuk diprediksi (misalnya, browser lama tidak selalu bisa render tag yang lebih baru).

    Komentar

    Posting Komentar

    Postingan populer dari blog ini

    Prototype

    Gambar
    PROTOTYPE PENGERTIAN PROTOTYPE PRODUK Salah satu kaidah penting dalam Design Thinking adalah “Fail fast to succeed sooner” atau “Gagal cepat agar sukses lebih cepat.” Maksudnya Saat merancang sebuah produk, meskipun sudah dilakukan riset yang cukup, kita tidak dapat memastikan bahwa produk kita akan diterima oleh pasar. Satu-satunya cara untuk mengetahuinya adalah dengan mengujinya di pasar. Namun, sebelum kita menguji versi akhir dari produk kita, ada baiknya kita meluncurkan versi prototipenya terlebih dulu ke kalangan terbatas. Tujuannya adalah agar kita mendapatkan umpan balik dari pengguna segera. Perhatian terhadap kualitas yang terbaik adalah bukan terpaku pada produk akhirnya saja. Hal ini penting agar produk akhir yang dihasilkan adalah produk yang bebas cacat dan tidak ada lagi pemborosan karena produk tersebut dibuang atau dikerjakan ulang.  Maka sebaiknya perhatian terhadap kualitas produk  harus dimulai sejak awal pembuatan produk. Tahapan yang sang...
    Baca selengkapnya