質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

2回答

2310閲覧

value属性はなんのためにあるのか

fj-kakeru

総合スコア29

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2018/04/26 09:12

編集2018/04/26 09:12

html

1<p> 2 このビルは<data value="14">十四</data>階建てです。 3 弊社はその<data value="8"></data>階にオフィスを開設しています。 4</p> 5

初期値を与えるという定義があるのはサイトで確認しましたが、
textboxに初期値を与えるのはわかる(「入力してください」など)のですが、
上記のようなところにvalue属性を与えて、何をするのでしょうか??

<追記>-----------------------------

<p>今年で<data value="80">八十</data>歳になります。</p> 質問文に書いてある、このvalueの値は何の意味があるのですか?

また、
<input type="checkbox" name="riyu" value="1" checked="checked">面白い
<input type="checkbox" name="riyu" value="2">役に立つ
<input type="checkbox" name="riyu" value="3">いまいち

このvalueの値も何のためにあるのかわかりません。

参考サイトなどはいつも調べています。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2018/04/26 09:20 編集

前回質問で解決してないなら解決済みとすべきではありません。
think49

2018/04/26 12:20

プロフィールに「ググってもわからないから聞いていることをエンジニアは学ぼう。コミュ力な」とあるので、「何が分からないのかを明確にしなければ、的確な解が得られない事を学ぼう」と返しておきます。
Zuishin

2018/04/26 14:49

垢を変える必要があるのはだいたいコミュ力の無い人です。
退会済みユーザー

退会済みユーザー

2018/04/26 23:18

コミュ力なければ、質問サイトなんてストレス貯めるだけだから、質問するのやめればいいのに^^;垢変えても結果は同じですよ。。。
think49

2018/04/26 23:26 編集

問題の要点は https://teratail.com/questions/123508 の mts10806 さんとのやり取りに書かれています。これを読んでも「参考サイトなどはいつも調べています」の一言で終わらせるのですから、なにも伝わってないのだと思います。
Zuishin

2018/04/27 12:44

これだけ見ると大勢でプロフィールに突っ込んでいるように見えますが、違います。正確には覚えていませんが「垢を変えて新しく質問するわwwwコミュ力な」のような質問者からのコメントを受けてのものです。今はそのコメントは削除されています。また各回答にも悪意の感じられる下品なコメントがついていました。
guest

回答2

0

使わないなら必要ありません。外して大丈夫です。
もし外して問題が起こったなら、そのためにあったんだとわかるでしょう。

投稿2018/04/26 09:46

Zuishin

総合スコア28660

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

ベストアンサー

<data>についてのみ回答します。

ページ全体や動作しているJavaScript等をみていないと確実なことは言えませんが、SEO対策の一つと考えられます。

参考: SEO対策に役立つかもしれない、普段あまり注目されていないタグたちまとめ(HTML 5.1版) - Qiita

人間は「八十」と「80」が同じ80という数であることを(日本語を読める人であれば)簡単に認識できます。しかし、コンピューターで処理する場合は、簡単ではありません。その部分が「数」を意味していると言うことをまず把握しなければなりません。そして、ただの「文字列」から「数値」に変換しなければなりません。これは読み取る側にあらかじめ仕込んでおく必要があります。

「80」のようなアラビア数字の羅列であっても、数字の羅列を認識して、これは数に違いないと判断して、十進数表記として解析した結果80という数だと判別します。最後の数として解析する部分だけでも、ほとんどの言語では標準で関数が用意されていますが、もしそれらの関数がなければ、ちょっとしたプログラムを作る必要があります。しかし、アラビア数字の羅列は世界共通で使われていますし、十進数の整数などは関数も標準で用意されているため、すぐに対応していることでしょう。しかし「八十」となると、中国語と日本語ぐらいでしか使われていないものであり、これを解析して80と判断するための関数も標準にはなく、作り込みが必要です。そうなると、「八十」を80という数だであると認識できるように対応するのはどうしても後回しになってしまいます。

これは検索エンジンを作っている人達にも言えることです。初期の頃の素朴な検索エンジンは、「八十」と書かれていても、それが数の80だとはわからず、ただの文字列として検索のインデックスに登録してしまいます。こうなるとある問題が出てきます。検索エンジンで「80歳」で検索したら、「八十歳」と書かれた項目は引っかかるでしょうか?いいえ、検索エンジンは「八十」が数であることすら知らないので、「八十歳」と「80歳」を結びつけることができません。その結果、検索結果には表れず、サイトに訪れる機会の損失に繋がります。

そこで<data>タグのvalueの登場です。value"80"と書いてあることで、検索エンジンは「これは『80』の意味らしい。つまり80という数だ」ということが判別できるようになります。検索のインデックスには「八十歳」という単なる文字列だけではなく「80歳」という数と単位が合わさったものとして登録されるようになります。こうして「80歳」と検索したときもサイトが引っかかるようになるというわけです。

ただ最近は、日本語解析の技術の発展によって、優れた検索エンジンでは「八十」を80と認識していると思われます。google先生も普通に答えてくれるので、現在においてもSEO対策として有用な手段であるかは疑問が残るところです。


なお、検索エンジンの詳細な仕組みは非公開であり、必ずしも現実の検索エンジンが上のようなことをしているとは限らない事にご注意ください。

投稿2018/04/26 10:10

編集2018/04/26 10:14
raccy

総合スコア21735

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Zuishin

2018/04/26 11:38

漢数字に数字のデータをあてるのは SEO としては疑問があるというより、はっきり無意味と言い切っていいと思います。 ご承知のように Google 先生で普通に漢数字が算用数字で検索できるので。 無意味な理由でもいいなら無限に推測できますが、やはり相手が意味のあることをしているという前提で推測すべきではないですか? もしこれが二十年前に使われていたなら SEO として使ったのではないかという可能性も残りますが、<data> ってそんな古いタグでしたっけ? HTML5 が広まった頃に SEO として有効だったとは思えません。 これが単に漢数字に算用数字をあてただけではなく、意味のある語であったならもしかしたら SEO として有効かもしれませんが、どのようにインデックスされるかわからない以上、それでも不明としか答えられないと思います。 こんなあやふやな理由よりも、もっと <data> が有効活用できる場面をご存知ですよね? JavaScript で使用するのに便利そうです。
miyabi-sun

2018/04/26 13:00

私はこの回答は質問文の意図を確実に射抜いていると考えます。 何故ならこれを書いた前任者はほぼ確実にSEO目的だからです。 HTMLはJSからアクセスするのに絶望的に向いていない文書です。 デザインの都合をCSSだけで吸収しきれずに、いとも容易くdivのネストだらけになる糞フォーマットです。 そんな中にポンと出てきたpタグ内の<data value="14"> こんな情報だけ裸で拾っても誰も何も嬉しくないし、そもそもクラスもIDも無しでアクセスしに来るのは前述の通り至難の技です。 一応考えられるのが文章としての採用ですが、もし私がサイト運営者ならHTMLになるより前の段階で使い、HTMLはあくまでWebサイト公開用にとどめます。 SEOは今は是正されて殆どの会社が死滅しましたが、営業という括りで考えるとかつて業者が毎月うん十万持っていっていた歴史がある程の価値があります。 正しいHTMLを読み込ませて順位を上げるためなら手段を選ばない経営者やWebサイト管理者は大勢居るでしょう。 きっと藁にも縋る思いで採用したのでしょう(知らんけど) それに検索エンジンはGoogleだけではありません。 調べた所Bingや百度も山本56を認識しているようですが、 アルゴリズムは確かに発表されていませんし、きっと前任者は新しもの好きで見知ったdata要素を使いたくなったのでしょう。(知らんけど) 前任者のやってた事とその意図を的確に説明し、 最終的に「あんまり意味ないんじゃないかな?」と締める流れで完璧な回答でしょう。 惜しむらくは質問主が何度も同じ題名、同じ文章で投稿している所ですかね… だからこそ全力で答えつつ遊ぶような回答になったと思いますが…
Zuishin

2018/04/26 13:08

https://dekiru.net/article/12915/ 作ったのは前任者でないようです。 サンプルとして挙げられていますが、SEO に有効との文言はありません。 <data> タグは SEO を目的に作られたものですか? そうであるなら SEO が目的だと断言してもいいでしょう。 そうでないなら、本来の目的は何でしょうか? 検索ワードではなく、プログラムから使えるデータを表すものではありませんか?
Zuishin

2018/04/26 13:16

https://developer.mozilla.org/ja/docs/Web/HTML/Element/data <data> タグの説明によく使われるサンプルがここでも使われています。 <data value="398">ミニケチャップ</data> この 398 が検索ワードとして意味があるとはとても思えません。見るからに JavaScript で扱うべきデータのように見えます。 もしこれを検索エンジンが「ミニケチャップと 398 は同じものなんだ」と判断して、ミニケチャップの検索結果に 398 でインデックスされたページを表示したらどうなりますか? 私なら検索エンジンをそのようには作りません。
think49

2018/04/26 13:37 編集

私もraccyさんの回答には、納得できません。 そもそも、Googleにとってその値(80)は可読可能である必要があるのでしょうか。 確かに「80歳」と認識できれば、ユーザには「80歳」で検索してHITするメリットが生まれます。 しかし、それは正規表現的にいえば、/(?:八十|80)歳/ と認識しているのと同じです。 Googleは「代替となる表現語句」を読み取っているに過ぎず、value属性は同義語を一つ指定する仕組みとして扱われます。 この回答は「80」という数値を機械的に有効活用可能な説明になっていません。 そこに意味があるのなら、Googleは「N歳以下の人間が購入可能なゲームを検索せよ」というような数値である事に意味がある検索手段を用意している、のような説明であるべきでしょう。 それならば、私は納得します。
miyabi-sun

2018/04/26 13:28

あれ、このサイトのコピペだったんですね。 サイト前任者に糞コードを押し付けられ涙目な回答者は居なかったんですね。 よかった…失礼しました。 だからdata要素の使い所はあるのか? という質問でZuiさんは使い所なんてないと回答していたんですね。 まぁ、rubyタグのようなもんだと思っておけば良いんじゃないですかね? あれも有効活用している所なんてなろうの転生無双シリーズで主人公が中二ネームの必殺技をぶっ放す所しか見たことありません。
Zuishin

2018/04/26 13:32

使いどころないなんて言っていませんよ。使ってないなら外して大丈夫と言いました。
miyabi-sun

2018/04/26 13:38

SEOとして無意味はZuiさんの意見で、JSとして無意味は私の意見でしたね。 失礼しました。 中途半端に混ざってごっちゃになってました。 JSとして有効というのはどういう状況ですか? 表形式で使うならtrやli、dt等のトリガーになるもののループだと思いますので、attributeとして宣言するだけで良いので、正直使い所さんが全く見えないのですが、例えばどんな使い方がありますか? やっぱりrubyのような誰も使わない寂しい要素だと思います。
Zuishin

2018/04/26 13:45

表示すべきデータと計算すべきデータをひとまとめにするのに便利ですね。 例えば表示は各国語の機械翻訳を表示したい、しかしマウスホバーで英語の原文を表示したいという場合には原文を <data> で持つことで対応できます。
miyabi-sun

2018/04/26 13:56

あー…なるほど!ツールチップがぴょこっと出る奴ですね。 確かにCSSだけでもいけますがHTMLが汚れたりと何かと使いづらいですね。 アレがJSで統一的に出せるわけですか…仰る通りかなり便利ですね。
think49

2018/04/26 23:17

一連の流れを読んで、一つの解が得られました。 勉強になりました。
x_x

2018/04/27 03:23

miyabi-sun さん >rubyのような誰も使わない寂しい要素 そうは思いません。 ただ、IE非対応でChromeも半年ほど前に対応したばかりの要素、まだ使う機会が訪れなかったというだけではないでしょうか? time要素も使われているようですし、これからでしょう。 ちなみにruby要素は要件に入っていて使ったことがあります。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問