Web制作

Web制作のタグが付いた記事です。

31件の記事

WEB制作運用・改善

第31回 記事のFrontmatterチェックを強化する―カテゴリ・連載・タグの設定ミスをビルド前に検出

Cloudflare WorkersのビルドでseriesOrder重複を検出した経験から、FrontmatterをAstro build前に検査する処理を追加。category、subcategory、series、seriesOrder、tagsを既存schemaとtaxonomyで確認し、正常時の219ページ生成まで記録します。

WEB制作デザイン・UI

第30回 タグページをカード表示に変更し関連記事を追加する―検索・並び替えと3件の自動表示

タグ一覧を人気タグとカード型の一覧へ変更し、タグ検索と並び替えを追加。記事末尾には既存Frontmatterから最大3件の関連記事を自動表示し、既存のタグURLやnoindex、連載導線を残したまま動作を確認した記録です。

サイト運用SEO・検索

第6回 Cloudflareのセキュリティヘッダーを設定する―AstroサイトのHTTPレスポンスを見直す

CloudflareのResponse Header Transform RulesとHSTS、Always Use HTTPSを使ってbringain.comのHTTPレスポンスを見直した。Security Headersの評価がFからAに変わるまでと、HTTPが200 OKのままだったつまずきも含めて記録する。

WEB制作デザイン・UI

PCでは問題ないのにスマホで画像表示が止まる―重い画像が与える影響とAstroでの対策

PCでは問題なく読めたページが、スマホでは画像付近で止まったように見えた経験から、重い画像がモバイル表示へ与える影響を確認します。ゆまラボでAstroの画像最適化、srcset、WebP、遅延読み込みを適用した実測も振り返ります。

WEB制作デザイン・UI

見出しアンカーは必要?長い記事の移動・共有で役立つ場面と増やしすぎるデメリット

AstroはMarkdown見出しへ自動でIDを付けるため、追加プラグインなしでもページ内アンカーを使えます。長い技術記事の目次や特定セクション共有で役立つ一方、見出し変更によるURL切れ、UIの増加、固定ヘッダーやコピー機能の注意点もあります。

WEB制作運用・改善

第25回 ゆまラボ専用の404ページを作る―存在しないURLから記事へ戻れる導線を追加

存在しないURLでブラウザ標準の404だけが表示されていたため、Astroの404.astroを追加しました。SiteLayoutを再利用し、トップページ・記事一覧への導線、Cloudflare Workersで404を返す構成、ローカルと公開画面の確認まで記録します。

WEB制作デザイン・UI

第24回 コードブロックにコピーボタンを追加―TOPの連載一覧もカード表示へ変更

記事本文のコードブロックへコピー操作を追加し、TOPページの「連載から読む」を3連載のカード表示へ変更しました。Clipboard APIのフォールバック、複数コードブロック、既存の連載カード再利用まで記録します。

WEB制作運用・改善

第22回 記事一覧の上部にもページナビを追加―10件表示を上下から移動できるようにする

記事一覧、カテゴリ、サブカテゴリ、連載詳細で、一覧末尾だけにあったページナビを上部にも追加しました。上下のナビを共通コンポーネント化し、同じpage・sort状態を使うようにした内容を記録します。

WEB制作運用・改善

第13回 ゆまラボのタグページとフッターを見直す―個別タグをnoindexにして固定ページへの導線を追加

ゆまラボのサイトチェックで気になった個別タグページの扱いとフッターの導線を見直す。タグ機能は残したままnoindexを設定し、お問い合わせ、プライバシーポリシー、免責事項へのリンクを追加した内容を記録します。