Muhammad Rizqi Tohopi

Optimis itu perlu…!!!

Membuat Website itu Mudah !!!

Adakah jalan yang dapat mempermudah pekerjaan membuat website ? Pepatah mengatakan: Banyak jalan menuju Roma. Kita bisa menggunakan berbagai macam cara untuk membuat website. Salah satu jalan yang mudah untuk merancang dan membuat website adalah dengan menggunakan perangkat lunak paling populer untuk membangun website: Adobe Dreamweaver.

Adobe Dreamweaver adalah salah satu perangkat lunak canggih yang dapat Anda gunakan untuk merancang dan membangun website. Dengan menggunakan Adobe Dreamweaver, pekerjaan membuat website yang rumit sekalipun akan menjadi pekerjaan yang mudah.

Sekarang, saya akan memaparkan contoh  website yang saya buat.

Terlebih dahulu bukalah aplikasi Adobe Dreamweaver, kemudian buatlah html baru. Pastikan anda sudah membuat site baru. Kemudian pada lembar kerja saya memilih tampilan desain, dikarenakan untuk mempermudah saya dalam mendesain web.

Selanjutnya saya membuat tabel, dimana tabel tersebut berfungsi sebagai tempat untuk meletakkan isi sebuah web. Caranya pilih insert => table, akan muncul kotag dialog. Saya mengisi untuk baris sebanyak 30 dan kolom 4.

1

Kemudian saya akan memberikan merge cell pada baris pertama sebelum memasukkan gambar banner web. Caranya drag baris yang akan di merge cell, kemudian klik kanan => pilih Table => Merge cells

Hasil Tampilan

3

Untuk memberikan gambar pada tabel ini, saya mengambil gambar yang saya desain dari photoshop. Di copy gambar tersebut, kemudian paste di tabel yang sudah di merge. Akan muncul kotak dialog seperti berikut.

4

Pilih Yes. Kemudian simpan gambar tersebut di sebuah folder dimana web latihan tadi disimpan.

Hasil Tampilan

5

Setelah banner selesai, saya membuat button. Button tersebut terlebih dahulu saya design melalui photoshop. Cara memasukkan gambar button tersebut, sama seperti memasukkan gambar banner web.

Hasil Tampilan

6

Kemudia saya membuat sebuah tulisan “Selamat Datang Di WEB Kami” dengan memberikan kode program marque pada kalimat tersebut. Caranya pilih Insert => Tag => Html Tags => Page elements => marque.

7

Hasil Tampilannya

9

Selanjutnya saya membuat posisi web di tengah. Caranya terlebih dahulu saya klik tabel kemudian atur Align pada Properties.

10

Hasil Tampilannya

11

Untuk memperindah tampilan web., saya memasukkan background pada desain web. Caranya klik diluar table, kemudian pilih Page Properties pada kotak Properties.

12

Akan muncul kotak dialog seperti ini

13

Hasil Tampilannya

 15

 Untuk memberikan warna background pada web pilih

14

Hasil Tampilannya

16

Selanjutnya saya membuat Link di setiap button (Home, Kurikulum, Ekstrakurikuler, Alamat). Untuk  memasukkan linknya, terlebih dahulu saya membuat html baru sebagai tempat untuk dijadikan link pada setiap button.

Cara membuat link, klik gambar Home kemudian browse file link pada kotak properties.

17

Button Kurikulum, Ekstrakurikuler dan Alamat, cara pembuatan link sama seperti Home.

Link Button Home

18

Link Button Kurikulum

19

Link Button Ekstraakurikuler

19

Link Button Alamat

20

Untuk menghilangkan tabel sehingga tampilan web menjadi rapi, ubah format Border dari 1 menjadi 0 pada kotak Properties.

21

Tampilan Browser Melalui Mozilla Firefox

Tampilan  Button Home

23

Tampilan Button  Kurikulum

24

Tampilan Button Ekstrakurikuler

25

Tampilan Button  Alamat

26

Sekian postingan kali ini, jika ada yang kurang mohon komentarnya. Postingan ini berupa hasil praktikum di lab. 🙂

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

%d blogger menyukai ini: