-
Notifications
You must be signed in to change notification settings - Fork 5
/
conception-fonctionnelle.html
executable file
·102 lines (95 loc) · 6.43 KB
/
conception-fonctionnelle.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
<title>Conception fonctionnelle - Guide du concepteur RGAA 3</title>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link rel="stylesheet" href="css/styles.css" media="all">
<link rel="stylesheet" href="css/print.css" media="print">
<script type="text/javascript" src="highlight/highlight.pack.js"></script>
<link rel="stylesheet" href="highlight/styles/tomorrow-night-eighties.css" media="all">
<script>hljs.initHighlightingOnLoad();</script>
</head>
<body>
<div class="main-header">
<div class="inside">
<ul class="skip-links">
<li><a href="#main">contenu</a></li>
<li><a href="#navigation">navigation</a></li>
</ul>
<header role="banner" class="header clear" id="banner">
<h1 class="title">Guide du concepteur RGAA 3</h1>
</header>
<nav role="navigation" class="gp-sommaire" id="navigation" aria-label="Sommaire du guide">
<button id="btnSommaire" aria-expanded="false">Sommaire</button>
<ul class="sommaire is-hidden" id="sommaireToggle">
<li><a href="index.html">Introduction</a></li>
<li>
<a href="conception-fonctionnelle.html">Conception fonctionnelle</a>
<ul>
<li><a href="1-images.html">Fiche 1 : Images</a></li>
<li><a href="2-tableaux.html">Fiche 2 : Tableaux</a></li>
<li><a href="3-formulaires.html">Fiche 3 : Formulaires</a></li>
<li><a href="4-navigation.html">Fiche 4 : Navigation</a></li>
<li><a href="5-consultation.html">Fiche 5 : Consultation</a></li>
</ul>
</li>
<li>
<a href="conception-graphique.html">Conception graphique</a>
<ul>
<li><a href="6-couleurs.html">Fiche 6 : Couleurs</a></li>
<li><a href="7-presentation.html">Fiche 7 : Présentation</a></li>
</ul>
</li>
<li>
<a href="conception-multimedia.html">Conception multimédia</a>
<ul>
<li><a href="8-multimedia.html">Fiche 8 : Multimédia</a></li>
</ul>
</li>
<li><a href="glossaire.html">Glossaire</a></li>
</ul>
</nav>
<div class="github-link">
<p><a href="https://github.com/DISIC/guide-concepteur">Contribuer</a>
<a class="pdfdown" title="Télécharger le Guide du concepteur RGAA 3 (pdf, 1,6 Mo)" href="export/guide-concepteurs.pdf">Télécharger</a></p>
</div>
</div>
</div>
<div id="wrapper">
<nav role="navigation" class="internav clear">
<ul>
<li><a class="prev" href="index.html"><span aria-hidden="true"> « </span>Introduction </a></li>
<li><a class="next" href="1-images.html">Fiche 1 : Images <span aria-hidden="true"> » </span></a></li>
</ul>
</nav>
<main id="main" role="main">
<h1 class="fiche-title">Conception fonctionnelle</h1>
<article class="article">
<p>La conception fonctionnelle a pour objectif de définir le fonctionnement et les fonctionnalités d'un site web, en tenant compte des objectifs de celui-ci et des besoins de ses utilisateurs. La conception fonctionnelle démarre à la réception du cahier des charges, et intervient avant la phase de conception graphique. </p>
<p>Elle est généralement conduite par des designers d'expérience utilisateur (<abbr title="user experience" lang="en">UX</abbr>), des ergonomes, des architectes de l'information, mais peut également être menée par des designers d'interfaces (<abbr title="user interface" lang="en">UI</abbr>), des web designers, voire même des graphistes dans de petites équipes polyvalentes. Les chefs de projet et les directeurs artistiques peuvent également être amenés à participer à la conception fonctionnelle.</p>
<p>En déterminant l'architecture de l'information, le système de navigation, la structuration des pages, mais également la chorégraphie <span lang="en">responsive</span> et la façon dont l'utilisateur va pouvoir interagir avec le site, le concepteur fonctionnel prend des décisions stratégiques qui vont fortement impacter l'utilisabilité du site, c'est à dire la facilité avec laquelle l'utilisateur pourra interagir avec lui.</p>
<p><strong>La conception fonctionnelle joue donc un rôle crucial en matière d'accessibilité web</strong> : puisque son rôle est d'améliorer l'expérience utilisateur, elle doit alors également permettre aux utilisateurs en situation de handicap d'utiliser le site. En effet, l’expérience utilisateur des personnes handicapées peut être complètement différente de celle d’un utilisateur valide utilisé comme persona. Ainsi, l’expérience utilisateur doit être inclusive et tenir compte des besoins spécifiques des personnes handicapées.</p>
<p>Lorsque les besoins spécifiques des utilisateurs handicapés sont pris en compte dès la conception fonctionnelle, en amont de la production graphique et technique du site, alors l'accessibilité est plus simple et moins coûteuse à mettre en œuvre qu'en fin de chaîne de production.</p>
<p>Les fiches suivantes abordent les problématiques d'accessibilité qui concernent la conception fonctionnelle dans le RGAA 3 :</p>
<ul>
<li><a href="1-images.html">Fiche 1 : Images</a></li>
<li><a href="2-tableaux.html">Fiche 2 : Tableaux</a></li>
<li><a href="3-formulaires.html">Fiche 3 : Formulaires</a></li>
<li><a href="4-navigation.html">Fiche 4 : Navigation</a></li>
<li><a href="5-consultation.html">Fiche 5 : Consultation</a></li>
</ul>
</article>
</main>
<footer id="footer" role="contentinfo" class="clear">
<h2>Licence d'utilisation</h2>
<p class="logo-smgap"><a href="http://references.modernisation.gouv.fr/"><img src="img/modernisation-logo.jpg" alt="Secrétariat général pour le modernisation de l'action publique"></a></p>
<p>Ce document est la propriété du Secrétariat général à la modernisation de l'action publique français (SGMAP). Il est placé sous la <a href="https://www.etalab.gouv.fr/licence-ouverte-open-licence">licence ouverte 1.0 ou ultérieure</a>, équivalente à une licence <i lang="en">Creative Commons BY</i>. Pour indiquer la paternité, ajouter un lien vers la version originale du document disponible sur le <a href="https://github.com/DISIC">compte <span lang="en">GitHub</span> de la DInSIC</a>.</p>
</footer>
</div>
<script type="text/javascript" src="js/script.js"></script>
</body>
</html>