You are on page 1of 5

Membuat Design Web Sederhana

Sekarang ini di dunia web khususnya terdapat berbagai macam gaya dan bentuk web yang menarik, untuk dipublikasikan ke internet semua itu bertujuan untuk menarik user unruk terus mengunjungi web tersebut .Disamping dari isinya yang bermanfaat karena tampilan web nya pun menarik, sehingga orang yang masuk untuk melihatnya akan merasa nyaman dan tidakl bosan dengan tampilan yang bias dibilang monoton atau Cuma gitu-gitu aja. Maka dari itu penulis akan berusaha semaksimal mungkin untuk membuat web yang menarik. Dalam pelajaran kali ini kita akan belajar bersama membuat trik dalam membuat design web yang sederhana khususnya untuk kita yang baru pertama belajar atau untuk orang awam serta orang yang sudah mungkin lebih tahu tentang photoshop ini 1. Kita open-All program-pilih Adobe Photoshop 7.0 kemudian pilih File-New dengan ukuran seperti pada gambar klik OK

2. Create New layer pada jendela Layers, sehinggga pada jendela layers bertambah dengan nama layer Layer 1

3. Pada layer 1 kita akan membuat biner dengan menggunakan Rectangular Marquee tool , dengan cara drag pada bagian atas lembar kerja dan diwarnai dengan menggunakan gradient tool dan untuk menghilangkan seleksi tekan Ctrl+D.

4. Create New layer pada jendela Layers, sehingga pada jendela layers bertambah dengan nama layer Layer 2 untuk membuat left color sebuah web, caranya seperti no 3.

5. Kemudian kita membuat biner untuk Kita tuliskan Home, Profile, Product, Contact caranya seperti no 3 dan no 4, kemudian kita buat tulisannya dengan cara Ketik Horizontal tool ,dan apabila ukuran default terlalu kecil kita bisa atur menggunakan Transform atau ketik Ctrl+T .

6. Pada biner kita buatkan tulisan Welcome to My Web kemudian kita buat efek double ring Glow untuk mempercantik tulisan , dan kita buatkan garis bawah untuk tulisan tersebut dengan menggunakan dan jangan lupa buatkan layer baru , kemudian atur ukuran sesuai keinginan anda untuk variasi gunakan free transform.

7. Kemudian kita akan melangkah ketahap pembuatan link nya dengan menggunakan , Drag pada kata Home , Profile , Product dan Contact

untuk dijadikan link.. Kalau sudah di drag , pilih Slice Select Tool , klik 2 kali pada Home sehinnga akan muncul form Slice Option , tulislah seperti pada form dibawah, klik OK .

8.

Langkah selanjutnya sesudah diatur target link nya , pada layar isi putih kita tulis dengan missalnya Home ( Untuk mengetahui bahwa link sudah benar ) kemudian klik file save for web dan aturlah seperti form dibawah ini bila sudah klik Save dengan nama index.html ( usahakan kita membuat folder sendiri ):

9. Untuk membuat link Profile, Product dan Contact, kita lakukan seperti contoh nomor 7 dan 8 dan nama linknya disesuaikan , misal Profile simpan dangan nama profile.html dan bertuliskan Profile pada bagian isi, begitu juga Product simpan dengan nama product.html dan bertuliskan Product pada bagian isi, dan Contact simpan dengan nama contact.html dan bertuliskan Contact pada bagian isi. Jangan lupa saat akan menyimpan dengan ketentuan gambar pada nomor 8 kita kita tekan Ctrl+A dahulu agar bisa tercopy semua baru kemudian klik save dan beri nama sesuai dengan linknya. 10. Untum melihat hasilnya kita dokumen yang kita simpan dan klik 2 kali pada file html nya. Lihat pada pagian atas web apabila alamatnya benar sesuai dengan nama linknya masing-masing berarti anda sudah berhasil.

Selamat mencoba membuat web sederhana , mudah-mudahan bisa mengembangkan lebih baik lagi dari latihan yang kita pelajari.

You might also like