つくる:公開版完成
人に見せられる状態まで一気に持っていく
この章では、仕上げの磨き、スマホ対応、公開の準備、自分らしさの4つを1つずつ扱ってきました。この回は、その4つを1本の画面にまとめて適用します。ここを抜けると、あなたのアプリは「動くもの」から「人に見せられるもの」に変わります。
動くだけの状態と、公開できる状態のあいだにある差は、じつは細かい項目の積み重ねです。ひとつひとつは3分で終わるのに、抜けていると一目で分かってしまう。だからこそ、思い出しながらやるのではなく、確認する項目を決めておいて、毎回同じ順で潰します。
公開前に見る項目
公開の直前に見る項目は、次のとおりです。
- ページの題名が入っていて、中身がひと目で分かる言葉になっているか
- 文字の種類の宣言が入っていて、日本語が化けないか
- スマホで開いたときに、等倍で表示される宣言が入っているか
- 画面の外周に余白があり、端に文字が張り付いていないか
- 持ち主が分かる要素が1つ入っているか
この5つを、毎回同じ順で確かめます。順番を決めておく理由は、思いつきでやると必ずどれかを飛ばすからです。プロの現場でも、公開前の確認は頭の中ではなく一覧の形で持ちます。
まとめて頼むときのコツ
ここまでの章では「1回1変更」を徹底してきました。仕上げの段階だけは、少し違う頼み方をします。同じ性質の小さな変更は、まとめて番号付きで渡したほうが速く、事故も起きにくいからです。
プレーンテキスト
良い例
公開の準備をしてください。次の4つを入れてください。
1. index.html に title を入れ、「たろうのおこづかい帳」にする
2. index.html に charset を utf-8 で入れる
3. index.html に viewport の指定を入れる
4. style.css で body の外周に余白を 24px 入れるまとめてよい変更と、分けるべき変更の線引きは、次のとおりです。互いに関係しない小さな追加はまとめてよく、画面の構造を作り替えるような変更は1つずつにします。今回はすべて小さな追加なので、まとめて渡せます。
頼んだあとに必ず見る
まとめて頼んだときほど、返ってきた画面の確認が雑になります。4つ頼んだら、4つとも入ったかを1つずつ見てください。番号付きで頼んでおくと、この確認が「1番は入った、2番も入った」という形で機械的にできます。
抜けがあったときは、全部を頼み直すのではなく、抜けた番号だけをもう一度伝えます。「3番の viewport が入っていないようです。追加してください」で通ります。
この回の演習
おこづかい帳を公開版に仕上げます。題名、文字の種類、スマホ表示の宣言、外周の余白、持ち主の名前の5つを入れてください。番号付きの1つの指示にまとめて渡してかまいません。返ってきたら、5つとも入っているかを自分の目で確かめてください。
完成条件
- 小さな追加はまとめて番号付きで頼んでかまいません
- 返ってきたら、頼んだ番号のぶんだけ入っているかを1つずつ確かめます