Pada pertemuan kali ini, saya akan mempraktekkan
cara penggunaan link dan menambahkan link
pada contoh web yang telah dibuat. Pada contoh tampilan web disini, sebelumnya
saya telah membuat tampilan awal laman web secara sederhana dengan bertemakan
pariwisata dan budaya yang ada di Indonesia. Berikut adalah contoh syntaks html
sederhana yang telah dibuat untuk menghasilkan laman web pariwisata sederhana.
Pada gambar pertama,
terdapat beberapa garis yang menandai keterangan yang terdapat pada gambar,
yaitu pada bagian pertama menjelaskan tentang title atau judul yang akan tampil
pada halaman web yang telah dibuat. Pada bagian kedua yaitu header, dimana pada
bagian header ini akan menampilkan teks bertuliskan budaya dan pariwisata
indonesia dengan ukuran teks 18, dengan warna teks putih dan letak teks
tersebut berada di tengah pada bagian header dari suatu laman web yang telah
dibuat.
Pada keterangan ketiga
yang menandai gambar tersebut, dimana keterangan ini digunakan untuk membuat
suatu kolom kecil yang terletak pada bagian kiri dari suatu halaman web yang
dibuat. Dimana pada kolom kecil tersebut terdapat beberapa menu, yaitu menu
home, menu profile, menu budaya dan menu pariwisata seperti yang terlihat pada
tampilan web yang telah dibuat. Selanjutnya pada kolom kecil sebelah kiri
tersebut terdapat keterangan yang menandai penggunaan link yang akan digunakan,
dimana pada bagian ini link akan digunakan pada menu home dan menu profile.
Untuk penggunaan link cukup menambahkan <a> yang diikuti dengan tujuan
link tersebut mengacu kemana, seperti contoh berikut ini <a
href="pertemuan 2.html"> kemudian diakhiri dengan </a>. Pada
gambar pertama, syntaks pembuatan laman web terpotong dan berikut adalah
lanjutan dari potongan syntaks yang terpotong pada gambar pertama.
Pada gambar kedua ini
merupakan lanjutan dari syntaks html pembuatan laman web yang digunakan, dimana
pada gambar ini terdapat penggunaan fitur link, namun pada penggunaan fitur
link disini yang terdapat pada bagian footer, dimana pada link tersebut tidak dilakukan
tujuan kemana link dari bagian tersebut, hanya saja membuat bagian yang
diinginkan terlihat dapat seperti dilakukan pengelinkan yang akan dituju.
Selanjutnya setelah
pembuatan syntaks html, kemudian untuk mempercantik tampilan laman web yang
sederhana itu, kita dapat melakukannya dengan penggunaan css, dimana css disini
berfungsi untuk membuat tampilan web menjadi lebih indah dan hidup. Berikut
adalah contoh penggunaan syntaks css yang dipergunakan untuk membuat tampilan
halaman web pariwisata dan budaya Indonesia menjadi lebih indah dan bagus.
Pada syntaks css
tersebut terdapat beberapa penggunaan untuk memperbaiki atau bahkan memperindah
tampilan halaman web yang dibuat. Pada bagian body ada penambahan background
yang digunakan pada tampilan web tersebut. Kemudian pada bagian header terdapat
pengaturan yang membuat tampilan header dimana background header berwarna biru
dengan ukuran header sebesar 100pixel kemudian untuk jenis tulisan pada header
bertipe verdana sedangkan warna tulisan pada header akan berwarna putih.
Selanjutnya pada bagian
main content, dimana pada bagian ini digunakan untuk pegaturan jenis dan ukuran
kolom yang dibuat sesuai dengan keinginan, seperti pengaturan besar dan
panjangnya kolom yang digunakan, background judul colom yang dibuat, layar
belakang bagian kolom yang dibuat bahkan sampai jenis tulisan yang akan dimuat
pada bagian kolom tersebut. Selanjutnya pada bagian footer dibuatlah semacam
border atau tabel yang akan menjadi landasan dari footer tersebut, disini juga
terdapat pengaturan background dari suatu footer dimana penggunaan warna
background dilakukan dengan menggunakan kode warna, namun juga dapat dilakukan
dengan cara menuliskan langsung warnanya seperti pada penggunaan background
untuk kolom pada bagian main content.
Kemudian, setelah
pembuatan file .css selesai dilakukan, maka simpan file tersebut dalam satu
folder bersamaan dengan file .html. Jika sudah selesai semua, maka berikut
adalah contoh tampilan sederhana halaman web pariwisata dan budaya yang telah
berhasil dibuat.
Pada gambar diatas,
merupakan contoh tampilan dasar seerhana halaman web yang telah berhasil
dibuat. Pada menu kolom sebelah kiri pada halaman home terdapat beberapa menu
yang ada didalam kolom tersebut, seperti menu profile, pariwisata dan menu
budaya. Pada ketiga menu tersebut terdapat beberapa menu yang telah dilakukan
penambahan link, seperti pada menu home dan menu profile, sedangkan pada menu
pariwisata dan budaya belum dilakukan penambahan fitur link pada menu tersebut.
Pada menu profile bila
dilakukan pengelinkan, maka akan menuju halaman web yang ditampilkan
berikutnya, sebagai contoh menu profile kita pilih maka selanjutnya akan
menampilkan menu profile, seperti pada gambar dibawah ini. Dan selanjutnya
hanya manambahkan isi dan bagian bagian yang diinginkan pada tampilan halaman
web berikutnya.Sekian penjelasan saya tentang penggunaan link pada halaman web secara sederhana, semoga ddapat bermanfaat untuk yang membutuhkannya.
Tidak ada komentar:
Posting Komentar