Bagaimana cara memilih foto sampul yang baik untuk situs web saya?

22

Sudah trendi untuk memiliki gambar latar belakang besar dengan teks yang relatif sedikit di atasnya untuk tajuk dan intro ke halaman web termasuk awal posting blog. Saya bisa memberikan banyak contoh tentang ini, tetapi saya pikir Anda tahu persis apa yang saya bicarakan.

Apa yang membuat foto sampul / latar belakang yang efektif? Apa yang harus saya ingat ketika mencari gambar atau berencana untuk mengambil dan mengedit beberapa untuk situs saya?

Zach Saucier
sumber
1
Sekarang trendi memiliki latar belakang VIDEO yang besar.
user11153
1
Bagus sekali, salah satu pertanyaan terbaik yang dijawab sendiri di situs (saya tidak bisa mengingat yang lain, jadi mungkin yang terbaik). :)
Dom
Juga lihat posting terkait pada video header
Zach Saucier

Jawaban:

30

Apakah Anda benar-benar perlu mengikuti tren?

Jangan pernah melakukan sesuatu karena itu tren. Lakukan sesuatu karena mereka baik untuk pengalaman pengguna karena itulah yang terbaik untuk perusahaan Anda dan desain Anda. Berpikir sangat keras tentang implikasi bahwa menambahkan gambar besar ke situs Anda akan memiliki dan mempertimbangkan pilihan lain yang Anda miliki. Anda tidak harus menggunakan teknik ini untuk memiliki situs web "modern" .

Dengan itu, ada banyak hal yang perlu diingat ketika memilih gambar latar belakang untuk situs web Anda. Karena jawaban ini sangat panjang, inilah daftar singkatnya; Saya memberikan lebih detail tentang masing-masing termasuk contoh di bawah ini.

  • Pastikan gambar terkait dengan konten
  • Pastikan gambar mengatakan apa yang Anda inginkan
  • Pastikan gambarnya relatif unik
  • Gunakan gambar hal-hal nyata
  • Pastikan gambar berfungsi dengan tata letak Anda
  • Pastikan gambar mengikuti aturan fotografi dan desain yang baik
  • Pastikan gambar mengikuti skema warna Anda
  • Batasi varians di dalam gambar
  • Pastikan ukuran gambarnya cukup besar
  • Pastikan Anda memiliki hak untuk menggunakan gambar
  • Pastikan kualitas fotonya tinggi

Pastikan gambar terkait dengan konten

Foto yang tidak terkait akan melakukan apa pun selain membahayakan. Sama seperti apa pun dalam desain Anda, jika tidak secara langsung sesuai dengan tujuan situs web Anda maka singkirkan. Pastikan itu terkait langsung dengan konten di sekitarnya , bukan sesuatu di kemudian hari. Gambar perlu memiliki konteks tambahan yang dibawa oleh beberapa teks atau tata letak untuk membantu pengguna memahami bahwa itu adalah situs dan bukan hanya gambar statis.

masukkan deskripsi gambar di sini


Pastikan gambar mengatakan apa yang Anda inginkan

Semua gambar memiliki konotasi berdasarkan konten gambar dan cara penataannya. Pastikan gambar sesuai dengan perasaan yang ingin Anda sampaikan serta merek. Gambar harus menyampaikan pemahaman tambahan melewati apa yang disediakan teks di sekitarnya. Juga pastikan itu membantu membangun merek Anda seperti yang Anda inginkan.

masukkan deskripsi gambar di sini

Tak perlu dikatakan bahwa gambar harus menarik secara visual. Rincian lebih lanjut tentang ciri-ciri agar gambar menjadi menarik ada di bawah ini.


Pastikan gambarnya relatif unik

Gambar khusus lebih baik daripada gambar stok, asalkan kualitasnya setidaknya sama. Itu berarti Anda harus menghindari stok gambar yang sangat terkenal selama alternatifnya sama berkualitas tinggi dan tepat. Namun, menjadi benar-benar unik tidak sepenting memiliki gambar yang bagus dan sesuai.

masukkan deskripsi gambar di sini


Gunakan gambar hal-hal nyata

Ada sesuatu tentang gambar nyata (bahkan versi yang sangat diedit) yang memiliki pengaruh besar pada kita sebagai manusia. Kami suka melihat hal-hal nyata. Kapan pun memungkinkan, pilihlah gambar nyata daripada sesuatu yang dihasilkan komputer kecuali itu sepenuhnya tidak sesuai dengan konten atau gaya yang Anda inginkan.

masukkan deskripsi gambar di sini

Memperlihatkan orang memiliki efek yang lebih besar, yang bisa baik dan buruk. Jika dilakukan dengan benar, itu dapat membuat pengguna merasa bahwa pengalaman itu lebih nyata dan pribadi. Jika dilakukan dengan buruk, itu bisa membuatnya tampak im pribadi dan murah. Lebih lanjut tentang itu di sini .

Wajah-wajah khususnya menarik perhatian, jadi pastikan mereka wajah yang tepat dan menempatkan mereka hanya di tempat yang benar-benar penting. Kadang-kadang menempatkan mereka dalam konteks lain seperti buku, dan iPad, komputer, dll. Dapat membantu. Di lain waktu lebih tepat untuk memotong wajah (pikirkan situs web pakaian atau peragawati). Menunjukkan wajah merek / juru bicara sangat efektif jika dilakukan dengan benar, saya sangat merekomendasikannya jika Anda bisa.

masukkan deskripsi gambar di sini


Pastikan gambar berfungsi dengan tata letak Anda

Alur pengguna dan tata letak situs Anda lebih penting daripada gambar apa pun yang Anda pilih. Buat dulu. Jika tata letak dan aliran terbaik itu memiliki sedikit ruang terbuka di bagian atas, maka pertimbangkan untuk menambahkan gambar.

Pastikan tidak ada bagian penting dari gambar yang dicakup oleh konten yang Anda miliki. Gunakan panduan visual untuk membantu mengarahkan pengguna ke konten yang Anda ingin mereka lihat (lebih lanjut tentang ini di bagian selanjutnya).

masukkan deskripsi gambar di sini


Pastikan gambar mengikuti aturan fotografi dan desain yang baik

Gambar harus mengikuti aturan fotografi inti termasuk aturan pertiga , memanfaatkan garis visual, memfokuskan pada konten utama dengan baik, membingkai subjek dengan benar, memiliki latar belakang yang baik, dan memiliki simetri dan pola di antara hal-hal lain. Untuk lebih lanjut tentang itu lihat di sini atau cari lebih banyak sumber daya online.

Prinsip-prinsip ini akan memberikan gambar lebih banyak tujuan dengan membantu menarik perhatian pada bagian-bagian penting dari gambar dan konteks sekitarnya.

aturan gambar yang bagus


Pastikan gambar mengikuti skema warna Anda

Semua situs web harus memiliki nuansa terpadu, termasuk skema warna. Apakah Anda memilih skema warna terlebih dahulu dan kemudian memilih kemudian gambar atau memilih gambar dan kemudian skema warna ( alat seperti ini dapat membantu dengan yang terakhir), pastikan bahwa warna gambar cocok dengan keseluruhan skema warna Anda. Terkadang mencuci gambar dan kemudian menerapkan filter warna dapat bekerja dengan baik.

descr


Batasi varians di dalam gambar

Jangan membuat tampilan visual sibuk. Memiliki banyak warna dan objek dalam gambar membuatnya sulit untuk menempatkan teks di atasnya dan menyesuaikannya dengan tata letak. Seperti yang dikatakan sebelumnya, buat konten terlebih dahulu lalu pilih gambar.

Menambahkan overlay sebagian transparan, menggelapkan gambar, atau mencuci menjadi hitam dan putih sebelum menambahkan filter warna dapat membantu mengurangi noise yang tidak perlu. Juga, warna latar belakang dapat diterapkan di belakang teks atau pada elemen untuk membantu keterbacaan juga.

masukkan deskripsi gambar di sini

Gambar di atas menggelapkan gambar asli dan menggunakan beberapa bayangan di tepinya untuk mengurangi noise. Gambar di bawah ini tampaknya menggunakan overlay gelap sebagian transparan untuk melakukan hal yang sama.

masukkan deskripsi gambar di sini


Pastikan ukuran gambarnya cukup besar

Tak perlu dikatakan bahwa gambar yang digunakan harus cukup besar untuk menutupi setiap layar tanpa peregangan. Itu berarti untuk layar ukuran penuh kita perlu memiliki gambar dengan resolusi minimum 1024 x 768 piksel, tetapi yang terbaik adalah membidik dengan lebar setidaknya 1.200 piksel. Kami juga dapat menyimpan pemuatan gambar besar untuk layar yang lebih kecil dengan menyajikan perbedaan ukuran gambar berdasarkan resolusi, lebih lanjut tentang itu di sini . Namun, cobalah untuk mengoptimalkan waktu pemuatan gambar namun tidak kebobolan kualitas gambar.


Pastikan Anda memiliki hak untuk menggunakan gambar

Jika Anda tidak diizinkan menggunakannya, jangan menggunakannya . Jika Anda tidak tahu apa hak cipta untuk gambar itu , cari, tapi jangan gunakan sampai Anda tahu! Hal terakhir yang ingin Anda lakukan adalah dituntut karena pelanggaran.


Pastikan kualitas fotonya tinggi

Jangan gunakan gambar buram atau buram. Jangan gunakan foto dengan konten yang dipertanyakan atau tidak terkait. Tetap sederhana tetapi (kebanyakan) nyata. Pikirkan baik-baik tentang bagian baik dan buruk dari setiap gambar yang Anda pertimbangkan dan tidak menerima sesuatu yang biasa-biasa saja.

Sumber daya tambahan:

Zach Saucier
sumber
4
Jawaban yang bagus. Saya mungkin akan terlalu ringkas: "Pastikan itu adalah foto yang bagus dan relevan dengan kebutuhan dan tujuan situs Anda" :)
DA01
@ DA01 Sementara saya sepenuhnya setuju dengan pernyataan itu, beberapa orang butuh sedikit bantuan lagi :)
Zach Saucier