You will need to create a design for your website and in AEM, you do so by using the Designer.
For more information about Web accessibility, see AEM and the Web Accessibility Guidelines.
Your design can be defined in the designs section of the Tools tab:
Here you can create the structure required to store the design, then upload the cascaded style sheets and images required.
Designs are stored under /etc/designs. The path to the design to be used for a website is specified using the cq:designPath property of the jcr:content node.
All the changes that are made on a page in design mode are persisted below the design node of the site and are automatically applied to all pages that have the same design.
To realize your design you will need:
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 %>
Code samples are intended for illustration purposes only.
The preceding example offers severals benefits:
- Components can have a different look/feel based on each site using a different design path.
- 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 and /content are the only external URLs that the browser sees protecting you of an external user getting curious about what is under your /apps tree. The above URL benefits also aid your System Administrator to setup better security because you are limiting the exposure of the assets to a few distinct locations.
Thank you for submitting your feedback.