Di Posting Oleh : INFO PENDIDIKAN
Kategori : EDUCATION Tips
Cara membuat desain web dengan photoshop - Ada beragam alasan yang dimiliki seseorang untuk membuat desain websitnya sendiri. Mungkin salah satu alasannya ialah biar mereka memiliki website dengan tampilan berbeda dan lain daripada yang lain. Di dalam tutorial photoshop kali ini, aku akan mengajak anda semua untuk mencar ilmu bersama mengenai cara membuat desain web dengan photoshop secara cepat dan mudah. Tentu saja penjelasan yang aku berikan di sini hanya berupa teknik-teknik dasar yang digunakan dalam pembuatan desain atau template dari sebuah website. Desain website yang aku hadirkan di sini dibuat dengan memadukan beragam warna sehingga tampilannya akan menjadi menarik meski tata letaknya mampu dibilang amat sederhana. Dengan kreatifitas yang anda miliki, nantinya anda mampu melaksanakan modifikasi sesuai dengan yang anda inginkan.
 |
| Source: Google Images |
Sebenarnya untuk membuat sebuah desain website dibutuhkan dua langkah. Langkah yang pertama ialah membat layout dengan aplikasi photoshop dan langkah yang kedua ialah membuat instruksi html untuk desain tersebut melalui aplikasi dreamweaver. Karena blog ini hanya membahas mengenai tutorial photoshop, maka yang aku jelaskan di sini hanyalah langkah awal yaitu perihal bagaimana membuat layout sebuah website atau blog dengan menggunakan photoshop. Untuk tutorial perihal pembuatan instruksi html nya anda mampu mencarinya di google. Jangan khawatir alasannya ialah ada berbagai website yang menyediakan perihal cara membuat html dengan aplikasi dreamweaver. Baiklah tak perlu berlama-lama lagi mari pribadi saja kita simak cara pembuatan desain website dengan photoshop berikut ini:
Tutorial Cara Membuat Desain Website dengan Photoshop Mudah dan Cepat
Langkah pertama
Tahap pertama dalam pembuatan desain web ialah membuat layout untuk desain awal. Buatlah sebuah kanvas gres dengan ukuran 700 x 875 px dan pengaturan resolusi pada angka 72 ppi. Jangan lupa untuk mengatur background content pada opsi transparent.
 |
| Source: Google Images |
Langkah kedua
Klik rounded rectangle tool pada kolom tool box, kemudian buatlah sebuah bidang dengan bentuk persegi agak memanjang ke bawah. Ini kan digunakan sebagai background dari desain web yang anda buat.
 |
| Source: Google Images |
Langkah ketiga
Klik kanan pada layer shape 1 kemudian pilih opsi blending option. Setelah itu klik gradient dan buatlah gradasi warna sesuai dengan kesukaan anda. Untuk desain ini dipilih warna hijau agak kecokelatan dengan warna dasar putih sehingga hasil gradasinya akan tampak ibarat ini:
 |
| Source: Google Images |
Langkah keempat
Langkah selanjutnya ialah membuat panel menu yang nantinya akan diisi dengan beberapa kategori menu. Klik lagi rounded rectangle tool kemudian buat sebuah kotak persegi kecil di bab kiri atas background. Beri gradasi warna yang agak berbeda biar tidak menyatu dengan warna pada background.
 |
| Source: Google Images |
Langkah kelima
Buatlah beberapa persegi memanjang dengan rounded rectangle tool berikan warna yang lebih cerah ibarat yang ada pada gambar di bawah ini:
 |
| Source: Google Images |
Langkah keenam
Berikan goresan pena pada kolom menu yang telah dibuat. Biasanya kolom menu diisi dengan beragam kategori mulai dari halaman utama, perihal saya, galeri foto, dan juga beragam link yang bertautan dengan website tersebut. Tak lupa ditambahkan gambar menarik lainnya di sebelah kanan background biar desain website tidak terlalu kosong dan monoton.
 |
| Source: Google Images |
Langah ketujuh
Gunakan slice tool untuk memotong-motong layer menjadi beberapa bagian. Daftar menu dibagi menjadi 4 bab sesuai dengan kategori yang ada. Kemudian logo website di sebelah kanan dipotong menjadi 1 bagian. Dan buat 1 bab di bawah untuk konten atau isi dari web tersebut.
 |
| Source: Google Images |
Langkah kedelapan
Sejauh ini desain web sederhana sudah selesai, anda tinggal menyimpannya dengan menuju menu file>save for web and devices...
 |
| Source: Google Images |
Langkah kesembilan
Pada jendela wizard pada dikala melaksanakan save, buat pengaturan ibarat pada gambar di bawah ini:
 |
| Source: Google Images |
Itulah kiranya langkah awal dalam cara membuat desain web dengan photoshop mudah dan cepat selanjutnya anda tinggal mengeditnya dengan menggunakan macromedia dreamweaver untuk memasukkan instruksi html pada desain tersebut biar dapat digunakan sebagai template dari sebuah website atau blog yang anda miliki. Sekian dari saya, hingga jumpa lagi pada beragam tutorial photoshop selanjutnya.
0 Response to "INFO PENDIDIKAN Cara Membuat Desain Web dengan Photoshop Mudah dan Cepat"