<!DOCTYPE html><!--[if lt IE 9]><html class="no-js lt-ie9" lang="fr" dir="ltr"><![endif]--><!--[if gt IE 8]><!-->
<html class="no-js" lang="fr" dir="ltr">
<!--<![endif]-->
<head>
<meta charset="utf-8">
<!-- Web Experience Toolkit (WET) / Boîte à outils de l'expérience Web (BOEW)
wet-boew.github.io/wet-boew/License-en.html / wet-boew.github.io/wet-boew/Licence-fr.html -->
<title>Fondements - Architecture de l’information</title>
<meta content="width=device-width,initial-scale=1" name="viewport">
<meta name="description" content="">
<!--[if gte IE 9 | !IE ]><!-->
<link href="images/favicon-f.ico" rel="icon" type="image/x-icon">
<link rel="stylesheet" href="https://wet-boew.github.io/themes-dist/GCWeb/css/theme.min.css">
<!--<![endif]-->
<!--[if lt IE 9]>
<link href="images/favicon-f.ico" rel="shortcut icon" />
<link rel="stylesheet" href="https://wet-boew.github.io/themes-dist/GCWeb/css/ie8-theme.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://wet-boew.github.io/themes-dist/GCWeb/wet-boew/js/ie8-wet-boew.min.js"></script>
<![endif]-->
<!--[if lte IE 9]>
<![endif]-->
<noscript>
<link rel="stylesheet" href="https://wet-boew.github.io/themes-dist/GCWeb/wet-boew/css/noscript.min.css" />
</noscript>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
<link rel="stylesheet" href="css/new.css" />
</head>
<body vocab="https://schema.org/" typeof="WebPage">
<ul id="wb-tphp">
<li class="wb-slc"> <a class="wb-sl" href="#wb-cont">Passer au contenu principal</a> </li>
</ul>
<header>
<div id="wb-bnr" class="container">
<section id="wb-lng" class="text-right">
<h2 class="wb-inv">Sélection de la langue</h2>
<div class="row">
<div class="col-md-12">
<ul class="list-inline margin-bottom-none">
<li><a lang="fr" href="foundations-e.html">English</a></li>
</ul>
</div>
</div>
</section>
<div class="row">
<div class="brand col-xs-5 col-md-4"> <a href="index-f.html"><img src="images/logo-f.png" alt=""><span class="wb-inv">Architecture de l’information</span></a> </div>
</div>
</div>
<nav id="wb-bc" property="breadcrumb">
<h2>Vous êtes ici : </h2>
<div class="container">
<ol class="breadcrumb">
<li><a href="index-f.html">Accueil</a></li>
</ol>
</div>
</nav>
</header>
<main property="mainContentOfPage" class="container">
<h1 property="name" id="wb-cont">Fondements</h1>
<div class="row">
<div class="col-md-8">
<p class="small"><span class="far fa-clock"></span> Durée de la lecture : 2 minutes</p>
<h2 class="h4">Sur cette page</h2>
<ul>
<li><a href="#h_1">Regroupement et structure</a></li>
<li><a href="#h_2">De haut en bas et de bas en haut</a></li>
<li><a href="#h_3">Cycle de vie</a> </li>
</ul>
<h2 id="h_1">Regroupement et structure</h2>
<p>Vous devez créer une structure qui aidera les utilisateurs à comprendre rapidement l’information.</p>
<p>La bonne structure guidera les utilisateurs vers l’information grâce à la reconnaissance et le contexte.</p>
<p>Réfléchissez à la façon dont vous pourriez organiser une pile de chapeaux divers.</p>
<blockquote class="mrgn-lft-lg">
<p>Les mêmes chapeaux peuvent être regroupés par catégorie (à plumes, à rubans, protection, religieux, militaire, style...); selon leur lieu de fabrication (Hollande, Afrique, Japon...); par ordre alphabétique (casquette, melon, fédora...); ou par continuum, tel que la taille ou le coût.</p>
<p>Lorsqu’un chapeau est pris seul, il peut nous en dire peu sur lui même ou sur le porteur, mais en comparaison avec d’autres chapeaux, il peut signifier l’autorité, l’appartenance, la profession ou un intérêt.</p>
<p>L’organisation créative de l’information crée de nouvelles informations.</p>
<p><strong>Les chapeaux ne changent jamais, mais le fait de les suspendre selon des motifs différents, des règles différentes ou sur des supports à chapeaux différents peut influer sur ce que nous apprenons à leur sujet.</strong></p>
<footer class="text-right">Richard Saul Wurman<br>
<cite lang="en"><a href="https://walkerquarterly.s3.amazonaws.com/DQ-145_Hats.pdf">Design Quarterly, Hats (disponible en anglais seulement)</a></cite></footer>
</blockquote>
<p>Avant de déterminer comment organiser votre contenu, vous devez comprendre :</p>
<ul>
<li><a href="https://www.eatingelephant.com/2011/07/domain-knowledge/">Sujet ou domaine de votre contenu <small>(disponible en anglais seulement)</small></a>, c’est-à-dire le contexte général du sujet </li>
<li> <a href="https://alistapart.com/article/lookatitanotherway">Modèles mentaux des utilisateurs <small>(disponible en anglais seulement)</small></a> par rapport à ce contenu (conception intrinsèque de la notion)</li>
<li> <a href="https://experiencinginformation.com/2011/07/11/business-model-canvas-a-type-of-alignment-diagram/">Besoins et objectifs opérationnels <small>(disponible en anglais seulement)</small></a>, qui peuvent avoir une incidence sur vos objectifs en matière d’architecture de l’information (AI) </li>
</ul>
<p> <strong>Lorsque vous regroupez du contenu, n’oubliez pas que les catégories ne sont pas neutres. Chaque catégorie expose certains biais et donne la priorité à un point de vue particulier au détriment des autres.</strong></p>
<p>Par exemple, avant de déménager sur Canada.ca, l’Agence du revenu du Canada (ARC) avait son propre site. Le contenu était organisé par ordre alphabétique et par auditoire.</p>
<p class="mrgn-tp-md">Lorsque le nouveau modèle du SCT a été publié, le regroupement et l’ordre ont été reconsidérés.</p>
<table class="table">
<thead>
<tr>
<th scope="col">Avant avril 2013</th>
<th scope="col">Après mai 2013</th>
</tr>
</thead>
<tbody>
<tr>
<td><ul class="nowrap lst-spcd list-unstyled mrgn-rght-lg">
<li>Bénéficiaires de prestations</li>
<li>Entreprises</li>
<li>Organismes de bienfaisance et dons</li>
<li>Particuliers</li>
<li>Professionnels de l'impôt</li>
</ul></td>
<td><ul class="lst-spcd list-unstyled">
<li>Particuliers et familles</li>
<li>Entreprises</li>
<li>Organismes de bienfaisance et dons</li>
<li>Représentants</li>
</ul></td>
</tr>
<tr>
<td>Capture d’écran<br>
<img src="images/foundations1a-f.jpg" class="img-responsive" alt="Webpage screenshot"></td>
<td>Capture d’écran<br>
<img src="images/foundations1b-f.jpg" class="img-responsive" alt="Webpage screenshot"></td>
</tr>
</tbody>
</table>
<p>Plusieurs changements ont été apportés :</p>
<ul class="lst-spcd">
<li>Organiser selon la popularité plutôt que par ordre alphabétique<br>
<span class="text-muted">La première option du menu attire le plus l’attention, de sorte que la rubrique « Bénéficiaires de prestations » était involontairement privilégiée par rapport au contenu beaucoup plus populaire des rubriques « Particuliers » et « Entreprises ».</span></li>
<li>Renommer « Particuliers » en « Particuliers et familles » et déplacer le contenu « Bénéficiaires de prestations » dans la page « Particuliers et familles » <br>
<span class="text-muted">Restructuration pour correspondre au modèle mental des utilisateurs.</span></li>
<li>Renommer « Professionnels de l'impôt » en « Représentants »<br>
<span class="text-muted">Les représentants personnels ne trouvaient pas l’information dont ils avaient besoin parce qu’ils ne se considéraient pas nécessairement comme des professionnels de l'impôt. </span>
</ul>
<p>La réorganisation et le réétiquetage de ces catégories ont permis aux visiteurs de s’identifier correctement dans les catégories.</p>
<p><strong>Rappelez-vous : </strong>Il n’y a pas d’AI neutre. Bien que les catégories puissent être parallèles, le placement, l’ordre et la priorité qu’on leur accorde ont une incidence sur l’expérience de l’utilisateur. De plus, puisque les catégories doivent être <a href="elements2-f.html">étiquetées</a>, des problèmes peuvent survenir si les étiquettes ne sont pas efficaces.</p>
<h2 id="h_2">De haut en bas et de bas en haut</h2>
<p>L’architecture d’information (AI) de haut en bas est l’image d’ensemble du site qui permet à l’utilisateur de naviguer dans les principales sections de contenu. Beaucoup d’utilisateurs passent par-dessus l’AI, utilisant plutôt le moteur de recherche.</p>
<p>L’AI de bas en haut est en fait le contenu. Ce sont les rubriques, les regroupements d’information, et le placement du contenu qui aident l’utilisateur dans ses recherches et sa navigation.</p>
<p>Idéalement, il faudrait examiner et considérer tant l’AI de haut en bas que l’AI de bas en haut. </p>
<h2 id="h_3">Cycle de vie</h2>
<p>Gardez à l’esprit que la qualité d’une organisation ou d’une structure dépend de l’engagement à la maintenir.</p>
<p>L’environnement numérique a tendance à changer facilement et souvent. Cela signifie que l’architecture de l’information (AI) est également fluide et itérative. Au fur et à mesure que les besoins des utilisateurs ou de l’organisation évoluent, il se peut que l’AI doive également changer.</p>
<nav role="navigation">
<h2 class="wb-inv">Navigation dans le document</h2>
<ul class="pager mrgn-tp-xl">
<li class="previous"> <a href="purpose-f.html" rel="prev">Objet</a> </li>
<li class="next"> <a href="elements-f.html" rel="next">Éléments</a> </li>
</ul>
</nav>
</div>
<div class="col-md-4">
<h2 class="wb-inv">Toutes les sections du cours</h2>
<ol class="vertical-steps">
<li class="completed"><a href="purpose-f.html">Objet</a></li>
<li class="active"><span>Fondements</span></li>
<li><a href="elements-f.html">Éléments</a></li>
<li><a href="principles-f.html">Principes</a></li>
<li><a href="disciplines-f.html">Disciplines et domaines d’études connexes</a></li>
<li><a href="resources-f.html">Ressources</a></li>
</ol>
</div>
</div>
<dl id="wb-dtmd">
<dt>Date de modification :  </dt>
<dd>
<time property="dateModified">2017-12-05</time>
</dd>
</dl>
</main>
<!--[if gte IE 9 | !IE ]><!-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.js"></script>
<script src="https://wet-boew.github.io/themes-dist/GCWeb/wet-boew/js/wet-boew.min.js"></script>
<!--<![endif]-->
<!--[if lt IE 9]>
<script src="https://wet-boew.github.io/themes-dist/GCWeb/wet-boew/js/ie8-wet-boew2.min.js"></script>
<![endif]-->
<script src="https://wet-boew.github.io/themes-dist/GCWeb/js/theme.min.js"></script>
</body>
</html>