基本操作編 10 / 10 基本 約5分

プレビューと公開|保存と公開は別の操作

「直したのにサイトが変わらない」の原因は、ほぼ公開ボタンの押し忘れです。保存・プレビュー・公開の関係と、公開前に確認すべき項目を整理します。

この教材で学べること

  • 自動保存と公開が別の操作である理由
  • プレビューで確認すべきこと
  • 公開前チェックの最低ライン

作ったものは、公開の操作をして初めて他の人に見えるようになります。編集中の内容は自動で保存されますが、保存と公開は別です。ここを取り違えて「直したのにサイトが変わらない」と悩むケースが非常に多いです。

編集から公開までの流れ

編集から公開までの流れを示した図 編集する 自動で保存される プレビューで確認 実際の見え方をチェック 公開ボタンを押す ここで初めて反映される サイトに反映 誰でも見える状態 「直したのに変わらない」の原因は、ほぼ公開ボタンの押し忘れ
図1:保存(自動)と公開(手動)は別の操作

この仕組みは不便に見えて、実は安全装置です。編集途中の中途半端な状態が、そのまま公開サイトに出ることを防いでいます。作業中でも安心して触れるのは、この分離のおかげです。

プレビューで見るべきこと

エディタ上の見た目と、実際のブラウザでの見え方は完全には一致しません。とくにリンクの動作とフォームは、プレビューでしか確認できません。

確認項目エディタプレビュー
レイアウト・余白確認できる最終確認
リンクの遷移先確認できない実際に押して確認
フォームの送信確認できないテスト送信する
スクロール時の動き限定的実際の挙動が見られる
スマホでの表示幅の切り替えで確認実機で開いて確認

公開前チェックの最低ライン

納品前に、最低でも次の項目は確認してください。ここを飛ばすと、公開後にクライアントから指摘される形になります。

項目確認すること
ページタイトル全ページに設定され、内容が違うか
説明文検索結果に出る説明が入っているか
リンクすべて意図した先に飛ぶか、切れていないか
フォームテスト送信が届くか、自動返信は設定したか
スマホ表示実機で横スクロールが出ないか
ファビコン・OGPタブのアイコン、SNSでの見え方
誤字脱字会社名・電話番号・住所は特に念入りに

基本操作編は以上です。次は最初の大きな壁、第3章 レスポンシブ編に進みます。

まずは1ヶ月間参加してみるplay_arrow