Senin, 03 Oktober 2011
Gambar & Teks Berjalan
07.41 |
Diposting oleh
Unknown
Gambar biasanya menjadi bagian yang paling menarik pada sebuah website. Gambar menjadi daya tarik utama seorang pengunjung untuk tetap betah berlama-lama terpaku pada sebuah website. Selain itu, gambar juga menjadi identitas tersendiri bagi seorang perancang website, yang membedakan website yang dibuatnya dari website-website lainnya. Betapapun sederhananya sebuah website yang dirancang tetap akan memiliki ciri khas yang tidak dimiliki oleh website lain.
Gambar pada sebuah halaman website secara sederhana dapat dihasilkan oleh berbagai perangkat elektronik yang dapat mengubah foto atau gambar menjadi data digital dalam bentuk image. Scanner dan Digital Camera adalah perangkat yang biasa digunakan untuk memproduksi gambar dalam bentuk digital. Sedangkan jenis file yang umum dipergunakan pada halaman html adalah: jpg, gif, png. File-file jenis ini sangat mudah ditemukan dan bertebaran di internet. Namun, untuk memuatnya pada halaman html yang kita buat harus memperhatikan aspek legal agar tidak terjadi hal-hal yang bertentangan dengan hukum nantinya.
Tag yang dipergunakan untuk menampilkan gambar adalah <img src=”namafile.jenisfile”>. Misalnya untuk menampilkan gambar dengan namafile: “header.jpg”, yang berupa gambar berikut:
maka pada file html akan ditulis seperti ini:
<html> |
Hasilnya akan terlihat sebagai berikut:
File: “header.jpg” di atas memiliki ukuran: 780 x 120 piksel. Dibuat dengan acuan lebar monitor komputer yang berukuran VGA: 800 x 600 piksel. Hasilnya ditampilkan pada monitor dengan ukuran yang lebih lebar dari ukuran VGA. Tampak bahwa gambar tidak berada di posisi tengah. Untuk memperbaikinya kita dapat membuat Tag <center> dengan penutup </center> untuk membuat Tag <img> menjadi rata tengah.
Tambahkan warna background pada Tag <body> dengan warna yang sesuai dengan karakter yang ingin ditampilkan, misalnya warna abu-abu tua untuk memberi kesan gagah. Anda dapat menambahkan atribut border pada Tag <img> untuk memberi garis pembatas pada gambar.
<html> |
Menampilkan Gambar Sebagai Background
Gambar selain ditampilkan secara tersendiri, juga dapat dijadikan sebagai background. Halaman website dapat diisi dengan gambar dengan ukuran relatif kecil yang ditampilkan secara berulang-ulang sehingga memenuhi seluruh halaman.Contohnya adalah gambar “bgr.gif” dengan ukuran 1 x 8 piksel, seperti ini:
dapat dijadikan sebagai background dengan cara menuliskan pada properti <body> sebagai berikut:
<html> |
Hasilnya akan terlihat sebagai berikut:
Nah, mudah bukan? Tentu saja untuk bisa menyiapkan gambar-gambar yang baik, kita harus mempelajari software yang sesuai. Adobe Photoshop adalah salah satu software pengolah gambar / foto yang sangat berguna untuk pekerjaan ini.
Perlu diketahui, file gambar pada sebuah halaman html bisa ditempatkan pada folder yang sama dengan file html – seperti pada 2 contoh di atas. Atau, ditempatkan pada folder khusus yang diberi nama “images”. Gunanya adalah untuk memisahkan file-file gambar dari file-file html agar terorganisasi dengan baik dan tidak bertebaran bercampur dengan file-file html. Pada sebuah website yang sudah lengkap, file-file gambar jumlahnya bisa puluhan, ratusan, bahkan ribuan, sehingga akan lebih rapi jika ditempatkan pada folder khusus dengan nama : images.
Menambahkan Teks Berjalan
Selanjutnya kita bisa menambahkan tulisan berjalan di bawah gambar header tersebut dengan menggunakan Tag <marquee> dan ditutup dengan </marquee>. Tentu saja kita dapat menambahkan style pada tulisan agar ditampilkan dengan warna dan font yang sesuai dengan selera.
<html> |
Langganan:
Posting Komentar (Atom)
Statistik
Translate
Blog Archive
-
▼
2011
(1064)
-
▼
Oktober
(834)
-
▼
Okt 03
(33)
- Santai dengan assembler 8051
- bersenang senang dengan codingan
- Daftar kode
- Konsep Dasar Java
- Fitur-fitur Baru pada Adobe Flash CS4
- Apakah Flash itu?
- Perbedaan CSS dan HTML
- Mengenal CSS
- Bekerja dengan Form
- Apakah PHP ?
- Karakter Khusus
- Form
- Table untuk Layout
- hosting
- Warna & Font
- Stylesheet
- Gambar & Teks Berjalan
- Analisa
- Link
- Html
- Text Formating
- Frameset
- Menghilangkan (virus) Autorun.inf pada Flashdisk
- Menjumlahkan Waktu dengan Format hh:mm:ss Mengguna...
- Membuat Fungsi Tanggal
- Verifikasi alamat email ini
- Verifikasi alamat email ini
- Verifikasi alamat email ini
- Mempercepat Koneksi Internet
- Rumus Luas dan keliling Persegi Panjang dengan Php
- Rumus Luas dan keliling Persegi dengan Php
- Rumus menghitung luas lingkaran dengan Java
- Rumus Luas Lingkaran dengan Php
-
▼
Okt 03
(33)
-
▼
Oktober
(834)
0 komentar:
Posting Komentar