Ticker

6/recent/ticker-posts

Mengenal Web

HyperText Markup Language
HyperText Markup Language, yang lebih dikenal sebagai HTML, merupakan bahasa yang digunakan untuk membuat halaman web. HTML dikirimkan kepada pengguna oleh web server, untuk kemudian ditampilkan oleh web browser. Sebagai sebuah markup language, HTML bertugas hanya memberikan informasi mengenai isi dari konten (dengan cara memberikan “tanda” pada teks, makanya disebut markup), tanpa memiliki informasi mengenai tampilan (style) dari konten tersebut. HTML hanya memberitahukan browser bahwa bagian tertentu dari sebuah tulisan merupakan kutipan, atau harus dicetak tebal. Bagaimana bentuk dari tulisan cetak tebal tidak diatur dalam HTML.
Karena bertugas hanya memberikan informasi isi (semantik), HTML bersifat sangat sederhana, biasanya hanya sepasang penanda (tag) yang melingkupi teks yang ingin ditandai. Listing di bawah memberikan contoh potongan HTML pada teks:
Scala (yang adalah kepanjangan dari "<u>Scalable Language</u>")
merupakan sebuah bahasa pemrograman yang dirancang untuk
digunakan dalam berbagai lingkungan, mulai dari <i>script</i>
sederhana sampai dengan sebuah sistem yang besar dan rumit.
Istilah kerennya, Scala adalah sebuah
<b>general purpose programming language</b>.
bagian mana yang merupkana HTML pada kode di atas? Dengan mudah tentunya anda dapat melihat, bahwa bagian yang merupakan kode HTML adalah kode-kode yang tidak dapat dibaca seperti <u>Scalable Language</u>. Penanda teks seperti <u></u> tersebut dikenal dengan nama tag pada HTML. Setiap tag memberikan arti khusus kepada teks. Tag “u” berarti teks tersebut bergaris bawah (underlined). Tag “i” berarti teks dicetak miring (italics), dan tag “b”, seperti yang dapat ditebak, memberikan huruf tebal (bold).
Kaget bahwa ternyata HTML sesederhana itu? Ya, HTML memang sangat sederhana! Pembelajaran HTML biasanya berkisar dalam eksperimen dan pembacaan dokumentasi mengenai setiap tag. Kedua hal tersebut menyebabkan penguasaan HTML hanya menjadi masalah kerajinan membaca dan pengalaman. Tantangan dalam pengembangan web pada sisi klien utamanya terdapat pada memperindah tampilan dan interaktifitas dari teks yang telah diformat HTML.

Cascading StyleSheet

Jadi, kalau HTML hanya berguna untuk menandai teks, bagaimana kita memberikan tampilan yang bagus pada teks tersebut? Dokumen HTML ditingkatkan tampilannya menggunakan sebuah bahasa lain, yang dikenal dengan nama Cascading Stylesheet, atau CSS. CSS sendiri merupakan bahasa deklaratif yang sangat kompleks, sehingga intrik utamanya tidak dapat dijelaskan di dalam beberapa paragraf, seperti pada HTML. Penjelasan detil mengenai CSS akan diberikan pada bagian selanjutnya. Untuk sekarang, hanya perlu dimengerti bahwa untuk membuat halaman web yang indah, diperlukan pengetahuan HTML dan CSS yang baik.

Javascript

Pada sebuah website modern, web yang enak dipandang mata saja tidak cukup. Sebuah website yang baik juga kerap kali bersifat sangat interaktif. Nama anda terlalu panjang untuk masuk ke dalam kolom nama di formulir pendaftaran? Tenang saja, web kami akan memperpanjang kolom tersebut begitu anda mengetik sampai di ujung kolom. Ingin mengetahui apakah user id yang diinginkan telah terpakai? Tenang, otomatis dicek kok, tidak perlu melakukan apa-apa.
Interaktifitas seperti yang dicontohkan di atas dimungkinkan dengan adanya kode khusus pada website tersebut yang dijalankan oleh browser ketika kita menampilkan website. Kode yang dijalankan ini ditulis dalam bahasa pemrograman Javascript, yang dapat langsung berinteraksi dengan HTML dan mengubah atribut, CSS, maupun isi dari HTML itu sendiri. Sama seperti CSS, Javascript tidak akan dibahas mendalam pada bagian ini, dan bahkan pada buku ini sama sekali. Pembahasan mengenai Javascript akan memerlukan sebuah buku tersendiri, karena kayanya bahasa pemrograman ini.

Browser dan Kode Klien

Sejauh ini, kita telah mengetahui bahwa pengembangan pada sisi klien dilakukan dengan menggunakan tiga bahasa, yaitu: HTML sebagai bahasa penanda konten, CSS untuk membuat desain tampilan, dan Javascript untuk inteaktifitas. Ketika browser menerima ketiga kode tersebut dari web server, maka browser akan menjalankan ketiga kode tersebut. Hasil dari eksekusi kode tersebut ialah tampilan website yang diberikan kepada pengguna. Jadi, tugas utama dari pengembang browser ialah membaca dan menjalankan kode pada sisi klien, untuk kemudian ditampilkan kepada pengguna.
Untuk memastikan berbagai browser yang ada dapat mengintepretasikan kode web dengan benar, sebuah badan standar dibuat untuk memberikan spesifikasi yang dapat dirujuk oleh pengembang browser. Badan standar ini dikenal dengan nama W3C (World Wide Web Consortium). Idealnya, setiap browser yang mengimplementasikan spesifikasi HTML dan CSS sesuai dengan standar yang ditentukan (W3C hanya mengatur kedua standar tersebut, Javascript diatur oleh badan lain) akan mendapatkan tampilan yang sama dari kode yang sama. Sayangnya, hal ini tidak sesuai dengan kenyataan yang ada di lapangan. Pada implementasinya, setiap browser memiliki “keunikan” tersendiri dalam mengintepretasikan HTML dan CSS. Hal ini menyebabkan pengembang pada sisi klien harus menguji web yang dikembangkan pada banyak browser, atau setidaknya beberapa browser yang paling populer, untuk memastikan halaman yang dikembangkan dapat tampil sesuai dengan keinginan.
Beberapa browser utama yang umumnya didukung oleh kebanyakan website karena pangsa pasarnya yang besar yaitu: Microsoft Internet Explorer, Mozilla Firefox, Google Chrome, Apple Safari, dan Opera. Tabel Browser dan engine-nya memperlihatkan engine yang digunakan oleh masing-masing browser.
Browser dan engine-nya
Browser Engine
Microsoft Internet Explorer Trident
Mozilla Firefox Gecko
Google Chrome Webkit
Apple Safari Webkit
Opera Presto (Kedepannya Webkit)
Perbedaan-perbedaan tampilan yang diashilkan oleh setiap engine dapat berupa perbedaan kecil, seperti ukuran font, ataupun perbedaan yang sangat besar, seperti perbedaan layout. Gambar Perbedaan Tampilan Browser memperlihatkan contoh perbedaan tampilah oleh empat buah browser, dari satu halaman yang sama [2]. Jika ditemui perbedaan-perbedaan sejenis pada bagian selanjutnya dalam buku ini, catatan khusus akan diberikan kepada pembaca.
Perbedaan Tampilan Browser
Perbedaan Tampilan Browser
Adanya perbedaan cara setiap browser menampilkan ini menyebabkan pengembang web pada umumnya memiliki banyak browser pada sistem pengembangan mereka, dan biasanya akan menguji tampilan web mereka pada banyak browser. Begitupun, kesamaan tampilan 100% umumnya tidak menjadi tujuan akhir, karena hal tersebut akan sangat sulit dilakukan. Yang umumnya ingin dicapai dengan pengujian pada banyak browser ialah tidak adanya tampilan yang menyebabkan web tidak dapat digunakan pada browser tertentu, misalnya komponen yang saling menimpa ataupun tulisan yang terlalu besar.
Jika anda masih belum memiliki seluruh browser utama yang tertera pada tabel Browser dan engine-nya, tunggu apa lagi? Segera pasang semua browser yang ada, dan lihat berbagai perbedaan dari tiap browser pada website yang sering anda kunjungi!

Posting Komentar

0 Komentar