画像に文字を重ねる

WEB知識

画像に文字を入れたり、画像を重ねる方法

ホームページやブログなど、やっている方が非常に多くなってきていますが、少しでも見た目を良くしたいですよね?今は画像加工ソフトなども多いので手軽に加工が出来ると思います。前の記事でも書きましたが、『Pixlr EditorやGIMP』などの無料ツールも十分加工で使えると思います。

今回は画像に文字や写真を重ねる際の構造について少しお話ししたいと思います。

まずは、画像の構造を理解しよう。

上記の画像の場合は、女性の画像の上に白い四角を重ねてその上に文字を入れていくので3層の構造になっています。これを理解すれば複雑な画像も通れるようになります。

業界では、『レイヤー(レイヤ)』と言っています。レイヤーとは、層や階層の意味で例えるならガラスと思って頂きたいです。

上記の画像では先ほどお話しした様に、女性の上に白い四角を重ね、さらにその上に文字を重ねるといった形です。

画像を重ねる 構造レイヤーを重ねる 画像

ここのレイヤーを移動することで画像の重ねる上下を逆転する事もできます。画像が複雑になればグループ化もできたりしますのでまとめて移動させる事も可能です。

その他覚えて置いて欲しい便利ワザ

グループ化

複雑な画像等を作る際には、グループ化をしておくと移動や編集の際がわかりやすくなるので便利です。

透明化

上位でも四角を重ねただけでは単色の白になってしまいます。透明化させることでより、オシャレに見えます。

グラーデーション

1枚の画像で色を段々と薄くすることで高級感やオシャレ度が増します。

まとめ

ツールごとでの違いはありますが、ほとんど内容は似ています。分からないではなく色々なことをやることでスキル等も上がります。参考にするバナーを見つけ、より似せるにはどの様な効果をつければ似せることができるのか考えながら試行錯誤してみましょう。

 

Affinity Photo 画像を丸く切り取るAffinity Photoで画像を丸く切り取る方法前のページ

Affinity Photoで画像にグラデーションをかける次のページ画像 ぼかす

ピックアップ記事

  1. 4年振りに…。やらかしました。
  2. 自分のホームページの歴史(ドメイン年齢)を知ってますか?
  3. マーケティングに大切なもの、第二章
  4. 開業前から、インスタグラムを有効に使う方法
  5. Affinity Photo(アフィニティフォト)で文字にグラデーション入れる方…

関連記事

  1. 口コミ 集客

    WEB知識

    口コミ連動型のホームページ作成

    今回は、口コミ連動型のホームページの作成をさせて頂きましたのでその事に…

  2. 最終目標 ゴール

    WEB知識

    何事も、始める前が大切だなぁ〜。最終目標の設定!

    今日は、セミナーに参加してきました。今回参加したのは、WEBのキャ…

  3. 404 エラー

    WEB知識

    サイトをリニュアールしたら、Googleからエラーメールが来た

    皆さま、ドメインをそのままホームページをリニューアル出来るのは知ってい…

  4. ピンタレスト

    WEB知識

    まだブックマーク?Pinterest を活用しよう

    まだブラウザでサンプルサイト等をブックマークしていますか?僕もそうでし…

  5. OGP サムネイル

    WEB知識

    フェイスブックでブログのサムネイル(OGP)画像の確認方法

    先日、知り合いのオーナーさんが気にされていたので、記事にしたいと思いま…

  6. WEB知識

    Photoshopを使わずに画像加工をする無料ソフト

    サイト作成・バナーの作成などをする際はAdobe Photoshop …

  1. マーケティング

    「集める」ではなく「集まる」集客方法に
  2. 大阪ビューティガレージ セミナー

    マーケティング

    大阪で2つのセミナーを開催します。
  3. 404 エラー

    WEB知識

    サイトをリニュアールしたら、Googleからエラーメールが来た
  4. 最終目標 ゴール

    WEB知識

    何事も、始める前が大切だなぁ〜。最終目標の設定!
  5. 看板メニュー

    マーケティング

    看板のメニューを考えて来店動機を掴もう
PAGE TOP