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

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

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

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Q&A

解決済

5回答

2855閲覧

<dl>タグを表作成のために使用してOK?

megu9859

総合スコア22

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

1グッド

0クリップ

投稿2019/04/28 23:09

表 (英語: table) 作成を目的としているタグは<table>タグですが、下記のURLでは、レスポンシヴが容易との理由で表作成に<dl>タグを推奨しております。近年、こういったチュートリアルを見かけます。

・まだtable使ってるの!? dlで1ランク上の表テーブル作成をしてみよう
https://yatteq.com/htmlcss-dltable

しかし、これはマークアップとして適切なのでしょうか? あくまでも<dl>タグは定義リストのためのタグであって、表作成のためのタグは<table>タグです。
dlの仕様: https://developer.mozilla.org/ja/docs/Web/HTML/Element/dl
tableの仕様: https://developer.mozilla.org/ja/docs/Web/HTML/Element/table

確かにレスポンシヴは容易ですが、マークアップとして誤りなのかどうか‥‥仕様確認をしても判断が難しく、表作成としての使用をためらっております。
マークアップが正解か不正解か、主観によるジャッジでも構いませんのでご教示いただけると幸いです。

※BAやご回答への返答には約1週間程度を要します。また、本注釈の削除はできかねます。何卒ご容赦ください。

jabberwocky3376👍を押しています

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

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

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

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

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

m.ts10806

2019/04/29 00:16

>本注釈の削除はできかねます 質問要件に関係のない内容を書いておいて「削除できない」は質問の私物化と思います。teratailの質問として削除できないのであれば万人が納得できるよう説明を追記してください。 要件とどう関係あるのかも追記願います。 というか、この数行を書く手間をコード書く方に向けた方がこの質問が良い方向に向くと個人的には思います
Zuishin

2019/04/29 00:21

なお前の質問にも書きましたが、知恵袋では一週間以内にベストアンサーを決めなければならないので、それに準じるなら返答に一週間はかかりすぎです。それ以前に回答者とやり取りして要件を明確にし、一週間以内には必ずベストアンサーを決定できるレベルにまで精錬しなければなりません。返事は遅くても当日中が常識かと思います。
guest

回答5

0

セマンティクス

https://momdo.github.io/html/dom.html#elements-in-the-dom

DOM内の要素は概念を表す。これは、要素がセマンティックとして知られる固有のセマンティックスを持つ。

Example: たとえば、ol要素は順序つきリストを表す。

上記仕様から、セマンティクス上のtable要素、dl要素は下記になります。

  • table要素は「表」を表す
  • dl要素は「定義リスト」を表す

セマンティクス上で「表」を表すコンテンツを <dl>でマークアップする事は出来ません。

※ここで、セマンティクス上の「定義リスト」を <dl>でマークアップし、CSSで「表」のように見せるのは構いません。
見た目を変えるのはCSSの領分であり、セマンティクス(HTML)には影響しません。
(デザイン上の観点が別にありますが、余談なので、ここでは省略します)

文法

https://yatteq.com/htmlcss-dltable で例示されているHTMLは <dt> に対応する <dd> が存在しない為、文法違反です。
先述の判断基準と違い、文法には絶対的な基準がありますので、必ず守る事をお勧めします。
HTMLの文法は https://validator.w3.org/ でチェックできます。

返答

BAやご回答への返答には約1週間程度を要します。また、本注釈の削除はできかねます。何卒ご容赦ください。

megu9859さんは回答に+評価を入れる程度には、回答文を読む時間があるようですが、返答には大変な時間を要する、と理解しました。
読み応えのある返答を期待しています。

※回答者も一人の人間ですので、質問者の対応次第では怒ることもあれば、苦言を呈することもあります。
無視をもって質問者への返答とする場合もあります。
あしからず、ご了承下さい。

更新履歴

  • 2019/04/29 18:03 返答を追記
  • 2019/04/29 18:35 仕様に則り、表現の修正(論理構造→セマンティクス)

Re: megu9859 さん

投稿2019/04/29 07:22

編集2019/04/29 10:16
think49

総合スコア18156

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

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

megu9859

2019/05/05 13:14

詳細なご回答、誠にありがとうございます。こちらも、<dt>に対応する<dd>が存在していないため文法違反である、という部分で納得がいきました。
think49

2019/05/05 23:20

To: megu9859 さん 返答に時間がかかる文章量とは思えませんでしたが、なぜ一週間かかったのでしょうか。 (返答は一週間後で結構です)
guest

0

ベストアンサー

参考にしているサイトのdlの使い方が意味論として全く通じないものになっています。仕様書もろくに読んでいないようなレベルが低いサイトを見て論じても意味がありません。正しいdlの使い方をしていて、かつ、テーブルを作る場合はdlを使うことを推奨しているというサイトを見つけてから、再度ご質問ください。


【おまけ】

以下は、詳しく知りたいって人に向けたおまけです。

まずは、HTML標準の仕様書を読んでみましょう。HTML標準の仕様書は常に変化するため、2019年4月29日時点のものを参考にしています。

HTML Standard

ここからdl要素とは「名前-値グループ(name-value group)」のリストであることがわかります。しかし、その構成には制限があります。

  • dl要素には0個以上の「名前-値グループ(name-value group)」から構成される。
  • 「名前-値グループ」は1個以上のdt要素(「名前」を表す)とその後に続く1個以上のdd要素(「値」を表す)から構成される。このとき、dt要素とdd要素、および、div要素の子であるdt要素とdd要素以外は全て無視される。
  • 一つのdl要素の中に同じ名前のdt要素があってはならない。

また、dl要素での「名前-値グループ」がどのように決定づけられるかのアルゴリズムも書いてあります。以下は、そのJavaScriptでの実装です。

JavaScript

1const getNameValueGroupList = dl => { 2 const processDtOrDd = node => { 3 if (node.nodeName.toLowerCase() === "dt") { 4 if (seedDd === true) { 5 groups.push(current); 6 current = { name: [], value: [] }; 7 seedDb = false; 8 } 9 current.name.push(node); 10 } else if (node.nodeName.toLowerCase() === "dd") { 11 current.value.push(node); 12 seedDd = true; 13 } 14 }; 15 const groups = []; 16 let current = { name: [], value: [] }; 17 let seedDd = false; 18 let child = dl.firstChild; 19 let grandchild = null; 20 while (child !== null) { 21 if (child.nodeName.toLowerCase() === "div") { 22 grandchild = child.firstChild; 23 while (grandchild !== null) { 24 processDtOrDd(grandchild); 25 grandchild = grandchild.nextSibling; 26 } 27 } else { 28 processDtOrDd(child); 29 } 30 child = child.nextSibling; 31 } 32 if (!(current.name.length === 0 && current.value.length === 0)) { 33 groups.push(current); 34 } 35 return groups; 36};

これを踏まえて 【コピペでOK】まだtable使ってるの!? dlで1ランク上の表テーブル作成をしてみよう のコードを見ています。後から記事が変更されたり、削除されたときのために、2019年4月29日時点でのHTMLを全文引用しておきます。

HTML

1<div class="dltable"> 2 <dl> 3 <dt class="row1">見出し1</dt> 4 <dt class="row2">見出し2</dt> 5 <dt class="row3">見出し3</dt> 6 <dt class="row4">見出し4</dt> 7 <dt class="row5">見出し5</dt> 8 </dl> 9 <dl> 10 <dd class="row1">内容1-1</dd> 11 <dd class="row2">内容2-1</dd> 12 <dd class="row3">内容3-1</dd> 13 <dd class="row4">内容4-1</dd> 14 <dd class="row5">内容5-1</dd> 15 </dl> 16 <dl> 17 <dd class="row1">内容1-2</dd> 18 <dd class="row2">内容2-2</dd> 19 <dd class="row3">内容3-2</dd> 20 <dd class="row4">内容4-2</dd> 21 <dd class="row5">内容5-2</dd> 22 </dl> 23</div>

アルゴリズムに従えば、三つのdlがありますので、「名前-値グループ」のリストが三つあります。三つは次のようになります。

  1. 一つ目のdlは、『見出し1』『見出し2』『見出し3』『見出し4』『見出し5』という5個の名前を持ち、値が空である「名前-値グループ」が1個だけです。
  2. 二つ目のdlは、名前が空で、『内容1-1』『内容2-1』『内容3-1』『内容4-1』『内容5-1』という5個の値を持つ「名前-値グループ」が1個だけです。
  3. 三つ目のdlは、名前が空で、『内容1-2』『内容2-2』『内容3-2』『内容4-2』『内容5-2』という5個の値を持つ「名前-値グループ」が1個だけです。

dl同士は独立して「名前-値グループ」のリストを持ちます。それらがdlをまたがって関連づけれることはありません。そして、ddの前にdtが無ければ名前が無い「名前-値グループ」になってしまいます。最も気をつけなくてはならないのは、名前と値はそれぞれ1個以上なければならないということです。よって、HTMLとして正しくないとなってしまいます。

たぶん、記事の著者は『見出し1』を『内容1-1』『内容1-2』と関連付けたかったのでしょう。もし、そのように書きたければ、HTMLは次のような形で書くべきでしょう。

HTML

1<div class="dltable"> 2 <dl> 3 <div class="col"> 4 <dt class="row">見出し1</dt> 5 <dd class="row">内容1-1</dd> 6 <dd class="row">内容1-2</dd> 7 </div> 8 <div class="col"> 9 <dt class="row">見出し2</dt> 10 <dd class="row">内容2-1</dd> 11 <dd class="row">内容2-2</dd> 12 </div> 13 <div class="col"> 14 <dt class="row">見出し3</dt> 15 <dd class="row">内容3-1</dd> 16 <dd class="row">内容3-2</dd> 17 </div> 18 <div class="col"> 19 <dt class="row">見出し4</dt> 20 <dd class="row">内容4-1</dd> 21 <dd class="row">内容4-2</dd> 22 </div> 23 <div class="col"> 24 <dt class="row">見出し5</dt> 25 <dd class="row">内容5-1</dd> 26 <dd class="row">内容5-2</dd> 27 </div> 28 </dl> 29</div>

class名についてですが、元記事のコードでは"row*"というクラスが列を表していましたが、「列」は英語で"colunmn"です。**なぜ列の番号付けに「行」である"row"と付けていたのかはわかりません。**上のコードでは「行」と「列」が"row"と"col"のクラスを付けるようにしました。また、将来増えることも考え、クラス名に無意味に番号を付けることもやめました。

今度はこれをテーブルっぽいレイアウトしたいとき、素直にスタイルを調整しようとすると、横では無く縦に見出しが並ぶ形になってしまいます。では、記事のように横並びにするにはどうしたらいいのかというと、(...来週に続く)

※回答の続きには約1週間程度を要します。また、本注釈の削除はできかねます。何卒ご容赦ください。

※回答者はこのまま失踪する可能性があります。一週間音沙汰が無く、調べてもどうすれば良いのかわからない、そもそもできるのかすらわかっていない場合は、別途質問として投稿していただければ、親切な方が答えてくれるかもしまれん。回答者自身がそのような質問をこっそり投稿していた場合は、色々と察していただきますようお願いします。


【続き】

SCSS

1.dltable { 2 width: 90%; 3 margin: 15px; 4 dl { 5 display: flex; 6 flex-flow: row nowrap; 7 border: 1px solid #cccccc; 8 border-radius: 4px; 9 text-align: center; 10 justify-content: left; 11 font-size: 12px; 12 .col { 13 display: flex; 14 flex: auto; 15 flex-flow: column nowrap; 16 +.col { 17 border-left: 1px solid #cccccc; 18 } 19 .row { 20 margin: 0; 21 padding: 10px 0; 22 +.row { 23 border-top: 1px solid #cccccc; 24 } 25 } 26 dt.row { 27 background: #f2f2f2 none repeat; 28 color: #333; 29 } 30 } 31 } 32}

jsfiddleでの結果

かなりやっつけでつくりましたが、元記事とほぼ同じように見せるようにはできたと思います。普段はBootstrapで誤魔化している私には、一から作るのは面倒くさいきついです。flexを(フレームワークではなく生で)初めて使ったので、私には解説できません。まだよくわかってなくて、無駄なことをしている部分もあるかも知れません。テーブルとは違って、改行が入ると縦は高さがズレていきます。そういう所の調整は私にはわからないので、別途質問でも上げてください。

投稿2019/04/29 04:42

編集2019/05/06 00:00
raccy

総合スコア21733

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

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

megu9859

2019/05/05 13:12

詳細なご回答、誠にありがとうございます。名前と値がそれぞれ1個以上存在していない、という具体的な違反理由が理解できました。
raccy

2019/05/06 00:28

それで、「表作成に<dl>タグを推奨」しているサイトは他に示してくれないのでしょうかか?「こういったチュートリアルを見かけます。」と言っているのですから、他にもあるのだと思われます。しかし、私も色々検索して見て、「dlを表のように表示しよう」というサイトはいくつか確認できましたが、「表はdlを使おう」というサイトは見つけられませんでした。一週間経っても示してくれないので、結局、そのようなチュートリアルを見かけるというのは、勘違いではなかったのかすら思っています。 つまり、私の回答は「質問の前提が間違っている可能性があり、現在の前提では論じるに値しない。」と言う内容です。この回答にBAを付けると言うことは、megu9859さんも「論じるに値しない」と結論づけたと言うことでいいのでしょうか? なお、私は、dlを表形式にするのは肯定も否定もしません。こういう場合はdlを、こういう場合はtableをと言う解説や主張もしていません。私の【おまけ】部分は、参考にされたサイトがどうして「レベルが低い」のかの理由を説明するものであって、また、サイトの作者の意図したとおりに書き直すならどうすると良いのかを書いたもので、回答にはあまり関係ありません。
m.ts10806

2019/05/06 07:59

私が質問者なら「え!続きのほうが気になる!早く書いてよ!」と突っ込みます。 私の質問内容の解釈が正しければ、続きのほうが知りたいことのはずだから。。。
guest

0

個人的には、「使用してOK」

理由:
区別が難しい部分もありますが、<table>の中には、<dl><ul>を「複数集めただけ」のものもあるため、HTML5でのセマンティックwebとして見れば、内容によっては「より良い」と言えるかと思います。

投稿2019/04/29 00:17

yoshinavi

総合スコア3521

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

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

megu9859

2019/05/05 13:20

ご回答、誠にありがとうございます。実際にこうして意見が分かれている点が、確かに区別の難しいところであると痛感しました。
yoshinavi

2019/05/05 14:40

そうですね。 罫線で囲ったら、すべてが「表」かと言えば、内容的にそうではない場合もあるでしょうから、難しい部分ですね。 (^^;)
guest

0

作れるなら作って良いかと。
「主観のジャッジでいい」なら尚更ですね。お好きにどうぞ。
どこかに「技術的にNG」という根拠資料があるなら躊躇うのもわかりますけど、ないなら勝手にやったらいいです。
見た目に違和感なければ使う人には影響は全くないです。
作る側の都合のみ。


なお、同様の質問を見かけますが全て同様の回答で済むので今後同じような質問は遠慮していただきたく。

組んでみて運用してみて不都合が起きてないならこの質問は実際に問題、課題が起きていないので非推奨と思います。

投稿2019/04/29 00:08

編集2019/05/08 07:42
m.ts10806

総合スコア80765

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

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

megu9859

2019/05/05 13:24 編集

ご回答ありがとうございます。 今回の問題は見た目の内容ではなく、目に見えない部分の内容でした。また、事前に同様の質問も探してみたものの、同様の質問を見つけることはできませんでした。あれば、逆にお教えいただけると助かります。
m.ts10806

2019/05/05 23:00

なぜ解決後に聞くのですか? 返答次第で別の展開があるならもっと早く聞けませんか? 質問内容ではどこにも「類似質問を探したこと」「目に見えない部分であること」はわかりません。 というか、目に見えない部分ってなに?という疑問しかないです。 まあ実際に組んで運用してないからわかりませんよね。 具体的にプログラミングで困ってるようには見えません(プログラミングしてないし)
megu9859

2019/05/06 06:51 編集

恐縮ですが回答内容の通り、mts10806様以外は「目に見えない部分の問題である」とご理解されています。 なお、個人のスキルに対する誹謗はご遠慮願います。
m.ts10806

2019/05/06 07:42

どこをどう見て「個人スキルに対する誹謗」と思われたのか分からないですけど、私があなたの質問と私の回答に対するコメントについての疑問に思った点が一切伝わってないのが分かりました。(あと他の回答もほとんどちゃんと読まれてないということも)
m.ts10806

2019/05/06 07:57

>恐縮ですが回答内容の通り、mts10806様以外は「目に見えない部分の問題である」とご理解されています。 ちなみにこれは「主観によるジャッジ」を排除する意味合いでよろしいですか? なぜ要件が書かれるべきタイトルに対しての回答を排除しようとしますか? 一応、現時点では私の回答でもベストアンサーに選ばれた内容と同数の高評価があります。回答には要約すると「(勝手に)好きにしたら?」となるものも複数ある中でなぜ私の回答「以外」と限定できますか? また現時点でかなりの数「問題・課題が含まれていない質問」という指摘が集まっていますが、それを無視、放置して回答内容の半分も理解せずに解決するのは無責任と思います。 途中で終わっている回答、もっと突っ込めば有用な情報が引き出せそうな回答があることに気づいていないようですし。 質問につけられた不要なただし書き、放置期間、回答につけられたコメントから暇潰しで遊んでいる印象も受けます。 「仕様を確認した」割りに、少し横を見れば載っている内容をスルーして質問してしまっていることにも気づいていません。 もっと調べて検証してから質問してください。 既にこの質問についた回答はあなたの手に負えるものでなくなっているのは明らかです。(理解度が全くうかがえないコメントばかりなので)
think49

2019/05/06 07:58

横からですが…。 > 恐縮ですが回答内容の通り、mts10806様以外は「目に見えない部分の問題である」とご理解されています。 私はセマンティクスがHTMLの領分、見た目がCSSの領分というニュアンスで説明しましたが、「目に見えない部分の問題」はmegu9859 さんの拡大解釈だと思います。 それから、raccyさんの回答ではこの観点で回答されておらず、「validなdl要素の判定ロジック」に主眼を置いていました。 なので、megu9859さんの一存で他の回答者全員を代弁したかのような物言いはお控えください。 > なぜ解決後に聞くのですか? これについては、私も疑問です。 質問が残っているのなら、その疑問を解消してから、BAを選ぶべきですね。 そうでないと、「mts10806さんはBAに選びません」と明言しながら、追加質問している事になり、失礼だと私は思います。
m.ts10806

2019/05/06 08:25 編集

仕様をそのまま転記した内容の回答のどこが「目に見えない部分」なのか気になりますね。仕様書は明文化されているものなので「目に見える部分」でしかないのですが、質問者さんだけのオレオレ基準があるのでしょうか。困りますね。書いたようにしか動かないのがプログラミング言語なのにオレオレフォーマットを適用されてしまうのは。 私を叩きたいだけにそう表現しているのであれば人格批判に等しく、プログラミングから離れることになるのでやめていただきたく。
think49

2019/05/06 08:45

「目に見えない部分」の解読、続くのですね。 CSSの「見た目」から連想して、「HTML=見えない部分」「CSS=見える部分」とエスパーして先程のコメントでした。 ただ、これも頭をひねらないと出てこない連想ゲームでして、拡大解釈には違いないと思います。
m.ts10806

2019/05/06 08:51

私の回答の「作る側の都合」こそ最も見えない部分なんですけどね。使えればいいだけのサイトの利用者には見えなくて見ることもない部分ですし。
think49

2019/05/06 08:58

そこはおそらく、mts10806さんの「見た目に違和感なければ使う人には影響は全くない」を受けて、「見た目に影響なくてもHTMLの文法違反は問題でした」と反論したかったのでしょう。 この仮定が真だとすれば、「回答の解釈」と「返答時の表現」に問題がある事になります。
m.ts10806

2019/05/06 09:01

私の回答がこの質問についた回答で最も早かったことを加味すると文法違反は後から知ったことになるのでそれでドヤされても困りますね。結局ちゃんとドキュメント読んでないだけですし。
megu9859

2019/05/07 23:13 編集

結婚とか団体生活が難しそう。 ブラリもできないまま、毎回質問の度に極限粘着体質のストーカーを数匹飼う質問者の身にもなれば。
m.ts10806

2019/05/07 23:13

妻もこどももいてもう何年も会社所属でエンジニアをやっていますがそれは本件と関係ありますか?人格批判をするためにコメントするのはやめてください。そんなに通報してほしいのですか?
megu9859

2019/05/07 23:17 編集

嫁と子供持ちが、朝昼夜問わず毎回神速で返答できるか。働け。人格否定って言うけどお前はホンマ無理や。 妄想はいいから、365日24時間通報してな。
m.ts10806

2019/05/07 23:20

>家族持ちが、昼夜問わず毎回神速で返答できるか。 それは単なる憶測。どこに「できない」ソースがありますか?あなたに私の私生活まで突っ込んで批判される筋合いはない。失礼極まりない。 他人の私生活気にする暇があるならご自身に寄せられた指摘でご自身を振り返られては。荒らす気しかないなら質問もコメントも一切しないでください。
m.ts10806

2019/05/07 23:32

余程コードや検証が必要な要件ならともかく、そうでなければ大抵想定の範囲内なので回答もコメントも可能ですし、それは単なる回答者としてのスタンスで、返答に一週間かかると無駄なただし書きをするあなたと変わりはないです。もちろんそれなりに技術も経験もあるので一週間かかるあなたとは頭の回転も引き出しも違うでしょう。神速は誉め言葉ととっておきますが、それ以外は本件ともteratailの本分とも関係のない妄想も含めた個人攻撃です。 なんども言ってますが“あなた程度“に執着も粘着もする理由はありません。 回答が可能だから回答し、質問に不備があるから極めて機械的に指摘をしているだけ。 質問のタグが私の回答可能なカテゴリーであるだけ。 本件ともteratailの本分とも関係のない場外乱闘を持ち込もうとしているので指摘しているだけ。 これくらいは理解してください。変な関西弁で凄んでみせるのではなく頭冷やして客観的に捉えてください。 エンジニア、またはエンジニアを目指しているなら尚更です。プログラミングに関する問題解決にのみ注力してください。teratailはその場です。
m.ts10806

2019/05/08 00:20 編集

>お前はホンマ無理や。 ではなぜ回答にコメントをしましたか?他の回答のコメントでもあなたに対する指摘が入っていますが、定型の感謝コメントのみや回答に対する理解が伺えないコメントをされるくらいならスルーされたほうがマシだと思っている回答者は少なくないです。今までの経緯や「朝昼夜問わず」と私の活動を監視しているあなたなら私からどのような返答があるかは容易に想像できたはずです。 「megu9859さんが頭のなかで作り上げた私の像」には「自分で勝手に解釈したteratailのルールに反していたら即批判」というのがあるのではないですか? だからコメントせずにスルーするなり低評価するなりしたらよろしいかと(基本的に回答に関する低評価には低評価の理由をコメントすることが推奨されています) いずれにしても既にthink49さんからもコメントがあったように解決済みにしたあとに別の回答に追加で求めるのはマナーに反していると思います。回答者の立場からするとそうなります。回答者の立場が想像できないからやってしまったのだと思いますが、マナーに反しています。 どうしても聞きたいのでしたらいったん解決済みを受付中に戻すか別の質問にすべきですね。 まあ「お前はホンマ無理や。」とのことなのでそこまではしないんでしょうけど、それこそ前にZuishinさんが提案されたように別スレッドを立てて回答者としての是非をユーザー全体に問えばいい話です。 ただ、今後なにかしら質問があがってても私が回答可能な限りは私はあくまで「問題解決」の観点から「それがどのユーザーであろうと関係なく」回答はするでしょうし、私もユーザーを見ずに質問内容だけみてコメントなり回答することも非常に多いですので「お前はホンマ無理や。」は勝手に貫いたらよろしいかと。 むしろあなたのそのスタンスが裏目に出て指摘が積み重なってることに気づける日がいつかくるといいですね。
m.ts10806

2019/05/08 00:35

正論なり指摘を親の敵のように嫌う人は一定いますが、お客様と関わる仕事をしている人であれば正論なり指摘、クレームは改善要望であり、成長のチャンスにつながることは分かっているので真摯に受け止めて対応します。 それができていないのに相手に的はずれの批判ばかり繰り返して自身の成長を阻害していることに気づけるといいですね。 teratailはプログラミングに関する問題解決の場です。 問題は早く解決できたほうが次の問題に取り組める時間をより多く確保できるので、早く解決できるに越したことはないですし、多くは「急ぎ」を割愛して質問を投稿しています。だからこそ回答者も早めの回答が文化になっていて回答者には「スピードスナイプ(15分以内にした回答がベストアンサーに選ばれた)」とプラスでスコアが入るようになっています。 それだけ問題解決は急ぎで早く行われるものですし、実際の現場でもスピードが求められていて、それをこなしているからこその回答速度です。 そういう質問者や回答者が多い中で「一週間程度要する」とただし書きをするのは異端と捉えられて当然でしょう。 回答者にとっては急ぎとか時間かかるとか要件に関係ないのでどうでもいい(できれば書かないで欲しい)内容ですしそれに指摘を入れることも多いです。そのただし書きがあることで「めんどくさい質問者」と回答者が質問をまともに読みさえせずに離れる例も非常に多いからです。 基本的に回答者が回答をつけないと解決しないものです。回答者に「めんどくさいやつ」と印象づけられれば回答が寄せられなくなることもあります。私は問題解決そのものを優先させるためユーザーを選ぶことは少ないですが、think49さんも書かれているように回答者も一人の人間ですので、悪い印象をもったユーザーに関わらないようにしている回答者も少なくないです。 そうなると困るのは質問者のほうではないですか?有益なアドバイスを得られる機会を失していることになります。成長のチャンスを自ら捨てていることになります。 赤の他人なのでかなりお節介な人でない限りは平気で見捨てます。 あと時々、teratailを匿名掲示板と勘違いして使っている例をチラホラ見ますがそのような使い方は礼儀を失しているので規約違反です。今目の前にいるあなたもその一人ですよ。
m.ts10806

2019/05/08 07:41

この回答に対する低評価をされた方はきちんと低評価の理由をコメントください。 それが本当に回答に対するものであれば回答の調整を行います。
guest

0

文法や、セマンティクスのことなどは他の回答者様が、答えておられるので、
SEOの観点から申し上げます。

おそらく、掲示していただいたURLの投稿者さんは、セマンティクスやSEOのことを考慮していない方なのでしょう。
SEOにおいて有利になるには、
正しい文法、セマンティクスでHTMLを書かれるのが最低条件となります。
内容によっては、多少正しい文法でなくても、検索上位になることはなりますが、
やはり、正しい文法、セマンティクスで書いた方が、有利になります。

また、SEOの観点だけでなく、重要なのは、誰かに情報を伝えるときに、正しい情報を伝えられるかが大事になってきます。
これはブラウザ、検索エンジンに対してもそうなのですが
(ブラウザ、検索エンジン対しては正しい文法、セマンティクスで書かないと、正しく伝わりません。なぜなら、見た目が大丈夫とか関係ないからです)
たとえば、目の不自由な方がサイトを閲覧するときにどうでしょうか。
見た目が大丈夫と間違った文法で記述したら、目の不自由な方々には情報が正しく伝わらなく、その方々の閲覧を逃すものになってしまいます。
これは、SEOの観点からも重要視されております。
また、ブラウザの機能として、目の不自由な方でもサイト閲覧できるような、読み上げ機能などが備わっており、その機能を正しく使うには、
正しい文法、セマンティクスが必要になります。
(ブラウザが解釈して読み上げするので、正しい文法の必要があるわけですね)

つまり、そういった、相手に正しく伝える必要がない、見た目良ければ別にいい、って思われるのなら、別にやってもいいと思いますよ。
ただ、正しい文法でセマンティクスで書こうとしているエンジニアによるコーディングの方が、全体的に完成度の高いサイト構築をされておりますし、
見た目も同時に担保するために、様々な創意工夫が生まれ、そうした方が、エンジニアとしての実力が上がるような気がしますけどね。

要は、気にしないなら、好きにすればいいけど、気にした方が、周りすべての人の、そしてなにより自身のためになるってことです。

投稿2019/04/30 00:45

miyabi_takatsuk

総合スコア9528

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

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

megu9859

2019/05/05 13:18

詳細なご回答、誠にありがとうございます。セマンティクスで記述することはSEO上でも最低限の条件‥‥分かっていたようなつもりではあったものの、本当に理解していないためか、チュートリアルなどをみると右往左往している自分がいました。 ‥‥が、raccyさんとthinkさんの文法違反の理由、そこからmiyabiさんがご助言くださったSEO上での問題、ここで記述の方向性が私自身の中で明瞭化できました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問