2

私は、賛否両論についての人々の意見、またはブラウザでWebサイトを設計し、PhotoshopやFireworksなどから離れることについてのまったくの「地獄」に興味があります。

私は自分のウェブサイトのリニューアルをデザインし、ブラウザで試してみましたが、振り返っていません。

例（私は12列の960pxグリッドを使用しています）：

<div id="news_section" class="floatleft columntwo spanfourcolumns">
   …content
</div>

<div id="recent_work" class="floatleft columnfour spansevencolumns">
   …content
</div>

デザインが再び楽しくなるだけでなく、グリッドの使用、垂直リズム、黄金比さえもこれまでになく簡単になりました。言うまでもなく、それは設計と静的コーディングの間のギャップを完全になくします。

どう思いますか？

4

11 に答える 11

17

さて、ブラウザを使用して作業を行うことは世界で最悪のことではありませんが、いくつかの「地獄」があります。

1）IEを使用してアプリを設計しないでください。ChromeまたはFireFoxを使用してください。IEの非準拠の動作は、CSSが実際には有効ではないのに有効であると思わせる可能性があります。IEの主な使用例は、IEでサイトをテストすることです。

2）例で行ったように、クラスの外観に名前を付けないでください。

于 2009-01-11T12:45:35.737 に答える
4

しないでください！

もし iDesign Steve がブラウザで直接デザインすることを学べば、

  1. 革新は苦しむでしょう: スティーブは CSS/HTML/その他の制限を気にしません。彼は、人類がまだ見たことのない最も印象的なサイトを自由に提供します。平均的なプログラマーのジョーの義務は、CSS/HTML/その他の制限を押し込んで承認されたデザインを時間内に詰め込むことであり、締め切りの直前にたまたま十分な規模の市場シェアを持っている愚かなブラウザーによってバラバラに引き裂かれるのを見ることです。実際、CSS を書くことは、アセンブリ コードを書くことに似ています。最も基本的なこと (流動的なマルチカラム レイアウトのような人はいますか?) を達成することさえ、途方もなく難しく、しばらくは気分が高揚します。
  2. Steve の冷静さの要因は減少します。私が知っている開発者で、WYSIWYG ツールを使用して HTML/CSS を生成したり、これを受け入れられると考えたりする人は一人もいません。必要なものがテキスト エディターだけの場合、見た目はクールではありません。顧客がスティーブのモニターをちらりと見て、いくつかのウィンドウの代わりにたくさんのテキスト、100 個の小さな面白いアイコン、半分完成したカラフルな下書きを見ると、「私の 7 歳の孫も文字を入力できる。 ..」。
  3. Joe には Steve よりも多くの制約があります。サイトはアクセシブルでなければならず、レイアウトはあらゆる種類の出力に対応できるように流動的でなければならず、javascript でうまく機能しなければなりません... とにかく CSS/HTML が書き直されるのであれば、苦労する意味はありません。

良いチームメイトになって、今すぐ Photoshop を起動してください。ジョーは請求書を支払うために仕事が必要です。

于 2009-01-11T14:13:09.180 に答える
3

最初に（HTML / CSSによって）ブラウザーでページのワイヤーフレームを作成してから、デザインを適用すると言っていますか？それが私がしていることです（そして37Signalsもその考えに従います）。

私の意見では、サイトはすぐに使用でき、見栄えを良くするために時間を無駄にしないため、開発者はPhotoshopに触れずに静的なワイヤーフレームを作成するのが良いと思います。

また、プログラマーとのデザインストリークはあまりない傾向があります-私はそれを太陽の下ですべてのPSコマンドを知っている人々に任せるのが好きです:)

また、レイアウトをすばやく作成するためにYUIGridsCSSフレームワークを使用しています。

于 2009-01-11T12:45:25.330 に答える
2

私のレベルのデザイン能力がない人にとっては、ホワイトボードのスケッチを1つ作成してから、HTMLとCSSに直接変換します。

それでも私のウェブサイトはひどいように見えます...

于 2009-01-11T12:47:04.453 に答える
1

PhotoshopでWebサイトをデザインすることはありません。私は物理的なスケッチからHTMLとCSSに直行します。私はそれがより速いと思います、そしてあなたはあなたが何時間も取り組んできた何か（Photoshopファイル）を捨てることに終わらないでしょう。

于 2009-01-11T12:48:20.503 に答える
1

私はワイヤーフレームにとどまり、紙からブラウザーに直接デザインすることを選択しました。もちろん、それが私の仕事であり、私をよりクリエイティブなデザイナーにしてくれたのです。

私は独自の CSS ライブラリを使用するのが好きですが、Google Blueprintを見て、Web デザイナーの Mark Boulton によるこの記事をチェックしてください。

于 2009-02-26T04:00:51.940 に答える
0

物理的なスケッチを使用すると、デザインの正しい軌道に乗ることができますが、Adobe Illustrator内ではるかに見栄えの良いレイアウトを作成できることがわかりました（Photoshopよりも要素を移動する方がはるかに簡単です）。デザインが完成したら、Photoshopを使用してスライスします。

于 2009-04-03T20:14:38.613 に答える
0

考慮すべき1つの意見は、あなたが誰のために設計しているのかということです。クライアント向けのサイトをデザインしている場合は、フォトショップで簡単なモックアップを作成して、クライアントがレイアウトを把握し、デザインを承認できるようにすることが役立ちます。クライアントがデザインに同意したら、モックアップの要素に合うワイヤーフレームを作成し、モックアップから実際の画像を必要とする要素をつなぎ合わせることができます。

この方法に従うときは、モックアップを実装するために使用できるすべての利用可能な設計要素を考慮し、仕事を成し遂げるだけでなく、適切に設計されたセマンティックな性質でそれらをまとめることを確認する必要があります。

于 2009-04-03T22:49:37.413 に答える
0

コンパス、特にブループリント/セマンティックは、ブラウザーでデザインするときに非常に役立ちます。また、レイアウトとスタイルを別のファイルに保持することも好きです。これにより、ワイヤフレームを 1 か所に保持しながら、気に入らないスタイルをより簡単に破棄できます。また、カラー パレットを使用してフォント スケールに合わせて構成することもお勧めします。どちらも便利で、SASS 変数を使用すると簡単に実現できます。

于 2011-03-12T04:42:42.713 に答える
0

いやいや！

  • テーブルの代わりにクラスを使用するだけで、「すべてのテーブル」の間違いをやり直しています。
  • あなたはプレゼンテーション（これをどこに置くべきか）をコンテンツと混ぜています。あなたのクラスはこれが何であるかを教えず、どこに置くべきかを教えます。
  • あなたのデザインは固定サイズです。ウィンドウのサイズ変更では流れないため、水平スクロールまたは右側に大きな空白が必要になります。

しかし、PhotoShop について言及する人がいる理由がわかりません。これは Web デザインのほぼ最後のツールです。おそらく Illustrator だけが、これに適していない唯一のツールです。

于 2009-01-11T15:42:27.393 に答える