ボクアフィ

ボクのアフィリエイト日記

AFFINGER5

AFFINGER5のハンバーガーメニューのテキストは表示させるべき?

投稿日:

この記事は約2分で読めます。

AFFINGER5のハンバーガーメニューは、テキストを表示させた方がクリック率が高まるので、メニューを見てもらいたいなら表示することをおすすめします。

ハンバーガーメニューとは?

ハンバーガーメニューとは、三本の横棒が縦に並んだアイコンのことで、アイコンをクリックすることでメニューが表示されます。

AFFINGER5では、「AFFINGER5管理」でデザインの変更や「テキスト(MENU)」表示の有無を設定できます。メニューの内容は、外観>メニューで設定することができます。

テキストを表示させるべき?

ハンバーガーメニューは、「三本線」と「テキスト(MENU)」をダブル表示をさせると、クリック率が高まります。

Webマーケティングに強くなるメディア「ferret」のABテストの結果によると、「三本線」と「テキスト(MENU)」をダブル表示をさせて、さらに囲いを付けると、クリック率が高くなったようです。

・三本線のデザイン(黒)が入っているものはクリック率が高くメニューとして、一般認知されている。
・スペースが許す場合、ハンバーガーとMENUをダブル表記して囲いを付けましょう。無いなら三本線と囲いで。

出典:https://ferret-plus.com/2672

ユーザービリティを向上させたいサイト運営者は、ハンバーガーメニューにテキストを表示させた方が良いかもしれません。

ただし、すべてのサイトがメニューをクリックしてくれることがゴールではないと思うので、サイトの属性にあわせて適用してください。

テキストが表示できない対処法

ハンバーガーメニューの下にテキストを表示させるには、ver20180831βにアップデートし、「AFFINGER5管理」>「メニュー」>「スマホ用スライドメニュー」で設定ができます。

設定を変更しても表示されないときは、

  • キャッシュのクリア
  • モバイル用ロゴ画像サイズ調整

などを試してください。

「カスタマイズ」>「ロゴ画像」>「モバイル用ロゴ画像」>「モバイル用ロゴ(又はタイトル)を使用する」にチェックを入れていて、「モバイル用ロゴ画像サイズ調整※少し大きく表示されます」にチェックが入っていないと、うまく表示できないようです。

まとめ

AFFINGER5のハンバーガーメニューは、通常は「三本線」だけですが、「テキスト(MENU)」を表示した方が、メニューをクリックして見てくれる可能性が高くなります。

ユーザービリティ向上を目指したいサイト運営者は、実装すると良いかもしれません。

おすすめ記事

EWWW Image Optimizerの設定画面

WordPress

画像を「EWWW Image Optimizer」でWebPに変換する方法

2018/11/26  

WordPressプラグイン「EWWW Image Optimizer」を使い、次世代画像フォーマット「WebP(ウェッピー)」に変換する方法を解説します。

AdSenseの「ページビュー」と「表示回数」の違い

AdSense

AdSenseの「ページビュー」と「表示回数」の違い

2018/06/30  

AdSenseのレポートでよく見る「ページビュー」と「表示回数」の意味の違いを解説します。

プラグイン不要!Googleフォームでお問い合わせフォームを作る方法

Google WordPress プラグイン

プラグイン不要!Googleフォームでお問い合わせフォームを作る方法

2018/06/08  

WordPressで人気のプラグイン「Contact Form7」を利用せずに、Googleが提供する「Googleフォーム」を使ったお問い合わせフォームの作り方をご紹介します。

-AFFINGER5

Copyright© ボクアフィ , 2019 All Rights Reserved.