タイポグラフィック・グリッド作成アプリケーション - lab
http://lab.allianceport.jp/web-typography-app/web_typography/ 私が印刷とウェブのデザインの比較について興味を持ち始めたのは、まだ私が学生だった頃なので、もう 10年近くも前になります。当時、Josef Muler Blockmannの『Grid System』をもとに、ウェブデザインへのグリッドシステムの応用を考えていました。その頃から「メディアによる再現性の違いを理解し、一つの理論をそれぞれに展開する」という考えをベースに、実用的なツールをつくりたいと思っていました。 グラフィックデザインには、グリッド・システムというデザイン手法が存在します。グリッドシステムとは、書籍デザインにおいて、全ページを同じグリッド上で展開することで、ページ全体に統一性を持たせ、レイアウト上の判断を効率的に行うツールとして、全世界のデザイナーに使われ
cssのテクニックなどを学びたい時に見ておきたい12サイト
cssが苦手で嫌いなので 好きになろうと思い、勉強に なりそうなサイトを国内外で 選んで絞ってみました。 同じ思いをしている方とシェア したいと思ったので記事にします。 リファレンスサイトは今回は割愛しました。勉強するなら抑えて当たり前ですしね。国内外合わせて11サイトとおまけが1サイトあります。まずは国内サイトから。 CSS HappyLife 個人的に国内でcssといえばCSS HappyLifeさん思い出します。基本から応用まで幅広く情報を配信。 CSS HappyLife CSS-EBLOG ほぼcss中心に情報を配信してくれています。こちらもかなり勉強になるサイト。サイト自体も見やすいですし、cssで困った時には必ず訪れたいサイトです。 CSS-EBLOG CSS Lecture cssで出来るテクニックを公開してくれています。デモページを用意してくれるのが凄く嬉しい。親切で分か
段組みを実現するCSSレイアウトをオープンソースで·Typogridphy MOONGIFT
プログラマーやSEの方々はWebデザインが苦手だ。私自身、色々勉強はしつつもどうにも好きにはなれない。そのため、極力テンプレート的なものを使って作業するようにしている。デザインを後回しにすると、システムがある程度できた時にはじめることになり、折角乗っている気分を台無しにする恐れがある。 CSSで段組みを実現 最近の流行は960px幅のWebサイトらしい。その大きさに基づいて、印刷レベルでも耐えうるというのがTypogridphyだ。 TypogridphyはCSSテンプレートをオープンソースで公開している（ライセンスは明記されていなかったのでご注意いただきたい）。XHTMLに準拠し、ValidなCSSとなっている。 TypogridphyはPHPファイルと一緒に提供されているが、プログラミングコード部分がないのでHTMLと変わらないようだ。960pxと書かれているが、デモ用のHTMLファイ
[CSS]divもfloatもclearもhackも使用しないで組む3カラムレイアウト | コリス
TJK Designのエントリーから、ヘッダ・フッタ・3カラムのレイアウトをdiv, float, clear, CSS hackを使用しないで実装するスタイルシートの紹介です。 A CSS layout that does not rely on DIV, FLOAT, CLEAR nor structural HACK! 対応ブラウザは、WidnowsがIE5.01, 5.5, 6, 7, Fx0.8, 1.5, 2.0, Op9.0, 9.24、MacがIE5.2, Safari2.0, 3.0, Fx2.0、LinuxがKonqueror, Mozilla、そしてiPhoneとなっています。 仕組みは、簡単に説明するとリストを使用したもので、実装方法は８つのステップで紹介されています。
[CSS]クロスブラウザ対応、高さの異なるカラムを揃えるスタイルシート | コリス
Matthew James Taylorのエントリーから、高さの異なるdivで組んだカラムの高さを揃えるスタイルシートを紹介します。 Equal Height Columns with Cross-Browser CSS & No Hacks demo: 2カラム demo: 3カラム 以前、紹介した「高さの異なるカラムを揃えるスタイルシート」では、ページ内アンカーで要素が消失したり、IEで印刷できないなどの不具合がありましたが、今回紹介するものは、その２つの不具合が無いものとなっています（IE7調べ）。 対応ブラウザは、IE5.5, 6, 7, Fx1.5, 2, 3, Op8, 9, Safari, Google Chromeなどほとんどのものに対応しています。 仕組みはカラムごとにdivを用意し、それぞれをずらして配置します。 下記は、そのイメージです。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
スチーム速報 ＶＩＰ
IDEA * IDEA
CSSによる段組（マルチカラム）レイアウト講座