MEMBUAT WEB SEDERHANA
Sesuai
dengan postingan saya sebelumnya yang membahas tentang Arsitektur Web. Kali ini
saya akan memposting tentang pembuatan sebuah halaman website (HTML) sederhana
menggunakan aplikasi Notepad++. Langsung saja kita mulai pembahasannya.
Dalam penulisan
HTML dokumen tidak jauh berbeda dari sebuah dokumen tulisan biasa lainnya, hanya
saja didalamnya dapat memuat kode yang berisikan instruksi atau lebih dikenal
dengan TAG tertentu. TAG pada HTML selalu diawali dengan <x> dan ditutup
dengan </x> dimana x disini adalah perintah instruksi yang kita inginkan.
Berikut
adalah contoh tampilan script untuk Web Sederhana yang telah saya buat :
Pada awal dokumen HTML, terdapat tag <HTML>
yang merupakan jenis dokumen pada HTML yang diakhiri dengan </HTML> pada
akhir dokumen. Selanjutnya didalam tag <HTML> terdapat tag-tag lain
seperti <HEAD>, <TITLE>, <BODY> yang harus diakhiri dengan
memberikan tanda miring pada tiap instruksinya.
Pada tag <BODY> kita dapat memberikan tampilan
background dengan sebuah warna atau gambar. Kali ini saya memberikan tampilan
pada background dengan sebuah gambar.
Pada background warna kita dapat memberikan listing seperti
berikut:
<BODY BGCOLOR=” warna”>
Sementara background dengan sebuah gambar dapat kita tuliskan
dengan:
<BODY BACKGROUND="gambar">
Pada “gambar” disini dapat kita isikan dengan nama direktori tempat
dimana gambar tersebut disimpan ataupun suatu URL.
Untuk membuat suatu format tampilan pada halaman HTML kita
dapat memberikan kode dasar seperti <B> </B> untuk mempertebal
tulisan, <I></I> untuk membuat huruf Miring, <U></U>
untuk memberikan Garis Bawah, <CENTER></CENTER> untuk membuat suatu
teks atau gambar agar Rata Tengah, <FONT SIZE=?></FONT> untuk
menentukan ukuran huruf (dapat diisi dari 1 sampai 7), <FONT COLOR=”?”>
untuk mengubah warna huruf, serta <FONT FACE=”?”> </FONT> untuk
memilih jenis huruf yang akan digunakan.
Untuk mengatur suatu ukuran huruf kita juga dapat menggunakan
kode <H1> <H2> <H3> <H4> <H5> yang diakhiri
dengan tanda garis miring masing-masing diakhirnya.
Pada tiap baris paragraf kita dapat memberikan kode
<P></P> sebagai pemisah antar paragraf, serta <BR></BR>
untuk melakukan pindah baris.
Selain kita bisa mengubah background dengan gambar atau
warna, kita juga dapat menampilkan sebuah gambar dengan perintah <img src=”gambar”>
kita juga dapat menentukan width dan height dari gambar
tersebut dengan <img src=”gambar”
width=? Height=?>
Langkah selanjutnya simpan dalam format HTML (ekstensi
*.html) dan buka file dengan browser web sejenisnya, maka hasil outputnya akan
seperti pada gambar berikut :
Sekian bahasan dari blog saya kali ini, semoga bisa
bermanfaat dan menambah ilmu kita semua. Sampai jumpa lagi dipostingan saya
selanjutnya... ^^
Komentar
Posting Komentar