Feuille de route : Détermination des exigences de conception à partir d'un prototype HTML

Les architectes d'informations transforment en exigences techniques les prototypes de conception transmis par les agences de conception. Affichez des exemples de prototype HTML pour une page d'accueil et des pages d'arrivée. Ensuite, découvrez comment séparer la conception en différents éléments avec des exigences de conception et des considérations d'ordre technique. Les développeurs et les administrateurs utilisent ces exigences techniques pour transformer la conception affichée dans les prototypes HTML en un thème personnalisé, des composants de page, un modèle de page d'arrivée pour le site, etc.

Prototype HTML de page d'accueil

Vous êtes architecte d'informations et vous recevez un prototype HTML de conception pour une nouvelle page d'accueil. A partir de la conception, vous affichez plusieurs éléments de conception qui doivent être développés afin de permettre à un créateur de contenu de créer la nouvelle page d'accueil.

Certains de ces éléments de conception sont contrôlés par le thème. D'autres éléments de la conception, tels que les composants de page, sont développés dans votre bibliothèque de contenu Web et sont développés pour permettre aux créateurs de contenu d'ajouter la page avec le gestionnaire de site.

1 En-tête avec logo de société et navigation
Le thème contrôle l'en-tête, le logo d'une société et une navigation. Pour créer un nouveau thème, le développeur de thème peut créer une copie du thème du thème simple dans le gestionnaire de thème.
Vous pouvez définir le thème pour la page racine du site.
2 Bannière avec image et texte
  • Un créateur de contenu ajoute une bannière à la page en sélectionnant un composant de page de bannière prédéfini à partir de la palette de composant de page.
  • En tant que développeur, vous devez d'abord générer un composant de page de bannière en utilisant la fonction de génération de l'application de création de contenu Web.
3 Texte promotionnel
  • Un créateur de contenu ajoute un texte promotionnel à la page en sélectionnant un composant de page de texte promotionnel prédéfini à partir de la palette de composant de page.
  • En tant que développeur, vous devez d'abord générer un composant de page de texte promotionnel à partir d'un type de modèle d'annonce en utilisant la fonction de génération de l'application de création de contenu Web. Vous pouvez ensuite personnaliser le style de votre texte. Par exemple, vous pouvez spécifier les paramètres font-size, font-weight, etc. pour établir une correspondance avec le prototype HTML.
4 Référence d'objet de contenu
  • Mettez en évidence un objet de contenu sur la page d'arrivée Produits à partir de votre page d'accueil. Un créateur de contenu peut utiliser le gestionnaire de site pour ajouter une référence à un objet de contenu qui est stocké sur la page Contenu masquée de la page d'arrivée Produits pour présenter une nouvelle édition de produit. La page d'arrivée Produits est une page enfant de la page d'accueil du site.
5 Annonce qui vous amène directement sur la page d'arrivée Produits
  • Un créateur de contenu peut ajouter une navigation de site à la page en sélectionnant un composant de page d'annonce prédéfini à partir de la palette de composant de page qui établit un lien avec la page d'arrivée Produits sur le site. La page d'arrivée Produits est une page enfant de la page d'accueil du site.
  • En tant que développeur, vous devez d'abord générer un composant de page d'annonce en utilisant la fonction de génération de l'application de création de contenu Web. Vous pouvez ensuite personnaliser l'annonce que vous générez. Par exemple, vous pouvez personnaliser le bouton qui vous relie à la page Evénements afin d'établir une correspondance avec la conception qui est affichée dans le prototype HTML.
6 Référence d'objet de contenu
  • Mettez en évidence un objet de contenu sur la page d'arrivée Evénements à partir de votre page d'accueil. Un créateur de contenu peut utiliser le gestionnaire de site pour ajouter une référence à un objet de contenu qui est stocké sur la page Contenu masquée de la page d'arrivée Evénements pour présenter le dernier événement. La page d'arrivée Evénements est une page enfant de la page d'accueil du site.
7 Annonce qui vous amène directement sur la page d'arrivée Evénements
  • Un créateur de contenu peut ajouter une navigation de site à la page d'accueil en sélectionnant un composant de page d'annonce prédéfini à partir de la palette de composant de page qui établit un lien avec la page d'arrivée Evénements sur le site. La page d'arrivée Evénements est une page enfant de la page d'accueil du site.
  • En tant que développeur, vous devez d'abord générer un composant de page d'annonce en utilisant la fonction de génération de l'application de création de contenu Web. Vous pouvez ensuite personnaliser l'annonce que vous générez. Par exemple, vous pouvez personnaliser le bouton qui vous relie à la page Evénements afin d'établir une correspondance avec la conception qui est affichée dans le prototype HTML.
8 Deuxième texte promotionnel
  • Un créateur de contenu ajoute un texte promotionnel à la page en sélectionnant un composant de page de texte promotionnel prédéfini à partir de la palette de composant de page.
  • En tant que développeur, vous devez d'abord générer un composant de page de texte promotionnel à partir d'un type de modèle d'annonce en utilisant la fonction de génération de l'application de création de contenu Web. Vous pouvez ensuite personnaliser le style de votre texte. Par exemple, vous pouvez spécifier les paramètres font-size, font-weight, etc. pour établir une correspondance avec le prototype HTML.
9 Application d'inscription
  • Un créateur de contenu ajoute une application d'inscription à la page en sélectionnant un Script Portlet prédéfini à partir de la palette de composant de page.
  • En tant que gestionnaire de site, vous créez un Script Portlet personnalisé qui a été configuré en tant qu'application d'inscription.
10 Pied de page
Le thème contrôle le pied de page. Voir l'élément 1.

Prototype HTML de page d'arrivée

Le prototype HTML de page d'arrivée présente un grand nombre des éléments de conception qui sont inclus dans le prototype HTML de page d'accueil. Le prototype HTML de page d'arrivée contient le même en-tête et le même pied de page que la page d'accueil. Le composant de page de bannière est également utilisé sur les prototypes HTML de page d'arrivée et de page d'accueil. Toutefois, le prototype HTML de page d'arrivée contient un composant de page de liste dynamique qui présente plusieurs objets de contenu. Le prototype HTML de page d'accueil ne nécessite pas le composant de page de liste dynamique.

1 En-tête avec logo de société et navigation
Le thème contrôle l'en-tête, le logo d'une société et une navigation. Pour créer un nouveau thème, le développeur de thème peut créer une copie du thème du thème simple dans le gestionnaire de thème.
Vous pouvez définir le thème pour la page racine du site.
Accédez aux ressources documentaires pour en savoir plus sur l'utilisation du thème simple et du gestionnaire de thème.
2 Bannière avec image et texte
  • Un créateur de contenu ajoute une bannière à la page en sélectionnant un composant de page de bannière prédéfini à partir de la palette de composant de page.
  • En tant que développeur, vous devez d'abord générer un composant de page de bannière en utilisant la fonction de génération de l'application de création de contenu Web.
3 Composant de page de liste dynamique
  • Un créateur de contenu ajoute une liste dynamique à la page d'arrivée en sélectionnant un composant de page de liste dynamique prédéfini à partir de la palette de composant de page.
  • En tant que développeur, vous devez générer un composant de page de liste dynamique en utilisant la fonction de génération de l'application de création de contenu Web. Vous pouvez générer votre point de départ pour votre liste à partir du type de modèle d'annonce. Ensuite, vous pouvez personnaliser votre modèle de création et créer un composant de page de menu pour définir l'ordre de tri de la liste. Enfin, vous pouvez modifier le modèle de présentation généré afin d'utiliser une présentation récapitulative et permettre au créateur de contenu de spécifier le chemin pour rechercher les objets de contenu qui doivent apparaître dans la liste.
4 Pied de page
Le thème contrôle le pied de page. Voir l'élément 1.

Création d'une bibliothèque de conception

Pourquoi et quand exécuter cette tâche

Créez une bibliothèque de conception pour séparer les objets de contenu de conception des objets de contenu Web. Générez vos composants de page et vos modèles de page dans la bibliothèque de conception. Séparer le contenu de conception du contenu Web offre les deux avantages suivants :
  • Vous pouvez contrôler la syndication de vos éléments de conception séparément de votre contenu Web.
  • Vous pouvez empêcher les mises à jour de portail, telles que les correctifs cumulatifs combinés, d'écraser les mises à jour que vous avez apportées à vos éléments de conception.

Procédure

  1. Click the Administration menu icon. Then, click Portal Content > Web Content Libraries.
  2. Créez votre bibliothèque de conception.
    Par exemple, vous pouvez nommer la bibliothèque Greenwheels Design.
  3. Cliquez sur l'icône Définir les autorisations pour ouvrir le panneau Droits d'accès aux ressources.
  4. Cliquez sur l'icône Editer le rôle pour permettre aux ressources suivantes d'éditer le rôle :
    • Collaborateur
    • Editeur
    • Gestionnaire
    • Administrateur
    Ajoutez les utilisateurs et groupes appropriés aux rôles afin de leur accorder des droits d'accès.
  5. Click the Applications menu icon. Then, click Content > Web Content Authoring.
  6. Cliquez sur Préférences > Configurer.
  7. Développez Sélection de bibliothèque.
  8. Ajoutez votre bibliothèque de conception à la liste Bibliothèques sélectionnées.
  9. Cliquez sur OK.