ブックマーク / zenn.dev/kagan (3)

  • 【HTML】dl, dt, ddで組みたくなる表、tableにするのがいいかもね(スクリーンリーダーと検索エンジンのために)

    dl や ul で組むべきでないという主張ではありませんので誤解のなきよう! dl で書くんだ!と思える人はそれがいいと思います😉👍 私自身は dl と table が HTML の使い方としてはどちらも正解で差がないように感じられて、どちらを使うべきか判断がつかず悩んだ末、具体的なメリットの部分を見て table にしたという話です。 同じように迷った人の参考になれば幸いです。 詳しくは以降で説明します。 想定する表の内容 この記事の議論では、名前と値の組が複数並んでいる、メタデータの表を想定します。 プログラミング言語でいうところの、連想配列 (Map, Dictionary, JS では Object) の構造に相当します。 具体的には以下のようなものです。 会社概要(「会社名:〇〇、所在地:〇〇、資金:〇〇、…」) 商品の仕様表(「商品名:〇〇、価格:〇〇、サイズ:〇〇、…」

    【HTML】dl, dt, ddで組みたくなる表、tableにするのがいいかもね(スクリーンリーダーと検索エンジンのために)
    flirt774
    flirt774 2024/04/08
    合わせて抑えておきたい テーブルを組む際に気をつけたいこと  https://accessible-usable.net/2014/08/entry_140822.html
  • WCAGをやわらかい言葉に噛み砕く

    このスクラップをZenn Bookとして再編集した、『【ゆるふわWCAG】中学生でもわかるウェブアクセシビリティガイドライン』を公開しています。 よければこちらをご覧ください。 目的 WCAGを理解したい けど、WCAG(およびその日語版も)に記載されている文章は定義を記述したもので、理解するには難しい。 なので、難しいことが苦手な自分でも理解できるように簡単な日語に変換していくことで理解したい。 人に説明するのが一番身につくって言うしね。 アクセシビリティ対応にハードルを感じている・どうやればいいかわからない人にも身近に感じてもらう 全体書けたら記事化したい。 気をつけたいこと あくまで「ガイドライン」だと思っているので、「制約」と感じるような表記にはしたくない。 「~しなければならない」じゃなくて、「こうだとハッピーだよね」にしたい。 抽象的な表現で、「それって、具体的にはどんなの

    flirt774
    flirt774 2022/12/27
  • 「HTMLでは環境依存文字(①や©など)を文字参照にしなければいけない」という誤解と、本当に置換すべき文字

    HTMLファイルで特殊記号を使う際、① は ①、© は © のように置き換えて書かないといけないものだと思いこんでいないでしょうか。 現代ではそれは誤解です。 UTF-8では特殊記号の文字参照は不要 そもそも環境依存文字とは、データを扱う機種・ソフトウェアなどの違い(文字コードの割り当ての違い)により表示に違いが出てしまう文字のことでした。 例えばShift_JISには © が含まれておらずそもそも保存できなかったり、 ① などの丸数字は含まれているものの、WindowsMac OS(当時)の割り当ての違いにより正しく表示できなかったりしました。[1] しかし現在ではUnicodeによって文字コードは統一化されており、その問題はほとんど起きなくなっています。 近年では多くの場合 UTF-8 でファイルを記述すると思います。 HTMLファイルの文字エンコーディングが

    「HTMLでは環境依存文字(①や©など)を文字参照にしなければいけない」という誤解と、本当に置換すべき文字
    flirt774
    flirt774 2022/10/21
    ¥(日本円記号)については明示的に設定しないとバックスラッシュになったりするので、円も加えてほしい https://qiita.com/Qiibow/items/b0222543f9e2fe196f12
  • 1