Show Menu
トピック×

デザインとデザイナー

この記事では、従来のUIを基にしてWebサイトを作成する方法について説明します。 アドビでは、 AEM Sites の開発の手引き で詳しく説明しているように、Web サイトに最新の AEM テクノロジーを利用することをお勧めします。
Web サイト用に、また AEM で、デザインの作成が必要になります。その場合はデザイナーを使用します。
Web アクセシビリティについて詳しくは、 AEM と Web アクセシビリティのガイドライン を参照してください。

デザイナーの使用

Your design can be defined in the designs section of the Tools tab:
ここで、デザインの格納に必要な構造を作成し、必要なカスケーディングスタイルシート(CSS)および画像をアップロードできます。
デザインは、に保存されま /etc/designs す。 Webサイトに使用するデザインのパスは、ノードのプロパティを使用し cq:designPath て指定し jcr:content ます。
デザインモードのページ上でおこなわれたすべての変更は、サイトのデザインノードの下に保持され、同じデザインを持つすべてのページに自動的に適用されます。

必要なもの

デザインを実現するには、以下が必要です。
CSS — カスケーディングスタイルシートは、ページ上の特定領域の形式を定義します。 画像 — 背景やボタンなどの機能に使用する画像。

Web サイトをデザインする際の考慮事項

When developing a website, it is highly recommended to store images and CSS files under /etc/design/<project> so you can reference your resources based on the current design like described by the following snippet.
<%= currentDesign.getPath() + "/static/img/icon.gif %>

前述の例には、いくつかの利点があります。
  • 別々のデザインパスを使用しているサイトごとに、コンポーネントのルックアンドフィールを変化させることができます。
  • Re-design of the website can be simply done by pointing the design path to a different node at the root of the site from design/v1 to design/v2.
  • /etc/designs とは、 /content ブラウザが外部ユーザを保護しているのを見た唯一の外部URLで、ツリーの下に何があるかを知りたがってい /apps ます。 上記のURLの利点は、アセットの公開をいくつかの異なる場所に制限するので、システム管理者がより高いセキュリティを設定する際にも役立ちます。