イベントページをシンプルにコーディングする

さて、今回は「イベント」ページをコーディングします。ここは切り出す画像もないのでさくっと作成します。

170119_img_01

これまでのページと同様に、雛形を複製して「event.html」に変更したら、contents内をdivで囲んでCSSを記述します。


HTML(event.html)



CSS(style.css)


終了です。早いですねー。シンプルですねー。 もし参加するイベントに特設サイトなどあったら、リンクを貼ってあげると、親切かもしれません。



かならず「target=”blank”」を入れて、別ウィンドウが開くようにしてください。ユーザーはページを「戻る」時に、反射的にページを「閉じる」傾向があります。 同一ウィンドウで特設ページを開くと、一緒に開いていた自分のサイトまで閉じられてしまい

「あれ?今みてたページどこいったんだろう?」のような状態に陥ります。

170119_img_02

ちなみに、閲覧者にとってのホームページの使いやすさの指標を「ユーザビリティー」といいます。どんなに良い情報が載っていても、どんなに素晴らしいイラストが掲載されていても、ホームページが使いづらかったら、その先を読んでもらえません。
本に例えるなら、「カバーが外れやすくて読みづらい」とか「ページがくっついて読めない」とかそんなレベルの問題です。自分のホームページも見直し、「ここちょっと見づらいかも?」と思ったら逐一直して、「読みやすいホームページ」にしていきましょう。

こちらも、イベントへ参加するたびに更新が必要なので、「ホームページを更新する」の回で詳細に説明します。

次はちょっと難しい「作者紹介」のコーディングです。

>>今回作ったページ(イベントページ)

>>サンプルデータをダウンロード(zipファイル)
次のお話 ↓