2

私は Web 会社で働いており、2 つの異なるデザインをテストするメインの Web ページの 1 つで A/B テストを行う予定です。A/B は 2 つの異なるデザイン アプローチを検討します: 異なるアイコン、色、スキームなど、およびレイアウトのわずかな変更です。主な変更点はデザインです (CSS で変更します)。

A/B テストの実行方法を知っていると仮定します。

私の質問は、CSS ファイルをどのように処理するかです。

私のメインCSSは、次のファイルにあります。generalStyles.css.

というファイルを作成する必要がありますgeneralStyles_B.cssか? それはそのファイルの複製でしょうか、generalStyles.cssそれともそのファイルに追加されて、私が変更している CSS ルールを「実行」するだけでしょうか?

Bオプションを選択することにした場合、複製によりgeneralStyles_Bを簡単に使用できるようになります。しかし、コードを簡単に維持するには、複製は間違っているようです。

ありがとう、アロン

4

2 に答える 2

4

これは、A/Bテストをどのように行っているかによって異なります。私が使用する方法は次のとおりです。基本的に、register-a.htmlとregister-b.htmlのような2つの異なるファイルを使用していると仮定します。ページを出力するアプリを使用している場合でも、両方のマークアップを制御する必要があります。また、私はあなたのページのどこかにあなたのコンテンツの周りにdivがあると仮定しています。

最初のページでは、HTMLは次のようになります。

<div id="container" class="register-a">
 <h2>Title</h2>
 <p>Content Goes Here</p>
</div>

2番目のページで、次のようにマークアップしている可能性があります。

<div id="container" class="register-b">
 <h3>Title</h3>
 <p>Content Goes Here</p>
 <div id="registerBox">
  <input />
 </div>
</div>

このために2枚のCSSシートは必要ありません。クラス'register-a'および'register-b'により、視覚的な変更を好きなように行うことができます。私はあなたが実行している現在のCSSシートを使用し、あなたのスタイルに次のようなものを含めます。

div.register-a p {font-size:14px}
div.register-b p {font-size:18px}

これは明らかな視覚的な違いになります。繰り返しになりますが、これはすべて、最初にA / Bテストをどのように行っているか、およびWebサイトでコードがどのように編成されているかに依存します。お役に立てれば。

于 2012-03-12T02:37:18.793 に答える
0

私も提案しますが、特定のページの背景などに変更が加えられた場合、同じ .css をわずかなバリエーションで重複したエントリで使用できます。

たとえば、元の css では、背景は「background.jpg」です。

body.home {
background-image:url('images/background.jpg');
background-color:#444;
background-repeat:no-repeat;
background-attachment:fixed;
background-size: cover;
}

バリエーションでは背景は「background0.jpg」

body.home0 {
background-image:url('images/background0.jpg');
background-color:#444;
background-repeat:no-repeat;
background-attachment:fixed;
background-size: cover;
}

この場合、バリエーション ページは body.home の代わりに body.home0 を参照するだけで、他の書式設定は失われません。

于 2013-07-11T13:08:10.027 に答える