タグ

ブックマーク / parashuto.com (5)

  • レスポンシブな時代に必要なWebディレクターの7つの心得

    先日、僕の恩師のウェブ制作会社で開催された勉強会で「レスポンシブWebデザインのワークフロー」についてお話させていただいたんですが、その際に「意思決定層との密なコミュニケーションをとり、スムーズに開発を進めていくために、苦労した点や工夫した点」について質問をいただきました。その回答をまとめたので、このブログでも共有したいと思います。今回まとめたものはレスポンシブWebデザインでの制作に特化した内容ではないですが、以下に挙げるようなWebディレクターとしての基礎知識やスキルが、レスポンシブWebデザインのような柔軟な対応を強いられる制作では大切になると感じています。 Question: 意思決定層との密なコミュニケーションをとり、スムーズに開発を進めていくために、苦労した点や工夫した点を教えてください。 Answer: どれもディレクターとして基的な内容になりますが、僕は以下のようなことを

    レスポンシブな時代に必要なWebディレクターの7つの心得
    yoruaki
    yoruaki 2013/05/29
  • CompassとSassの基礎の覚書(インストールとツール編)

    Compassを使えたら便利だろうなぁと思うことが結構増えてきたので、年末に時間をつくって基礎を勉強してみました。僕のような初心者にはとっつきにくいところもあったので、備忘録として基礎をまとめてみました。 目次 そもそもCompassやSassってなに? SassやCompassを使うメリットは? CompassやSassを使うには? コマンドラインツール GUIツール Compassのコマンドラインツールの基的な使い方 Compassの設定ファイル(config.rb)について まとめ 参考 そもそもCompassやSassってなに? SassはSyntactically Awesome StyleSheetの略で、CSSをプログラム言語のように拡張するものです。CSSでは使えない変数や関数のようなものを使えるようにするものです。SASSで書いたものは一度プロセス(コンパイル)してCS

    CompassとSassの基礎の覚書(インストールとツール編)
  • レスポンシブWebの時代だからこそ見直すべき、3つの「ウェブの哲学」 | Rriver

    先日、「A Dao of Web Design」という記事を読んでいて衝撃を受けたので、このブログでもご紹介したいと思います。この「A Dao of Web Design」には、ウェブ制作の歴史と未来が記されています。当時は存在すらしなかった「レスポンシブWebデザイン」やウェブの基理念である「One Web」にも通じる内容です。 この記事が書かれてから12年以上たっていますが、日のウェブ制作を次のステップに進めるためにも、「ウェブの哲学書」とも言えるこの「A Dao of Web Design」が、いま一度、日で見直される必要があると感じています。 いったいどんな記事? 「A Dao of Web Design」は、オーストラリア出身のJohn Allsopp氏が書いた記事で、2000年4月7日にA List Apartに掲載されたものです。John Allsopp氏は、早くからウ

    レスポンシブWebの時代だからこそ見直すべき、3つの「ウェブの哲学」 | Rriver
    yoruaki
    yoruaki 2012/07/21
  • 次世代HTMLの新仕様「レスポンシブ・イメージ(仮)」についてまとめてみた

    レスポンシブWebデザインを実装する際、画像の扱いは一つの課題として残っています。現在、PHPを使用した「Adaptive Images」やJavaScriptを使った「Responsive-Images」などが現実的な対応策としてありますが、どちらもApacheの設定を必要とします。レスポンシブWebデザインが広まって標準的な実装方法の一つになろうとしている今、サーバサイド技術に依存しない解決策が早急に求められています。 そんな中、HTMLの仕様策定の一端を担うWHATWG(Web Hypertext Application Technology Working Group – ワットダブルジーと読む)で、新たな仕様が検討されています。 では、どんな議論がされていて、今どんな状況なのか? なかなか複雑なことになっているようなので、調べてまとめてみました。 ※この記事は、レスポンシブWeb

    次世代HTMLの新仕様「レスポンシブ・イメージ(仮)」についてまとめてみた
    yoruaki
    yoruaki 2012/07/03
  • レスポンシブなデザインにするなら知っておきたい。各ブラウザの小数点以下のピクセル値の扱い

    デザイン要素を固定しないリキッドレイアウトは、未知の端末にも対応するというコンセプトのもとに実装するレスポンシブウェブデザインには必須だと考えています。そのリキッドレイアウトを実装する際に理解しておきたいのが、パーセント値で幅や高さを指定した際に小数点以下になるピクセル値(10.5pxとか9.2pxなど)に対するブラウザの挙動です。 たとえばグリッドシステムを構築する際、計算上はあっているのにブラウザでは思った通りに表示されないといったことが起こります。これは、各ブラウザのサブピクセル(小数点以下のピクセル値)の扱いの挙動差により生まれます。 まずはパーセント指定の基から まずは前提となるパーセント指定の際の計算の基のおさらいから。。。 CSSでパーセント値を使って幅や高さ指定をすると、指定した要素を含む親要素をベースにピクセル値が計算されます。 たとえば100pxの親要素の中にある子

    レスポンシブなデザインにするなら知っておきたい。各ブラウザの小数点以下のピクセル値の扱い
  • 1