ASP.NET Webforms開発者とWebデザイナー：対話する方法？
私はASP.NET Webforms開発者であり、デザイナーとやり取りするときにいくつかの問題に直面しています。
デザイナーは常にasp.net server controls。彼らはむしろhtmlファイルを用意し、cssファイルとそれらに必要な画像を作成したいと考えています。設計フェーズが事前に完了している場合、関連するcssファイルを含むhtmlファイルを取得することがありますが、aspxファイルと設計を統合する多くの問題に直面します（テレリックコントロールを制御するサーバーなど）。
私が聞きたいのは：
- これらの問題を解決するにはどうすればよいですか？ .netサーバーコントロールに問題があるため、デザイナーはphp-およびmvc開発者を好みます。デザイナーと正しい方法で対話する方法を知る必要があります。
- .aspxページのレンダリング（htmlページ）をデザイナーに提供するツールまたはアプリケーションはありますか？つまり、Visual Studioのaspxではなく、実行時のページを意味します。彼らはWeb式を使用していますが、レンダリングされたページもHTMLで表示したいと考えています。
ここの元デザイナーはDevになり、私はWebコントロールについても怒りを込めてうめきました。正直なところ、デザイナーが慣例を調整する方がはるかに安価 .NET開発者がGridViewのカスタム実装を掘り下げるよりも、デザイナーがそれぞれTD 'rel'タグ（または何でも）があります。
Arseni Mourzenkoが非常に賢明に指摘したように、Webformsを使用するかどうかの決定は、HTMLの制御の一部を制限すると同時に、コーディングの効率をある程度高める会社の選択です。会社が（デザイナーを喜ばせるためだけにすべきではない）再考する意思がある場合を除き、デザイナーはこの現実を受け入れる必要があります。彼らができることはいくつかあります：
1）何かのIDに応じて停止。これは最初は間違っていたと感じましたが、クラス（そしてもちろん継承）ですべてのスタイルを設定すると、実際にははるかに簡単になりました。まず、セレクターの重みをすべて均等にしました。 CSS継承では、IDはCLASSよりも優先されます。すべてが子またはクラスセレクター、あるいはその両方になることは実際にちょっといいことであり、特異性の順序を理解するのが少し簡単になりました。 JSレイヤーでも同じことですが、IDベースのセレクターをクラスベースのセレクターと交換するのに苦労はまったくありませんでした。
2）RadioButtonListsとCheckboxListsが何に変換するかを教えるに加えて、Label = span、Panel = div、およびその他の自明ではないコントロールからHTMLへの要素。 .NETがこれらをHTMLにレンダリングする方法は、私が予想したよりも少し奇妙で、HTMLがこれらのコントロールからどのように出力されるかを知っていれば、画面を作成する方がはるかに簡単でした。
3）デザイナーにASPXで直接行う、生のHTMLではない（！important） 。デザイナーにGridViews、ListViewsなどの基本を教えます。匿名のオブジェクトコレクションをGrid/ListViewコントロールにプッシュするためのコードスニペットを提供します。 CSSを学ぶことができれば、このコードをコピーアンドペーストする方法を学ぶことができます。無料版のVS Web Expressを使用できます。これは、CSSとJSの作業で非常に優れています。これらのダミーWebプロジェクトは、デザイナーにいくつかのコントロールを入力する機会を与え、次にソースを表示してそれらがどのようにレンダリングされるかを確認します。
4）。NETでのFORMタグの使用方法を説明してください。これについては以前は忘れていましたが、デザイナーが慣れなければならないもう1つのことは、通常、単一のFORMタグがページ全体をラップすることです。これはフォームコントロールの動作を変更し、本当に奇妙な副作用なしにFORMタグをネストすることはできません。デザイナーがこれを理解していることを確認してください。そうしないと、フォームHTMLがWebFormに組み込むのが悪夢になります。
5）テーマとスキンに近づかない。 .NETフレームワークには、アプリケーション全体のスタイルコントロールを支援するこれらのツールがありますが、通常のWebデザイナには不格好で奇妙であり、自分の時間に見合うだけの価値があるとは思いませんでした。これらは、CSSに精通していない開発者にとっては素晴らしいツールのように見えますが、設計者を遅くするだけです。デザイナーが自然環境（htmlおよびcssファイル）で作業できるようにすると、デザイナーはより幸せで生産的になります。
6）サイトソリューションで「プロトタイプ」プロジェクトを維持する。開発者が常にコードの対象となるようにするには、設計者に実際のソリューションで偽のWebプロジェクトを作成して、ASPXのみのページを保存し、実際の開発者が触れないようにします。これは、デザイナーが実際のプロジェクトと同じソリューションでプロトタイプを見直して、開発者が行った方法を確認できることを意味します。開発者はいつでもプロトタイプを実行して、作業がデザイナーの意図と一致することを確認できます。
最後に、開発者を再トレーニングする準備ができている場合を除き、MVCに変換するための苦情に抵抗します。私は個人的にMVCが大好きですが、WebFormsの知識が豊富なチームがある場合は、理由もなく捨てないでください。アプリケーションでViewStateの問題、SEOの問題、またはアクセシビリティの問題が発生している場合は、MVCを厳密に調べてください。ただし、MVCでWebForms開発者をトレーニングするには、デザイナーにWebコントロールの使用方法をトレーニングするよりも多くの時間がかかります。
結局のところ、私が自分でWebFormsで作業することができなかったデザインはありませんでした。たとえそれを理解する前に、そのGridViewに1時間ほど誓ったとしても。
.aspxページのレンダリング（htmlページ）をデザイナーに提供するツールまたはアプリケーションはありますか？
式を忘れる（私はそれが好きではなかった）。 Visual Studio（Web Developer Express）の無料バージョンを入手してください。それはあなたが持っているあらゆるソース管理ソリューションにフックすることができます、そしてそれはデザイナーが彼らのASPXページを走らせそしてブラウザでレンダリングされたHTMLを見ることを可能にします。 CSSとJSツールは以前よりもはるかに優れており、Web Essentialsなどの拡張機能に組み込まれた素晴らしいツールがいくつかあります。 VSインターフェースで、CSSルールをベンダー固有のすべての偏差、カラーピッカー、およびパレットに1クリックで変換し、CSSファイルに画像を1クリックで埋め込む、「LESS」CSS変換（CSSで「コーディング」できます）、 F12 JavaScriptの「ナビゲート」に加えて、本当のインテリジェンスなど。以前のバージョンのVisual StudioはCSS/JSを二流市民として扱っていたため、FYIとデザイナーにとっては今やその宝庫です。
問題の解決策はありますが、これにはMVPへの設計パターンの変更が含まれます。これは時間の先行投資であり、開始前に真剣に検討する必要があります。
基本的に、発生している問題は新しいものではありません。つまり、ビューがサポートするデータモデルを識別するインターフェイスを通じて、ビューの抽象化を導入する必要があります。
これは非常に包括的なトピックであり、パターンを人生の例として見るのは理にかなっています。この例は、あなたのケース- MVPパターンを使用したより良いWebフォーム にかなり参考になります。
編集：上記の提案の場合コストが高すぎる（時間とリソースの点で）従うには、私は間違いなくアドバイスしますデザイナーとより密接に協力する =。チーム内で問題を伝えるがあなた（設計者と開発者）の仕事の障害を解決するのに大いに役立つと私は信じています。これはチーム作業であり、作業を実行するためのすべての障害を取り除くための問題の適切なコラボレーションはチームとしてプロジェクトで成功する方法！です。これは私たちのプロジェクトで行うことです。
ASP.NETは、生成されたHTMLコードを抽象化するフレームワークです。これは、ASP.NETコントロールによって生成されるものを書き換えるための十分な予算がない限り、ASP.NETアプリケーションで特定のHTMLコードを正確に再現するように求められることはありませんです。
長所と短所を備えたASP.NETコントロールを使用するか、手動HTML（またはASP.NET MVC）に切り替えて、現在のプロジェクトのコストを数千ドル増加させるかは、利害関係者次第です。 。
このコンテキストでHTMLをカスタマイズできないことは、他の場合と同様に制約です。 デザイナーはこの技術的な制約を自分の仕事で考慮する必要があります。ケースは、テキストが正確なフォントで正確なサイズで表示されるべきであるとデザイナーが言う場合と非常に似ています：印刷ではなくWebサポートです。 、つまり、テキストのサイズが異なります。
ツールについては、プレーンHTMLをASP.NETテンプレートに変換するツールを知りません。特定のテーブルを特定のASP.NETコントロールに変換する必要があるとどのように推測するのでしょうか。
私の最後の仕事で、開発者はアプリケーションをビルドしてデザイナーに渡し、多くのソフトウェアプログラマーが作成しなかったように見せることができました。 :)
このプロセスを最初に開始したとき、開発者と設計者の間には多くのやり取りがありました。彼らは与えられたページを理解していませんでした。ページを動的に構築する場合、天国は禁止します。ここで説明している状況とほとんど同じでした。
私は各デザイナーと一緒に座って、ローカルボックスにWebアプリケーションをインストールする方法を教えました。実行方法とすべてを彼らに示しました。画面にASPコントロールがどのようにレンダリングされるかを説明しました。次に、ブラウザーでそれを開き、firebugを使用して、aspコントロールとレンダリングされたものの間のリンクを確認しました。
これは彼らを大いに助けました。彼らがそれを見て、ボックスで実行し、デザインツールを使用してスタイルを微調整したり、遊んだりできると、彼らの生活はより簡単になりました。
これを行った後、私は開発者とのミーティングを行い、CssClassタグを使用し、スタイルが定義されていることを確認する必要があることを開発者に知らせました。また、画面に表示されているものはすべて、デザイナーが追加できないcssクラスをそれにアタッチする必要があります。
それはプロセスでした。双方がアレンジに慣れるまでには少し時間がかかりました。しかし、それはコミュニケーションの道を開きました。使用されたコントロールについて文句を言う代わりに、デザイナーはさまざまな要素にスタイルを追加するように要求することができました。
したがって、私の提案は、デザイナーと一緒に座って、ページがどのようにレンダリングされるかを彼らに示すことです。 firebugを使用してページを分析し、ページが形成された方法を確認します。
ここでは、開発中のASP.NET WebFormsプロジェクトで作業する必要があるときにデザイナーと一緒に過去に取ったいくつかの便利な方法を示します。
- ローカルにデプロイ：開発者は、ローカルにデプロイされたプロジェクトの中間バージョンを提供します。これは両方に時間を節約します。デザイナーは.aspxを要求しますが、サーバーコードではなく、レンダリングされたHTMLと対話します。このアプローチは、サーバーコードをデザイナーから抽象化します。 HTMLの生成方法や、
javscriptファイルとcssファイルがクライアントに配信される方法を知っている必要はありません。もちろん、これはデザイナーがブラウザーデバッガー/ DOMインスペクターに熟練していることを前提としています。デザイナーは、ブラウザー内でcssの変更をすべて適用し、その後cssファイルに適用できます。 - モデルを提供する：デザイナーがHTMLを使用して作業することをより賢明にするために、サーバーコントロールによってレンダリングされたHTMLのモデルをデザイナーに提供します。彼らは、そのHTMLを好きなように調整し、サーバー側の実装に適用する変更を提案できます。これは、earlyおよびoftenを実行する必要があります。クライアント側の実装が依存するHTML構造で終わり、設計者がその構造の変更を提案する必要があります。
一般に、設計者はサーバー側のコードとのタッチポイントをできるだけ少なくする必要があるため、できるだけデザイナーから離してください。
私自身（多くの場合、バックエンドとフロントエンドの両方の役割で多くの作業を行い、多くの場合一緒に作業を行っています）のハイブリッド開発者として、ASP.NET WebFormsモデルも長年嫌いです...設計の推進力は、Web開発を民主化するための簡単なドラッグアンドドロップ設計ツールを提供することでした（Visual Basicがアプリプログラミングを非CSメジャーにアクセス可能にしたのと同じ方法）。ステートレスな環境（Web）は手利きであり、強制されています（ViewStateがあります。
また、デフォルトではASP.NETがID属性を引き継ぎ、CSS設計者がIDの使用と同じ方法でクラスを使用する必要があるという事実だけで、マークアップ開発とスタイル設定の中心的な原則に違反しています。最も単純なシステムを除いて、コントロールのスタイル設定を悪夢のようなものにする可能性のある、divとネストされたタグの深いスタックで要素を階層化します。
これらのことを考えると、MVCの書き換えはコストまたは時間の制約になると思いますので、パスは簡単なものではありません。
Webアプリケーションを実行する環境をデザイナーに提供して、CSSの変更をリアルタイムで確認できる方法はありますか？ ASP.NET Webフォームでデザイン作業をしているとき、自分のマシンでWebアプリを起動し、CSSを微調整し、ローカルで実行して、アプリにどのように影響するかを確認できることが非常に重要です。
1つのオプションは、デザイナーがワークステーションから実行できるASP.NET開発に特化した仮想マシンをセットアップして、2つのツールセットを混在させる必要がなく、開発者が何かに失敗した場合にスペースは、機能しているイメージからいつでも再ロードできます。
はい、これは、デザイナーがF5キーを押してアプリを実行する方法を学習する必要があることを意味します。 （または、テスト環境でさえ、CSS、JS、および画像があるディレクトリへのFTPへのアクセスを彼らに与えるだけです！）また、彼らに多くのバックエンドコードが表示されることを意味します。 .csファイルまたは.vbファイルを無視するだけで、パニックに陥るのを防ぐことができます...もちろん、分離コードファイルからスタイルを設定するようなことを行わないようにする必要があります。 。（しかし、それはあなたがそれをしないでしょう、それはデータを結びつけて、あまりにも密接に見るので、そうでしょう？）.
サイトが適切に構造化されていて、CSSファイルとJSファイルが区別されていて、マークアップにインラインスタイルがあまり適用されていない場合は、<％％>領域を避けるだけで、ほとんどの作業を完了することができます。一方で、静的なHTML/CSSを動的なアプリで機能するものに変換しようとするときに、デザイナーがあなたが経験しなければならないことに対してもう少し感謝するかもしれません。
あなたは彼らに一緒に話し、お互いのニーズと好みを理解させる必要があります。ソフトウェアやツールでは解決できない「問題」です。どちらのパーティーも喜ばせようとしないでください。うまくいかないでしょう。彼らは妥協する必要があります-それは結婚のようなものです。
1つの方法は、f.exを配置することです。各当事者が理由を説明する機会を得て、彼らが好むものを好むようにするワークショップ。このような状況では、常に良いコミュニケーションが鍵となります。このような集まりは投資と見ることができます。
または、簡単に言うと、問題は技術指向ではなく組織指向であり、そこで解決策を提供する必要があります。
もう1つの選択肢は、給与を引き上げて彼らに黙るように伝えることです（通常は短期的な解決策...）。