こんにちは
WebデザイナーのAyanaです
初めましての方はこちらから >> 自己紹介
昨日は、Webデザインの基礎
『Webデザイン4大原則の近接』
についてお届けしました！
まだ見ていない方は、
『近接』についてはこちら >> 『近接について』
今日は、
『整列』について説明していきます！
デザインはセンスで制作するのではなく、
ルールに沿って制作して行きます
『Webデザイン４大原則』とは？
・近接 (Proximity)
・整列 (Alignment)
・反復 (Repetition)
・コントラスト (Contrast)
今日は一緒に『整列』について
見ていきましょう
②『整列』とは、
要素にルールを持たせてレイアウトすること
上記図の左側は、
要素があちこちに配置されているので、
まとまりがないですよね？
どこを見ていいか分からない状態となっています。
右側は、要素で整列させているので、
見た目も美しいですね
要素が整列しているので、
情報をパッと見た際に受け取りやすいと思います。
関連する要素同士のサイズや色、
フォントや配置がバラバラだと、
何が同じもので何が違うものなのか、
パッと見て理解ができません。
『関連する情報同士はサイズや色を統一』し、
『揃え』を意識してレイアウトすることが大切です。
『近接』で、同じ情報のグループをまとめ、
『整列』で、その情報を伝わりやすい見た目、
配置するイメージです。
『整列』には、
左右のレイアウト配置と
上下のレイアウト配置があります。
左右の整列
・右揃え
・左揃え
・中央揃え
上下の整列
・上揃え
・下揃え
・中央揃え
どの整列でレイアウトをしていくのかで
目に見えないラインができ、
美しいデザインに起き上がってきます
最初は深く考えずに、
上に揃えるのか？
中央に揃えるのか？
といった具合で大丈夫です！！
基礎は最初、学んだからと言って、
アウトプットをしていかないと
覚えることができないので、
それぞれのペースでしっかりと
基礎を体に覚えさせて行きましょう！
今回の図は『中央揃え』となります。
目に見えないラインが
真ん中に軸を置いている状態ですね
今日は、Webデザイン4大原則の
『整列』について説明しました。
ぜひ、知識を取り入れて
今すぐあなたのブログのバナーを
作ってみてくださいね
明日は、『反復』について
説明します
もしあなたが、デザインに興味があるけど、
こんなお悩みがあるなら、
お金に対する悩みが多い
もっと自分のために時間を自由に使いたい
未来への不安で毎日考えてしまう
海外や旅行にいつでも好きなときに
行けるようになりたい
手に職をつけたい
デザインをやってみたいけど自信がない
自分らしく生きたい
例：
WEBデザイナーに興味はあるけど、
自分にできるかどうか不安。
まずは、何から始めたらいいの？
など、想っていることを気軽にメッセージくださいね！
公式LINEでは個別のやりとりができますよ
↓↓↓
Ayana