HTML

スポンサーリンク
HTML

【入門編】リスト構造のセマンティックな使い分け – HTML実践ガイド

「ただの並び」じゃない!HTMLリストタグを正しく使いこなして、Webに「意味」を吹き込もうWeb制作を始めたばかりの頃、こんなふうに思ったことはありませんか?「見た目は全部同じように並んでいるのに、なんでわざわざ `ul` とか `ol`...
HTML

【テクニカル・上級編】olタグのstart属性とreversed属性 – HTML実践ガイド

リストの順序を「DOMの力」で制御する:`start`と`reversed`属性の深淵Webアプリケーションにおいて「リスト」は最も基本的なUIパーツの一つですが、シニアレベルのエンジニアであれば、この単純な `ol` タグが、いかに効率的...
HTML

【実務・中級編】olタグのstart属性とreversed属性 – HTML実践ガイド

HTMLの「リスト」を極める:`ol`タグの`start`と`reversed`で魅せる順序の美学フロントエンドエンジニアの皆さん、こんにちは。普段、マークアップをする際、「順序付きリスト」といえば何気なく `ol` と `li` を並べて...
HTML

【入門編】olタグのstart属性とreversed属性 – HTML実践ガイド

こんにちは!フロントエンドの世界へようこそ。HTMLを学び始めると、必ず出会うのが「リスト」ですよね。スーパーの買い物リストや、手順書のように「1, 2, 3…」と並ぶ番号付きリスト。今回は、その番号付きリストである `` タグをもっと自由...
HTML

【テクニカル・上級編】大規模リストのパフォーマンス最適化(仮想スクロール) – HTML実践ガイド

DOMは裏切る:数千件のリストを「正しく」捌く仮想スクロールの極意Webアプリケーションが成熟するにつれ、私たちは「無限のデータ」を扱うという残酷な現実に直面します。APIから返ってきた5,000件のユーザーリストを、そのまま `map` ...
HTML

【実務・中級編】大規模リストのパフォーマンス最適化(仮想スクロール) – HTML実践ガイド

数千件のリストをDOMで溺れさせない:仮想スクロール(Windowing)の真髄フロントエンド開発の現場で、「リストアイテムが数千件ある」という要件を聞いたとき、皆さんはどう感じますか?正直、冷や汗が出ませんか?初心者が真っ先にやるのは、単...
HTML

【入門編】大規模リストのパフォーマンス最適化(仮想スクロール) – HTML実践ガイド

こんにちは!フロントエンドの現場で日々コードと格闘しているエンジニアです。Webサイトを作っていると、「リストの中に数千件のデータを表示したい!」という場面に出くわすことがありますよね。例えば、膨大な商品リストや、過去のメッセージ履歴などで...
HTML

【テクニカル・上級編】記述リスト(dl)のレイアウトパターン – HTML実践ガイド

記述リスト(dl)の再評価:Flexbox/Gridで紐解くCSSアーキテクチャの極意多くのフロントエンドエンジニアにとって、``(Description List)は「なんとなく意味論的に正しいから使う」という、お守りのような存在かもしれ...
HTML

【実務・中級編】記述リスト(dl)のレイアウトパターン – HTML実践ガイド

記述リスト `` を「ただの装飾」で終わらせない。モダンCSSで操るレイアウトの正解現場でコードレビューをしていると、未だに「用語と説明」を表現するのに `` や `` を使って力技で整えているケースに出くわします。HTMLのセマンティクス...
HTML

【入門編】記述リスト(dl)のレイアウトパターン – HTML実践ガイド

こんにちは!Web制作の世界へようこそ。コードを書いていると、「これ、どうやって並べるのが一番きれいかな?」と悩む場面、たくさんありますよね。特に、HTMLの「リスト」と聞くと、``や``を思い浮かべる方が多いと思いますが、実は現場でめちゃ...
スポンサーリンク