tel.0120-622835

営業時間/10:00〜18:00 
定休日/土日祝日

ブログ|アプリコットデザイン
トップページ > ブログ > 初心者のためのデザイン日誌10

BLOG

ブログ

UPDATE:2016.11.10

CATEGORY

初心者のためのデザイン日誌10

初心者のためのデザイン日誌!記念すべき(?)2桁目に突入!

webデザインのレイアウトその2

ウェブ・レイアウトを大きく分けると「グリッド・レイアウトデザイン」と「フリー・レイアウトデザイン」の 2つに分けることができます。

グリッドデザイン

文字や画像、カラムなど一定の規則に従い、格子状にレイアウトして、整然としたイメージの印象が強いレイアウトになります。
%e5%90%8d%e7%a7%b0%e6%9c%aa%e8%a8%ad%e5%ae%9a-1
本来は新聞や雑誌などの印刷物で良く使われているレイアウト手法になります。画像や文章などの構成要素を、各グリッドにきちんと配置することで、マージンを統一して各要素の大きさが多少違っていても、きちんと整列された印象を与えることが可能になります。

〜メリット〜
1 一瞬で多くの情報を見せることができる
2 サムネイル画像などを整列することでクリックがしやすい
3 整列したコンテンツを配置することでサイト全体の統一感が出やすい
4 コンテンツの追加更新が効率的にできる

〜デメリット〜
1 一度に入ってくる情報量が多くなるため、どこから見れば良いのか迷いやすくなる
2 更新頻度高いWEBサイト程、過去に興味のあった記事を見つけにくい
3 全体的な統一感があることにより、コンテンツごとの重要度に差をつけにくい

グリッドデザインのタイプ別があります。


カード型グリッドデザイン

コンテンツをカードを並べたような「カード型グリッドデザイン」。
%e5%90%8d%e7%a7%b0%e6%9c%aa%e8%a8%ad%e5%ae%9a-2

可変グリッドデザイン

ブラウザの幅に合わせてコンテンツの幅や位置を変化させる「可変グリッドデザイン」。
%e5%90%8d%e7%a7%b0%e6%9c%aa%e8%a8%ad%e5%ae%9a-3
きちんと整列されたレイアウトから秩序のような印象を感させるグリットデザイン。ただある程度の規則性の中でイレギュラーなものや、大きさの違うものを配置したりすることで個性を出したり「遊び」を入れることもできます。

次回はフリー・レイアウトデザインについて触れていきたいと思います。

デザインの基礎知識コーナー

毎回箇条書きでお得な情報載せていきたいと思います。

学んだこと①

Webフォント→Webサイト上でフォントを表示するための技術。フォントファイルをWebサーバー上に置きフォントデータを読み込むことで、指定したフォントを表示させることができる。

Happiness in Design

シアワセをデザインする会社

営業ゼロで年間600件以上
お問い合わせをいただいている
ノウハウを惜しみなく。

アプリコットデザインには創業当初から営業マンはいません。
創業当初からWEBを活用することに重点を置いて、これまで試行錯誤してきました。その結果、年間600件以上の問い合わせををこのホームページから得ています。ホームページという集客ツールを提供している私たち自身が、自社のホームページで集客できないのでは、お客様に自信を持ってオススメすることはできません。自社の実験から「WEBを活用して集客するためのノウハウを蓄積」した上で、誰よりもホームページの素晴らしさを知り、自信をもってお客様にご提供していきたいと考えます。

VIEW MORE

CONTACT

お問い合わせ・ご相談は
お気軽にどうぞ。

tel.0120-622835

営業時間/10:00〜18:00 
定休日/土日祝日

プロジェクト

それぞれの
らしさ溢れる日常を。

カフェ、トリミングサロン、ネイルサロン、スクール「tone village(トーンビレッジ)」

カフェ、トリミングサロン、ネイルサロン、スクール「tone village(トーンビレッジ)」

カフェ/トリミングサロン/
ネイルサロン/スクール

2023.6.2(FRI)

GRAND OPEN

採用情報

recruit info

豊かで彩りのある社会をつくる!

私たちは仕事を通して、一人でも多くの人が未来に対する希望を描けるような、そんなワクワクする社会をつくっていきたいと思っています。

VIEW MORE