8

私は Web 開発者ですが、自分のプロジェクトで、フロントエンドの設計が得意でないことが私の最大の弱点であることに気付きました。他のデザイナーに頼るのは、彼らが私が望むほど迅速に制作できない場合に迷惑になる可能性があります.

HTML/CSS に関する私の見解は、基本的には驚くほど機能する大きなハックであるということです。CSS やブラウザー固有のバグやクセが多すぎて、すべてを解き明かそうと膨大な時間を費やさずにすべてを学習して覚えることはできません。CSS を頭の中に入れるための近道はありますか? 私はいくつかの CSS の本を見てきましたが、IE6 で物事を正しくレンダリングする方法と角を丸くする方法の長いリストを実際に読んでいます。(まじめな話、鋭い角を曲がるのにこれほど多くのトリックが必要になるのはなぜですか? Web 以外のプラットフォームでは、これは重大な見落としと呼ばれます。)

jQuery が JavaScript に対して行う CSS に類似するものは存在しますか? jQuery を使用すると、機能するものを作成するために JavaScript をよく知る必要はありません。

私は IE6 が奇妙な方法で動作する理由を知ることに興味はありません。私は、あいまいなブログを読むのに何時間も費やすことなく、CSS を使用してやりたいことを行う方法を学ぶ方法にもっと興味があります。

4

6 に答える 6

5

鉛筆と紙でアイデアをスケッチし (三角形や六角形ではなく、箱で考えてください)、小さな部分をすべて分解して、それぞれのやり方を学びましょう。大きすぎて分解できない問題はありません。そして、いつものように、TMTOWTDI!

例を見つけてそこから学びましょう。少なくとも私はそうやって学び始めました。使用されているスタイルを調べて、それらをいじってみましょう。気に入ったものを見つけたら、モックアップを作成して遊んでみましょう。次に、ブラウザ間の互換性をテストします。

何かが Firefox と Chrome では機能するのに IE では機能しないためにイライラした場合 (これはよく起こります)、あきらめないでください。ビル・ゲイツの名前をののしることは、彼が代弁するすべてが素晴らしいストレス解消法だと思います。:-)

私が好んで使用する優れたツールはFirebugです。これは Firefox 用のプラグインで、他の多くの機能の中でも特に、ブラウザー内で CSS ルールを編集し、実行するとすぐに結果を確認できます。

CSS が Web デザインの世界では後付けのようなものだったことには同意しますが、これはまったくの発明であり、物事を非常に簡単かつ迅速に開発できるようにします。

于 2009-12-24T22:35:43.560 に答える
4

はい、「CSS の jQuery」である CSS フレームワークがあります。より一般的なものには、960やBlueprintなどがあります。私は個人的に 960 を使用しており、レイアウトから多くの当て推量が必要になることがわかりました。

他の人が言っているように、CSS は読んで学ぶのは難しいです。最終的には、多くの経験を通じて本能を開発する必要があるものの1つになります（通常、多くの試行錯誤、欲求不満を意味します）. あなたが強調したように、それは理想的な状況ではありませんが、それが現実です。

もう 1 つの問題は、採用されている方法論やワークフローが個人間で実際に異なる可能性があることです。最初に Photoshop でモックアップを作成し、次に HTML/CSS を使用して正確なピクセル単位の「レンダリング」を作成する人もいます。他の人は、Photoshop、Illustrator、または別のツールを使用して単純にスケッチしてアイデアを出し、それを HTML/CSS でゼロから再作成します。さらに、HTML/CSS といくつかのサムネイル スケッチから直接始めることを好む人もいます。これらの方法のどれがあなたに最も適しているかを理解することは、パズルのさらに重要なピースです.

于 2009-12-24T21:53:07.477 に答える
2

かなりの時間と練習が必要です。しかし、HTML をクリーンで単純なままにしておくと、多くの問題を回避できます。以下に、私が役に立ったと考えることができるいくつかのルールを示します。

  • HTML ページで DOCTYPE を使用し、ルールが最も緩いトランジショナルから始めて、HTML を検証します。ページを quirks モードではなく標準モードにしておくと、全体的に問題が大幅に少なくなります。
  • 早い段階でサポートするブラウザーを選択し、論理的な順序でサポートします。私にとっては、Firefox で開発してから、Chrome / Safari で確実に動作するようにします。IE は特別な種類のコメントを使用して、IE にのみ表示される html を挿入できます。それを使用して IE7 のスタイルシートを追加し、次に IE6 を使用してスタイルをオーバーライドし、これらのブラウザーでの表示の問題を修正します。通常は、最初に最適なブラウザーから始めて、逆方向に作業する必要があります。
  • パディングには注意してください。これは、私が扱った中で最も問題のあるプロパティの 1 つです。可能であれば、パディングの代わりに余白のある小さなサブコンテナ要素を使用することを選択してください。より多くのマークアップですが、マージンはすべてのブラウザーでより適切に処理されます。
  • 相対位置要素内の絶対位置要素。これは多くを解決します。要素を相対的に配置すると、通常の流れにとどまります。相対的な親の内部に要素を絶対配置すると、絶対アイテムは親の位置を参照して機能します。
于 2009-12-24T22:42:16.040 に答える
1

グラフィックデザインのクラスをいくつか受講してください。どんなプログラミング言語でもあなたを芸術家にすることはできず、優れたユーザー インターフェイスの設計には芸術性が必要です。

[または、一緒に仕事をするより良いグラフィック デザイナーを見つけることができます]

于 2009-12-25T01:06:35.967 に答える
1

css-discussを購読し、一般的な問題を試して、進捗状況について他の人と話し合ってください。wikiも非常に有用なリソースです。

于 2010-03-25T23:00:51.897 に答える
1

この場合、本はあまり役に立たないと思います。CSS を習得するのは非常に簡単ですが、習得するのは非常に困難です。

私が提案できるのは、あなたが行くにつれて学ぶことだけです..あなたには多くの経験が必要です!

または、IE7、特に IE6 のサポートを中止することもできます。これを行うと、ごくわずかで非常にまれな癖が見つかります:)

于 2009-12-24T21:49:29.563 に答える