タグ

レイアウトに関するabbey_rita_sadyのブックマーク (7)

  • HTMLの外部ファイル化

  • レイアウトの基本となる画面サイズ色々

    現在標準といわれている表示解像度は、XGA(1024×768ドット)だ。現在の標準的なPCがこの解像度を使っており、比較的古いタイプのPCでもこの程度のサイズをカバーしている。 古いラップトップパソコンを使っているユーザーであれば表示解像度はSVGAの可能性があるが、PCの最小表示サイズVGAモード同様、新型のOSが対応するPCではあまり日常的に使われてはいないと考えてよい。また現在ではSXGA(1280×1024ドット)の解像度も優勢で、WindowsXPやMacOS X世代のOS対応機はこの環境に対応するものがほとんどだ。 サイトのレイアウトに使える標準的なスペースは、ターゲットモニターの表示解像度からこれらを差し引いた大きさ、ということになる。実際のレイアウトサイズの目安には基準があり、最も低い環境に配慮した SVGAサイズなら760×420ピクセルが、標準的なサイズのXGAなら95

    レイアウトの基本となる画面サイズ色々
  • ブログの動線を考えたレイアウト

    Webデザインや配色に役立つ(かもしれない)テクニック、便利なツールを紹介しています。 /*無駄にエロいのは仕様です*/ 01 About 02 Blog 03 Color 04 Design 05 Love 06 etc 駅やコンビニ、デパートなどの建物や、生活のあらゆる場所に人の「動線」を考えたレイアウトがされています。 家も住む人に合わせてリフォームをしたり、部屋を模様替えする時には、居心地がよく使い勝手の良い家具のレイアウトを考えると思います。 サイト内での平均滞在時間は約1分と言われていますが、ごちゃごちゃしていると大抵の場合、ブログから去っていくだけでなく、次の訪問のチャンスも逃してしまうかもしれません。 目的ページまでの動線 レイアウトを決めた後にチェックしたいのは動線です。 目的のページを探しやすくする 訪問者の移動をしやすくする 3クリックまで 「3クリックルール」という

    ブログの動線を考えたレイアウト
  • Mac の人気の秘密は黄金比?

    Webデザインや配色に役立つ(かもしれない)テクニック、便利なツールを紹介しています。 /*無駄にエロいのは仕様です*/ 01 About 02 Blog 03 Color 04 Design 05 Love 06 etc 以前、Mac をオススメするたったひとつの理由 で 「デザインが美しい」としつこいくらいに書きました。Mac の魅力はデザインだけではありませんが、なぜ Mac のデザインは美しいのか、その秘密に迫りたいと思います。 スティーブン・ジョブス氏やデザイナーの方が黄金比を狙ったのかどうかわかりませんが、下の記事を読んで美しさの理由には「黄金比という言葉の持つ力」が関係しているのかもしれないと思いました。 ■Macモニターは黄金比? Macを語ろう!Vol2 Macの黄金比 こちらの記事では、iBook を除くMac の各モデルのモニターは黄金比(1:1.618…)に近い1

    Mac の人気の秘密は黄金比?
  • 美しいレイアウトを計算してくれるツール :: Love & Design ::

    以前 Webデザインと黄金比の関係 でご紹介した、白銀比、黄金比、白金比、第二黄金比を使った美しいレイアウトを計算してくれるツールが、さらに再分割できるようになりパワーアップしました。 電脳狂想曲 レイアウトの小技 使い方と説明 実際に画像を表示しながら分割ができるので、サイドバーや画像の大きさを決めるときや、ロゴやメニューを配置するときに便利です。 【使用例】段組(2カラム)するとき 横幅780px の場合 黄金比:横幅 / 552px / 228px 白銀比:横幅 / 512px / 268px 白金比:横幅 / 571px / 209px 第二黄金比:横幅 / 565px / 215px ↓もしかして黄金比? これまでテキトーに決めていたという方も、Webデザインだけでなく、プレゼンの資料などにも活用できそうなので、ぜひ一度お試しください。 参考記事 「見えない線」に沿ってページをレ

    美しいレイアウトを計算してくれるツール :: Love & Design ::
  • 黄金比によるWebレイアウト - メモログ

    「Balance in Design 美しく見せるデザインの原則」に触発され、「黄金比によるWebレイアウト」を実践してみました。黄金比とは「最も美しい比」と呼ばれている比率で、具体的には5:8(1:1.618...)の縦横比をさします。バランスが良く安定した形で、人工物のみならず自然物にも美しいと感じるものの多くに黄金比が存在するそうです。 さて実践。最初に全体のレイアウトから。縦幅を800pxに想定して、そこから横幅を計算してみました。800pxを長辺とすると、短辺は1.6で割って500px。しかし横幅500pxだとなんとなく狭い感じがしたので、800pxを2で割って、短辺を400pxとした2つの黄金長方形として考えることにしました。400pxを短辺とすると、長辺は1.6をかけて640px。最終的に微調整をして横幅を650pxとしてみました。 次に横幅650pxを5:8に分けて、メイン

  • 世間はまだまだテーブル・レイアウトが主流? | スラド

    kirara(397)曰く、"東京webデザイナー日記で、日経平均銘柄225社サイトの脱テーブル率調査という興味深い報告が掲載されている。同報告では日経平均銘柄225社の全サイトのトップページを調査してあり、レイアウトがCSSかテーブルか、文書型宣言は何か、などが一覧できる。 また、調査結果がグラフにまとめられたレポートがPDFでダウンロードできる。 これは5月18日、銀座で開催されたイベント「CSS Nite」にて発表された資料との事。 PDFを読んでみると、なかなか衝撃的な結果が報告されている。225サイトの調査結果は以下の通り。 「100% pure CSS」なのは28社(12.4%) -->この内「XHTML+CSS」なのは15社(6.6%) 「CSS/テーブル混在(ハイブリッド)」なのは32社(14.2%) 「テーブルのみ」なのは155社(68.9%) 非CSSのうち「100%

  • 1