普通のHTMLの書き方
保守しやすく、規模に依存しないHTML文書のために 一般 DOCTYPEで始める 置き換えられるべきまたは旧式のDOCTYPEを使わない XML宣言を使用しない 文字参照はできる限り使わない &と<、>、"、'は名前文字参照を使ってエスケープする 制御文字や不可視文字は数値文字参照を使う コメントではその内容の前後へ空白文字を置く 終了タグを省略しない 空要素の書き方を混ぜない タグや属性値の前後へ空白文字を置かない 大文字・小文字を混ぜない 引用符を混ぜない 属性を2文字以上の空白文字で区切らない 真偽値を取る属性の値は省略する 名前空間は省略する XML属性は使わない data-*とMicrodata、RDFa Lite用の属性と通常の属性を混ぜない デフォルトの暗黙のARIAセマンティックスを尊重する 文書要素 lang属性を追加する lang属性の値はできる限り短くする できる限り
普通のHTMLの書き方(またはHTML Best Practices日本語版)
この夏、HTMLについて書く機会が別々に何回かあった。そのうちちゃんとした形で出ることだろう。そのままのテンションで一気にHTML Best Practicesの日本語版を作成した。内容は増えていないものの、さすがに日本語の方がさっと読め、色々直さなければという気になる……。 この量で 575は 無理でした カタカナ訳はちょっと嫌だったので「普通のHTMLの書き方」というタイトルにした。あまりうまい訳でもないので、そのうちカタカナ訳になりそうだ。 これに限らず「(Best )Practice」という言葉は訳出しづらい印象がある。直訳は「慣習」や「慣例」だが、日本語のそれらはネガティブなイメージがあるように思っており、このコンテキスト(ベスト)では不適当だと感じる。「実践手法」とするとかなり近いが、だいぶ硬い。あきらめて「プラクティス」というカタカナだと、今度は「練習」的な意味でとらえられる
遅延読み込み用のぼやけた画像
Mediumでとある記事を高速にスクロールして読んでいたら、さりげなく画像を遅延読み込みしていることを知った。読み込み発火のタイミングがうまいのかあまり遅延読み込みの存在を感じさせないのもすごいと思ったが、プレースホルダー画像の実装方法が良さそうだった。単純に元の画像を幅30px程度まで小さくしてそれをブラウザーにリサイズさせることでぼやけた画像をプレースホルダーとして表示しているだけだが、十分に機能していそうで目から鱗だった。 画像の遅延読み込みはなかなか曲者で、読み込むタイミングやプレースホルダーとしている画像が悪いと大きくユーザーにストレスを与える。プレースホルダーでよく使われるローディング画像は読み込み中のインジケーターではあるが、同時に何か遅いことをやっていますというネガティブな印象も与えてしまう。ユーザーはローディング画像を見るとスクロールを止めなくてはならないのかと感じること
ID使っても別に問題ない
CSSでID使うの良くない……どころか、ID使うのはゴミクズカスみたいな風潮で辛い。その根拠はいくつかあり、それらはCSSだけをただそのまま書く場合には納得出来ないこともないかなーと思うので余計に辛い。特にOOCSSのようなアプローチではIDは混ぜるな危険。だからといってIDを使わないのがベスト・プラクティスなわけじゃない。 CSS Lintの利用が広まり、これがID使うなって怒るのも原因の一端な気がする。Disallow IDs in selectorsではIDの問題点として以下のようなものを取り上げている。 However, IDs have a downside: they are completely unique and therefore cannot be reused. つまりユニークなため再利用できないというマイナスの面がある、と。確かに再利用できない。でもこれはマイナス
HTMLにおけるimg要素のalt属性
HTML Standardの4.8.1.1 Requirements for providing text to act as an alternative for imagesをざっと把握できるように日本語で箇条書きにしただけのものです。最終的には原文をしっかりと読むべきでしょう。 基本 必ず定義されるべきである その値は空であってはならない その画像に代わりになる最適な文字列である ページ上の全ての画像をそのalt属性の値で置き換えてもページの意味合いが変わってはならない 画像のキャプションや題名、銘とみなされるような補助的な説明を意味するものであってはならない 前後で解説されている情報の繰り返しであってはならない 画像以外に何も含まれていないリンクやボタンで使われる場合 リンクやボタンの目的を明確に伝える文字列を指定する わかりやすく説明するために文章ではなく画像のチャートやグラフを
Hail2u
Hail2uは、幅広い話題の記事や、おすすめのウェブページ、読んだ本などを公開している、ながしまきょう(hail2u)の個人ウェブサイトです。CSSや、HTML、ウェブ標準についての話題が多く、JavaScriptやサーバーサイドの話がそれに続きます。近年は特に話題を限定せずにいろいろ書いています。 最近の雑多な記録 3か月ごとの定期リリースでvim-css3-syntaxのv2.4.0を出した。 松岡美術館にモディリアーニなどの所蔵品が出てくる展覧会を見に行く。 マイナー番号が上がり、いろいろ変わったが、雰囲気は変わっていない。 GitHubにはブランチActivityという機能があり、そこでは強制プッシュなどで見えなくなったコミットのハッシュも見つかるようだ。 2023年の12月に行った展覧会の後期を見に、再びWHAT MUSEUMへ行く。 よくよく考えたつもりでESRのMagSafe
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
