黄金比について詳しく解説、レイアウトや構図に効果的に取り入れるデザインテクニックのまとめ
黄金比や黄金螺旋を使い、Webサイト、雑誌や同人誌の表紙、フライヤーなどのレイアウト、コンテンツの配置、余白のとり方、写真の構図、オブジェクトの形のデザインにうまく取り入れるデザインテクニックを紹介します。 以前に1,000ブクマ越えの「黄金比をサイトのデザインに取り入れる簡単な３つの方法」を記事にしましたが、黄金比の取り入れ方もいろいろ進化しています！ What Is The Golden Ratio? 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 黄金比（Golden Ratio）とは 1. 黄金比をレイアウトに使う 2. 黄金比をスペースに使う 3. 黄金比をコンテンツに使う 4. 黄金比を写真の構図に使う 5. 黄金比を形に使う エジプトのピラミッド、ダヴィンチのモナリザ、これらとTwitterやペプシのロゴとの共通点は何で
黄金比とは？基礎・書き方とデザインに活用するときの5つのポイント | LISKUL
黄金比とは、「1:1.618」という比率のことです。 黄金比は、物事のバランスと調和を最適化し、視覚的魅力を引き出すと言われています。 自然界では、貝殻の螺旋形状などがこの比率で形成されており、モナリザなどの美術品や、エッフェル塔などの建造物にも活用されています。 しかし、具体的にはどのようなものなのか、どのようにデザインに取り入れればよいのかわからないという方も多いのではないでしょうか。 そこで本記事では、黄金比の基礎や、歴史、計算方法、身の回りにある例、具体的な活用方法、などの情報を一挙にご紹介します。 黄金比を活用して魅力的なデザインを作成したい方は、ぜひご一読ください。 黄金比とは、1：1.618という比率のこと黄金比とは、「1：1.618」という比率のことで、数学、美術、自然の中で頻繁に見受けられる特別な比です。 この比率は「黄金分割」とも呼ばれ、ある長さを二分割した時、全体と大
CSS3で作るナビゲーション
CSS3で作るタブメニュー 今回は、前回のWEBパーツに続き、これまで紹介してきたCSS3の機能を使ってナビゲーションパーツを作成してみましょう。まずは、図 1のような、タブ型ナビゲーションの作り方を紹介します。タブ画像を並べたようなデザインですが、テキストはWebフォント、グラデーションはlinear-gradient、角丸はborder-radiusで指定し、CSSだけで実装したサンプルになります。 HTMLは以下のようになります。 ［リスト01］HTMLソース（tab01.html） <head> ～中略～ <link href='http://fonts.googleapis.com/css?family=Terminal+Dosis:800' rel='stylesheet' type='text/css' /> <link rel="stylesheet" type="text
CSSシグネチャとは？メリットと実用TIPS – LIQUID BLOG
CSSシグネチャとは、ページのbodyなどにidやclassを設定し、 CSSでページごとのスタイルの切り替えを行う手法です。 シグネチャ（signature）は直訳すると署名、サインの意味です。 最近あまりこの言葉を目にすることがなくなりました（Twitterでは1件もヒットしませんでした・・）が、 便利な手法なので紹介します。 なお、ユーザーがブラウザの「ユーザースタイルシート」を 設定できるようにする手法という意味もあるようですが、 今回は前者について紹介します。 CSSシグネチャの解説 CSSシグネチャを利用すると、トップページとカテゴリページで 一部デザインを変える、ナビゲーションデザインで閲覧中ページが分かるようする、 といったことが、ひとつのCSSで簡単にできます。 ページごとのデザインをひとつのCSSで指定できる ページごとにデザインが変わる要素が、ページ内に複数あっても、
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
