webページのイラスト選びに頭を抱えていませんか？webサイトのイラストを選ぶ際、どんな素材でも使用しても問題ないと勘違いしている人が意外と多いです。実は、著作権などを含めイラスト選びの際に気をつけたいポイントがいくつかあります。そこで今回は、選び方のポイントや注意点、フリー素材サイトなども紹介していきます。ぜひ参考の一つにしてみてください。
webページにイラストを使用する重要性
webページにイラストを使用する場合には、イラストで表現したい目的や役割を認識しておくといいでしょう。web1ぺージにおいてイラストがもつ役割には「解説」や「演出」が挙げられます。この二つについて解説していきます。
①解説
webページを開いた時に、文字ばかり並んでいるHPをみて難しそうと犬猿したことはありませんか？文字情報だけではなかなか頭に入ってこなかったり、読みにくいイメージをもったことがある方も多いでしょう。そこで、webページにイラストを使用することで内容を視覚的に補助し見やすくする「解説」の役割を担っています。
例えば、食べ歩きの詳細情報で、地図が表示されているのとないのとでは、情報の入り方が全く違います。文字だけでも情報を得ることができますが、参考になると感じてもらうにはイラストを使用するのが効果的といえます。ファビコンと呼ばれる、webサイトのシンボルやイメージとして用いられるアイコンをユーザーが分かりやすいように取り入れている企業も多いです。
②演出
もう一つの役割である「演出」には、文章だけでは伝わりづらいイメージや世界観を引き立てる役割があります。企業がアピールしたい内容やイベントの告知などで、イラストがあることでより正しい情報を届けられることが期待できます。また、イラストを使用することでデザインのアクセントとして華やかさを演出したり、背景ページでより世界観に引き込むこともできるでしょう。
例えば、イベント告知のwebページの場合、当日開催される会場を写真で分かりやすく伝えながら、ページ全体を通してイラストを使用し、イベントが待ち遠しいと感じる演出をしているケースが多いです。
webページにイラストを使用するときは著作権に注意
webページのイラストを使用する重要性が分かったところで、イラスト選びの話に進みましょう。世の中には撮影した写真のようなイラストや手書きで描かれたイラストまで多く存在します。インターネット上で検索を行えば、すぐにイメージにあったイラストを見つけ出すことができるでしょう。ただし、webページにイラストを使用するときは著作権に注意しながらイラストを選ぶようにしてください。
フリーイラスト素材を提供しているサイトが多くあるので、利用することをおすすめします。注意点としては、フリーイラスト素材と案内しつつも一部有料という形で、イラストを提供している素材サイトがあります。フリーイラスト素材を使用する場合には、必ずサイトの利用規約を正しく理解し、有料か無料か確認して納得した上で使用するようにしましょう。
webページのイラストに使えるおすすめのフリー素材サイト
ここではwebページのイラストに使えるおすすめのフリー素材サイトについて紹介します。どんなサイトを使うか迷っている方は、ぜひ参考にしてみてください。
ISOMETRIC（アイソメトリック）
ISOMETRIC（アイソメトリック）イラストは、海外のサイトで斜め上から建物や人物などを見下ろしたようなイラストをを扱っています。立体感のあるイラストを求めている方や、世界観を大事にしている方にはおすすめできるサイトです。
ISOMETRIC：https://isometric.online/
Adobe Stock
Adobe Stockは有料イラストを提供しているサービスのイメージが強いですが、無料で使えるイラスト素材も多数揃っています。イラストを検索する際に無料素材に絞り込むことで、無料で使えるイラスト素材を確認することができます。
ただし、ダウンロードしたい素材があった場合にはAdobeのアカウントに登録する必要があります。海外のイラスト素材なども豊富に取り揃えているので、webページのイメージに合う場合には検討してみてください。
Adobe Stock：https://stock.adobe.com/jp/
ソコスト
webページに統一感を求めている場合には、シンプルなイラストを多く取り揃えている素材サイトのソコストがおすすめです。使いやすくクオリティも高いため、どんな素材を使おうか迷っている初心者には、向いているサイトといえます。
ソコスト：https://soco-st.com/
webページに使用するイラストの選び方のポイント
ここでは実際にwebページに使用するイラストの選び方について、ポイントをまとめました。ぜひ参考の一つにしてみてください。
イラストの画質とファイルサイズ
フリーイラストの素材を提供しているサイトでは素材のダウンロード形式を選べるサイトもあります。webページで使用することをイメージして、最適な画質やファイルサイズを選ぶことをおすすめします。特にビジネスシーンでは、webページの重たさなどを気にするケースが少なくありません。負担をかけないファイルサイズを選ぶといいでしょう。
ターゲットに合ったコンテンツ
どれだけクオリティーの高いイラストを選べても、ホームページに使用するイラストで与えたい印象や方向性が定まっていないと、統一感のないごちゃごちゃとしたサイトになりかねません。イラスト以外にもデザインの要素は盛り込めるため、あくまでも設定しているターゲットに合わせたイラストを選ぶようにしましょう。
雰囲気を固める
イラストによっては、鮮やかで印象に残るものやふわっとした優しい印象を与えるものなど様々です。彩度の低いイラストの場合には固い印象を与えるモード、パステルカラーや水彩グラデーションイラストの場合は、ふんわりとしたやわらかい雰囲気に仕上がります。
先でも紹介したように、ターゲットに合った統一感あるイラストを選んでいくと、ユーザーの心を掴みやすくなります。
具体例
例えば、大学の受験生向けや企業の採用サイトの場合には、ターゲットがZ世代となります。そのため、若者向けのトレンドを掴んでいるイラストを選ぶと、目を止めてくれることが期待できます。競合も多いため、差別化をはかり個性をと大学の雰囲気を伝えようとしているサイトが多い印象です。
次に、イベントサイトですが、イベントが開催されるまでの短期的に多く閲覧されるのが特徴的です。大学生や社会人をターゲットに設定していることが多いため、コンセプトが伝わるようなイラストを抜粋しましょう。若者に受ける作風や最近のトレンドを掴んでいるイラストを判断できる能力が求められます。
まとめ
いかがでしたでしょうか。今回は選び方のポイントや注意点、フリー素材サイトなども紹介してきました。webぺージにおいてイラストがもつ役割には「解説」や「演出」が挙げられます。内容を視覚的に補助し見やすくしたり、デザインのアクセントとして華やかさを演出したり、背景ページでより世界観に引き込むこともできるでしょう。積極的にイラストは使用していきたいところですが、webページにイラストを使用するときは著作権に注意することを忘れないようにしましょう。今回は実際に使えるおすすめのフリー素材サイトやイラストの選び方のポイントについても紹介しているので、参考にしつつ自身のサイトがより評価されるサイト作りに役立ててください。
