Passer au contenu principal
pdf?stylesheet=default
Blackboard Help

Bonne pratique : personnaliser une marque

La création d'une marque personnalisée pour votre établissement est le meilleur moyen de populariser votre logo, vos couleurs et les informations importantes vous concernant auprès de vos utilisateurs. Une marque personnalisée véhicule la personnalité, les opinions, les promesses et les services de votre établissement. Vous pouvez personnaliser votre marque de bien des manières différentes, allant de la plus facile à la plus complexe.

Avant de commencer à personnaliser votre marque, identifiez les objectifs de cette personnalisation et concevez votre approche.

  • Identifiez la portée de la personnalisation et optez pour la méthode la plus appropriée et la plus simple pour y parvenir. Par exemple, il est inutile de créer un thème système personnalisé juste pour ajouter les couleurs et le logo de votre établissement. Essayez plutôt de changer les couleurs et d'ajouter un logo par la Personnalisation de la marque par défaut.
  • Assurez-vous de connaître l'identité de votre établissement afin de vous conformer aux recommandations établies en matière de création de marque et de style.
  • Créez des maquettes lors de la conception d'une page de connexion, d'une page Passerelle et d'un thème de système personnalisés.
  • Planifiez des délais de développement suffisants pour concevoir et tester les thèmes et les palettes personnalisés.
  • Créez un plan pour l'analyse qualité et la maintenance des thèmes de système personnalisés.

File:fr-fr/Learn/Sandbox/fr-fr/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/easy.png Page de connexion et page passerelle personnalisées

Page de connexion personnalisée. La meilleure manière de débuter la personnalisation de votre marque est de personnaliser votre page de connexion. La page de connexion constitue un fichier unique contenant sa propre feuille CSS et la majeure partie du balisage modifiable. Le fait de repenser la page de connexion n'affecte en rien le reste de l'application et la portée de la modification est donc réduite. La création d'une page de connexion personnalisée ne nécessite aucune expérience en HTML et CSS. Il vous faut également déterminer l'emplacement où stocker les images associées. Pour en savoir plus, reportez-vous à la rubrique Personnaliser la page de connexion.

Page Passerelle. La page Passerelle est la toute première page Web que les utilisateurs voient lorsqu'ils accèdent à Blackboard (sauf si ce paramètre a été ignoré). Vous pouvez ajouter une image ou un message de bienvenue personnalisés ainsi que des modules contenant des informations pertinentes et importantes. L'ajout de modules personnalisés nécessite une certaine expérience en HTML et CSS. Pour en savoir plus, reportez-vous aux rubriques Modules et Personnaliser la page passerelle.

Bonnes pratiques pour la conception d'une page de portail

Une page de portail, telle que la page Mon établissement, est souvent la première page que voit un utilisateur lorsqu'il accède à Blackboard Learn. Le fait de concevoir et d'agencer soigneusement le contenu du module sur cette page permet à la fois de mettre votre marque en valeur et d'améliorer l'expérience utilisateur. Suivez les deux étapes générales suivantes pour y parvenir :

  1. Passez en revue l'intégralité du contenu du module afin de vous assurer qu'il ne détonne pas avec la marque nouvellement appliquée. Lors de la conception du contenu du module, essayez de respecter les conventions établies par votre thème et votre palette. Essayez de coder le module en HTML, afin que le texte du module puisse s'accorder avec la couleur et les styles de police définis par votre thème et votre palette. Les modules utilisent parfois une grande image unique (similaire à une publicité d'en-tête sur un site Web) pour véhiculer un message. Les images sont nécessaires à l'animation de la page, mais l'apparence d'une "publicité d'en tête" (comprenant le texte d'en-tête, le texte de paragraphe et des images) risque parfois de détonner avec le thème et la palette utilisés par votre marque. L'utilisation du format HTML assurera la flexibilité de votre module : lorsque vous redimensionnerez la fenêtre du navigateur, le contenu du module le sera également.
  2. Essayez de définir une hiérarchie visuelle, de sorte que l'utilisateur puisse facilement analyser la page et y trouver du contenu concret. Cela est souvent plus facile à dire qu'à faire. Étant donné qu'un portail contient un grand nombre de modules avec des contenus divers, il doit souvent répondre aux besoins de nombreux intervenants internes. Chacun d'eux souhaite parfois mettre l'accent sur ses propres documents. En règle générale, si la même importance est donnée à tous les modules, aucun d'entre eux ne sort du lot, ce qui peut engendrer une certaine confusion chez les utilisateurs. Essayez de considérer la page de manière globale et d'agencer les modules de sorte que les utilisateurs puissent trouver facilement le contenu principal.

Les autres bonnes pratiques s'appliquant à la conception d'une page de portail ne sont pas spécifiques à ce type de page, mais incluent celles que vous avez peut-être déjà prises en compte lorsque vous avez défini l'apparence de votre marque.

Accessibilité

Esthétique

  • Utilisez des couleurs correspondant à votre marque et au thème
  • Types de polices lisibles
  • Utilisez des images haute qualité
  • Disposez les modules afin qu'ils remplissent la page
  • Créez une hiérarchie visuelle pour faciliter la lecture du contenu
  • Évitez toute conception/mise en page surchargée
  • Actualisez régulièrement le contenu de la page
  • Si possible, appliquez des techniques de conception adaptatives afin que la taille de votre contenu s'adapte à différents affichages (http://en.wikipedia.org/wiki/Responsive_web_design)

Conseil

  • Si vous trouvez que vos possibilités sont limitées par la mise en page de module par défaut de Learn, envisagez de modifier la page de portail afin d'utiliser une seule colonne remplie avec un seul module HTML. Vous pouvez modifier l'HTML personnalisé dans le module unique afin de pouvoir utiliser la mise en page que vous souhaitez et reproduire les tendances dans les autres pages d'index.

File:fr-fr/Learn/Sandbox/fr-fr/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/sort-of-easy.png Commandes d'interface graphique

Commandes d'interface graphique. Vous pouvez facilement modifier l'apparence de votre marque en sélectionnant un ensemble de couleurs et les options de mise en page de votre installation Learn. Vous pouvez :

  • Modifier la couleur d'un ensemble limité d'éléments de l'interface utilisateur
  • Indiquer un logo et un lien vers une URL spécifique
  • Sélectionner les options de mise en page et les couleurs de l'onglet Système

Aucune connaissance en HTML ou CSS n'est requise pour effectuer ces modifications. Vous pouvez afficher vos sélections dans le volet d'aperçu avant d'appliquer les modifications à l'ensemble du système. Toutes vos sélections de couleurs peuvent être enregistrées sous la forme d'une palette de couleurs.

File:fr-fr/Learn/Sandbox/fr-fr/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/middle.png Palette de couleurs et thème système

Palette de couleurs. Blackboard Learn offre plus d'une douzaine de palettes de couleurs. Vous pouvez en sélectionner une pour votre marque par défaut. Vous pouvez modifier les couleurs d'une palette à l'aide de l'interface utilisateur ou télécharger la palette et la modifier à l'aide de l'outil d'édition de texte ou d'édition CSS. 

Thème système. Le thème système constitue la couche CSS définissant l'apparence de votre établissement. Vous pouvez sélectionner un thème fourni par Blackboard Learn ou en concevoir un vous-même. La meilleure façon de créer votre propre thème est de télécharger un thème existant afin de l'utiliser comme modèle. Modifiez-le à l'aide de l'outil d'édition de texte ou d'édition CSS. 

File:fr-fr/Learn/Sandbox/fr-fr/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/complex.png Palette de couleurs personnalisée

Palette de couleurs personnalisée. Étendez la personnalisation de votre interface utilisateur en créant votre propre palette de couleurs afin qu'elle corresponde à la création de marque, au logo et au modèle de couleurs de votre établissement. Blackboard Learn dispose de plusieurs palettes de couleurs qui appliquent différentes couleurs au système. Vous pouvez modifier une palette de couleurs existante afin de la faire correspondre à vos exigences spécifiques.

Bonnes pratiques pour la conception d'une palette de couleurs personnalisée

Lorsque vous sélectionnez des couleurs pour votre palette personnalisée, tenez compte des quelques recommandations suivantes.

  • Utilisez des couleurs correspondant à l'identité visuelle de votre établissement. Consultez le guide de style de votre établissement pour connaître les couleurs officielles. Assurez-vous que la combinaison de couleurs choisie se traduit en un modèle de couleurs approprié pour l'interface utilisateur.
  • Assurez-vous que vos sélections de couleurs fonctionnent bien ensemble, créant une expérience visuelle harmonieuse. Color Matters est un site Web intéressant vous présentant les modèles de couleurs complémentaires, analogues et monochromatiques. En savoir plus sur la théorie des couleurs facilite le choix de couleurs adaptées à votre établissement.

File:fr-fr/Learn/Sandbox/fr-fr/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/most-complex.png Thème système personnalisé

Thème système personnalisé. Vous pouvez transformer complètement l'interface utilisateur de l'installation Learn de votre établissement en créant un thème système personnalisé. Cette méthode de personnalisation est la plus coûteuse et la plus complexe, nécessitant l'analyse et la modification de plus de 12 000 lignes de code. Elle constitue cependant la meilleure façon d'adapter l'interface utilisateur de Blackboard Learn à l'identité visuelle de votre établissement, mais elle nécessite un examen constant de toutes les nouvelles versions de Learn.

Bonnes pratiques pour la conception d'un thème de système personnalisé

La conception d'un thème de système personnalisé constitue une tâche complexe et ne peut en aucun cas être considérée comme un projet secondaire. Une expérience significative en CSS et DOM est requise. En outre, vous aurez besoin d'un environnement de développement afin de développer, de tester et de gérer le thème.

  • Couleurs : recherchez l'identité visuelle de votre établissement. Votre établissement dispose certainement d'un guide de style incluant une section sur les couleurs de marque de l'établissement. Assurez-vous que la combinaison de couleurs choisie se traduit en un modèle de couleurs approprié pour l'interface utilisateur.
  • Harmonie des couleurs: une bonne compréhension des modèles de couleurs monochromes, complémentaires et des camaïeux facilite le choix de couleurs harmonieuses qui correspondent à votre établissement.
  • Exigences en matière d'accessibilité : la connaissance de ces exigences est primordiale pour s'assurer que le contraste du thème de système obtenu est suffisant et que le thème est accessible (http://www.w3.org/TR/WCAG/)
  • Polices : vous pouvez indiquer différentes polices pour votre marque. Testez les polices afin de vous assurer qu'elles peuvent être affichées dans différents systèmes d'exploitation. Vous pouvez également introduire des polices personnalisées en les incluant avec votre thème et en y faisant référence à l'aide d'une règle @font-face. Assurez-vous que les polices personnalisées prennent en charge les langues dans lesquelles vous enseignez.
  • Icônes : vous pouvez repenser certaines icônes et les utiliser dans l'application sous forme d'images d'arrière-plan.

Modification de la gestion de la création de marques personnalisées

Lorsque vous évaluez et testez une mise à niveau, il est primordial que vous téléchargiez et enregistriez les personnalisations au cas où elles devraient être restaurées. Utilisez l'outil Theme DIFF pour comparer les modifications CSS d'une version à l'autre de Learn. Cet outil facilitera la détection des modifications apportées à la feuille CSS, afin que vous puissiez évaluer l'impact sur vos personnalisations. 

Les éléments qui définissent une marque (généralement un thème, une palette et/ou un logo) se distinguent du contenu de la page. N'oubliez pas d'examiner le contenu des pages "publiques", telles que les pages de portail, pour vous assurer qu'il respecte les directives visuelles établies par la marque.

Thèmes système personnalisés et installation de nouveaux Building Blocks

Si vous avez un thème système personnalisé, vous voulez sans doute l'étendre aux nouvelles pages incluses dans un Building Block que vous avez installé via les Mises à jour logicielles. Tous les Building Blocks installés de cette façon n'ont pas une feuille de style spécifique pour chaque outil, mais certains en proposent.

Lorsque vous installez un Building Block contenant sa propre feuille de style sur un système qui dispose d'au moins un thème personnalisé, vous en êtes informé pendant l'installation. Il vous est recommandé de tester la fonctionnalité avec votre thème personnalisé, comme vous le faites quand vous mettez Learn à niveau. Vous recevez ce message lorsque votre établissement dispose déjà d'un thème personnalisé installé, même s'il n'est pas utilisé actuellement.

Si vous voulez savoir si un Building Block contient des feuilles de style spécifiques pour les outils, vous trouverez ces informations dans le Panneau de configuration de l'administrateur. Dans Building Blocks , cliquez sur Building Blocks, puis sur Outils installés. Accédez au menu contextuel pour chaque Building Block listé et cliquez sur Afficher les composants. Si le Building Block contient des feuilles de style spécifiques à un outil pour un des thèmes fournis avec Learn, les spécificités du thème sont listées sur cette page.

Si vous gérez vos thèmes personnalisés par stockage de copies des paquets hors ligne, réactualisez le paquet hors ligne de votre thème personnalisé en le téléchargeant à partir de l'IU du Panneau de configuration de l'administrateur après la mise à niveau SP 14 afin d'obtenir un exemplaire contenant la nouvelle structure de paquets introduite dans ce service pack. Il ne sera apporté aucune modification aux feuilles de style ni aux processus de personnalisation. En revanche, après la mise à niveau SP 14, les paquets hors ligne de la structure de paquets préalable ne pourront plus être mis en ligne : vous recevez un message d'erreur.

Marques différentes pour une même installation Learn

Si votre établissement dispose d'une licence Community Engagement, vous pouvez créer différentes marques pour différents groupes d'utilisateurs par rapport à leur fonction dans le système. Il convient de créer des noms d'hôte pour permettre l'utilisation de plusieurs marques dans une instance de Learn unique.