ルートとメタデータ（html, head, meta, OGP）

Webサイトを「アプリ」に変える魔法のひとこと。『meta application-name』の秘密こんにちは！Web制作の世界へようこそ。HTMLを学び始めると、``タグの中に並ぶ不思議な呪文のようなコードたちに、「これって何のためにある...

viewportの深淵：`user-scalable=no` という「悪魔の誘惑」と、モダンWebにおける最適解フロントエンドの世界において、`` はあまりに平凡で、誰もが一番最初にコピペする「おまじない」のような存在だ。しかし、Webアプ...

「とりあえずコピペ」から卒業する。Viewport制御の深淵と、UXを損なわないための最適解フロントエンドエンジニアとして数年現場を歩いていると、誰もが一度は「スマホでピンチズームができないようにしたい」「意図しないレイアウト崩れを防ぎたい...

スマホで見ると文字が小さすぎる…！「viewport」を制して、Webサイトを思い通りに操ろうWebサイトを作っていて、「PCで見るとバッチリなのに、スマホで見るとやたら文字が小さかったり、画面がスカスカだったりする……」なんて経験、ありま...

魔法の杖ではないDNS Prefetch：モダンWebにおける「先読み」の最適解と解像度フロントエンドの最適化において、私たちはしばしば「速さ」という抽象的な指標を追い求めます。しかし、ネットワークのレイテンシという物理的な壁を前にしたとき...

DNSルックアップの「待ち時間」を削り取れ：`dns-prefetch` を使いこなす現場の知恵フロントエンドのパフォーマンスチューニングにおいて、私たちはつい「JSのバンドルサイズ」や「画像フォーマット」といった目に見える改善に注力しがち...

「あのサイト、表示が速い！」の秘密。`dns-prefetch`でWebサイトをスマートに高速化しようWebサイトを作っていると、「もっとサクサク動くようにしたい」「読み込みの待ち時間を減らしたい」という悩み、必ずぶつかりますよね。今日は、...

プリロードの深淵：`link rel="preload"` でレンダリングのボトルネックを物理的に破壊するWebフロントエンドにおいて「パフォーマンス」という言葉は、しばしば「なんとなく速くする」という曖昧なニュアンスで語られがちです。しか...

レンダリングの「ボトルネック」を先回りして潰す：`rel="preload"` 実践ガイドWebサイトのパフォーマンスチューニングにおいて、多くのエンジニアが「画像圧縮」や「JSのバンドルサイズ削減」に血眼になります。もちろんそれらも重要で...

「表示が遅い！」を解決する魔法の杖。`link rel="preload"` でリソースを賢く先取りしようWebサイトを作っていて、「あれ、画像や文字が少し遅れて表示されるな」と感じたことはありませんか？ ブラウザは、Webサイトを表示する...