キャプション付きブロックは、ウェブサイトやブログのコンテンツを際立たせる魔法の宝石です。
- 読者の興味を惹きつけ、情報提供を強化
- ビジュアル面での魅力を飛躍的に向上
適切な配置とデザインで、ユーザーエンゲージメントを高め、サイトの魅力をアップさせます。
本記事では、実践的なアプローチと共に、
- キャプション付きブロックの効果的な使い方
- サイトデザインへの取り入れ方
を解説します。
シンプルなツールが、あなたのウェブサイトを新たな次元へと導く鍵となるでしょう。
キャプション付きブロックとは
キャプション付きブロックは、画像や動画などのメディアコンテンツに説明文や注釈を追加する機能です。例えば、プロジェクトの紹介や製品の特徴説明など、様々なシーンで活躍します。
文章だけでなく、画像なども配置できる。
リストも挿入できる。
- リスト１
- リスト２
キャプション付きブロックの設定手順
挿入
初期値は「デフォル」です、好みに応じて変更。
スタイルは赤枠に示す７種類の中より選択。
標準は３色ですが、黒矢印の「SWELL設定」をクリックするとカラーパレット設定が表示され
色のカスタマイズができます。
キャブション付きブロックのタイトルの左に「SWELロゴのアイコン」を設定。
①アイコン位置→②アイコン選択→③アイコンサイズを決定（STEP6に進む)。
②のアイコン選択からSWELLロゴを決定。
キャプション付きブロックのカスタマイズ
キャプション付きブロックの設定を通じて、さらにサイトの印象を向上させることができます。ここでは、幅広いカスタマイズ方法をマインドマップにまとめました。
この中で赤枠の項目は以下に詳細解説しているのでご覧ください。
カラーのカスタマイズ
異なるカラーを試すことで、サイトの雰囲気をガラリと変えることが可能です。カラーの選択は、ブランドのイメージを強化するためにも重要なポイントです。
キャプション付きブロックのサイドバーに、以下のようなカラーパネルが設置されています。
これらを選択することで、以下のような色のついたキャプション付きブロックが利用できます。
「デフォルト」スタイルでの利用
「枠内」スタイルでの利用
「小」スタイルでの利用
アイコンの挿入
キャプション付きブロックでは、アイコンを挿入することで、視覚的に情報を伝え、訴求力を高めることができます。
タイトルの左に電話のアイコンを選択。
デザインバターンのカスタマイズ
現在は7種類のデザインパターンがあります。
使用例
キャプション付きブロックは、画像や図表に短い説明文をつけることで、コンテンツの理解を深める効果がある。ブログ記事、商品紹介ページ、サービス紹介ページ、ポートフォリオサイトなど、様々な場面で有効に活用されている。
ブログ記事での活用法
1. ブログ記事でキャプション付きブロックを活用すれば、文章だけで
は伝わりにくい情報を補い、読者の意思を促進できます。
2. 旅行ブログでは、写真に地名やエピソードを続けることで記事が
充実し、読者の興味を引きやすくなります。
3. キャプションは画像説明だけでなく、感想や背景情報も書き込む
ことで、記事に静かを考慮した効果も期待できます。
商品の紹介ページ
1. 詳細な画像とキャプションで商品の特徴・注目を訴えます。
2. 使用方法、対象ユーザー、特徴をわかりやすく示唆し、商品情報
をすぐに把握できます。
3. 視覚的な情報で購入を高め、購入決定を進めます。
サービス紹介ページ
1. 画像・図表とキャプションでサービスの流れをわかりやすく説明します。
2. 利用シーンや成功事例を具体的に紹介し、利用イメージを喚起します。
3. 顧客の声で共感を見つめ、サービスへの洞察を高めます。
ポートフォリオサイト
1. 作品に込められた想い、制作過程、技術をキャプションで紹介
2. 閲覧者へ詳細な情報が提供され、作品への理解と関心が高まります。
まとめ
キャプション付きブロックは、Webページやプレゼンテーション資料の情報伝達能力を飛躍的に向上させるツールです。テキストだけでは伝わりにくい情報を、ビジュアル要素とキャプションの組み合わせによって明瞭かつ効果的に伝えることができます。
この記事では、キャプション付きブロックの基本的な構成方法から、読者や視聴者の注目を引く応用技術まで、幅広い利用法を解説しました。かつ分かりやすいものに変わります。
最後までお読みいただきありがとうございます。
さて、ご案内ですがSWELL専用エディターブロック全てをまとめた記事があります。
よかったらご覧ください。
もう一つは、タイトル名が「SWELLトップページをサイト型にカスタマイズ？劇的ビフォーアフター」の記事を最近作成しましたので興味があったら一読ください。
