最初のWeb制作は、小さな紹介ページでいい。練習課題の決め方

News

Web制作を学び始めたあなたへ。
最初の作品で、何ページもあるサイトを作ろうとしていませんか。
トップ、会社概要、サービス、ブログ、問い合わせ。構成を書いただけで、
用意する文章と画像が増えていきます。

最初は、一枚の紹介ページからで大丈夫です。
小さくして、作る・確かめる・直すところまで一巡させます。

課題を小さくする理由があります。

何でも作れると言われると、テーマ、色、写真、文章、配置を同時に決めることになります。
まだ操作にも慣れていない段階では、どこで詰まったのか分からなくなりがちです。

そこで、先に題材と目的を決めます。例えば「架空の植物交換会を紹介し、参加を検討する人が
持ち物を確認できるページ」。練習用の設定です。参加者を実際に集めるための告知ではありません。

この条件なら、交換会の概要、対象になる植物、日時と場所、持ち物、参加方法が候補になります。
おしゃれに見える情報を足す前に、初めて見る人が困らない内容を選べます。

最初に、何のページかを伝えます。次に内容と参加条件を示し、最後に参加方法を置く。
この順番なら、内容を知らない段階で申し込みだけを求めずに済みます。

紙に四つの長方形を描き、「交換会とは」「参加できるもの」「日時と持ち物」「参加方法」と
書いてみてください。まだ色も写真も決めません。順番だけを見て、必要な説明が抜けて
いないかを確かめます。

ここで直せば、作り直す量は小さく済みます。

一枚に収まらないほど説明が増えたら、「今回の目的に必要か」と問い直します。
運営者の詳しい経歴や、植物ごとの長い育て方は、最初の課題では扱わなくても目的を
満たせるかもしれません。

「満足するまで作る」だと、終わりが見えません。
私は、課題を始める前に確認できる形の完成条件を置く方法をすすめます。

– 何の紹介か、冒頭で分かる
– 日時・場所・持ち物を探せる
– 参加方法へのリンクが動く

この三つを満たしたら、
いったん完成です。初回から、動く装飾や複雑な仕掛けを増やす必要はありません。
やってみたいことは、次の課題メモに残しておけば大丈夫です。

完成条件と、身に付けたい操作は分けて考えてください。「文字のサイズを変える」は学ぶ
操作で、「日時を読みやすく示す」はページの目的に沿った確認です。両方を結び付けると、
操作をどこで使うかがはっきりします。

一度作れたら、スマホで見てみます。日時が文章に埋もれているなら、情報のまとまりを作る。
持ち物が見つからないなら、見出しを変える。気になるところを全部直すのではなく、
一箇所を選びます。

変更前の画面を保存し、変更後と比べるのもおすすめです。
良くなったと思った理由を、「見出しで持ち物を探せるようにした」のように一文で書きます。

うまくいかなかった点も、次の課題です。

例えば、余白を広げたら一つの情報が離れて見えた。そんなときは元に戻して、見出しや文章の
区切りから調整します。思い通りにならなかった経験を残せば、調べたい内容が具体的になります。

練習したものを紹介するときは、「架空の設定による自主制作」と明示してください。
依頼を受けた実案件や、利用者の反応があった成果として扱わないことです。

そのうえで、目的、担当した内容、工夫、直した点は説明できます。最初のページで学んだことを、
誇張せずに伝えられます。

一枚を完成させた後、すぐ別のテーマに移らなくても構いません。同じ植物交換会のページを使って、
次はスマホでの配置を見直す、その次は文章を短くする、と課題を変えられます。

題材と目的を固定すると、今回変えた点へ集中できます。前回より何が確認できるようになったかも
比較しやすいです。新しい設定を考える時間を、表示の違いを確かめる時間へ回せます。

ただし、練習を続ける途中で目的まで変わった場合は、その変更をメモしてください。
参加方法を伝えるページから、イベントの記録を見せるページへ変えたなら、必要な情報も変わります。
画面だけ直して、最初の目的が置き去りにならないようにします。

正直、何ページも作った量だけでは、自分が何を理解したかは分かりません。
一枚でも、目的から作り、確認して直し、その理由を話せるか。そこを最初の目標にしてみてください。

今日は、紹介したい題材を一つ選び、「誰に、何を伝える一枚か」を書いてみましょう。
次に、必要な情報を四つのまとまりに分ける。ツールを開くのは、そのメモができてからでも遅く
ありません。