Simpan Tempat

bunga

bunga

Senin, 12 Desember 2011


Nama     : Mardha
Tetala    : 13 oktober 1994
Ciri*       : Bisa liat sendiri , , tergantung pendapat loch aja schie
Cita*      : Ingin menjadi orang yang berarti bagi orang lain
Hobby    : Bermain Bulu tangkis & Volly
Umur     : Makin hari makin bertambah and tepatnya sekarang 17 tahun
Agama   : Islam

Prinsip : Jangan pernah bersifat seperti gunting yang memisahkan sesuatu yang bersatu ,,
tp , , bersifatlah seprti lem yang selalu menyatukan sesuatu yang terpisah . !
                          Motto  : Hanya sekali membuat keputusan

 
T his is My Coretan ""
Membuat Website dengan Publiser

Publisher dapat kita gunakan untuk membuat website. Untuk memulai pembuatan website, buka program Ms. Publisher dengan cara klik menu Start | Program | Microsoft Office | Microsoft Office Publisher.
Langkah-langkah:
1.     Pada bagian New Publication Pilih Web Sites and E-mail. Akan muncul berbagai macam template dari website.
2.     Pilih salah satu template.
3.     Muncul kotak dialog Easy We Site Builder
4.     Pilih checkbook pada halaman yang akan kita tampilkan. Tekan OK.
5.     Pada setiap halaman yang kita pilih diatas, akan dibuatkan menu pada bagian kiri website kita.
6.     Mulai edit website.
7.     Untuk mengedit Header, klik pada header kemudian ketikkan header baru.
8.     Ketikkan posting atau berita.
9.     Untuk memasukkan gambar melalui Insert | Picture | From File, kemudian browse pada gambar yang akan dimasukkan.
10.                        Simpan website buatan kita dengan melalui menu File | Save As, ketikkan nama file, maka secara otomatis Ms. Publisher akan menyimpan dalam format .pub (format standar Ms. Publisher).
11.                        Untuk melihat tampilan website kita, tekan menu File | Web Page Preview.
12.                        Website hasil design kita akan ditampilkan melalui browser.
13.                        Untuk menyimpan dalam format .html, tekan menu File | Publish to the Web. 




Desain Halaman Web Dengan Dreamweaver 8.0


Untuk dapat mengikuti tutorial ini, diharapkan Anda menggunakan Macromedia Dreamwever versi 8.
Jika Anda menggunakan versi di atasnya, misalnya Adobe Dreamweaver CS 3, CS 4 dan CS 5 Anda harus
menyesuaiakan dengan tools-nya.
Pada tutorial ini kita akan membuat desain halaman web seperti berikut. Pada bagian atas gunakan
header yang dibuat di Photoshop. Tidak memerlukan slicing dalam hal ini. Pada umumnya header
memuat NAMA PERUSAHAAN, JENIS USAHA dan SLOGAN PERUSAHAAN. Di sebelah kiri terdapat menumenu
yang di-link-kan dengan halaman web dengan bentuk yang sama, namun kontennya berbeda. Di
sebelah kanan terdapat menu SEARCHING dan di bawahnya merupakan konten dari setiap menu.
Bagian bawah merupakan FOOTER, biasanya berisi copyright.
Berikut langkah-langkahnya.
1. Di Photoshop buat header dengan ukuran 745 x 150 px. Header yang dibuat memuat: Judul,
Jenis, Slogan, Logo perusahaan. Simpan dengan nama header.jpg
2. Pilih HTML setelah Anda mengeklik menu Dreamwever 8.
3. Tambahkan title halaman web, sesuai slogan perusahaan Anda dan simpan file Anda dengan
nama: index.html
4. Pilih align: center pada bagian Properties yang terdapat di bawah stage.
5. Insert  _Table (Ctrl+Alt+T), dan isikan sesuai dengan gambar berikut. Setelah itu klik OK.
6. Insert  _Table (Ctrl+Alt+T), dan isikan sesuai dengan gambar berikut. Setelah itu klik OK.
7. Letakkan kursor pada baris pertama. Tekan Insert  _Image (Ctrl+Alt+I). Setelah itu masukkan
file header Anda. Klik OK jika sudah selesai.
8. Letakkan kursor Anda pada baris kedua. Insert  _Table dan isikan sesuai dengan data berikut.
9. Atur sedemikian rupa sehingga kolom pertama memiliki width 24%.
10. Letakkan kursor pada baris kedua kolom kedua. Insert_Table dan atur seperti gambar berikut.
11. Letakkan kursor pada kolom ketiga, pilih align: right, kemudian pilih submenu Form. Tambahkan
12. Atur pada kotak dialog Input Tag Accesbility Attributes. Setelah itu klik OK.
13. Posisikan kursor di kolom sebelah kiri. Tambahkan Button dan atur seperti gambar berikut. Klik
OK jika sudah selesai
14. Ganti Button name: Cari dan Value: Cari pada bagian Properties di bawah stage.
15. Pada baris kedua kolom pertama, ketikkan teks: Menu dengan alignment: Center; beri warna
teks: #FFFFFF dan background warna: #999999. Atur denan font: Arial dan size: 12.
16. Atur juga pada baris kedua sesuai dengan langkah 15. Berikut ini tampilan pada baris kedua.
17. Letakkan kursor pada baris ketiga. Insert  _Table dan aturlah seperti gambar berikut.
18. Buatlah kolom pertama dengan lebar 24%.
19. Letakkan kursor Anda pada baris ketiga kolom pertama. Insert  _Table dan aturlah seperti
gambar berikut.
20. Buatlah lebar kolom pertama secara proporsional, seperti gambar berikut. Atur align: center
pada kolom pertama.
21. Buat file di Photoshop dengan ukuran: 8 x 8 px dan berilah warna: #99999. Simpan file tersebut
dengan nama: dot.jpg. Insert  _Image, masukkan file dot.jpg pada kolom pertama baris 1
sampai dengan baris 9. Selanjutnya ketikkan menu-menu pada kolom kedua dan atur dengan
font: Arial, size: 12.

22. Pada baris ketiga kolom kedua isikan konten seperti berikut. Jangan lupa untuk mengatur Vert:
Top.
23. Pada baris ketiga isikan dengan konten seperti berikut.
Copyright ©Istiyanto Company Created by Istiyanto
Best View at 1024 x 768 px
24. Buatlah sesuai dengan kreasi Anda, warna dan fontasinya.
25. Simpan file Anda dan tekan F12 atau pilih submenu: Preview in Firefox 3.5, sesuai dengan
browser yang Anda gunakan.
26. Tampilan di browser.

27. Selanjutnya Anda buat link pada menu pilihan. Blok teks yang ingin Anda beri link dan ketikkan
sesuai dengan nama menu, misalnya: Home  _index.html; Profil  _profil.html dan seterusnya.
28. Save As file Anda sebanyak 8 kali dengan nama: profil.html; produk.html, bukutamu.html dan
seterusnya sesuai dengan daftar menu di atas, sehingga saat ini Anda memiliki 9 file dengan
desain yang sama. Buka kembali file-file yang telah Anda buat dan gantilah kontennya yang
terdapat pada baris ketiga kolom kedua.
29. Tekan F12 untuk preview hasil halaman web yang telah Anda buat.
Selamat Berkreasi !!!

 Mardha
***Tugas kita bukanlah untuk berhasil.   Tugas kita adalah untuk mencoba, karena didalam mencoba itulah kita menemukan dan belajar membangun kesempatan untuk berhasil***
 
 XII. MULTIMEDIA 1
^_^ Jika Tuhan menciptakan pelangi tuk mengindahkan langit, maka Tuhan menciptakan sahabat tuk keindahan hidupmu ^_^  
Cinta
Cintailah kekasihmu sekedarnya saja ,, siapa tahu nanti akan jadi musuhmu.
Dan bencilah musuhmu sekedarnya saja, siapa tahu nanti akan jadi kekasihmu.
 



Minggu, 11 Desember 2011

Mengenal Lingkungan Kerja Dreamweaver MX

Lihat Gambar 1. Dreamweaver MX menawarkan dua layout view untuk dijadikan sebagai tampilan kerja saat Anda membuat halaman web. Setelah instalasi, Dreamweaver MX akan memberikan opsi: Macromedia Dreamweaver MX Workspace atau Macromedia Dreamweaver 4 Workspace. Anda dapat mengubah-ubah tampilan ini lewat menu preferences, Modify > Preferences > Change Workspace. Pilihan ini tentu saja terserah Anda, pada tutorial ini saya akan menggunakan Dreamweaver MX Workspace.

  Fig 1. Lingkungan kerja Dreamweaver MX


Berikut ini penjelasan untuk elemen-elemen workspace seperti telah tertera pada gambar. Document Window adalah tempat di mana Anda dapat membuat halaman web secara visual, kode, atau keduanya. Insert panel adalah tempat Anda dapat memasukan image, Flash movie, table, atau elemen lain. Insert panel ini serupa dengan menu Insert pada menu bar. Untuk memunculkan panel ini, klik Windows > Insert atau tekan Ctrl-F2. Property Inspector berguna untuk melakukan pengeditan pada suatu elemen di Document Window. Document Toolbar berguna untuk mengubah tampilan dari disign/visual view, code view, atau keduanya sekaligus. Selain itu juga untuk memberi titel pada dokumen, melihat tampilan di browser. Panels Group merupakan kumpulan dari panel-panel Dreamweaver MX.


Pada bagian ini kita akan membuat halaman web sederhana dengan pemformatan dasar pada teks, link, anchor, dan Page Properties.
Bekerja dengan Teks
Pada dasarnya Dreamweaver tidak jauh berbeda dengan program pengolah kata dalam memformat teks. Namun terdapat sedikit perbedaan karena Dreamweaver menggunakan HTML. Untuk memformat teks dapat kita lakukan dengan menggunakan Property Inspector. Lihat Gambar 2


Fig 2. Property Inspector