HOW TO MAKE HOMEPAGE
WITH EXTENSION HTML?
Salah satu cara membuat halaman website yaitu dengan
menggunakan Adobe Dreamweaver. Gambar berikut ini merupakan salah satu tampilan
halaman website dengan ekstensi .html. Struktur halaman html yaitu
<html>
<head>
<title>
</title>
</head>
<body>
</body>
</html>
Penasaran ingin tau
bagaimana cara membuat halaman website? Simak langkah-langkah berikut ini:
- Setelah membuka halaman html, langkah pertama yang harus dilakukan adalah mendesain background dari website yang akan kita bangun. Untuk membuat background website tetap statis ketika di scroll (lihat gambar di bawah ini), masukkan semua code hingga selesai membuat website ke dalam body, karena body merupakan isi dari halaman website.
Background-image: url (gambar/background.png); digunakan untuk memasukkan background, dan url
(gambar.background.png); merupakan link dari gambar yang diambil. Disini penulis
menyimpan gambar di folder gambar, dengan nama background.png.
Background-repeat:no-repeat; digunakan agar gambar background tidak melakukan perulangan
apabila di scroll.
Background position:center; digunakan untuk meletakkan background di posisi tengah.
Background-size;
digunakan untuk mengatur ukuran background yaitu auto.
Background-attachment;
digunakan agar background bersifat statis.
Setelah menuliskan script tersebut, maka output background tersebut akan
tampak seperti di bawah ini (perhatikan scroll dan background pada gambar 1 dan
2).
- Kemudian buatlah logo dari website yang akan dibuat, logo dari website ini di desain dari gambar yang diberi nama “LOOK”. Untuk menginsert gambar gunakan code berikut ini:
Img
src digunakan
untuk memasukkan gambar dan tanda sama dengan (=) “gambar/logo.png” merupakan gambar logo tersebut disimpan di folder
gambar dengan nama logo.png
- Setelah itu untuk membuat tulisan “HOW TO MAKE HOMEPAGE WITH EXTENSION HTML?”, tuliskan code berikut ini:
Font-size
merupakan
script untuk mengatur ukuran font yang akan digunakan, disini penulis
menggunakan ukuran xx-large.
Color
merupakan warna yang digunakan dalam tulisan tersebut, warna yang terdapat pada
gambar merupakan kode dari #F9C
<p> …..</p> merupan
baris untuk menuliskan tulisan yang akan ditulis.
- Untuk membuat button pencarian, berikut ini adalah code yang digunakan:
- Untuk menuliskan isi website (di dalam gambar tersebut berua biodata), berikut ini adalah code yang digunakan:
Style=”line
height: 1.5em digunakan untuk mengatur posisi antar
baris.
Text-indent
1in digunakan untuk memberikan
paragraf.
Text-align:
justify digunakan untuk mengatur tulisan agar rata
kanan-kiri.
<em><strong>
…….<strong> digunakan untuk memberikan bold pada
tulisan, seperti pada kata “don’t say
before you try it”
"…….."
digunakan
untuk memberikan tanda kutip pada kata “hard” dan “try”.
•
digunakan
untuk memberikan simbol pada riwayat pendidikan berupa (●)
- Dan terakhir membuat footer yang terdapat pada bagian paling bawah sebuah halaman website, dan berikut ini adalah code yang digunakan:
<table
width=”….” Height=”…” border=”…” digunakan untuk membuat
tabel dengan ukuran ketinggian, ketebalan, dan border.
a
href digunakan untuk menautkan halaman dengan halaman
yang lain.
Style:
text-decoration:none digunakan untuk menghapus tanda garis
bawah apabila halaman telah tertaut.
<h1>
digunakan untuk mengatur jenis huruf.
