
できればイメージマップで作業したいのですが
画像をスライスしてリンクを張るほうがいいのでしょうか?
SEOで不利な点などあるのでしょうか?
いちおう自分なりに調べてみたのですが知らない事も
あるのではないかと思うので、両者メリットデメリットなど
よろしければ教えてください。
なぜイメージマップかというと追加変更するかもしれないので
スライスしなおす事や、画像やHTMLの管理のことを考えて
手間を掛けたくないからです。
(素人が変更することも考慮してFlashは使わないのを前提にしています。)
あとイメージマップでhover時に変化をさせたい・・・・
というのは不可能なのでしょうか?
(最悪スクリプトでマップエリアの座標を取得して描画とかも
できそうなのですが・・・)
No.1ベストアンサー
- 回答日時:
HTMLの最も重要な基本は文書構造に従って正しくマークアップするこどてす。
SEOというものが存在するなら、それはまさにこれを意味しています。たとえば、それがナビゲーションリンクでしたら、
<ul class="nav">
<li><a href=""><img alt="トップ"></a></li>
<li><a href=""><img alt="製品"></a></li>
<li><a href=""><img alt="サポート"></a></li>
<li><a href=""><img alt="コンタクト"></a></li>
</ul>
※HTML5なら、<nav>という要素がある。<ul class="nav">を<nav>に変更する。
そのうえで、スライスした画像をスタイルシートで並べればよいでしょう。
イメージマップほ使うときも、画像を見めないプラットフォーム--もちろんサーチエンジンも---のためにきちんとナビゲーションを書いておけばよいです。
したがってきちんとマークアップされていれば、イメージマップだろうが、画像スライスだろうがSEO的には大差ないでしょう。
もちろん、一枚の画像をまったくスライスせずにリンクを並べることもできます。(四角に限られますが)・・そのほうが良いかも・・最も楽ですしね。
【資料】読んでおくべき仕様書の該当部分
14.1 スタイルシートの概説 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )
【引用】____________ここから
ユーザエージェント及び著者は、グラフィックが得られない場合やユーザエージェントがグラフィックにアクセスできない場合のために、グラフィック系イメージマップに関する代替テキスト内容を提供する必要がある。 例えば、ユーザエージェントは、altテキストを用いてグラフィック系イメージマップの位置にテキストリンクを生成してよい。 こうしたリンクは、キーボード入力や音声入力など、様々な方法でアクティブにできる。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Objects, Images, and Applets in HTML documents( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より
回答ありがとうございます
最後に行き着いたのが四角に限られるリンク・・・だったのですが
日本地図の各県を・・・ということなのでマップかスライスにしようと
しています。
サイトの紹介ありがとうございます。
時間をつくってじっくり読んでみます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Google Maps Googleマップに投稿された画像を自身のホームページやブログ等で使用してよいでしょうか? 1 2023/02/14 00:28
- 英語 切り分けて形ある物となった食べ物の可算、不可算の扱いについて 6 2022/11/03 16:10
- その他(コンピューター・テクノロジー) デジタル化推進でうちの会社では、ペーパーレス化が進んでいます。 そこで、質問です。 会社では、検査課 3 2023/06/11 00:17
- 生物学 脳の記録部位の集計方法について 1 2022/06/11 21:26
- 地図・道路 皆さん、知っていますか? みんな大好き、Googleマップのストリートビューは、中国では利用できない 1 2022/03/29 03:07
- Google Maps iPhoneです。Googleマップで検索しようと場所を入力しようとタップすると画像のようなメニュー 3 2023/06/06 21:35
- その他(プログラミング・Web制作) 監視カメラを水平につないでパノラマの映像を作りたい 1 2022/09/06 15:26
- HTML・CSS リンクバナーのHTMLタグ。画像を変えたり、設置位置を変えるとバナー貼付け側はどう見える? 2 2023/02/01 12:01
- Illustrator(イラストレーター) ワードに貼った画像のキャンバスと画像本体のサイズの調整 2 2022/05/19 18:31
- 魚類 アクアリウムについて質問です。 現在、排水パイプと吸水パイプの位置で悩んでいます。 画像は45cm規 3 2023/08/21 18:28
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
リストの入れ子について
-
タブメニューでカレントタブを...
-
ホームページビルダーで同じ行...
-
HTML,CSSのみでDIVブロック
-
cssでロールオーバーを作る...
-
CSS初心者です。至急お願いしま...
-
css 横並びのナビゲーションバ...
-
html css jsなどを用いてリンク...
-
イメージマップと画像のスライ...
-
HTMLを教えてください。選...
-
複数の文字を一度に置換ってで...
-
CSSのセンタリングが、「div」...
-
Atomというエディタでのショー...
-
cssのaリンクで、幅(width=)が...
-
スマートフォンサイト デザイン
-
項目間の点線引き html/javascript
-
プレビュー画面でリストマーク...
-
ホームページのテーブルの位置...
-
<li>で改行する横並びのメニュー
-
cssのリストで、番号1と2の間の...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
html/cssの、navを2段にする...
-
リストマーカーをボックス内に...
-
liタグの中に<p>タグやら<dl>を...
-
ulタグやliタグの中でbrタグ...
-
複数行にまたがる括弧を表示し...
-
html <ul></ul>の並びで一行空...
-
ulとliで囲った文字の一部を変...
-
HTMLで組織図を作成する方法
-
list-style-type部分だけ大きく...
-
htmlの<ol>タグで、数字などを...
-
テーブル内のプルダウンの下に...
-
html <li>の中の文字一部に色を...
-
<ul><li></li></ul>にするメリ...
-
番号付きリスト(<Ol><Li>・・...
-
divタグ内のコンテンツが重なっ...
-
リストの数字のフォントサイズ...
-
レスポンシブWebデザインでリン...
-
背景色を行ごとに変えるには?
-
Dreamweaverで、ul要素の下に写...
-
ページを開いているときのリン...
おすすめ情報