採用率との関係性

アコーディオン要素とは、クリックすると開閉するコンテンツを指します。
あえてネガティブな表現をしますと、クリックしないと気づかないコンテンツです。

例えば テストページ を例にご説明しますと、
ページ下部の「資料請求」ボタンのデザインを変更したつもりでも、実はアコーディオン要素「口コミ」の中にも「資料請求」ボタンが存在しており、それに気づかずデザイン投稿に至ってしまうケースも少なくありません。

それではせっかく素敵なデザインをご投稿いただいても、修正と再チェックが嵩み、ラウンド利用までの時間が伸びてしまいます。

ラウンド利用までの時間を短縮することで得た信頼は、採用率を上げるきっかけになりますので、今回も皆さまのお力になれますよう、アコーディオン要素のチェック方法についてご紹介して参ります。

チェックポイント

• ページ内のアコーディオン要素を全てクリックする
• アコーディオン要素内にデザイン変更箇所が含まれていないか確認する

チェック方法

テストオファー：練習用オファー④
テストページ：物件詳細
デザイン変更：資料請求ボタンのデザイン変更

1. デザイン投稿前にエディター画面右下の「プレビュー」ボタンをクリック
   
2. アコーディオン要素をクリック
   
3. 意図したデザインになっていればプレビューを閉じ、デザインを投稿
4. 意図したデザインになっていなければ、Chrome デベロッパーツールで該当箇所のHTML要素を確認
   1. デザインがあたっている箇所のHTML要素を確認
      
   2. デザインがあたっていない箇所のHTML要素を確認
      
5. エディターに戻り、意図したデザインになるようソースコードを修正
   再度「プレビュー」ボタンをクリックしデザインを確認
   
6. 意図したデザインになっていればプレビューを閉じ、デザインを投稿

採用率を上げる・修正を減らすTips

• 第1弾「投稿前の検証URLチェックが、採用率を上げる!?」
• 第2弾「オリエンシートのレスポンシブ表記に迫る」
• 第3弾「気づくと築く、投稿前のプレビュー表示」
• 第4弾「ブラウザ幅のブレイクポイントとは!?」
• 第5弾「アコーディオン要素に潜む落とし穴」
• 第6弾「JSで差をつける入力フォーム改善」