Mendesign Website NEWS

Mendesign Halaman Website

Published by admin on April 23, 2009

Nah videobelajar kita kali ini akan mempelajari cara  membuat design  web template  menggunakan software  adobe potoshop. Caranya  adalah :

1.       Buka  terlebih  dahulu  software potoshop

2.       Klik  menu  file  dan pilih  new, di kotak   dialog  new  kita  akan tentukan  ukuran  widthnya  yaitu  775  dan  heightnya  790. Kemudian  resolusinya  72,  color  modenya  RGB  Color  dan  background  contentsnya    adalah  white, kemudian  klik  tombol  ok. Sekarang  kita  telah  mempunyai  halaman  kerja.
3.       Lalu  klik  view  dan  pilih  rulers, setelah  itu  kita  klik  pada bagian  rulers  secara  vertical  pada  posisi   25  pixel dan  kita  letakkan  kembali  garis  bantu  pada posisi  750  pixel. Kemudian  pada bagian  horizontal  kita  posisikan  di  20  pixel  dan kita  beri  kembali  garis  bantu  pada posisi 750  pixel.  Kita  pastikan  bahwa  posisi  ini  sudah  benar  dan untuk  mencek  ukuran  sebenarnya  kita  gunakan  zoom.
4.       Klik  rectangle  tools  pastikan  bagian  pate  terpilih, lalu  kita  buat  kotak  sebesar  garis  bantu  yang  baru  kita  buat  dan  klik  kanan  pilih  make  selection  dengan radius  0  lalu  klik  ok. Kemudian  muncul  seleksi  dan  pilih  tombol  edit  setelah  itu  pilih  stroke. Tentukan  terlebih  dahulu  width  adalah  1  kemudian  warnanya  adalah  kita  buat  dengan kode  warna  b6b6b6  yaitu  muncul  warna  abu - abu  kemudian  klik  tombol  ok.

Setelah  itu  cara  membuat image  baner  yaitu  kita  masukkan  image  baner  yang   kita  punya  lalu  kita  tarik dan masukkan  ke  halaman  potoshop  kita.  Kemudian  image  banner  di  seleksi  tekan  tombol  Ctrl+A  dan  klik  tombol  edit pilih  copy. Kita  masuk  kembali  ke  halaman  kita yang  baru, kemudian  kita  buat  layer  baru  yaitu  pada  tombol  create  new  layer   lalu  klik  tombol  edit  kemudian  paste. Sekarang  kita  sudah  mempunyai  image  banner kemudian   kita   letakkan  image banner  tersebut  di  atas da  harus  pas dengan garis  bantu. Kemudian  kita  buat  layer  baru  lalu  pilih  warna  dengan kode  2c2c2c. Untuk mempermudah  kita  membuat  image  kita  harus  menggunakan  garis  bantu  dengan  menggunakan  rulers. Setelah  itu  kita  klik  rectangle  tools  pilih  pada  bagian  optionnya   adalah  fill  pixels  untuk  membuat kotak  image  logo  yang  akan  di  buat. Caranya  sama  seperti  yang  pertama  kita  membuat image  banner.


Cara  membuat kotak  untuk  design logo  yaitu  kita  klik  rectangle  tools  pilih  fill  pixels, kemudian  kita  buat kotak  image  di sebelah  image  baner  tujuannya   adalah  untuk meletakkan  logo  maka  kita  masukkan  gambar  logo  yaitu  dengan mengklik  gambar  logo  tersebut  lalu  bawa  ke  halaman  potoshop  lalu  klik  tombol  seleksi  dan klik  tombol  edit  dan  pilih  copy  lalu  masuk  ke  halaman  kerja  kita  kemudian  kita  buat  layer  baru  lalu  paste  di  halam  di  kotak  design  untuk  logo. Setelah  itu  kita  akan  membuat kotak  image  untuk  dibawah  kotak  image  logo  yaitu  dengan  membuat  garis  bantu  menggunakan  rulers. Kemudian  kita  klik  rectangle  tools  dan kita  pilih  fill  pixels  dan kita  buat  kembali   layer  baru  dan pilih  warna  dengan  warna  hijau, setelah  itu  kita  buat  image  sesuai  garis  bantu  yang  kita  buat.  Dan kita  tambah  letakkan  image  dibawah  kotak  yang  berwarna  hijau  caranya  seperti  yang  sebelumnya. Yitu  kita  pastekan  di  halaman  kerja  kita. Setelah  itu  kita  masukkan  text, caranya   dengan mengklik  text  tools. Kita  tinggal  mengetikkannya  di bawah  image  yang  baru  kita  letakkan.  Kemudian  kita  akan  menambahkan  image  di  sebelah  kanan  yaitu  dibawah  baner .

Selanjutnya  kita  akan  membuat image-image  dan  text  untuk  isi  yaitu  kita  letakkan  isi  dari  text  di  tengah  atau  di  bawah  banner  dengan mengklik  text  tools   lalu kita  ketikkan  isi  halaman  web  template  kita.  Setelah  itu  di  bawah  text  kita  akan  letakkan  sebuah  gambar pada  halaman  kerja  kita. Kemudian  yang  terakhir  kita  akan  membuat  menu-menu  pada  halaman web  template kita  yaitu  dengan cara  klik  text  tools  kemudian  kita ubah  ukurannya  menjadi  14  dan  warna  textnya  adalah  warna  hitam  atau  dengan kode  0000 dan  klik  ok,setelah  itu  kita  ketikkan  menu-menunya  seperti  home, about  us, the  came, support  dan  contact. Kemudian  klik  window  lalu  pilih  character dan  kita  ubah  jarak  daripada  menu-menu  yaitu  100 dan  kita  ubah  jenis  hurufnya  dengan reguller.

Download: Video 1, Video 2

zoloft and suicide

Share/Save/Bookmark

Readers Rating:
1 Star2 Stars3 Stars4 Stars5 Stars (1 votes, average: 4 out of 5)
Loading ... Loading ...

Install the postviews plugin

Comments:
10 so far
Toolbar:
add your comment add this to delicious add this to digg share this on facebook Stumble this item
Tagged with: , ,
  1. Fany on Fri, 8th May 2009 9:26 am 

    muat design ini pake photoshop 7.0 bisa?
    aqu nyoba kok gak bisa ya?

  2. admin on Fri, 8th May 2009 11:41 am 

    Maaf, maksud anda membuat disignnya pake photoshop 7?, bisa

    admin.

  3. husni on Thu, 14th May 2009 11:15 pm 

    Saya sudah membuat desain nya di potoshop, tapi bagaimana cara masukkan ke dreamwaver? dalam bentuk format apa kita simpan desain di potoshop? JPEG….ya

  4. isman on Wed, 3rd Jun 2009 7:39 am 

    Karena sekolah kami belum mempunyai website, jadi saya sangat memerlukan video tutorial ini baik yang menggunakan adobe photoshop maupun dreamweaver secara lengkap dalam bentuk CD dan tentu saja saya akan membelinya.Terima kasih.

  5. dzikri on Fri, 3rd Jul 2009 1:19 am 

    setelah selesai filenya di simpan dalam bentuk apa? terus bagaimana cara menslicenya? mohon pencerahannya terimakasih?

  6. Faraby on Thu, 26th Nov 2009 2:01 am 

    apakah saya bisa mendapatkan gambar header,logo dan yang lainnya yang dipakai dalam materi membuat website di atas . .
    Terima kasih . .
    saya sangat berharap bisa, agar dapat lebih memudahkan kami semua dalam proses belajar . .

  7. Fitri on Tue, 9th Feb 2010 4:10 pm 

    makasih banyak.

  8. arno on Mon, 5th Apr 2010 9:09 pm 

    bagus bnget tutor nya…

  9. abdil on Sun, 23rd May 2010 5:59 am 

    waduh….bank makasih bagt,,,nie sumpah beguna bwt saya :D

  10. pard1 on Wed, 4th Aug 2010 9:57 am 

    Belum sempet liat videonya sih.. tapi thanks sdh berbagi.. ^^




XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

F.Office

Eko

Eri

Danu

Jun

Novi Dj

Yanda

Paste your Google Analytics (or similar) tracking code here