-

11 meilleurs sites Web universitaires sur Drupal. Aperçu des fonctionnalités

Qu'ont en commun l'université d'Oxford, l'université de Cambridge et l'université de Princeton ? La réponse est simple - Drupal. Les universités les plus connues et respectées ont choisi ce CMS pour gérer leurs sites web. La scalabilité, la personnalisabilité et l'interopérabilité de Drupal sont quelques-uns des arguments souvent avancés derrière ce choix. J'ai rassemblé des exemples des meilleurs sites universitaires pour examiner leurs fonctionnalités et leur design.

Qu'est-ce qui rend les sites universitaires uniques ?

Les sites universitaires sont inhabituels en raison de leur nature multifonctionnelle. Ils servent de plateformes complètes qui répondent aux besoins de différents utilisateurs.

Tout d'abord, ils agissent en tant que centres d'information, présentant des détails sur les programmes d'études, les conditions d'admission et les profils du corps enseignant. Il n'est pas rare qu'ils offrent des fonctionnalités interactives telles que des visites virtuelles du campus et des ressources multimédias qui donnent vie à l'expérience académique.

De plus, les sites universitaires servent de canaux de communication clés et facilitent ainsi une interaction fluide entre les étudiants, le corps enseignant et le personnel. Ils incluent souvent des sections pour s'inscrire aux cours, soumettre des devoirs, publier des actualités académiques et soutenir un environnement en ligne dynamique.

Les sites universitaires reflètent également l'identité de l'institution à travers des éléments de design, mettant en valeur ses valeurs, ses réussites ou sa culture de campus. Les fonctions d'intégration sociale, de réseau d'anciens élèves ou de calendrier avec événements contribuent à renforcer le sentiment de communauté.

Les meilleurs sites universitaires sur Drupal

Les sites universitaires que j'ai examinés et leurs fonctionnalités ont des dénominateurs communs clairs qui les soutiennent dans la réalisation des objectifs susmentionnés. Un design fonctionnel, une option de recherche, une section FAQ et des éléments qui engagent principalement les utilisateurs ne sont que quelques-uns des aspects. Dans la liste ci-dessous, je distingue une université particulière par une fonctionnalité à noter comme source d'inspiration à introduire sur votre page web.

1. L'Université de l'Arizona - engager l'utilisateur

Un élément essentiel qui doit distinguer les meilleurs sites éducatifs est la manière dont ils engagent les utilisateurs. Cela augmente les chances qu'une telle personne reste plus longtemps sur la page web et ait envie d'y revenir plus tard. Un prétexte à cela pourrait être la section Actualités. 

La section avec les mises à jour doit être lisible et claire, et le contenu doit être divisé par sujet afin qu'il soit facile de trouver ce qui intéresse l'utilisateur. Cependant, parfois un sujet manque. Que faire alors ?

Les développeurs du site web de l'Université de l'Arizona ont fourni une option qui permet à un utilisateur d'utiliser un formulaire pour proposer leur idée pour ce qu'ils appellent une histoire.

Ainsi, en plus de la navigation simple dans la section en question, il y a un bouton CTA engageant, SOUMETTRE UNE IDÉE D'HISTOIRE, par lequel n'importe qui peut soumettre une proposition d'article. 

Video file


Source: arizona.edu

2. Université d'Oxford - horaires de visites

L'université d'Oxford est l'un des collèges les plus célèbres au monde. Alors, qui ne voudrait pas la visiter ? Surtout si l'on envisage sérieusement de poser sa candidature à cette université. L'option que j'ai trouvée sur ce site Drupal devrait inspirer toute personne souhaitant attirer le plus de personnes possible dans leur institution.

Le menu principal a un onglet appelé JOURNÉES PORTES OUVERTES ET VISITES. Si vous passez votre curseur dessus, vous verrez une liste avec des informations utiles telles que les heures de travail des départements, les voyages et l'hébergement. Il y a aussi une option pour planifier votre journée dans la section  Planification de votre journée. Oxford vous permet de visiter pendant 24 heures, 12 heures ou 6 heures, et chaque option est décrite en détail.

Video file


Source: ox.ac.uk

À droite se trouve un bouton pour le formulaire d'inscription avec un CTA spécifique - S'INSCRIRE POUR ASSISTER À UNE JOURNÉE PORTES OUVERTES. C'est aussi un excellent exemple de comment le bouton devrait être et comment le concevoir pour remplir son objectif. Dans ce cas, il vous encourage à prendre un rendez-vous en ligne.

3. L'université de Cambridge - l'utilisation de la vidéo

Comme dans l'exemple précédent, l' Université de Cambridge est également l'une des universités les plus célèbres au monde. Elle attire beaucoup d'utilisateurs, donc naviguer et guider vers les sections suivantes sur le site web est un après-coup.

Ce site universitaire regorge d'une grande variété de contenus. Par conséquent, il n'est pas surprenant que les créateurs de la page web aient décidé d'utiliser des vidéos pour montrer l'école sous une forme différente, plus attrayante, et parler aux candidats des avantages d'étudier à Cambridge.

Lorsque vous allez dans la section Cours vous verrez une vidéo pour vous aider à choisir un collège. C'est une vidéo vous expliquant ce qu'il faut rechercher lors de votre choix tout en vous présentant l'institution elle-même. Mais ce n'est pas tout - si vous cliquez sur un sujet, vous pouvez visionner du matériel dédié à des études spécifiques.

Je pense que c'est une idée simple et intéressante pour stimuler l'imagination. Le candidat se souviendra plus des images que des mots, ce qui peut les pousser à choisir cette université.

Le site web de l'université de Cambridge sur Drupal attire l'attention des utilisateurs avec un contenu vidéo engageant.


Source: cam.ac.uk

4. Université de Princeton - un design attrayant

L'université de Princeton, en revanche, est un exemple de grand design tel qu'implémenté sur Drupal 10. Les développeurs se sont concentrés sur de grandes graphiques et la plus petite quantité de contenu possible mais nécessaire.

Cette approche ne nuit en rien à la fonctionnalité du site web. J'ose dire que elle rend même le site web de l'université plus transparent et mieux organisé. En cliquant simplement sur le menu, les sections s'affichent. Après les avoir sélectionnées, des sous-catégories logiquement agencées conduisent à d'autres sous-pages, et elles apparaissent immédiatement.

En approfondissant le site web, vous pouvez voir le design maintenu de manière cohérente, et les blocs de texte placés sur les graphiques deviennent encore plus apparents. Je vous encourage à prendre quelques minutes pour un voyage relaxant à travers ce site universitaire unique sur Drupal.

Le site Drupal de l'université de Princeton est un excellent exemple de design réfléchi et clair.


Source: princeton.edu 

5. Massachusetts Institute of Technology (MIT) - recherche originale

Pour qu'un site universitaire fonctionne bien en tant que plateforme d'information, l'un des outils les plus efficaces devrait être un moteur de recherche. Un excellent exemple est le Massachusetts Institute of Technology (MIT). Les créateurs de ce site de collection ont abordé le sujet de manière créative, tirant pleinement parti de son potentiel d'utilisabilité.  

Premièrement, parce que la barre de recherche est placée à un endroit personnalisé (en tant qu'élément supplémentaire). Deuxièmement - grâce à sa présentation dynamique, elle se démarque et est clairement visible. Troisièmement - après avoir commencé à taper le terme de recherche, un grand écran avec les matériaux trouvés apparaît, et à mesure que vous tapez plus de lettres, les résultats de recherche se réduisent automatiquement.

Je dois admettre que c'est l'une des solutions de recherche les plus originales que j'ai vues pour un site web sur Drupal. Et voici à quoi ressemble le processus en direct :

Video file


Source: mit.edu

6. University College London (UCL) - calendrier et filtrage

Je ne pouvais pas laisser University College London hors de la liste, non seulement parce que elle a été nommée l'université de 2024 (selon The Times et The Sunday Times). En naviguant sur ce site universitaire, mon attention a été attirée par le calendrier et le filtrage utilisés dans le contexte des articles.

Lorsque vous allez à la section Actualités les articles peuvent maintenant être filtrés par date, sujet, unités commerciales, type d'article et public. C'est un excellent exemple de l'utilisation de cette fonctionnalité, qui vous permet de réduire le champ de recherche aux paramètres que vous souhaitez.

 Le site Drupal de l'Université College de Londres a une section d'article filtrée.


Source: ucl.ac.uk

7. Université de Pennsylvanie - page d'accueil légère et événements

Il y a quelque chose de spécial à propos de la page d'accueil de l'Université de Pennsylvanie. Le premier mot qui m'est venu à l'esprit était "légèreté." Peut-être que les marges entre les paragraphes sont responsables de mes impressions ? Ou peut-être le menu épuré ? Drupal offre de nombreuses options pour choisir la disposition du site web afin de répondre aux besoins des éditeurs et des utilisateurs. Ici, il est clair que les développeurs de la page web ont passé beaucoup de temps à exploiter le potentiel du système.

Un autre élément est la section Événements qui a encore un calendrier et un filtrage pratique . L'événement principal et à venir est mis en évidence par une boîte circulaire et une description détaillée, avec la possibilité de le partager en tant que publication sur les réseaux sociaux. Plus bas se trouvent des événements à venir, et en dessous d'eux, des liens utiles pour obtenir plus d'informations à leur sujet.

Le site de l'Université de Pennsylvanie sur Drupal se distingue par sa mise en page épurée et son calendrier.


Source: upenn.edu

8. PSL Université Paris (PSL) - versions linguistiques et accessibilité

En tant qu'administrateur de site universitaire, on ne doit pas oublier le besoin de le préparer en différentes langues. Si l'université s'ouvre à la communauté internationale des étudiants ou des enseignants, tout le contenu doit avoir ses équivalents dans d'autres langues, en fonction des besoins. Drupal est un système avec un support multilingue, il fonctionne donc bien pour cela.

De plus, il convient de considérer les facilités et l'accessibilité pour le plus large éventail possible d'utilisateurs. Cette approche est également représentée par le site web de PSL Université Paris, où vous pouvez choisir la façon dont le site web est présenté, entre autres choses :

  • le contraste entre le défaut, amélioré et inversé,
  • police personnalisable,
  • interlignage accru.

Tout cela fait que le service répond aux attentes des personnes ayant besoin de faciliter la navigation quotidiennement.

Video file


Source: psl.eu

9. L'Université du Texas à Austin - menu et défilement des pages

Le site web de l' Université du Texas à Austin a une façon remarquablement intéressante de révéler des éléments dans le menu principal et une méthode de défilement de la page web.

Dans le premier cas, lorsque je passe ma souris sur certaines catégories du menu, un bloc personnalisé avec une image et une description apparaît après l'expansion de la liste. Une telle solution attire votre attention et vous incite à lire plus de contenu. C'est aussi un excellent moyen de "raviver" le menu, qui est généralement juste une liste de liens sous une forme minimaliste.

De plus, la fonction ci-dessus reste cohérente avec le deuxième cas - une manière intéressante de parcourir la page web. Lors du défilement des photos, la suivante chevauche la précédente, tandis qu'un bloc de texte apparaît à un rythme différent. C'est sans aucun doute un attrape-œil original et pratique. Le contenu exposé attire le regard et vous permet de rester plus longtemps sur le site.

Video file


Source: utexas.edu

Le design et les solutions de navigation spécifiques sur le site de l'Université du Texas, dont il y en a plus que celles que j'ai mentionnées, méritent définitivement de l'attention. Ils peuvent être une source d'inspiration dans le contexte de la construction d'une page web universitaire en tant qu'ensemble réfléchi, où rien n'est laissé au hasard.

10. Université de Kyoto - la section FAQ

La section FAQ est une fonctionnalité précieuse. Elle sert de réponse aux questions les plus fréquemment posées, peut minimiser le nombre de formulaires de questions envoyés, et ainsi - réduire le temps nécessaire pour traiter les réponses à ces demandes.

Pour un exemple de la manière dont vous pouvez construire de manière transparente une telle section sur un site web, je me suis déplacé virtuellement au Japon. L'université de Kyoto est une autre page web basée sur Drupal 10 qui montre une approche non conventionnelle à la mise en page de la sous-page FAQ.

D'après la mise en page utilisée ici, il apparaît que les sujets peuvent être placés sur le côté gauche de l'écran et les réponses - sur le côté droit. Cette disposition permet de développer plus de contenu, d'ajouter des titres et des liens supplémentaires, et de clarifier l'information. Elle diffère de la plupart des sites web, où les questions et les réponses sont situées les unes en dessous des autres, limitant la possibilité d'édition.

Video file


Source: kyoto-u.ac.jp

11. Université de Yale - compteur et ecommerce

L'une des fonctionnalités de Drupal est un compteur, souvent utilisé sur les sites web, par exemple pour indiquer le nombre d'employés d'une entreprise, de projets réalisés, ou d'années sur le marché. Dans le cas de l'université de Yale, cependant, cet outil a une fonction plus avancée et un design original.

Le compteur est situé dans la section Dons et sa fonction est de montrer le montant des dons collectés par rapport à l'objectif fixé. En plus de la somme exprimée en chiffres, les dons remplissent graphiquement un pourtour autour du globe, illustrant le pourcentage d'accomplissement du plan.

Il convient également de noter la sous-page elle-même, qui est axée sur les subventions. Bien que presque chaque université ait une section similaire, la façon dont elle est présentée et le chemin d'achat développé ici est particulièrement simple et convivial. Oui, j'ai délibérément utilisé une expression tout droit sortie d'un magasin en ligne. En sélectionnant un financement, nous ajoutons plus d'éléments comme s'ils étaient dans un panier d'achat. Nous avons donc ici une intégration avec le commerce électronique.

Video file


Source: yale.edu

Les meilleurs sites universitaires - résumé

Les fonctionnalités énumérées dans cet article sont des exemples de ce que vous pouvez obtenir en utilisant Drupal. Cependant, ce CMS offre encore plus de moyens de faire fonctionner un site web universitaire de manière fluide et sécurisée. Ceux-ci incluent des intégrations personnalisées, le contrôle des permissions, et des modules d'optimisation SEO.

J'espère que les universités que j'ai énumérées seront une référence dans votre recherche des meilleures solutions. Et si vous avez besoin d'aide pour mettre en œuvre une fonctionnalité spécifique ou construire une page web à partir de zéro, obtenez le soutien de développeurs spécialisés dans Drupal pour l'enseignement supérieur.

-