Tag
30件
HTML
`grid-template-rows`に`transition`が効くのでJS使わずにアコーディオン作ってみた件
背景 / よくある実装方法 / 実装方法 / デモ
クレジットカード情報入力フォームのベストプラクティスを考える
背景 / クレジットカード情報を入力するフォームの仕様 / 適切なマークアップをする / デモ
[HTML] meta http-equiv="X-UA-Compatible"の記述は不要
TL;DR / meta http-equiv="X-UA-Compatible" とは / 今後はどうするのか / 参考 / Footnotes
`<input type="range">`のstepを可変にする方法
仕様 / 完成デモ / 実装 / 参考
[HTML] meta robots の noodp, noydir 定義は SEO として不要
TL;DR / noodp,noydir と歴史 / 今後はどうするのか / Footnotes
[アクセシビリティ] アイコンフォントの要素にaria-labelなどを追加するときの観点
アイコンフォントの前提 / アクセシビリティの目的 / 実装 / 関連
[CSS] ダークモードを有効化しない方法
背景 / 方法 / 参考
[アクセシビリティ] 画像に代替テキスト（alt）を追加するときの観点
概要 / img 要素の alt 属性の入れ方 / Alt 属性決定木 / 実装 / 参考リンク
[HTML] meta keywords の記述は SEO として不要
TL;DR / meta keywords とは / meta keywords と SEO との関係性 / meta keywords を記述したままで良いのか / まとめ / 参考
[HTML] メールアドレス・電話番号などの入力フォームのUXを考える
背景 / 各項目の仕様 / フォームの機能 / 参考
[Google Fonts] 読み込みのパフォーマンスを向上させる方法
display=swap / 読み込みスクリプト / 参考
バックエンドから返却される規定画像要素に対してLazyload（遅延読み込み）をフロントエンドだけで実現させる
Lazyload（遅延読み込み）とは / 実施条件（縛り） / 実装 / 参考
[HTML] <template>要素について
template 要素とは / template 要素の特徴 / 使い方 / その他
IE11などレガシィブラウザを意識したWebP画像の表示方法
WebP とは / 実装方法 / デモ / おわり
[HTML] inputの入力候補をdatalistで実装する方法
対象仕様 / detalist を使う / デモ
CDATAセクションは書く必要があるのか
背景 / そもそも CDATA セクションとは / 現代での CDATA セクションの扱い / まとめ / 参考
阿部寛のホームページをモダン化する
謝辞 / コンセプト / 手法 / 完成
[Firefox] imgの縦横サイズが保たれない場合の対処法
状況 / 対処法 / 参考
[SyntaxHighlight] Google Code PrettifyからPrism.jsに変更した時に気をつけたこと
概要 / Google Code Prettify / Prism / Google Code Prettify から Prism に乗り換え
Bootstrapっぽさをなくす3つの方法
前置き / 方法 / おわり
input[type=file]で選択するファイルを画像のみに制限する方法
HTML5 の accept属性 を使う / JavaScript で選択したファイルをチェックする
[Firefox] リロードしてもチェックボックス等の値が維持されてしまう問題の対処法
サーバサイド / フロントエンド
<b>と<strong>の違い
違い / 参考
[CSS] 究極のIE対策
条件付きコメント / メディアクエリを利用して IE10〜IE11 に対応する
[HTML] title属性内などで改行する方法
コード / サンプル