大きな引用 1 枚証言

このパーツの使いどころと実装ポイント

1 名の声を大きな引用符とともに大胆に見せる証言パートです。白いカードに box-shadow でほどよい浮き上がりを与え、引用文（tql__q）を 24px の太字で中央に配置します。語り手のアバター（頭文字入りの円）と氏名・肩書きを下に添えることで、誰の言葉かを明確に伝える構造です。複数の声を並べる形式と違い、最も強い 1 件に集中させて印象を残せます。

向いている場面

• 導入事例の象徴となる代表的な顧客の声
• サービス紹介ページの信頼を高める区切り
• 採用サイトでの社員インタビュー抜粋

引用符はテキストの全角記号で表現されているので、フォントによって見え方が変わります。デザインを統一したい場合は擬似要素で大きな引用符を重ねる方法もあります。

実装上の注意

実在の声を載せる際は、本人の許諾を得たうえで氏名や肩書きを正確に記載してください。アバターは頭文字のプレースホルダなので、実写真に差し替えると説得力が増します。引用は装飾の見出しではなく本文として、blockquote 要素でマークアップすると意味が正しく伝わります。長い証言は読みやすい行間（line-height:1.7）を保つことも大切です。