abbr要素
abbr要素の役割
abbr要素内に記述したテキストが、何かの略語であることを示します。
なお、abbr要素は、全般的な意味で略語を表しますが、頭文字をつなぎあわせた略語(しかもその言葉が一つの単語として読めるような)は、acronym要素を使います。
また、abbr要素で略語を示したら、略していないときの正式名称をtitle属性に記述しておくと、マウスカーソルがテキストに合わさったときにポップアップで表示されます。
abbr要素を使うことを忘れてしまうことはよくありますが、その部分が略語である場合には、指定しておいた方がSEO上にも効果的であるとされていますので、略語を使った場合には忘れずにabbr要素で囲いましょう。
abbr要素に設定できる属性
属性名 | 意味 |
class | クラス名。CSSを適用するときなどに使用する。 |
dir | 文字表記の方向。左から右(ltr)と、右から左(rtl)を指定する。通常はltrなので、右から左へ表記する言語を使わないのであれば、指定しなくてよい。 |
id | ID名。CSSを適用するときに使用する。 |
lang | 言語コード。日本語、英語といった言語を指定する。html要素に記述してあれば、明示する必要はない。 |
style | スタイルシートを直接記述する。 |
title | 補足情報。テキストにカーソルを合わせるとtitle属性に指定した文字列をポップアップで表示する。 |
abbr要素の使い方
彼は有名な<abbr title="Disc Jockey">DJ</abbr>です。
「DJ」が略語であることを示しています。DJという略語は、そのまま「ディー・ジェイ」と読むしかなく、一つの単語として読めないので、通常の略語扱いになります。title要素には、DJの正式名称がDisc Jockeyであることを示しています。
彼は有名なDJです。
関連リンク
よく読まれている記事
- 右クリックメニューの表示が遅い【Information】
- 画像の一部にリンクを貼る(クリッカブルマップ【Dreamweaver】
- 一定時間でローテーションする広告【JavaScript】
- Dreamweaver【Dreamweaver】
- クリックした画像を拡大・縮小する【JavaScript】
UpDate:2010-2-18
[不定期コラム] ウェブマスターの憂鬱
第1回:ゼロから始める!?ウェブマスター
この話は、いきなり会社のウェブサイトの管理を命じられ、何もわからない状態から手探りでウェブサイト運営を学んでいった過程を記録したものです。
今思えば、このときの経験は、仕事の考え方や進め方に大きな影響を与えるものとなったし、その後、趣味としてウェブサイトをつくるようになったことを思えばやってよかったと思います。
ウェブサイトをつくる楽しみ、情報を発信する意義、客観的な視点で利便性を追求することの大切さ、利用してもらったときの喜び・・・わたしにとって、会社のウェブサイトをつくるという経験は、クリエイティビティを実感することができる、貴重な体験です。
しかし、当時はそんなことは考えもしなかったし、徐々にやわらいでいるとはいえ、現在でもウェブマスターの憂鬱が続いていることを思えば、この経験は、出口の見えない迷宮に迷い込んでいるようでもあり、また、クリエイティビティの追求という麻薬を欲しているようでもあります。
ウェブマスターは華やかだという思い込み
ウェブマスターというと、華やかでおしゃれなイメージを持っているかもしれません。しかし、中小企業におけるウェブマスターとは、そんな格好のいいものではありません。
中小企業の中には、ウェブサイトを外注しないところもあります。外注にするとコストが高すぎるというのが主な理由でしょう。要は、そこまでウェブサイトの必要性はないだろう、と大抵の人は思っているのです。
しかし、そういった企業の場合でも、「今の時代、ウェブサイトがないのはまずいかもしれない・・・」と考えます。しかし外注は高いから考えられない。となると、自社内でわかりそうな人に作成を命じることになります。
不定期コラム「ウェブマスターの憂鬱」は、中小企業に勤める社員が、ある日、ウェブマスターに任命され、試行錯誤を繰り返しながら独学でウェブサイト作りを覚えていく過程を綴ったものです。
しかし、その道は辛く険しく、さまざまな問題が障害となってサイト作りを阻み、進行は困難を極めました。
これから会社のウェブサイト作成を任されることになるかもしれない人には、このコラムを警告として読んでもらいたいと思います。決してわたしと同じ轍を踏まないでください。