Tuesday, October 26, 2021

Mengenal HTML dan CSS

HTML dan CSS

Apa itu HTML ?


Sumber : Gambar Google


Menurut WIKI. Hyper Text Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegrasi.

Sederhananya, HTML adalah kerangka yang membentuk dan mengatur bagaimana sebuah halaman web akan ditampilkan di browser. Untuk membentuk dan mengatur halaman tersebut kita menggunakan markah / tanda atau lebih umum disebut tag. Tag HTML mempunyai tag pembuka dan penutup. Tag pembuka menggunakan simbol kecil (<) dan besar dari (>), begitupun dengan tag penutup, hanya saja untuk tag penutup ditambahkan slash (/).

Apa Itu Tag, Elemen, dan Atribut ?

Agar lebih mudah dalam belajar HTML dasar, kita harus kenalan dulu nih dengan istilah-istilah tag, elemen, dan atribut. Mereka adalah tiga sekawan yang menjadi penyusun HTML.

Berikut masing-masing penjelasanya.

  • Tag, digunakan sebagai awalan instruksi atau perintah yang akan dibaca oleh web browser. Misalnya : tag <bold>. Tag ini akan meminta browser menampilkan teks dalam format tebal;
  • Element, merupakan keseluruhan kode yang terdiri dari tag pembuka (< >) hingga tag penutup (< />). Contohnya : <h1> Contoh Elemen </h1>. Meski demikian, tidak semua tag HTML memiliki pasangan penutup;
  • Attribute, yaitu informasi atau perintah tambahan yang berada di dalam elemen. Misalnya : <img src="pantai.jpg" alt="pantai baron"> Elemen ini menggunakan tag <img> dengan atribut sumber gambar (src) dan alt text (alt).

Setelah memahami komponen pembentuk HTML, silakan dibaca juga coding HTML (pada sub nav sekolah pada blog ini). (baca selengkapnya)

Kerangka Inti HTML

Sampai sini, kita sudah mengetahui apa saja penyusun HTML. Jika bagian-bagian tersebut dikumpulkan, terbentuklah dokumen HTML.

Namun, mari kita sisihkan dulu bayangan tentang dokumen HTML, yang dipenuhi ratusan tag. Kita akan mengulik sedikit terlebih dahulu bentuk dokumen HTML paling sederhana dan menjadi kerangka inti yang menyusun setiap dokumen HTML di dunia ini.

  • <!DOCTYPE html> berfungsi untuk mendeklarasikan kepada komputer bahwa kita akan menuliskan perintah dalam kode HTML;
  • <html>  </html> merupakan tag yang menandakan bahwa anda memulai dan mengakhiri dokumen dalam kode HTML;
  • <head>  </head> diisi dengan metadata dari dokumen HTML, seperti judul tab, deskripsi dan lain-lain;
  • <body>   </body> diisi dengan konten halaman website.

Setelah mengetahui kerangka inti HTML, kita dapat melengkapinya sesuai dengan tujuan dan kebutuhan halaman website kita.

Belajar HTML dengan Editor HTML

Dari tadi, kita sudah mempelajari teori belajar HTML dasar. Pasti sudah tidak sabar bukan untuk segera mempraktekkannya. 

Kalau begitu, sekarang saatnya kita menyiapkan editor HTML. Editor HTML merupakan lembar kerja untuk membuat dan mengedit dokumen HTML.

Ada berbagai editor HTML yang bisa kita gunakan secara gratis, seperti notepad, atom, bracket dan masih banyak lagi. Namun sebelum memilih editor HTML, pastikan OS komputer kita kompatibel.

Nah setelah menginstal editor HTML, kita bisa belajar HTML dengan lebih mudah. Sebab fitur yang ditawarkan editor HTML akan mempercepat proses kerja kita. (Baca Selengkapnya).

Memilih Browser Terbaik

Setelah membuat dokumen HTML, kita pasti ingin melihat hasilnya bukan ?, karena itu, pastikan anda sudah memiliki web browser. Web browser merupakan aplikasi untuk mengakses dan halaman website.

Oleh web browser, bahasa komputer yang telah anda buat di editor HTML akan diterjemahkan ke dalam tampilan yang dipahami manusia.

Nah untuk berjaga-jaga, sebaiknya siapkan minimal dua web browser, meski sudah ada standarisasi HTML, bisa saja terjadi error sehingga tampilan antara satu web browser dengan browser lainnya berbeda. (Baca Selengkapnya).

Membuat Halaman Website Pertama

Sekarang, anda sudah bisa membuat dan melihat eksekusi syntax HTML pada browser anda. Sayangnya, halaman HTML anda belum bisa diakses oleh publik. Alasanya, file HTML masih tersimpan dalam direktori komputer anda saja.

Karena itu, perlu untuk mengonlinkan project tersebut. Jalan tercepatnya yaitu dengan membuat website melalui layanan web hosting.

Tak hanya cepat, cara pengoperasiannya juga mudah, lho. anda bisa segera mengupload file HTML ke WordPress ataupun langsung melakukan kustomisasi melalui WordPress Editor.

Melengkapi Halaman Website

Supaya ilmu belajar HTML dasar anda semakin top, cobalah membuat komponen tambahan pada halaman website. Masukkan bumbu-bumbu pelengkap agar halaman website anda makin sedap dan informatif.

Anda bisa memasukkan gambar, tabel, form ataupun komponen pelengkap lainnya. Dijamin, halaman website yang anda sajikan akan lebih mudah dipahami, lebih menjaring peminat, dan mendatangkan keuntungan yang tidak anda duga. (baca selengkapnya).

Belajar Mengatur Template Halaman Website dengan HTML



Referensi :
  • niagahoster.co.id Link



0 comments:

Post a Comment

Terima Kasih Sudah Berkontribusi Pengembangan Blog Ini