cssで作るドロップダウンメニュー
コーポレートサイトなど情報量が多いサイトでは、リンク先のページに飛んでからさらにそのページの中から目当てのコンテンツを探さなければならない、といった手間がかかります。
メガドロップダウンメニューであれば、リンク先のページの中の目当てのコンテンツにダイレクトに飛べるので、ユーザーの手間が省けるわけです。ユーザビリティの向上のためにも情報量の多いサイトであれば積極的に使っていきましょう。
メガドロップダウンメニューを採用しているサイト例
www.tiffany.co.jp
<nav class="g-nav"> <ul> <li><a href="#">トップ</a></li> <li class="drop">メニュー <ul class="menu-child"> <li><a href="menu/index.html#lunch">ランチ</a></li> <li><a href="menu/index.html#dinner">ディナー</a></li> <li><a href="menu/index.html#course">コース</a></li> </ul> </li> <li><a href="#">アクセス</a></li> </ul> </nav> </body> </html>
