HTML

Kata-kata Web sebenarnya penyederhanaan dari sebuah istilah dalam dunia komputer yaitu WORLD WIDE WEB yang merupakan bagian dari tekhnologi Internet. World wide Web atau disingkat dengan nama www, merupakan sebuah sistem jaringan berbasis Client-Server yang mempergunakan protokol HTTP (Hyperteks Transfer Protocol) dan TCP/IP (Transmisson Control Protocol / Internet Protocol) sebagai medianya.. Pada awalnya Internet atau WEB hanya dipergunakan untuk kepentingan Militer yaitu suatu tekhnologi yang dipergunakan untuk mengirimkan pesan rahasia melalui satelit. Akan tetapi lama kelamaan tekhnologi tersebut akhirnya meluas, dan bahkan Internet pada saat ini sudah sama populernya dengan Telephone. Informasi yang dikirimkan lewat Internet dapat diakses keseluruh dunia hanya dalam hitungan menit bahkan detik. Sehingga tekhnologi ini menjadi sangat populer dan cepat sekali perkembangan nya. Boleh dikatakan saat ini Internet sudah tidak menjadi istilah yang asing lagi ditelinga. Suatu Informasi yang dikirimkan lewat Internet dapat berupa Teks, gambar maupun multimedia sehingga Internet juga dimanfaatkan oleh perusahaan-perusahaan untuk mempromosikan Produk-produknya dengan cepat dan mudah. Bahasa dasar dari pemrograman web yaitu HTML (Hyperteks Markup Language).

Jadi sebelum Anda mempelajari bahasa pemrograman Internet yang lain seperti,PEARL, PHP, JAVASCRIPT, ASP dan lain sebagainya. Anda diharuskan menguasai dahulu teknik-teknik dasar pemrograman web yaitu HTML. HTML (Hypertext Markup Language) merupakan suatu script dimana kita bisa menampilkan informasi dan daya kreasi kita melalui internet. HTML sendiri adalah suatu dokumen teks biasa yang mudah untuk dimengerti dibandingkan bahasa pemrograman lainnya, dan karena bentuknya itu maka HTML dapat dibaca oleh platform yang berlainan seperti windows, unix dan lainnya. HTML merupakan bahasa pemrograman fleksibel dimana kita bisa meletakkan script dari bahasa pemrograman lainnya, seperti JAVA, VB, C, dan lainnya. Hypertext dalam HTML berarti bahwa kita dapat menuju ke suatu tempat, misal website atau halaman homepage lain, dengan cara memilih suatu link yang biasanya digaris bawahi atau diwakili oleh suatu gambar. Selain link ke website atau homepage halaman lain, hypertext ini juga mengizinkan kita untuk menuju ke salah satu bagian dalam satu teks  itu sendiri. 

 HTML tidak berdiri sendiri, agar ia dapat bertugas dalam membangun halaman

web, ia harus ditulis dalam software atau aplikasi tertentu, yang dikenal sebagai

HTML Editor. HTML Editor inilah yang bertugas untuk “menerjemahkan” bahasa

HTML menjadi halaman web yang siap dilihat oleh para surfer di seluruh dunia. Untuk mempelajari HTML tidaklah begitu sulit, Karena HTML hanyalah sebuah bahasa yang berbasis teks dengan perintah-perintah yang mudah di ingat dan dimengerti oleh kita. Sehingga Anda tidak memerlukan sebuah Compiler (penerjemah bahasa pemrograman ke bahasa mesin) seperti bahasa-bahasa pemrogaman yang lain. Anda cukup menuliskan program-program HTML dengan teks editor apa saja seperti NOTEPAD atau yang sejenisnya, kemudian file itu Anda beri akhiran HTM atau HTML dan dijalankan atau dipanggil melalui sebuah program browser seperti, Internet Explorer, FireFox, Opera, Netscape dan sebagainya. File tersebut langsung diterjemahkan dan ditampilkan di monitor melalui program browser tersebut.

Secara umum, ada dua jenis HTML Editor, yaitu  text editor dan WYSIWYG editor.

1.   Text Editor

Text Editor biasa digunakan oleh mereka yang sudah mahir dalam menggunakan bahasa HTML, karena melalui editor jenis ini anda dapat langsung menuliskan kode-kode HTML satu persatu, sesuai prosedur teknis yang berlaku. Untuk editor jenis ini, kita dapat menggunakan notepad.

2.   WYSIWYG Editor

WYSIWYG Editor adalah solusi bagi mereka yang belum mahir dalam menggunakan bahasa HTML. Pada jenis aplikasi ini, kita dapat membangun  halaman web dengan lebih mudah, karena apa yang terlihat di layar akan  sama  dengan hasil yang anda dapatkan. WYSIWYG adalah singkatan dari What  You See Is What You Get. Untuk editor jenis ini , kita dapat menggunakan aplikasi Microsoft Word, Excel, Access,  PowerPoint, Outlook, FrontPage dan  yang cukup popular Macromedia Dreamweaver.

1.      Struktur Dokumen HTML

Elemen pada HTML dapat didefinisikan sebagai suatu kode tertentu yang akan

menyediakan tempat untuk meletakkan beberapa kode didalamnya. Berbeda dengan tag yang menangani satu kode saja. Untuk lebih jelasnya perhatikan skema di bawah ini :

<html>

<head>

<title>Judul Halaman</title>

</head>

<body>

…isi dari halaman web…

</body>

</html>

Keterangan :

1. Dokumen HTML selalu diawali dengan tand tag pembuka <html> dan diakhiri

dengan tanda tag penutup </html>.

2. Pada elemen head <head></head>, dapat kita sisipkan kode untuk menuliskan

keterangan tentang dokumen HTML. Atau dapat juga kita sisipkan scripts

pemrograman web seperti Javascript, VBscript atau CSS untuk menambah

daya tarik pada situs yang kita buat agar lebih menarik dan dinamis.

3. Elemen-elemen <body></body> berisi tag-tag untuk isi atau layout tampilan

situs kita, seperti : <font></font>, <table></table>, <form></form>.

Jadi jelas bahwa elemen merupakan satu bagian yang besar yang terdiri dari banyak kode-kode yang disebut tag itu. Dokumen HTML diawali dengan tag <HTML> dan diakhiri dengan tag </HTML>. Elemen pada HTML akan memisah dokumen menjadi dua bagian utama, antara lain :

1. Elemen <HEAD>………</HEAD> :  Merupakan bagian kepala, tempat untuk menuliskan  keterangan mengenai judul halaman web, nama pengarang dan script atau program kecil.

2. Elemen <BODY>………</BODY> : Merupakan bagian badan atau isi, tempat untuk menuliskan informasi yang akan ditampilkan pada browser.  Tag hanyalah bagian dari elemen. Tag adalah kode-kode yang digunakan untuk men-setting dokumen HTML. Dari tiap-tiap teks programnya, dimulai dengan tanda <Tag-awal> dan diakhiri dengan tanda </Tag-akhir>. Untuk membuat dokumen HTML, perlu mengetahui dan mempelajari elemen serta tag-tag yang digunakan untuk menandai bagian-bagian dari suatu dokumen dengan menggunakan program editor teks biasa yaitu notepad atau dengan yang berbasiskan WYSIWYG seperti Maxromedia Dreamweaver dan Microsoft FrontPage.

Dokumen HTML bisa dibuat dengan menggunakan text editor biasa ataupun dengan editor khusus.

Contoh-contoh HTML editor :

1.      Microsoft Front Page

2.      Macromedia Dreamweaver

3.      Netscape Navigator Gold

4.      Netscape Composer

5.      HotDog

6.      CU-HTML, dll

Perlu diketahui bahwa, program HTML tidak seperti Bahasa pemrograman yang lain yang mengenal perintah JUMP (melompat dari perintah yang satu keperintah yang lainnya), jadi program HTML akan dikerjakan oleh Browser dari atas kebawah dan tidak bisa balik lagi keatas. Dan juga dalam pembuatan file HTML sedapat mungkin hindari karakter-karakter yang merupakan ciri khas dari perintah-perintah HTML seperti, karakter < , > dan  ;

Perintah-perintah dasar HTML

1.      <H1> sampai <H6>          : membuat font ukuran besar-kecil

2.      <i>                                     : membuat teks miring

3.      <b>                                    : membuat teks tebal

4.      <u>                                    : membuat teks bergaris bawah

5.      <p>                                    : membuat paragraph

6.      <center>                            : membuat teks berada di tengah layar

7.      <align>                              : membuat teks rata kiri dan kanan

<p align=right>           : rata kanan

<p align=center>         : rata tengah

<p align=left>             : rata kiri

<p align=justify>        : rata kiri dan kanan

8.      <br>                                  : memasukkan fungsi enter

9.      <sup>                                : membuat suatu teks naik

10.  <sub>                                : membuat suatu teks turun

CSS (Cascading Style Sheet)

CSS merupakan kependekan Cascading Style Sheet yang berfungsi untuk mengatur tampilan dengan kemampuan jauh lebih baik dari tag maupun atribut standar HTML. CSS sebenarnya adalah suatu kumpulan atribut untuk fungsi format tampilan dan dapat digunakan untuk mengontrol tampilan banyak dokumen secara bersamaan.

Keuntungan menggunakan CSS yaitu jika ingin mengubah dokumen, maka tidak perlu mengubah satu persatu. Penggunaan CSS ada dua cara yaitu dengan menyispkan kode CSS langsung dalam kode HTML atau simpan menjadi file tersendiri berekstensi *.css. Dengan meyimpan sebagai file tersendiri akan memudahkan untuk mengontrol tampilan dalam banyak dokumen secara langsung. CSS mendapat dukungan penuh pada browser versi 4 dan pada versi sebelumnya, hanya Internet Explorer yang masih mampu mengenal CSS. Tampilan CSS dapat berbeda jika ditampilkan pada menu browser yang berbeda.

Browser

Browser merupakan suatu program yang dirancang untuk mengambil informasi informasi dari suatu server komputer pada jaringan internet.  Informasi-informasi ini biasanya di kemas dalam page-page, dimana setiap page bisa mempunyai beberapa link yang menghubungkan web page tersebut ke sumber informasi lainnya. Jika suatu link di klik, browser akan mencari alamat dari tujuan link tersebut dan browser akan menampilkan informasi tersebut, namun jika tidak menemukan alamat yang di tuju, browser akan memberikan suatu pesan yang menyatakan bahwa alamat dari tujuan link tersebut tidak dapat ditemukan. Umumnya dokumen yang diterima oleh browser adalah file yang berformat html. File HTML sebenarnya file berisi teks, yang berisi data teks yang akan ditampilkan dan memuat perintah-perintah yang memberikan pengetahuan bagi

browser bagaimana data tersebut harus ditampilkan. Tetapi, tidak semua browser

memiliki cara penterjemah yang sama. Beberapa browser mungkin tidak mengenali beberapa perintah yang ada di file HTML. Pada intinya, browserlah yang memegang kendali dan kekuasaan bagaimana dokumen yang diterima akan

ditampilkan. Browsing merupakan istilah umum yang digunakan bila menjelajahi dunia maya atau web. Tampilan web yang sangat artistik yang tidak hanya menampilkan teks tapi juga gambar-gambar yang ditata sedemikian rupa sehingga

selalu membuat  para surfer mampu untuk surfing berjam-jam. Karena para surfer

harus sangat memperhitungkan rencana web mana saja yang akan dikunjungi atau

batasi informasi yang ingin diakses, karena bila tidak surfer akan tersesat ke dalam rimba informasi yang maha luas. 

Jenis-jenis browser yang paling sering digunakan adalah Netscape

navigator/ Comunicator, Internet Explorer, NCSA Mosaic, Arena, Lynx, dan lain-

lain.

Arti dari perintah-perintah META

Setelah Anda mengenal perintah <title> serta </title> dan mengetahui fungsinya, selanjutnya mungkin Anda akan menanyakan arti dari perintah <meta>. Pengertian META itu sendiri dalam HTML dapat berarti perintah yang tersembunyi, perintah yang menjadi acuan, perintah yang menjadi standar baku, dan sebagainya. Perintah meta dibedakan dari nama (name) yang tertulis, dan isi/arti dari perintah itu (content). Jadi perintah META harus mempunyai atribut NAME dan atribut CONTENT dalam penulisannya. Adapun nama-nama dari perintah META yang sering dipergunkana oleh kebanyakan situs antara lain:

1.        Author

Atribut yang menyatakan tentang pembuat atau programer file tersebut.

2.      Audience

Atribut yang digunakan untuk mengaktifkan pilihan multimedia yang ada pada halaman web itu. Biasanya isi content dari perintah meta ini cuma

kata ALL atau DISABLE

3.      Copyright

Atribut yang menyatakan tentang hak cipta dari file tersebut.

4.      Content-type

Berbeda dengan perintah meta yang lain, perintah meta ini digunakan sebagai pemberitahuan kepada browser tentang standar baku dari format bahasa dan kode yang digunakan, beberapa standar kode yang berlaku antara lain : ANSI, iso-8859-1, UTF-8 dan sebagainya. Penulisan perintah meta ini boleh dikatakan wajib bila kita menggunakan karakter-karakter tertentu yang akan di tampilkan di browser misalnya karakter huruf Arab, jepang, china, dsb. contoh format penulisannya sebagai berikut :

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">

5.        Description

Atribut yang digunakan untuk menerangkan isi dari suatu halaman web atauketerangan mengenai maksud dan tujuan situs itu sendiri bisa juga sebagai penjelasan dari suatu produk dan sebagainya.

6.      Generator

Atribut yang digunakan sebagai pemberitahuan bahwa file ini dibuat oleh suatu software atau program yang disebutkan di dalam isi content.

7.      Keywords

Atribut yang digunakan sebagai kata kunci untuk pencarian kata pada file tersebut, masing-masing kata kunci dipisahkan dengan tanda koma.

8.      Robots

Atribut yang digunakan sebagai pemberitahuan kepada Search Engine seperti GOOGLE, agar semua kata yang akan di index mengikuti link-link yang ada pada halaman tersebut, isi content dari perintah meta ini hanya kata ALL yang berarti Semuanya.

9.      Revisit-after

Atribut yang digunakan sebagai pemberitahuan kepada Search Engine seperti GOOGLE, agar kembali mengecek dan mengindex halaman web ini dalam waktu yang ditentukan. isi content nya menunjukan lamanya waktu, Contoh : < meta name="revisit-after"  content="2 days"> , untuk menyatakan 2 hari.

Masih banyak lagi perintah-perintah dari META ini, daftar diatas adalah beberapa perintah META yang sering dipergunakan oleh kebanyakan situs-situs terkenal. Perintah META boleh dituliskan boleh juga tidak, saya hanya menyarankan sebaiknya perintah meta itu tidak dituliskan semuanya karena akan sedikit memperlambat akses dari pembacaan file. Seperti yang telah diberitahukan pada paragraf diatas, bahwa program HTML dikerjakan oleh browser mulai dari bagian atas file secara ber-urutan sampai ke bawah. Sehingga semakin banyak perintah META yang ditulikan diatas maka akan semakin lama juga akses pemuatan

file tersebut di browser.