レッスンおつかれさまでした。

本日は、HTML、CSSとデザインに関して行いました。

Webサイトのデザインを行うとき、ゼロから作ろうとせず、既存の様々なWebサイトを参考にすると良いと思います。

プロの作るデザインは何を目立たせたいのか、何を伝えたいのかが明確になっていると思います。

そのために余計な要素は削ぎ落とし、色使いも3色程度におさえます。

何もない余白の空間をうまく使うことも大切になります。

HTMLやCSSの確認は、2本指タップで出るメニューから「要素の詳細を表示」で確認すると便利です。

SafariだけでなくFirefoxやChrome、IEでも同じような機能があります。

「要素の詳細を表示」でボックスサイズ（divタグで囲った部分など）や画像が意図した通りのサイズになっているか確認します。

元の画像サイズの横幅が100pxなのにHTMLやCSSで98pxと指定してしまうと少しぼやけたように見えてしまう場合があります。

柄のある背景画像に文字を重ねると文字が読みにくくなってしまします。

文字を読みやすくするために、文字にフチをつけるのはあまりよろしくありません。

文字を加工するのではなく、文字の読みやすい背景画像を選ぶようにしましょう。

フチ文字は、スーパーの新聞折込チラシによくあるように、安さを売りにするようなものにはよく使いますが、マンションなどの広告には使いません。

あつかう商品や対象によっても、見せ方も変わってきます。