ホームページ作成/HTML・スタイルシート(CSS)の基礎

ショートカットキーでリンクやボタンを操作可能にする

多くのソフトウェアには便利なショートカットキーが用意されています。慣れると非常に重宝するショートカットキーをホームページ内部にも設けてみましょう。ページ内の各オブジェクトをキーで選択する方法をご紹介。

西村 文宏

執筆者:西村 文宏

ホームページ作成ガイド

便利なショートカットキー

WindowsやMacなどのOSや、その他のソフトウェアにはたいてい「ショートカットキー」が用意されています。 用途は、マウスを使わなくてもキーだけで操作ができるようにすることだったり、アクセスしにくい場所に用意された機能を簡単に呼び出すためだったりします。

例えばテキスト編集時では、[Ctrl]+[X]で切り取り、[Ctrl]+[V]で「貼り付け」などがありますね。慣れてくると、マウスを使うよりもショートカットキーを利用する方が圧倒的に早く作業ができるようになり、とても便利です。

ウェブページでもショートカットキーを用意できる

ウェブページ上の様々なリンクや入力フォームなどは、キー1つで移動できるようにはなっていないことがほとんどです。しかし、ウェブページ上のアイテムにも、ショートカットキーを割り振ることができます。

というわけで今回は、ウェブページ上に存在する各機能に対して、任意のショートカットキーを割り当て、キーボードだけで操作できるようにする方法をご紹介いたします。

どんなメリットが?

もしあなたのウェブサイトが、頻繁に利用されるような機能をたくさん提供している場合、アクセス者は毎回マウスでスクロールしたりリンクをクリックしたりするのを面倒に感じているかも知れません。そんなとき、ショートカットキーがあれば、キーを押すだけで利用できるので便利になります。

たくさんの機能を提供しているわけではない場合でも、 マウスの使えない環境や、マウスが使いにくい状態、マウスが壊れてしまった端末などからの アクセスが容易になるということで、アクセシビリティ上望ましいとも言えます。

実現はとても簡単です。
スクリプトは使用しません。最大で、わずか14文字を書き加えるだけです。

それでは、早速、ショートカットキーを割り当ててみましょう。

それでは、次のページへ! →


  • 1
  • 2
  • 3
  • 次のページへ

あわせて読みたい

あなたにオススメ

    表示について

    カテゴリー一覧

    All Aboutサービス・メディア

    All About公式SNS
    日々の生活や仕事を楽しむための情報を毎日お届けします。
    公式SNS一覧
    © All About, Inc. All rights reserved. 掲載の記事・写真・イラストなど、すべてのコンテンツの無断複写・転載・公衆送信等を禁じます