HTMLタグの意味

4640 ワード

HTMLとは
HTMLのフルネームはHyperText Markup Languageで、翻訳するとハイパーテキストタグ言語になります.Webページの内容と構造を定義します.
なぜ意味化ラベルを使用するのか
  • 可読性、保守性
  • htmlには多くのラベルがあり、各ラベルにはその意味があり、例えばh 1〜h 6は異なる重要度のタイトルを表す.普段は意味のないラベルdivやspanなどでも同じ効果が得られる学生が多いが、可読性はかなり悪い.読みやすさが悪くならないと思っている学生もいるかもしれませんが、それは私たちの中には普段から意味ラベルを使う習慣がなく、divばかりだからです.
    htmlはタグ言語であり、宣言式の書き方であるため、プログラマブル性がなく、論理表現能力が強くない.htmlタグは、Java、C、Javascriptなどの他のプログラマブル言語のように、プログラマーが勝手に変数に名前を付けると、コードの可読性が非常に悪くなり、後期メンテナンスコストも非常に高くなります.
  • SEO

  • ほとんどのサイトのドメイン名は覚えにくいため、多くの人がインターネットを利用してポータルサイトを通じてインターネットを利用しています.しかし、検索エンジンが出てきてから、検索エンジンを使ってインターネットを利用するのはますます傾向になっている.検索エンジンはあなたが入力したキーワードに基づいて、直接関連サイトと内容を検索することができて、人工的に1つ1つ検索しないでください.
    しかし、検索エンジンはどのようにウェブサイトが私たちが探している内容であることを知っていますか?検索エンジンは爬虫類を派遣して時々ネット上の各種のウェブサイトにアクセスして、それが1つのウェブサイトのhtmlドキュメントを取得すると、ドキュメントの頭の内容の中のmetaデータによってウェブサイトのタイプと内容を判断して、データベースに保存します.(悪意のある爬虫類誘導は別として)
    seoは重要ですか?もちろんとても重要です.seoはウェブサイトにトラフィックをもたらすことができて、トラフィックはウェブサイトの血液のようで、アクセス量がなくて、ウェブサイトは存在しませんに等しいです.seoは現在、インターネットの垂直業界となっている.よくやったのは、百万歳になるのは夢ではない.しかし、seoはこれらのみを運営している.
  • アクセス性
  • 良いサイトは、できるだけ多くの人がバリアフリーに閲覧できるようにしなければならない.例えば、視覚障害者はスクリーンリーダーを借りて、インターネットで買い物をすることもできます.サイトのカートボタンがdivで書かれている場合、スクリーンリーダーの認識は非常に困難です.私たちはどうして視覚障害者にもインターネットを利用させることができるのか、これはとても面白い問題です.私たちは毎日多くの时間をかけて携帯電話や他の設備でホームページを閲覧しなければならないので、もし後で目が見えなくなったら、私たちは後でサーフィンすることができます.(それだけでなく、この世界にはブラインドゲーム、ブラインドプログラマーもいます)
    一般的なHTMLタグの意味
    htmlタグの意味についての議論や文章は数え切れないほどあり、全力を尽くして守ろうとするサイト開発者も多いが、開発になると、どんなタグを使うべきか思い出せない.そこで、頭皮をかき始めました.時間が経つと、ハゲてしまいました.
    ラベルの使い方をいくつか挙げます.
    article:翻訳すると文章の意味で、その内容は独立した完全な文章であるべきです.雑誌、新聞、技術または学術記事、論文またはレポート、ブログ、またはその他のソーシャルメディア記事であってもよい.articleはネストできますが、その内容は関連している必要があります.各articleにはタイトル(h 1~h 6)があるはずです.
    section:段落.例えば、文章(article)の断片です.各段落にはタイトル(h 1~h 6)があるはずです.sectionがarcticleのサブ要素である場合、タイトル番号は文章のタイトルより大きくないでください(そうしないと変に見えます).sectionにスタイルを使用したり、スクリプトの切り込み点として使用することもお勧めしません(概ねjsで操作しないでください)、divを使用して代わりにするべきです.pラベルとは違います.私达はふだん文章を书いて改行して、初めは2つの字を空けて、これは1つの段落を表して、pで表すことができます.sectionは、1つ以上のp段落であってもよい.このいくつかの段落の表現の意味は近いか、完全な意味を構成している.小中学校の国語の授業に似ていて、先生は学生を区分させます.
    nav:ナビゲーションブロック.たとえば、他のページやこのページにジャンプするリンクが含まれています.navの内容はリストでもなくてもいいです.例:
    
    
    

    しかし、サイトの下部には、住所や連絡先など、多くのリンクがあります.この時はnavを使う必要はありません.
    aside:現在の位置段落に関連する独立した内容.たとえば、関連テキスト、段落、広告、ナビゲーション
    h 1~h 6:重要度の異なるタイトル.
    ヘッダー、footer:body、article、aside、nav、sectionは頭や足を持つことができます.ヘッダは、通常、上部の検索ボックス、ディレクトリ、logo等を包むために用いられるが、タイトルh 1〜h 6を包むようにしてもよいが、必須ではない.
    figure、figure-caption:2つを組み合わせて使用し、注釈イラスト、グラフ、写真、コードリストなどに使用できます.例:
    Listing 4. The primary core interface API declaration.
    interface PrimaryCore {
      boolean verifyDataLine();
      void sendData(in sequence<byte> data);
      void initSelfDestruct();
    }
    div: の もありません. する のサブノードをラップしたり、 するコンテンツをレイアウトに したりすることができます.
    ol,ul,dl: の2つの はより で,それぞれシーケンステーブルと リストがある.dlは2 Dの なリストに ています. :
    A
    xx
    xx
    xx
    xx
    B
    xx
    xx
    xx
    xx

    blockquote、q:すべて の です. つの にはもう つの が されている. または を する がある はciteラベルを します. なる は、blockquoteがciteラベルを に むことです.q は、フレーズや のように く、citeは ノードとしてその に れる.qの は と じですが.しかし、 なる シーンがあります. えば、 ったことがあるなら、 で してもいいです.qに わないかもしれません.
    s、del: のデフォルトの の は くなく、 があります.しかし、sはそれほど ではないと べ、delは されたことを している.
    strong、em:どちらも の があります.strongは を に し、emは の のアクセントのようなニュアンスを している.
    i: や 、あるいは に れる ちや などの . は かりやすく、 は かりにくいです.まず を てみましょう.

    .

    , . , . , , , , .

    , , ——

    , .


    の では、リーマンが ているのと が めるのは な で、 は で、 のシーンで、iで しました.iは のラベルに って わることができて、 たちはemが の いを すことができて、dfnでそれらの あるいは な の を むことができます.
    b: して、 を き こすが、 ずしも ではない.これに して、 の もする はない.たとえば、ハイライトされたテキストの を します. は です.

    ! !


    ここはstrongの が いています.
    u: ( )、スペルミス、 がわかりにくい.
    time: 、タイムゾーンなど、 に する .
    code:コードクリップ.
    var: やプログラミングなどで われる . :

    x 5


    samp: または への を す.
    span:divと じように、 の もありません. の やテキストを んでスタイルを することができます.
    ......