Kali ini
saya akan berbagi ilmu tentang menginputkan efek gambar ke web, mengelink-kan
dari satu URL ke URL yang lain, dan membuat efek tulisan atau gambar bergerak
dengan menggunakan html dreamveaver. Pembahasan ini juga sebagai tugas
Pemrograman Web untuk mengupload ringkasan materi perkuliahan minggu ini.
Adobe Dreamweaver adalah
aplikasi desain dan pengembangan web yang menyediakan editor WYSIWYG visual
(bahasa sehari-hari yang disebut sebagai Design view) dan kode editor dengan
fitur standar seperti syntax highlighting, code completion, dan code collapsing
serta fitur lebih canggih seperti real-time syntax checking dan code
introspection untuk menghasilkan petunjuk kode untuk membantu pengguna dalam
menulis kode. Dreamweaver dapat menggunakan ekstensi dari pihak ketiga untuk
memperpanjang fungsionalitas inti dari aplikasi, yang setiap pengembang web
bisa menulis (sebagian besar dalam HTML dan JavaScript). Dreamweaver didukung
oleh komunitas besar pengembang ekstensi yang membuat ekstensi yang tersedia
(baik komersial maupun yang gratis) untuk pengembangan web dari efek rollover
sederhana sampai full-featured shopping cart. Oke, langsung saja masuk pada
pembahsan.
A. Cara mengupload Gambar pada Web
1.
Buka software Dreamveaver
2.
Akan mucul kotak dialog, pilih saja HTML.
3.
Mulailah mengetikkan script berikut di layar kerjanya.
<html>
<head>
<body >
<img
src="http://kendhin.890m.com/banner-trik.jpg"
border="0" height="17" width="90">
</body>
</head>
</html>
Kamu bisa
browse foto dari drive yang kamu punya.
A. Cara Menge-Link
Link merupakan elemen
terpenting dalam sebuah
situs. Elemen ini
merupakan jembatan untuk berpindah
dari satu halaman ke
halaman yang lain
dari t opik satu
ke topik yang
lain dalam satu halaman,
at au bahkan ke
halaman web yang
lain atau ke
alamat email. Di bawah
ini adalah sintak penulisan html untuk membuat link (letakkan dibawah tag <body>).
<a
href=”alamat_link”>text atau gambar</a>
Misalkan untuk
membuat link menuju
ke halaman kontak.html
pada text
tertentu maka
html nya adalah:
<a
href=”kontak.html”>text tertentu</a>
Sedangkan
untuk memberikan link pada gambar t tentu
saja didalam tag <a>
terdapat tag
<img>
<a
href=”alamat_link”>
<img
src=”kontak.gif” al
t=”kontak”>
</a>
Dijelaskan di atas
bahwa kita bisa
membuat link yang
menuju ke halaman tertentu, situs
tertentu, dan bahkan
alamat email tertentu.
Di bawah ini adalah contoh html untuk beberapa jenis
alamat tersebut:
Sedangkan untuk
membuka alamat link
ke jendela browser
yang baru kita
bisa
menggunakan target=”_blank”
<a href=”http://www.google.com” target=”_blank”>link menuju ke google</a>
B. Cara Membuat Text Bergerak dari Kiri Kekanan
1.
Buka Software Dreamveaver
2.
Akan muncul kotak dialog, pilih HTML.
3.
Mulailah mengetikkan script dibawah ini di layar kerjanya
<head>
<body>
<marquee
align="center" direction="right" height="45"scrollamount="2"
width="70%">Ini Textnya bisa bergerak</marquee>
</body>
</head>
Nah untuk
membuat gambar bergerak maka gambungkan script untuk mengupoad gambar dan
script untuk membuat tulisanbergerak seperti yang telah saya jelaskan diatas.
C. Membuat teks berjalan ke kiri dan kembali ke kanan
<head>
<body>
<marquee
align="center" direction="left" height="50"
scrollamount="5" width="70%"
behavior="alternate">
<b>Text nya bergerak ?</b>
</marquee>
</head>
</body>
