July 21, 2024

Membuat Galeri Foto Web dengan Photoshop

2 min read

Photoshop menyediakan fasilitas untuk membuat galeri foto web. Berbagai template yang juga sudah tersedia sehingga kita hanya perlu melakukan perintah dan memilihnya. Untuk membuat galeri ini, sebelumnya kita harus mempersiapkan gambar/foto, folder tempat gambar tersebut, dan folder tujuan penyimpanan.

Langkah 1

Setelah itu pilih File รขโ‚ฌโ€œ Automate-Web Photo Galery.

clip_image002

Maka kotak dialog Web Photo Galery akan muncul.

clip_image004

Pada styles terdapat template untuk Web Photo Galery. Pilihan Styles sebenarnya banyak pilihan sesuai keinginan. Saat ini saya memilih pilihan Horisontal Slide Show untuk styles.

Bagian email juga bisa apabila diperlukan. Pada Bagian source Images, pilih folder sumber gambar. Kalau sudah ditentukan foldernya, klik OK. Di samping kanan tombol tersebut akan muncul alamat folder sumber gambar. Jika ada subfolder di dalam folder sumber dan ingin dimasukkan dalam proses pembuatan, pilih kotak Include All Subfolders. Klik tombol Destination untuk menyimpan hasil penyimpanan gallery kita nantinya . Kalau sudah ditentukan foldernya, klik OK.

clip_image006

Selanjutnya pada tab Options dan pada pilihan General, kemudian pada Extension pilih. Htm. Setelah itu centang bagian Add Width and Height Attribut For Images.

Langkah 2

Pada tab Options, ubah dari General menjadi Banner.

clip_image008

Beri nama situs atau gallery pada form Site Name, Misalnya CLUB WEB DESAIN PALCOMTECH LAHAT.

Isi bagian Photographer apabila diperlukan. Isi Contact Info dengan alamat atau lainnya yang bisa digunakan oleh user untuk menghubungi anda. Isi juga bagian date untuk tanggal pembuatan galeri anda. Secara default tanggal sudah ditentukan oleh Photoshop.

clip_image010

Langkah 3

Masih pada Option, Ubah dari Banner menjadi Large Image.

clip_image012

Pada bagian ini berguna untuk mengatur tampilan view setiap gambarnya. Pada Resize Images Pilih Medium dengan Ukuran 350 Pixel. Pada Bagian Constrain pilih Both dan pada JPEG Quality pilih Medium dengan skala 5 sehingga ukuran File Size akan menyesuaikan. Untuk Border Size, isi saja 0 pixels,Pada Bagian Tittle Use kemudian centang/pilih filename, description, credits, title dan copyright.

Langkah 4

Pada tab Options, ubah dari Large Images menjadi Thumbnails. Pada bagian Thumbnail digunakan untuk mengatur gambar thumbnail, kemudian atur pada Size Images, pilih Medium dengan ukuran 75 pixel. Untuk Border size isi saja 0 pixels dan untuk Tittle Use, pilih Filename

clip_image014

Langkah 5

Pada Tab Options, ubah dari thumbnail menjadi Custom Colors. Pilih warna Background, misalnya warna Putih, warna Banner Biru Muda, warna text hitam, warna link biru tua, warna active link merah, dan visited link ungu.

clip_image016

Langkah 6

Selanjutnya pada tab Options, ubah Custom Colors menjadi security. Bagian Security adalah bagian untuk mengamankan gambar kita agar dalam gambar gallery kita agar tidak dicuri hak ciptanya oleh orang lain. Bagian security juga bias tidak kita isi Pada Content pilih Custom Text, sedangkan untuk pilihan lainya secara default akan menyesuaikan. Pada Custom Text, isi dengan teks yang akan ditampilkan pada gambar, misalnya CLUB DESAIN PALCOMTECH LAHAT. Tentukkan font yang ingin digunakan, misalnya Arial. Tentukan juga font size yang diinginkan, misalnya 36pt. Pada Color kita dapat menentukkan warna sesuai pilihan, bisa Black, White atau Custom. Untuk itu pilih saja Black dan tentukan Opacitynya. Disarankan untuk menentukan opacity 30%-50% agar teks terlihat transparent. Untuk Position pilih bagian Centered, Pilih None untuk Rotate.

clip_image018

Hasilnya adalah seperti dibawah ini.

clip_image020

Selamat mencoba ^-^

0 thoughts on “Membuat Galeri Foto Web dengan Photoshop

  1. hmmmm…mbak niar samo mbak nisah neh hampir mirip cak nyo, slah koment kami laju..

    mbak niar neh yang buat desain project web club desain lahat kan ???

    mbak udah di kirim lom file psd web club kemaren…???

    ke alamat email kami

    sulerais@yahoo.com

    thanks

    btw this tutorial lebih keren kalau ditambahkan plug in jquery (wuih mode somsek on)

  2. @raise – sudah ku kirim kemaren pak…..desain psd nya kan…….
    cek deh nti kalo nggak ak kirim lagi

    nah pak raise aja yang tambahin tutorial lagi ……. biar ada plugin jquerynya….gimana ๐Ÿ™‚ sekalian sharing pak….tak bagi cendol ntar :cendolb

  3. thanks mbak ya…

    wah laju direquest dah…

    agak panjang seh tutor nya agak ngejelimet bahasa nya hehehehehe

    btw mbak niar aja dulu ya, ntar saya nyusul

Leave a Reply

Your email address will not be published. Required fields are marked *

Copyright © All rights reserved. | Newsphere by AF themes.