ウェブサイト写真のクイックガイド

公開: 2020-04-24

すばらしい写真を含めると、プレーンなWebページを視覚的に魅力的なWebページに変えることができます。 しかし、古い写真だけで十分というわけではありません。 適切な画像を決定することは、慎重に検討する必要があります。

ただし、設計者が必ずしもその決定を下せるとは限らない場合もあります。 たとえば、クライアントからそれほど素晴らしい画像が渡されたことはありませんか? それが彼らのウェブサイトの全体的な美学を奪うとしても、彼らはそれを使うことを主張するかもしれません。

それでも、その日を救うチャンスはまだあります。 それはすべて、写真がWebデザインで果たすことができる役割をよりよく理解することです。 クライアントと私たちの両方を教育することができれば、クライアントが10年前の携帯電話で撮影した粒子の粗いオフキルター画像を回避できます。 その代わりに、全体的な体験に追加する魅力的で関連性のある写真があります。

それを念頭に置いて、ここにあなたのウェブサイトに最適な写真を選択するためのいくつかの役立つヒントがあります。

主題を検討する

何よりもまず、写真はコンテンツの主題を反映している必要があります–少なくともある程度は。 これは正確な科学ではなく、多くの場合、解釈の余地があります。

もちろん、最も簡単な方法は、専門家を雇ってスポットオン画像を撮影することです。 しかし、それは多くの企業の予算を超えています。 それは私たちにストックフォトの必然的な使用につながります。

ストックフォトを使用する場合は、被写体に関して常に頭に釘を打つとは限りません。 ただし、基本的な考え方を理解することを目指すことはできます(少し一般的であっても)。

例として、ピアノ調律師を雇う理由についてのブログ投稿を書いたとしましょう。 たぶん、あなたは実際の仕事をしている誰かの素晴らしい画像にアクセスできないでしょう。 しかし、ピアノの写真を見つけることができる可能性があります。 さらに良いことに、その内部部品に焦点を当てたもの。

目標は、ユーザーが特定の主題に焦点を合わせ続けるのに役立つ画像を見つけることです。 完璧である必要はありませんが、コンテンツのメインテーマから離れすぎないようにしてください。

タブレットデバイスでウェブサイトを表示している男性。

色と後処理について考える

Adobe PhotoshopやCSSなどのツールの素晴らしさのおかげで、画像内で最初に見つけた色は必ずしもそのようにとどまる必要はありません。 色相、彩度を変更したり、白黒に変換したりすることもできます。

それでも、どの色がプロジェクトに最も適しているかを考えることは価値があります。 サイトの全体的なデザインなどのアイテムは、作成しようとしているムードと同様に、大きな要因になる可能性があります。

ウェブサイトの背景が暗く、大胆な発言をしたい場合は、明るい色の写真が医師の指示どおりである可能性があります。 しかし、もっと真面目で控えめなものを探しているなら、白黒は完璧かもしれません。

使用する予定の後処理効果も考慮する必要があります。 見つけたすべての画像が、使用している特定のフィルターに適しているとは限りません。

たとえば、サイトの各ページの一連のヘッダー画像にカラーオーバーレイを適用する場合は、効果を適用したときに、選択した写真が一貫して見えるようにする必要があります。 特定の画像が不自然に見える場合は、このシナリオに最適ではない可能性があります。

印刷された写真をコンピューター画面上の写真と比較する男性。

サイズと向きの問題

自分で写真を撮る場合でも、ストックサービスからダウンロードする場合でも、選択した画像は、ウェブサイトに追加される前に小さいサイズにトリミングされる可能性があります。 ブロードバンド接続と4kモニターを使用しても、巨大な画像(ダウンロードサイズが同じくらい大きい)はあまりユーザーフレンドリーではありません。

したがって、サイトで特定の画像をどのように使用するかを検討することが重要です。 トリミングはそれにどのような影響を及ぼしますか? ここで、画像のピクセルサイズとその向きが関係します。

たとえば、ヒーローエリア内の背景画像を考えてみましょう。 この場合、多くの場合、幅の広い風景指向の写真を使用するのが最適です。 背の高い、縦向きの写真を短くて幅の広い写真に変えようとすると、通常、あまりにも多くの詳細が省略されます。

同時に、ピクセルサイズも重要です。 理想的には、画像をトリミングする余地があるように、必要以上に大きい画像を選択するのが最善です。 小さな画像を爆破すると、通常、表示品質が非常に悪くなります。 したがって、希望のサイズに縮小できるものを探してください。

そして、モバイルを忘れないでください! 画像の使用方法によっては、小さな画面でピクセル単位で完璧に見えるようにスタイルを調整する必要がある場合があります。 大画面では画像が見栄えがする可能性もありますが、小画面では実際にはうまく機能しません。 これは、レスポンシブテンプレートで機能する別の画像を見つける必要があることを意味する場合があります。

Photoshopでトリミングされている画像。

クライアントのひどい写真について

以前、クライアントが特定の写真(別名「間違った」写真)の使用を主張する状況をほのめかしました。 このような場合、それを悪い考えとして単純に却下するのは簡単です–そして多分そうです。 しかし、彼らの感情と思考過程の両方を認識することも賢明です。

これをよりよく理解するために、少し調査する必要があるかもしれません。 まず、画像に関する懸念事項を正直かつ丁寧に述べます。 たぶん、サイジングが機能しないか、品質が十分ではありません。 とにかく、あなたの考えをオープンに出すのが最善です。

あなたがそれをさらに議論するとき、彼らが好きな写真についてそれが何であるかを正確に見つけるようにしてください。 あなたはそれが彼らが持っている唯一のものであるか、それが何らかの感傷的な価値を持っているので、彼らがそれを使用していることに気付くかもしれません。 彼らがあなたの傑作を「台無しに」しようとしている可能性は低いです(ただし、それが理由であると彼らが主張する場合は、できるだけ早くそこから出てください)。

そこから、いくつかのオプションを表示できます。 効果を追加したり、コラージュの一部にしたりすることは、より良いフィット感を生み出すのに役立つ可能性があります。 または、画像を簡単に再作成できる場合は、再撮影を提案することもできます。

多くの場合、画像に関してはクライアントが柔軟であることがわかります。 そして、あなたが彼らの最善の利益のために働いていることを彼らが見ると、彼らは途中であなたに会う可能性が高くなります。 したがって、最初の要求を最終決定として受け取らないでください。妥協の余地がある可能性があります。

手を振る女性。

より良い写真=より良いウェブサイト

膨大な量の写真をすぐに利用できるため、画像をすばやく取得して使用するのは簡単です。 しかし、それはその仕事に適したものですか?

実際には、適切な写真を見つけるのにもう少し手間がかかる場合があります。 サイトの主題、適切な色の選択、および必要なサイズを検討してください。 それはあなたの検索を絞り込むのに役立ちます。 そこから、さまざまなオプションを試し、最適なものを決定することがすべてです。

そして、クライアントが独自のアイデアを持っている場合は、コミュニケーションの線を開き、状況を最大限に活用する方法を検討してください。

写真はあなたのウェブサイトを本当に際立たせることができる要素です。 したがって、時間をかけて賢明に選択してください!