改めて、WEBサイト制作で気を付けること | 長期有給インターン生の日常|株式会社ガーディアン | 初期無料サブスク型のホームページで成果を上げる東京のガーディアン

こんにちは、WEBプログラマコースの池田駿です。

最近パーツ構築の仕事にも慣れてきて、割とスムーズに制作ができるようになってきました。

ここで改めて基本をキッチリと定着させようと思い、

今までアドバイスいただいていたことや、ガーディアンでのルールを纏めておきたいと思います。

1. topやleftで位置を指定しない。フレックスボックスなどの「論理的配置」にする。これがCSSによるデザインの基礎。
2. レスポンシブデザイン。WEBサイトの幅やデバイスが変わっても見やすいように工夫。特にガーディアンが提供するscscのパーツはお客様が好きに配置して編集できることが大事。サイト幅767pxがPCとスマホの境界であり（執筆当時）、この近辺でのサイトの形状は入念にチェックする。
3. widthを変に指定しない。100%にしたうえでmarginやpaddingで対応する。
4. 色はhslaで指定。細かな変更が効くから。
5. 背景を白色で固定するべき時もある。ダークモードなどで見えにくくならないように。
6. 余白感、写真や文字の大きさにもこだわる。それでだいぶWEBサイトの印象が変わるから。
7. クリックできるところにはホバーを絶対つける。押せるのか押せないのか分からないから。
8. 画像を入れるところとアイコン（背景透過の画像）を入れるところを区別する。

大切なことはまだまだ沢山ありますが、私は特にこれらのことを普段強く意識しています。これからも見やすい、そして売り上げにつながるWEBサイトのために制作の腕を磨いていきたいと思います。

それでは！