出す前と出したあと

この場面の困り事と、そのまま使えるコード。全12件。 足りなければ、行末のページへ進む。

出す前と出したあとの場面で、最初にどこを見るかの順と、避けること
図を大きく見る

このページの中だけを絞ります。ページは移りません。

検索結果に出るタイトルが決まらない

そのページでしか読めない語を先頭に、サイト名は末尾へ。全角30字あたりで切られる。タイトルの付け方

<title>石窯の焼き上がり時間|つきひ</title>
<!-- 固有の語 → 何が読めるか → サイト名 -->

説明文が全ページ同じになっている

1文目にそのページの答えを置き、ページごとに書き分ける。使い回すと選ぶ材料が消える。説明文の書き方

<meta name="description" content="石窯は朝3時に火を入れ、6時から順に焼き上がります。">

h1 が2本あると言われた

ロゴを h1 にしている。ロゴは p に戻し、h1 は本文の1本にする。段も飛ばさない。見出しと構造

<header><p class="logo"><a href="/">つきひ</a></p></header>
<main><h1>石窯の焼き上がり時間</h1></main>

ページの住所を変えたい

301 で古い住所から新しい住所へ向ける。サイト内の古いリンクも同じ回で書き換える。URLの付け方

# .htaccess
Redirect 301 /info.html /access.html

パンくずを検索結果にも出したい

画面に出ているパンくずと同じ並びを JSON-LD で書く。画面に無い階層は書かない。構造化データ

<script type="application/ld+json">{"@type":"BreadcrumbList", ...}</script>

この画面を検索に出したくない

noindex を付ける。robots.txt で止めると読みに来ないので、noindex が伝わらない。インデックスの制御

<meta name="robots" content="noindex, follow">

公開したのに検索結果に出てこない

noindex・canonical・robots.txt の順に見る。最後に、どこからもリンクされていないかを見る。公開後に確かめる

curl -s https://example.com/access.html | grep -o 'name="robots"[^>]*'

公開前に何を確認するか

リンク切れ・警告・コントラスト・375px・拡大・空の画面・禁止語。一覧はチェックリストにある。公開前チェックリスト

公開前チェックリストで手順を見る

どの数値を守ればよいか一覧で見たい

コントラスト・押せる大きさ・行・余白・折り返し・時間・速度を1ページにまとめてある。数値の早見表

数値の早見表で手順を見る

検索に拾わせたくないページがある

noindex を入れる。逆に、拾わせたいページに noindex が残っていないかも確かめる。公開前チェックリスト

<meta name="robots" content="noindex, nofollow">

更新したのに表示が変わらない

キャッシュが残っている。ファイル名かクエリを変えて配信する。速くする

<link rel="stylesheet" href="style.css?v=20260824">

引き渡した後に崩れると言われる

更新する人が非専門なら、崩れにくい型を選ぶ。規則が単純なデザインスタイルに寄せる。デザインスタイルの選び方

崩れにくい型=余白の刻みが単純なデザインスタイル

デザインスタイルの選び方で手順を見る

この場面で貼れるもの#

答えを読んだら、ここから完成形を持ち帰れます。

この資料は、Webサイトを作るときに引くためのものです。 何のために作ったか。作っているのは AK²Lab。