Pengenalan Penulisan Html

Untuk sebagian kalangan, mungkin membuat website merupakan hal yang biasa. Tapi untuk sebagian besar lainnya, membuat website merupakan hal yang asing dan tidak pernah terbayangkan sebelumnya. Padahal jika di kita bisa membuat sebuah website, maka tidak menutup kemungkinan kita akan menghabiskan waktu berjam-jam di depan komputer setiap harinya.

Kenapa tidak.....!!!!!

Karena selain asyik, ternyata dengan website buatan kita sendiri, kita bisa menjadikannya mesin uang lhoo....

Nah lhooo....

Kalau sudah berurusan dengan uang pasti
langsung semangat deehhh..........

Bukan bermaksud mematahkan semangat. Tapi membuat website itu tidaklah gampang dan itu adalah fakta yang harus anda ketahui lhoo... eitttsss..... Jangan langsung patah semangat doongg....!!! kan nanti kita akan bahas bagaimana cara membuat website dengan mudah. Tapi kita mulai dari yang sulit dulu yaa......

Hehee.......!!!!!

Ok....

Sekarang kita harus tahu dulu nich... Sebenarnya website itu apa sich????!!!!!!!

Menurut bahasa website merupakan kumpulan halaman yang menampilkan informasi data teks, data gambar diam atau gerak, data animasi, suara, video dan atau gabungan dari semuanya, baik yang bersifat statis maupun dinamis yang membentuk satu rangkaian bangunan yang saling terkait dimana masing-masing dihubungkan dengan jaringan-jaringan halaman (hyperlink).

Sekarang kita siapkan dulu semua hal yang di perlukan untuk membuat website.

1. Komputer.

Yang pertama yang pasti sebuah komputer. semakin handal komputer yang anda pakai, maka semakin bagus.

2. Koneksi server.

Hal ini sangat penting untuk memposting website yang anda buat.

Cukup dua itu saja dulu. Soal kedepannya nanti akan kita bahas lebih lanjut..

Tahap 1.

Pengenalan html

Untuk membuat website pertama-tama kita harus belajar bahasa HTML. HTML (Hyper Text Markup Language) adalah sebuah "bahasa program" yang memungkinkan kita membuat halaman web yang bisa ditampilkan dalam browser (Internet Explorer, Chrome, firefox dll). Setelah kita menguasai dasar-dasar HTML, barulah kita mencoba membuat rencana dan rancangan dari desain dan isi website yang hendak kita buat. Kemudian rancangan itu kita tuangkan dalam bentuk halaman-halaman web yang terpadu.

Oleh karena itu, untuk membuat dokumen HTML, anda bisa menggunakan semua program teks editor biasa, mulai dari Notepad hingga MS Word. Untuk mudahnya, kita gunakan program Notepad. Latihan 1. Bukalah program Notepad. Bila anda belum tahu caranya, klik Start > Programs > Accessories lalu Notepad. Sekarang ikutilah dengan seksama latihan-latihan berikut satu demi satu. PENGENALAN KODE HTML Dalam program Notepad anda, tulislah seperti ini:

<html>

</html>

Masing-masing baris di atas disebut tag. Tag adalah kode yang digunakan untuk me-mark-up (memoles) teks ASCII menjadi file HTML. Setiap tag diapit dengan tanda lebih besar (>) atau lebih kecil (<). Ada tag pembuka yaitu <HTML> dan ada tag penutup yaitu </HTML> yang ditandai dengan tanda slash (garis miring) di depan awal tulisannya. Perlu anda ketahui bahwa tag-tag html dapat ditulis dengan huruf besar ataupun huruf kecil. Artinya, penulisan <HTML> atau <html> atau <Html> sama saja hasilnya. Namun perlu selalu diingat bahwa penulisan tag yang salah meskipun hanya satu karakter akan berpengaruh terhadap dokumen HTML anda, bahkan bisa berakibat dokumen HTML anda tidak bisa ditampilkan dalam browser. Sekarang kita akan beralih pada tag selanjutnya. Tambahkanlah tag seperti berikut:

<html>

<body>

</body>

</html>

Isi dari dokumen HTML yang sesungguhnya adalah yang ditulis diantara tag <body>. Coba tuliskan:

<html>

<body>

Tulisan ini akan tampak dalam browser.

</body>

</html>

Simpanlah file tersebut dengan meng-klik menu File lalu Save As. ubah "Save As Type" nya menjadi All Files (*.*). Setelah itu, beri nama file misalnya: latih1.html. Jangan lupa penambahan ekstensi .html di belakang nama file! klik tombol Save maka file akan tersimpan sebagai dokumen web. Tutuplah program Notepad anda. Sekarang bukalah lagi program browser. Klik menu File lalu Open. Cari dan pilih file latih1.html, lalu klik Open. Nah, lihatlah hasil karya anda yang pertama......

Sekarang lihatlah kembali browser anda yang sedang menampilkan file latih1 tadi. Klik menu View lalu Source. Dengan instruksi ini akan muncullah program Notepad yang di dalamnya tampak source code atau kode-kode HTML yang tadi anda buat. Misalnya kita akan menjadikan halaman web latih1 ini menjadi berwarna latar belakang kuning dengan tulisan berwarna merah. Untuk itu, kita perlu menambahkan atribut BGCOLOR dan TEXT ke dalam tag body sebagai berikut:

<html>

Tulisan ini akan tampak dalam browser.

</body>

</html>

Simpanlah kembali file ini. kemudian buka lagi melalui jendela browse anda dan anda akan melihat hasilnya seperti ini..

Tulisan ini akan tampak dalam browser

Demikianlah sekilas fungsi tag BODY. Sekarang bukalah kembali source code alias kode-kode HTML. Masih ingat, kan caranya? (Klik menu View lalu Source). Tambahkanlah tag-tag berikut ini:

<html>

<head>

</head>

Tulisan ini akan tampak dalam browser.

</body>

</html>

Di sini terlihat bahwa kita menambah tag <head> dan tag <title>. Tag HEAD berfungsi untuk mengapit berbagai macam fungsi dan informasi yang berkenan dengan halaman web yang bersangkutan. Pada latihan kali ini, kita memasukkan tag TITLE diantara tag HEAD. Sesuai namanya, tag TITLE ini berfungsi untuk mengapit kalimat yang menjadi judul dari halaman web tersebut. Sekarang mari kita tuliskan judul halaman web ini:

<head>

<title>website Pertamaku</title>

</head>

Tulisan ini akan tampak dalam browser.

</body>

</html><html>

Simpan lalu buka lagi file ini. Maka anda akan melihat di baris teratas (yang dinamakan Title Bar) dari program browser akan menampilkan judul atau titel dari halaman web anda yaitu: Karya Pertamaku. latihan pertama selesai... Latihan 2 Dalam latihan kedua ini, kita akan mempelajari beberapa tag yang sedikit lebih sulit. Tag-tag ini berfungsi untuk mengubah tipe huruf yaitu menebalkan (bold), membuat tulisan miring (italic) atau memberi garis bawah (underline) juga memberi warna (color) dan ukuran (size) pada tulisan. Buka lagi program Notepad kemudian tuliskan seperti berikut ini:

<html>

<head> <title>Latihan Ke dua ku</title> </head> <body> Tulisan Ini Bold Tulisan Ini Underline (garis bawah) Aku ini Italic </body> </html>

simpan file dengan nama latiha2.html. lalu buka kembali dan anda akan melihat hasilnya....

buka kembali notepad anda kemudian tuliskan seperti berikut...

<html>

<head><title>latihan keduaku</title>

</head>

<body>

Tulisan ini akan terlihat dengan font times

Tulisan ini akan terlihat dengan font arial

Tulisan ini akan terlihat dengan font verdana dengan warna merah dan berukuran 12pt sekaligus tebal

Tulisan ini akan terlihat dengan font tahoma berwarna biru berukuran 12pt dicetak miring dan bergaris bawah

</body>

</html>

simpan file dengan nama latih3.html Tutup program notepad. Lalu buka dari jendela browse anda.. lihat hasilnya....

latihan 2 selesai....

untuk latihan ke tiga kita akan bahas pada halaman berikutnya yaa... di mana kita akan coba untuk membuat tabel dan menyisipkan gambar. Dan itu merupakan Hal yang paling penting dalam membuat sebuah website....

Pages

Tutorial website vs blog