ウェブサイトの構造を定義し、開発したら DOM 正確に言えば、そのスタイルを定義することが重要です。これは最もクリエイティブな領域でもあり、Webサイトの最後の隅まで最高の精度でカスタマイズできます。 カスケードスタイルシートが最適なソリューションですが、Web開発の世界に初めて参入するすべての人にとって、最良の結果を達成するために考慮すべきいくつかのヒントがあります。
奉献されたフロントエンドに典型的な専門的な結果を得るには、順序、読みやすさ、このタイプの実践で最も一般的なエラーの修正などの特定の側面を考慮する必要があります。 以下で共有します XNUMXつのヒント 非常に基本的ですが、同時に、CSSスタイルシートの処理と最適な構成にとって非常に重要です。
CSS3スタイルシートで効果的な順序と構造を確立するようにしてください
私は常にスタイルシートを階層順に分割しています。 最初に、私は通常、一般的なセレクターを適用し、次にhtmlセレクターの宣言を追加し、最後にコンテナーとマイナー要素のID内で作業します。 基本的に地面 DOMのロジックに従います 親から始めて子供で終わります。 ただし、別の式や順序に従うこともできます。たとえば、セレクターと宣言をそれらの機能を考慮してグループ化できます。 すべては私たちの好みが何であるか、そして私たちがより快適に働くことをどのように感じるかに依存します。
セレクターごとに明確で簡潔な名前を選択してください
考慮しなければならない非常に重要なことがあります。CSS3では大文字と小文字の使用が異なるため、大文字で単語を書くと、意味が異なり、エラーが発生する可能性があります。 最も簡単なことは、このタイプの問題を回避するために常に小文字を使用することです。 また、試してみてください 明確に認識できるクラスとIDの名前を選択してください そして、彼らは私たちに疑いや誤りを推測させないこと。
明確なコメントを追加することを忘れないでください
確かに、ファイルを他の人、おそらくクライアントや、レイアウトデザイナー、他のデザイナー、開発者などの作業チームの同僚と共有する必要があります。 このため、構造に注意を払い、清潔で整然とした仕上がりを確保することが非常に重要です。 明確なコメントは、スタイルシートにアクセスするすべての人が一目で自分の道をすばやく見つけるのに役立ちます。 考慮しなければならないあらゆる種類の観察 コンテンツとして表示される必要があります。 HtmlファイルとCSSファイルの両方にコンテンツを含めることができ、どちらの場合も、論理的には最終結果に反映されず、同じソースコードにアクセスした場合にのみ表示されるコメントであることに注意してください。非常に役立ちます。
スタイルシートには常にリセットを適用してください
各ブラウザにはデフォルトのスタイルシートがあるため、ページが表示されているブラウザに応じてエラーや変更が発生しないようにするために、非常に便利であり、 スタイルシートをリセットする。 いくつかの選択肢がありますが、EricMeyerのリセットスタイルシートは非常に良いオプションです。
最も効果的なツールを選択してください
あなたのウェブサイトのデザインに取り組むときにできるだけ効率的にするためにあなたが使うことができる多くのツールがあります。 ワイヤーフレームの作成からサイトの構造の開発まで、そして以下を含むあらゆる種類のアプリケーション Adobe Photoshop、Illustrator、またはFireworks。 あなたはまた、最も推奨されるもののXNUMXつである多くのプロの編集者を持っています(少なくとも私が使用するもの) 崇高なテキスト、またはそれが失敗した場合、Adobe Dreamweaver 高度なパーソナリティを備えた非常にシンプルなインターフェイスを提供するだけでなく、ショートカットシステムやオートコンプリートシステムを使用してコードを操作できるため、使用する時間を70%以上節約できます。従来のプレーンテキストの編集者。
アドバイスをありがとう、私はデザインに情熱を持っており、すべてのアドバイスは好評です。 立ち止まるな。
おかげで!