Pembahasan HTML [1]


Hmm, sekarang coba Kita bersama-sama memandang betul-betul sebuah layar monitor di depan Kita yang menampilkan halaman Facebook, cobalah untuk memandang dari tampilan paling atas browser, ada yang bertuliskan Sintang Web Developer, hingga ke paling bawah hingga tertulis Obrolan. Dari manakah mereka semua itu berasal? Nah, bagian-bagian tersebut mulai dari atas hingga paling bawah terbagi-bagi menjadi beberapa bagian yang terstruktur dalam elemen-elemen halaman website yang Kita sebut HTML.

Pada dasarnya, HTML merupakan teks biasa yang akan jadi sangat membosankan untuk Kita baca. Tapi sebetulnya itulah halaman web yang sungguhan. Nah, bagaimana mungkin kemudian Kita dapat menjumpai halaman yg berwarna-warni dengan berbagai gambar dan tampilan yang menarik? Nah, tugas inilah yang kemudian dilakukan oleh browser yang membuka halaman website tersebut. Jadi, ketika sebuah halaman website dibuka dengan Firefox, maka akan menampilkan tampilan web yg menarik, namun ketika dibuka dengan teks editor seperti Notepad, hanya akan tampil teks-teks yang membentuk halaman website tersebut dalam struktur dan aturan yang dikenal sebagai HTML.

Bagaimana? Insya Alloh teman” sudah dapat memahami ini dengan baik. Selain itu, untuk melihat aturan HTML yg digunakan pada sebuah halaman web dari browser, juga dapat dilakukan dengan klik kanan pada halaman web, kemudian pilih “Lihat kode sumber laman” atau “View Source”, atau dengan hanya menekan Ctrl+U di Firefox. Ketika tampil, jangan terlalu peduli dengan kode yang mungkin sebagian mengatakan bahwa terlalu sulit untuk dimengerti, yang pasti teman” sudah memahaminya.

Seperti juga teknologi-teknologi lainnya, HTML juga terus mengalami perkembangan sehingga kini Kita mengenal HTML5, yang sebelumnya pernah Kita kenal HTML4.01, XHTML1.0, dll. Namun yang pasti, Kita menggunakan HTML versi manapun, browser tetap akan mengenalinya, meski pada HTML5 belum semuanya dapat dikenali oleh semua browser yg ada sekarang. Elemen-elemen dalam sebuah halaman web terbagi-bagi dalam pengelompokan yang dikenal sebagai tag-tag HTML yang terstruktur. Bagaimana pengelompokan tersebut? Misalnya Kita ingin meletakkan elemen paragraf di sebuah halaman web, maka Kita menandainya dengan menuliskan

Paragraf pertama

. Sehingga elemen paragraf tersebut ditandai diantara tag

dan

. Tag yang pertama merupakan tag pembuka, dan yang kedua merupakan tag penutup. Dalam HTML, tag-tag yang membagi elemen-elemen halaman website tersebut sudah ditentukan dan Kita hanya perlu menggunakannya saja, jadi Kita tidak perlu mendefinisikan tag sendiri.

Sebagai referensi, daftar tag-tag HTML4.01 dan XHTML1.0 dapat Kita lihat bersama di http://www.w3schools.com/tags/default.asp . Jangan begitu khawatir melihat daftar tag yang begitu banyak, Kita tidak harus menggunakan semuanya untuk membuat halaman web yang sudah dikata bagus, namun dapat memahami kesemuanya tentu saja itu lebih baik. Dan sebetulnya nama-nama tag tersebut juga telah dibuat sedemikian rupa agar mudah dimengerti kok, jadi jangan khawatir. Sebagai catatan, dalam daftar tag-tag tersebut terdapat beberapa yang memperoleh label Deprecated berwarna merah, sehingga tag-tag tersebut akan lebih baik tidak digunakan dan digantikan dengan teknologi atau tag yang lain yang lebih baik.

Mengenai tag-tag yang sering digunakan dan penjelasannya, akan dijelaskan pada pembahasan berikutnya, namun sebelumnya Kita perlu mengenal HTML yang terstruktur. Adapun struktur pokok dari sebuah halaman website (HTML) adalah sebagai berikut:

Judul Halaman

Paragraf 1

Jadi, struktur utama dari halaman web tersebut dinaungi oleh sebuah tag utama yaitu . Kemudian yang tepat berada di bawahnya adalah dan . Nah, anggaplah halaman ini adalah sebagai sebuah surat formal. Jadi, head merupakan kepala atau kop suratnya yang akan berada di bagian atas dan biasanya berisi judul, sedangkan yang berada di antara tag pembuka dan penutup body merupakan isi dari surat tersebut. Sehingga ketika ditampilkan dalam sebuah browser, head tidak akan ditampilkan di dalam halaman secara langsung, namun di title bar dari browser. Tepatnya, judul halaman ini diatur oleh tag . Sedangkan body tentu saja akan tampil di halaman utama yang menampilkan konten web.

Bagaimana Kita akan memulai mempraktikkannya? Teman-teman bisa mencobanya sendiri dengan menggunakan teks editor seperti Notepad (Start Menu > All Programs > Accessories > Notepad), kemudian mengetikkan atau mengkopi saja teks yang berisi elemen-elemen HTML (disarankan untuk mengetikkan), kemudian menyimpannya. Dalam penyimpanan, isikan nama file dengan nama sekeinginan teman-teman dan nama file diakhiri dengan .htm atau .html . Sebelum menekan tombol Save, sebaiknya Kita pastikan bahwa pada bagian Save as type telah terpilih All Files.

Buka file tersebut, dan akan dijumpai tampilan seperti pada http://www.feeltothink.co.cc/sintangwebdeveloper/latihan1.html .
Terima Kasih, Semoga Manfaat.

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s