Senin, 07 November 2011

CARA MEMBUAT WEBSITE DENGAN BAHASA HTML

HTML (HyperText Markup Language) adalah sebuah bahasa markup dasar yang digunakan untuk membuat sebuah halaman website. Dalam pembuatan website biasanya orang juga menggunakan bahasa pemograman lain selain HTML seperti PHP, ASP, JSP, dan lain-lain untuk membuat website menjadi dinamis dan interaktif. Sampai di sini mungkin Anda sudah merasa enggan untuk membaca lebih lanjut dan berharap ada cara yang lebih gampang untuk membuat website tanpa harus belajar HTML. Untungnya, memang ada cara yang lebih gampang.

Salah satunya adalah dengan menggunakan aplikasi Microsoft Word. Anda hanya tinggal mengetik isi, memasukkan gambar, ataupun membuat tautan, di mana semuanya dilakukan seperti Anda biasa menggunakan Microsoft Word. Kemudian Anda simpan file tersebut dalam format HTML, maka file ini sudah menjadi halaman website yang bisa dibuka dengan Internet Explorer ataupun Mozilla Firefox atau browser lainnya. Cara membuka file tersebut dengan browser adalah dengan mengkliknya dua kali. Anda sama sekali tidak memerlukan pengetahuan mengenai bahasa HTML. Di sini Anda langsung merancang seperti apa halaman website Anda terlihat. Coba Anda buka dokumen tersebut dengan notepad atau wordpad, maka yang muncul adalah file yang telah Anda buat tersebut dalam bahasa HTML.

Apa Anda masih ingat pembahasan mengenai Teknik SEO pada Halaman Website dan Teknik SEO pada Meta Tag. Untuk bisa menggunakan teknik SEO jelas sekali Anda harus mengerti bahasa HTML.

Saya sama sekali tidak mengatakan Anda harus menjadi ahli dalam bahasa pemograman web, namun saya sangat menyarankan Anda mempelajari dasar-dasar HTML antara lain bagaimana membuat title tag, description meta tag, keywords meta tag, alt tag, membuat tautan, mengubah format teks, dan lain-lain. Alasan lain mengapa Anda perlu mempelajari dasar-dasar HTML adalah sewaktu Anda melakukan promosi website, Anda harus tahu cara membuat tautan dengan perintah <a href>.

Sebagai permulaan coba Anda ikuti langkah-langkah berikut:
  1. Buka aplikasi notepad atau wordpad dan ketik atau copy-paste kode HTML berikut:
  2. <html> <head> <title>HTML pertamaku</title> </head> <body> Ini adalah struktur dasar bahasa HTML. </body> </html>
  3. Simpan file tersebut dengan nama "belajar HTML.txt".
  4. Oleh karena notepad atau wordpad tidak bisa menyimpan file dalam format HTML, maka Anda harus mengubah nama file tersebut menjadi "belajar HTML.html". Saya anggap Anda sudah tahu cara mengubah nama file.
  5. Setelah Anda mengubahnya bukalah file tersebut dengan browser Anda, dengan cara mengklik file tersebut dua kali. Hasilnya akan tampak seperti gambar berikut:
  6. dasar HTML

Seperti yang telah Anda ketikkan pada langkah 1 di atas, struktur dasar bahasa HTML terdiri dari pasangan tag berikut:
  1. <html> dan </html>
  2. <head> dan </head>
  3. <title> dan </title>
  4. <body> dan </body>
Untuk belajar HTML, Anda memerlukan program khusus yang disebut HTML Editor karena fitur-fitur yang dimiliki notepad atau wordpad sangat-sangat terbatas. Salah satu HTML editor gratis yang mudah penggunaannya adalah HAPedit, Anda bisa mengunduhnya di http://hapedit.free.fr/hapedit.php. Nama file yang Anda unduh adalah "hapedit.zip". Ekstrak file "hapedit.zip" ke folder baru yang Anda beri nama "hapedit". Di dalam folder hapedit tersebut ada file HAPedit.exe, klik dua kali file tersebut maka HAPedit akan muncul seperti gambar berikut.



HTML editor - HAPedit

Contoh pembuatan halaman website dengan HAPedit adalah sebagai berikut:
  1. Apabila HAPedit sudah terbuka, pada Tab Documents pilih menu File --> New --> HTML Page.
  2. Pada halaman HTML yang baru
    • ganti judul halaman website "Sans Titre" yang diapit oleh title tag pembuka <title> dan title tag penutup </title> dengan "HTML pertamaku" (ketikkan tanpa tanda kutip)
    • setelah kode perintah <body bgcolor="#FFFFFF"> ketikkan "Ini adalah HTML pertamaku." (ketikkan tanpa tanda kutip)

  3. Simpan file ini dengan nama "membuat HTML dengan HAPedit.html" di folder baru misalkan namanya "HTML". Folder HTML nantinya bisa Anda gunakan untuk menyimpan file-file HTML Anda.
  4. Pilih menu Display --> Browse with --> Default Browser F9. Hasilnya adalah sebagai berikut:
  5. membuat HTML dengan HAPedit
Itulah halaman website pertama Anda. Mudah bukan! Di website ini saya tidak membahas secara detil mengenai bahasa HTML. Anda bisa menemukan banyak sekali website yang mengajarkan bahasa HTML di Internet. Akan tetapi, saya merekomendasikan Anda untuk menggunakan tutorial yang dibuat oleh Maricopa Center for Learning and Instruction. Tutorial belajar HTML tersebut bisa dibaca secara langsung disini http://www.mcli.dist.maricopa.edu/tut/lessons.html. Didalamnya juga sudah tersedia tautan untuk mengunduh tutorial dalam format PDF.

Tutorial belajar HTML yang dibuat Maricopa Center for Learning and Instruction ini sangat bagus karena sudah disertai dengan contoh pembuatan website. Anda bisa menyimpan contoh-contoh file HTML yang diberikan di dalam folder "HTML" yang telah Anda buat. Folder "HTML" tersebut dapat Anda akses langsung melalui HAPedit. Pilih tab Folders dan klik dua kali Add project, kemudian pilih lokasi di mana folder "HTML" berada dan tekan OK maka folder "HTML" akan muncul pada tab Folders.



HAPedit - Add project

Setelah menyelesaikan tutorial yang dibuat Maricopa Center for Learning and Instruction, Anda sudah menguasai dasar-dasar HTML dan sudah bisa membuat website Anda sendiri.

Apabila Anda sudah membuat halaman website Anda, selanjutnya Anda harus memiliki nama domain dan mendaftarkannya ke web hosting provider agar website Anda bisa muncul di Internet. Kita mulai dengan cara memiliki nama domain.

Tidak ada komentar:

Poskan Komentar