• 99k
  • 15
ウェブデザイン \ 2017年2月15日

便利!アンカーを使って特定の位置にリンク設定

スマートフォンの普及に伴い、スクロールダウンするだけで、どんどんコンテンツが表示される縦に長いWebデザインを採用するホームページが増えています。そんなデザインのホームページでも役立つアンカー機能。皆さんは上手に使えていますか?

ホームページを作成する際、訪問者が見つけたい情報をすぐ見つけられるようにする事は必須です。これを使うことで、クリックひとつで訪問者をページの特定箇所へ誘導することができます。訪問者にとっても長いページの一番下まで閲覧したときに、いちいち上までスクロールしなくても良いので、とても便利です。

今回は、アンカー機能について詳しくご説明します。

アンカーとは?

アンカー(Anchor)には、英語で「錨(いかり)」または「固定する」という意味があります。

ホームページ作成の分野では、サイト内の同じページ、または別のページで特定の位置に移動する際に使用される位置マーカーのことを指し、主に以下2つの利用法があります。

1.パーツをアンカーにリンクする
指定したアンカーへ、テキストやボタンをリンクすることができます。パーツをアンカーにリンクすることによって、サイト訪問者がそのパーツをクリックすると、指定したアンカー位置へジャンプします。

例えば、サービス紹介のページで特定のサービスについて詳しく説明したい時や、よくある質問の回答を記載する際など、情報を1カ所にまとめて記載したくない時に使用頂けます。

2.アンカーメニューを利用する
下記のようなアンカーメニューを使うことで、サイト上の異なるセクションをクリック1つでアクセスできるようになります。アンカーメニューはサイト訪問者がページを閲覧する際、常に表示されます。

アンカーメニュー

 

アンカーが役立つ理由

ホームページのヘッダーからフッターに至るまで、アンカーはどこに設置してもOKです。

アンカーはホームページのUX(ユーザー・エクスペリエンス)を向上させるのに効果的です。アンカーがあることで、訪問者は自分に不必要な情報をスキップし、必要な情報のみを閲覧することができるからです。

アンカーの設定方法

最後に、アンカーの設定方法をご紹介します。

  1. エディタ画面左の追加メニュー(+型アイコン)をクリック
  2. その他をクリック
  3. アンカー下のアンカーをクリック
  4. アンカーをドラッグして、希望の位置に配置

アンカーを設定したら、あとはリンク先を追加すれば完了です。
リンク先を追加するには以下の方法をお試しください。

  1. アンカーをクリックし、ページを選択下のドロップダウンメニューよりページを選択
  2. ページの位置(アンカー):下のドロップダウンメニューより、アンカーを選択し、終了後、完了をクリック

これで、アンカーリンクの設定が完了です!
動画も参考にしてください。

早速、あなたのホームページにもアンカーを追加してみましょう!


今すぐ Wixブログ を
無料購読しよう!

Wixブログを購読しよう 役立つ情報をいち早くゲット!

正しいメールアドレスを
入力して下さい

正しいメールアドレスを
入力して下さい Email already exists

正しいメールアドレスを
入力して下さい Invalid email

Wixブログを購読 \ 

WebデザインやWix新機能についての
最新情報を無料でお届けします!

正しいメールアドレスを
入力して下さい

正しいメールアドレスを
入力して下さい Email already exists

正しいメールアドレスを
入力して下さい Invalid email