Ritaelfianis.id – Apa itu HTML? HTML adalah markup language yang dipakai untuk membuat halaman website.
HTML ini sebagai salah satu teknis yang digunakan dalam pemrograman. Untuk membangun suatu situs di internet, Anda harus memahami betul mengenai HTML, terlebih lagi jika ingin menjadi seorang programmer.
HTML adalah singkatan dari Hypertext Markup Language. Kode HTML digunakan untuk memastikan format gambar dan teks yang tepat untuk pencarian di internet.
Tanpa ini, mesin pencarian akan kesulitan menampilkan teks sebagai komponen dan gambar sebagai komponen lainnya.
Pengertian HTML
HTML terdiri dari kombinasi simbol dan teks yang diarsipkan dalam sebuah file. Ada standar atau format khusus yang wajib diikuti dalam membuat sebuah file.
Format tersebut telah diatur dalam standar kode internasional atau ASCII (American Standard Code for Information Interchange).
Pengertian HTML ialah bahasa standar pemrograman yang menggunakan tanda-tanda (tag) untuk menyatakan berbagai kode agar mudah ditafsirkan oleh mesin pencari sehingga halaman tersebut bisa ditampilkan secara benar dan tepat.
Jadi secara sederhana, HTML adalah kerangka yang membentuk dan mengatur tampilan sebuah halaman web di browser.
Untuk membentuk dan mengatur halaman web tersebut maka digunakanlah bahasa markah atau tag.
Sejarah Perkembangan HTML
Sejarah HTML berawal dari dikembangkannya HTML untuk pertama kalinya oleh Tim Berners-Lee dari organisasi European Organization for Nuclear Research (CERN) pada tahun 1990.
Awalnya ia membuat HTML untuk memudahkan para ilmuwan dalam mengakses dokumen satu sama lain.
HTML versi yang pertama muncul pada tahun 1991 yang memiliki 18 macam tanda (mark).
Perkembangan HTML dari tahun ke tahun semakin meningkat dan versi HTML yang terbaru terus bermunculan. Sampai hari ini ada 120 jenis tanda yang tersedia dalam bahasa HTML.
HTML terus berkembang dengan versi terbarunya menggunakan teknologi paling canggih.
Maka tak heran jika eksistensi HTML berkembang semakin pesat dari segi popularitas. Kini tercatat sudah tercapai 87,4 pengguna HTML.
Apakah HTML Merupakan Bahasa Pemrograman?
Banyak pemula yang merasa bingung mengenai bahasa yang digunakan pada pemrograman HTML.
Namun nyatanya HTML tidak memakai bahasa pemrograman sebab HTML hanya bahasa markah atau penanda, tidak bisa melakukan aksi yang diperintahkan oleh bahasa pemrograman seperti operasi aritmatika.
HTML tidak mempunyai kemampuan untuk membuat fungsionalitas yang dinamis, Anda hanya bisa menggunakan HTML sebagai kerangka pada website dan aplikasi web. HTML merupakan level paling dasar dari teknologi frontend.
Mengenal Komponen-komponen Penting HTML
Secara umum, HTML terdiri dari tiga bagian, yaitu tag, elemen dan atribut.
Berikut ulasan singkat beserta contoh mengenai komponen-komponen penting dari bahasa markup tersebut:
1. Tags
Tags ialah sebuah syntax dan dua tanda spesial yakni tanda awalan dan akhiran dalam perintah HTML yang akan dibaca oleh web browser.
Tag menggunakan dua kurung siku yang memiliki fungsi yang berbeda.
Terdapat dua jenis tag yang dipakai secara berpasangan dalam perintah HTML; Tag pembuka atau opening tag (….) serta tag penutup atau closing tag (/…). Setiap jenis tag akan memberikan hasil yang berbeda.
Hingga kini, HTML memiliki lebih dari seratus tags. Agar lebih mengerti, mari simak ulasannya berikut:
Opening Tag
Tag pembuka terdiri dari nama elemen itu sendiri, sebagaimana yang dicontohkan di atas.
Opening tag (h2) mengklasifikasikan bahwa heading tersebut adalah subheading kedua.
Apabila elemen yang dimaksud adalah sebuah paragraf maka maka opening tag akan menjadi (p)
Closing Tag
Meskipun closing tag memiliki simbol yang mirip dengan opening tag, tetapi perbedaan closing tag terletak pada garis miring sebelum nama elemen.
Fungsi dari garis miring ini sendiri yaitu untuk mendeskripsikan dimana elemen tersebut berhenti dalam satu dokumen.
2. Elemen
Ketika Anda mempelajari HTML, maka salah satu komponen yang paling pentingnya adalah elemen yang berupa keseluruhan kode mulai dari tag pembuka hingga tag penutup.
Elemen terdiri dari simbol dan teks yang berupa tag pembuka, konten, serta tag penutup.
3. Atribut
Atribut adalah informasi ataupun perintah tambahan yang terdapat dalam elemen.
Fungsi dari atribut ini sebagai penjelas perintah tag. Pada umumnya dalam sebuah tag bisa berisi beberapa atribut, namun tidak semua atribut dapat digunakan dalam sebuah tag.
Terdapat beberapa atribut yang dipakai untuk menentukan perintah apabila terjadi sesuatu pada elemen.
Penerapan dari atribut tersebut akan dilaksanakan dengan pemrograman javascript sehingga dapat melakukan aksi tertentu dalam sebuah website.
Mengenal Hubungan HTML dan CSS
Anda telah mengetahui HTML dan komponen penting di dalam HTML. Namun, lebih jauh dari itu, jika kita berbicara mengenai HTML maka akan sangat erat kaitannya dengan CSS.
Jika dianalogikan, HTML sebagai struktur dalam sebuah halaman website sedangkan CSS merupakan tampilannya.
CSS merupakan singkatan dari Cascading Style Sheet. Ini adalah aturan dasar untuk mengendalikan beberapa komponen dalam sebuah website.
Kegunaan dari CSS ini agar komponen-komponen dalam sebuah website bisa lebih terstruktur dan seragam. Namun CSS bukan bahasa pemrograman.
HTML memiliki keterbatasan dalam mengatur tampilan halaman website. Maka CSS bisa mengatasi kendala tersebut dengan membuat warna yang berbeda ketika mouse mendekati link.
Kehadiran CSS berfungsi untuk melengkapi kinerja HTML hingga menjadi tampilan yang sempurna.
Fungsi-Fungsi HTML
Mengapa HTML penting bagi suatu website? Sebab HTML dipakai untuk membuat dokumen elektronik atau yang biasa disebut dengan halaman.
Nantinya halaman tersebut akan ditampilkan di World Wide Web (WWW). Setiap halaman akan terkoneksi dengan halaman lain yang disebut hyperlink.
Setelah mengetahui pengertian dan komponen-komponen penting dari HTML, tentunya Anda juga perlu untuk mengetahui fungsi dari bahasa markup ini.
Berikut adalah hal yang merupakan fungsi dari HTML:
1. Memudahkan dalam Membaca Halaman Website
Fungsi HTML yang paling utama adalah membuat halaman website yang lebih mudah untuk dibaca dan dipahami.
Seluruh laman website yang ada di mesin pencarian menggunakan HTML tanpa ada pengecualian.
2. Menandai Teks Pada Suatu Laman
HTML ditulis pada suatu laman dokumen dengan simbol atau tag tertentu.
Tag dan simbol tertentu akan membuat tampilan teks menjadi bergaris tebal, miring, tebal dan lain sebagainya.
3. Menjadi Pondasi Utama Sebuah Website
Website dibuat dengan beberapa fitur, memakai javascript untuk mengatur pola website, implementasi bahasa pemrograman server PHP serta mendesain web dengan bantuan CSS.
Semua bahasa dapat diklasifikasikan apabila web mempunyai bahasa HTML sebagai pondasi awal.
4. Menandai Elemen serta Membuat Online Form
Lalu apa fungsi HTML selanjutnya?
HTML berfungsi menandai beberapa bagian dalam website seperti, header, footer, navigation dan lain sebagainya.
Di samping itu, HTML juga dipakai sebagai bahasa dalam pembuatan form secara online.
5. Menampilkan gambar, tabel, video
Untuk menampilkan gambar, tabel dan video dalam sebuah halaman website dan blog memerlukan komponen yang disimpan di web menggunakan bahasa HTML.
Fungsi ini sangat vital supaya tampilan web sesuai dengan yang telah dibuat sebelumnya.
6. Mengarahkan Pengguna ke Halaman Website Lain
Tak hanya cukup mengetahui apa itu HTML?
Anda juga perlu tahu bahwa salah satu fungsi dari HTML yaitu mengarahkan pengguna ke website lain atau yang disebut dengan Hyperlink.
Dengan hyperlink ini, pengunjung jadi lebih mudah dalam memperoleh informasi yang berhubungan dengan halaman tersebut.
Contoh Kode HTML
Selanjutnya ada beberapa kode atau tanda HTML yang bisa Anda pelajari, berupa simbol kurung <…> yang berpasangan dimana ini menjadi tanda awal dan akhir.
Teks yang terletak di tengah-tengah tanda kurung akan menjadi objek tujuan dari kedua tanda tersebut.
Supaya Anda tidak merasa bingung, berikut beberapa contoh html:
- <title>maksud dari teks ini adalah judul </title>
- <bold> maksud dari teks ini adalah dicetak tebal </b>
- <p> maksud dari teks ini adalah paragraph </>
Cara Kerja HTML
Untuk memahami cara kerjanya, langkah pertama cobalah Anda membuat dokumen HTML di aplikasi editor HTML dan simpan dengan format .html atau .htm
Pada umumnya dalam sebuah website terdiri dari banyak halaman, kemudian masing-masing dokumen yang berisi komponen HTML akan tersusun menjadi beberapa bagian seperti heading, isi konten dalam bentuk paragraf dan lainnya.
Ekstrak beberapa file di atas kemudian dibuka memakai web browser. Supaya dapat diakses oleh banyak orang maka Anda bisa membaginya secara online maupun menyewa jasa hosting website serta mengupload file website tersebut.
Dengan begitu Anda menjadi tahu cara kerjanya secara sederhana.
Cara Membuat HTML dan CSS
Sebelum memulai langkah cara membuat HTML dan CSS, bahan yang harus Anda persiapkan terlebih dahulu yaitu Text Editor sebagai media untuk menulis dan Web Browser untuk menguji hasil coding supaya proses pembuatan bisa berjalan dengan lancar.
Berikut tahapan membuat HTML dan CSS:
1. Menyusun Struktur Proyek Website
Buatlah folder untuk menyimpan proyek website, gunakan VS Code untuk mengerjakan tahapan ini dan membuka folder yang Anda inginkan.
Kemudian buatlah folder bernama image yang berfungsi untuk menyimpan berbagai gambar yang akan dimasukkan dalam website HTML.
Setelah itu, lakukan langkah yang sama yakni membuat folder untuk index.html yang berisi inti dari proyek yang sedang dikerjakan dan buatlah juga folder style.css yang berfungsi untuk membantu inti dalam pengerjaan website.
2. Add Kode pada Index.html
Tambahkan kode pada Index.html sebagai pondasi utama dari website Anda.
Dalam membuat Index HTML ini, terdapat 4 bagian utama yang menyusun bagian tersebut:
- Tag HTML merupakan wadah untuk menyimpan berbagai komponen HTML yang telah dibuat.
- Tag DTD/Doctype, berfungsi untuk mendeklarasikan jenis dokumen serta file HTML untuk selanjutnya diproses pada web browser. Tag ini harus diletakkan di awal bagian.
- Tag Head, Anda dapat menulis berbagai komponen website yang secara visual tidak akan muncul dalam tampilan website. Seperti source js, source CSS dan lain sebagainya.
- Tag Body, Anda dapat mengisinya dengan berbagai macam konten dalam website HTML.
3. Add Kode pada File style.css
Anda perlu melanjutkan langkah yang ketiga ini. Tanpa adanya CSS tampilan website akan monoton, hanya berupa tulisan-tulisan yang tersusun secara vertikal tanpa adanya bentuk ataupun pola sehingga tampilan menjadi kurang menarik.
Struktur penulisan CSS terdiri dari beberapa bagian:
- Blok Deklarasi, merupakan tempat untuk menuliskan kode style untuk CSS yang dimulai dengan tanda kurung kurawal.
- Selektor, yaitu kata kunci (keyword) yang mengkoneksikan style CSS dengan index.html. Biasanya berupa class, tag, id serta komponen lainnya dalam HTML.
- Properti dan Nilai, berbagai macam aturan yang diberikan pada selektor yang dipilih.
4. Mengakses Web
Apabila semua proses membuat HTML dan CSS sudah selesai, Anda bisa mengetikkan index.html web pada browser.
Tak hanya itu, Anda juga bisa membukanya melalui text editor untuk melakukan perubahan yang bisa dilihat secara langsung di browser.
Setelah mengetahui tentang html dan cara membuatnya, Anda bisa mulai membuat dari hal yang mudah terlebih dahulu.
Seperti membuat heading dan mengkreasikannya dengan cara menambahkan gambar, mengubah bentuk tulisan ataupun merubah warna dari tulisan.
Kelebihan dan Kekurangan Penggunaan HTML
Tak hanya mempelajari HTML secara umum, Anda juga perlu tahu bahwa sebagai bahasa standard dari website, HTML juga memiliki beberapa kelebihan dan kekurangan.
Berikut beberapa kelebihan dan kekurangan tersebut:
1. Kelebihan Menggunakan HTML
- HTML bersifat open source dapat digunakan gratis tanpa biaya tambahan.
- HTML cukup ramah bagi pemula karena strukturnya yang rapi dan konsisten.
- Bahasa Cross Platform yang dapat digunakan dalam banyak sistem operasi yang berbeda.
- Sebagai standard resmi yang ditetapkan oleh World Wide web Consortium (W3C).
- HTML tidak membutuhkan compiler untuk melaksanakan perintah.
- Dapat digunakan dalam berbagai media seperti tabel, gambar dan video.
2. Kekurangan Menggunakan HTML
- HTML hanya bisa menampilkan website yang statis jika tanpa dukungan bahasa lain seperti CSS, JavaScript serta VBScript.
- Bahasa markup ini memiliki beragam tag dan elemen yang terkadang sulit dipelajari oleh orang-orang awam dan pemula.
Tempat Belajar HTML
Bagi Anda yang masih pemula dan ingin mempelajari mengenai HTML, terdapat banyak kursus HTML dan programming secara umum yang dapat Anda pelajari.
Inilah beberapa situs yang dapat digunakan untuk mempelajari HTML:
1. General Assembly Dash
General Assembly Dash dapat diakses secara gratis oleh pemula. Di sini menawarkan program mentoring dan pemberian sertifikat apabila telah menyelesaikan program.
Namun sertifikat tersebut belum tentu bisa digunakan saat melamar kerja, sebab General Assembly Dash bukan institusi yang tersertifikasi.
2. Codeacademy
Bagi pemula yang ingin belajar HTML lebih jauh, tempat belajar online ini dapat diakses secara cuma-cuma.
Cocok untuk yang ingin mencoba menulis HTML. Namun kekurangannya, di Codeacademy tidak menawarkan sertifikat yang bisa digunakan ketika melamar kerja.
3. W3schools
W3schools menawarkan program belajar gratis, namun jika ingin mendapatkan sertifikat maka Anda harus membayar sebesar 95 dolar AS.
Kekurangan dari W3schools adalah materi yang diajarkan hanya bersifat dasar saja sehingga kurang cocok untuk yang sudah mahir.
Penutup
Sekarang Anda sudah cukup memahami apa itu HTML?, mulai dari sejarah perkembangannya, fungsi, hingga cara kerjanya.
Mempelajari HTML merupakan tahap awal bagi siapa pun yang ingin menekuni dunia pemrograman web sebelum menjadi orang yang profesional di bidangnya.
Namun tidak cukup mempelajari dasar-dasarnya saja, pelajari juga bahasa pemrograman yang lain seperti CSS, JavaScript dan lainnya.
Jika telah menguasai penuh materi HTML, Anda bisa menjadi seorang web developer maupun profesi lain yang berhubungan dengan website.
