リンクやボタンの配置について

このQ&Aのポイント
  • リンクやボタン同士が十分に離れている状態にしてください。
  • 「十分に離れている状態」とは、リンクやボタン同士が適切な間隔を持つことを指します。
  • ボタンとは、HTMLの<button>タグを使用して作成されたクリック可能な要素を指します。
回答を見る
  • ベストアンサー

リンクやボタン同士が十分に離れている状態にしてくだ

ウェブマスター ツール で、エラーページがあるようで 「モバイル ユーザビリティ > タップ要素同士が近すぎます」 「リンクやボタン同士が十分に離れている状態にしてください。」 と書いてあります。 「十分に離れている状態」というのは、どういう状態を言うのでしょうか? リンクが近すぎるとも思ってないです。 あと、ボタンというのは、タグでいうと何を指してるのでしょうか? <button type=""button"" onclick=""window.open('http://www.google.co.jp);"">検索</button> みたいなのは、ソース内にあるのですが、これのことを言ってるのでしょうか?

  • HTML
  • 回答数2
  • ありがとう数2

質問者が選んだベストアンサー

  • ベストアンサー
  • tkmojo
  • ベストアンサー率50% (105/207)
回答No.2

リンクやボタンというのは<a>や<input>、<button>タグ全般の事だと思います。 「押せるもの同士が近かったら押し間違えちゃうでしょ?」という意味のエラーですね。 スマホ対応していないサイトは、ほぼこのエラーが出ます。 スマホでPCサイトを全画面で表示してみると、十分離れているリンクも当然近くなるので。 経験上、レスポンシブデザインで作ったサイトの場合はリンク同士が密着していてもこのエラーは出なかったので、とにかくスマホ対応をすればエラーは出なくなるような気がしますが。 スマホ対応しているサイトでこのエラーが出るのは私が作ったものの中では経験が無いので、逆にどういうサイトか知りたいですね。

fklqhogr
質問者

お礼

ありがとうございました。

その他の回答 (1)

回答No.1

スマホで見た時に文字が小さくなっていると、 必然的にテキストリンク同志も近くなります。 あとは1ページの割合の問題です。 リンク同志が近いものがあっても、 1ページの全体からみて割合が少なければ そのエラーは出なくなります。 検証した者より。

fklqhogr
質問者

お礼

ありがとうございました。

関連するQ&A

  • ボタンリンクをしたいのですが・・・

    ボタンの形でリンクをしたいのですが、うまくできません。 <a>タグのテキストリンクならページが移動するのですが、 <a href="URL"><button>文字</button></a> は、ボタンがペコペコするだけで、 <form><input type="botton" value="文字" onclick="parent.main.location.href='URL'" title="文字"></form> は、ステータスバーにエラーが出ただけです。 何がいけないのか分からないし、他にどうすればいいのかもさっぱり分かりません。 IE6.0を使っていますが、IE依存タグは避けたいです。 ボタンリンクのやり方についてアドバイスをいただけないでしょうか。

  • ボタンで、リンクを、別ウィンドウで開く

    質問させていただきます。 ボタンで、リンクを、別ウィンドウで開くには どういうソースを書いたら良いのでしょうか? <FORM> <INPUT TYPE="button" VALUE="リンク" onClick="window.location.href='index.html'"> </FORM> だと、同一ウィンドウ内に開いてしまいますし・・・。 どうか教えてください。よろしくお願いいたします!

  • html で ボタンをつくる

    楽天RMSで、ページにリンクできるテキストボタンを作りたいのですが onClick が禁止タグになっているので使えませんでした。 <html>だけでリンクボタンを作成したいのですが、 <button><a href="リンク場所">テキスト</a></button>で できるかとおもったら、表示はボタンになっているにもかかわらず、リンクできませんでした。 楽天RMSでリンクボタンを作成するにはどのように記述すればいいかわかりません。 どなたか教えていただけないでしょうか。

  • ハイパーリンクをインプットボタンで作るには

    HTML初心者です。 <a href="input.php?action=rewrite">修正する</a> 上記のハイパーリンクをインプットボタンでリンクさせたいのですが <input type="button" class="button" value="修正する" onClick='window.open("input.php?action=rewrite")'> だと新しいウィンドウが開いてしまいますし <input type="button" class="button" value="修正する" onClick=("input.php?action=rewrite")> だとリンクできません。 どのようにすれば良いのでしょうか? よろしくお願いします。

    • ベストアンサー
    • HTML
  • INPUTタグを使ってリンク先のウインドウを指定したい

    INPUTタグを使って、リンク先を表示させたいのですが、うまくいきません。わかる方よろしくお願いします。 今迄正常に動いていたソース↓ <INPUT type="button" value="ログオン" onclick="window.open('test.htm','win1','width=400,height=500');"> リンク先のウインドウの表示方法を変えると不具合がおこるソース↓ <INPUT type="button" value="ログオン" onclick="window.open('test.htm','win1','target=_home');"> ※フレームのページを使っていて(フレーム名 headとhome)、homeに表示させたい。 INPUTタグを使用したい。

  • ボタンをファイルにリンクさせたい

    お世話になります。 HTMLで <button type="button" name="button" value="button"> <font size="3"><b>テスト</b></font></button> <br><br> 上記のような感じでボタンを作りました。このボタンを あるファイルにリンクさせたい(URLでなくてファイル)のですが、 できますか? ネットで検索すると、URLの場合ですが <Form><Input type="button" value="テスト" onClick="location.href='http://test.jp/'"></Form> 上のように出ていますが、どこにどのようなタグを打てば いいのでしょうか? 宜しくお願いします。

    • ベストアンサー
    • HTML
  • リンクの追加

    下記のソースでとじるボタンをクリックするとリンク先をしていしたい。 たとえばYahooにとばしたい。http://www.yahoo.co.jp/ 修正する場所を教えてください。 "<input type=""button"" value=""印 刷"" onclick=""window.print()"">  <input type=""button"" value=""とじる"" onclick=""link()"">" & _

  • ボタンの違い

    くだらない質問になってしまいますが、 押しボタンのリンク方法で、 onClick=location.href onClick=parent.location.href onclick=window.open はそれぞれどのような効果なのでしょうか?

    • ベストアンサー
    • HTML
  • リンクボタン

    ボタンを押してリンク先に飛ぶようにするには <form><input type="button" value="homeへ" onClick="location.href='home.html'"></form> とすれば可能ですがこれをJavaScriptを使わずに出来る方法はないものでしょうか? どうしても画像など使わずにボタンで実現させたいのですが。

    • ベストアンサー
    • HTML
  • ボタンにファイルリンクをつける

    またまた質問させていただきます。 <html> <head> <script language="javascript"> <!-- function OpnWin(strTarget) { open(strTarget,"_blank"); } //--> </script> </head> <body> <form name="frm1" method="post"> と来て、このあとのボタンに、 <input type="button" value="リンク" onclick="OpnWin('file://PC001/+++/***/@@@');"> というリンクを貼りたいのですが、リンクの貼り方が 間違っているらしく、うまくいきません。 <a href="\\PC001\+++\***\@@@> というリンクだと上手くいくのですが・・・。 どうか教えてください。よろしくお願いいたします!

専門家に質問してみよう