Senin, 04 November 2013

Penggunaan Link pada WEB


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