forked from Nuclear-Squid/ergol
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
359 lines (338 loc) · 16.9 KB
/
index.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
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
<!DOCTYPE html>
<html lang="fr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta name="description" content="a Colemak-style keyboard layout for French-speaking users" />
<title> Ergo-L </title>
<link type="text/css" rel="stylesheet" href="css/layout.css" />
<link type="text/css" rel="stylesheet" href="css/demo.css" />
<link type="image/svg+xml" rel="icon" href="favicon.svg" sizes="any" />
<script src="js/x-keyboard.js" type="module"></script>
<script src="js/demo.js" type="text/javascript"></script>
</head>
<body>
<h1> Ergo-L </h1>
<p> Une disposition de clavier optimisée pour les développeurs francophones et
les typographes exigeants. </p>
<div id="demo">
<div>
<input spellcheck="false" placeholder="zone de saisie Ergo-L">
<x-keyboard src="layouts/ergol.json"></x-keyboard>
<p>
<span> powered by
<a href="https://fabi1cazenave.github.io/x-keyboard/">x-keyboard</a>
</span> géométrie :
<select>
<option value="iso"> ISO </option>
<option value="ansi"> ANSI </option>
<option value="ol60"> TMx </option>
<option value="ol50"> 50% </option>
<option value="ol40"> 40% </option>
</select>
</p>
</div>
</div>
<h2 id="objectifs"> Objectifs </h2>
<ul>
<li> disposition <strong>optimisée pour le français et l’anglais</strong> </li>
<li> couche AltGr optimisée pour l’enchaînement des symboles de programmation </li>
<li> <strong>conservation des raccourcis usuels</strong> :
<kbd>Ctrl</kbd>-{<kbd>Q</kbd>,<kbd>A</kbd>,<kbd>S</kbd>,<kbd>Z</kbd>,<kbd>X</kbd>,<kbd>V</kbd>}
(<kbd>Ctrl-<kbd>C</kbd> est décalé, mais reste faisable d’une main) </li>
<li> support de tous les caractères spéciaux utilisés en français
(diacritiques, majuscules accentuées, lettres entrelacées, symboles de ponctuation…) </li>
<li> <strong>chiffres en accès direct</strong> </li>
</ul>
<h2 id="install"> Installation </h2>
<p>
Voir <a href="https://github.com/Nuclear-Squid/ErgoL">le dépôt GitHub</a>
pour les instructions d’installation.
</p>
<h2 id="licence"> Licence </h2>
<p>
<a href="http://wtfpl.net/">WTFPL</a>
– Do What the Fuck You Want to Public License.
</p>
<h2 id="optimisation"> Optimisation </h2>
<p> L’optimisation d’une disposition de clavier francophone comprend deux difficultés : </p>
<ul>
<li> le placement des lettres, selon une méthode de type Dvorak ou Colemak ;</li>
<li> la gestion des caractères accentués — accès direct, <kbd>AltGr</kbd>,
touche morte ? </li>
</ul>
<p> <abbr title="trop long ; pas lu :">TL;PL:</abbr> Ergo-L est une disposition
optimisée façon <a href="https://colemak.com/">Colemak</a> /
<a href="https://workmanlayout.org/">Workman</a>, utilisant une touche morte
de type <a href="https://qwerty-lafayette.org/">Lafayette</a> pour les
caractères accentués. </p>
<p> Ergo-L est meilleur que Bépo pour le Français, meilleur que Dvorak pour
l’Anglais et meilleur que Qwerty pour la programmation ! </p>
<div style="text-align: center">
<a href="stats#/ergol/iso/fr"><img src="img/heatmap_ergol_fr.png"
alt="heatmap de la disposition Ergo-L sur un corpus francophone"></a>
<caption> <small> (cliquer sur l’image pour plus d’infos) </small> </caption>
</div>
<h3> Placement des lettres </h3>
<p>Il y a eu plusieurs projets anglo-saxons d’optimisation du clavier, tous
basés sur un réarrangement des touches du Qwerty visant à :</p>
<ul>
<li> Maximiser l’alternance des mains lors de la frappe ; </li>
<li> Répartir les touches de façon équitable sur les deux mains ; </li>
<li> Utiliser en priorité la rangée centrale, puis haute, puis inférieure ; </li>
<li> En cas de non-alternance des mains sur un digramme, diriger la frappe
vers le centre du clavier ce qui sollicite davantage les doigts les plus
habiles à savoir l’index et le majeur. </li>
</ul>
<p> Le plus connu et le plus ancien (finalisé en 1932) est
<a href="https://fr.wikipedia.org/wiki/Disposition_Dvorak">Dvorak</a>.
Particularité : toutes les voyelles sont sous la main gauche. Mais avec la
généralisation de la bureautique, les raccourcis claviers
<kbd>Ctrl</kbd>-{<kbd>Q</kbd>,<kbd>A</kbd>,<kbd>S</kbd>,<kbd>Z</kbd>,<kbd>X</kbd>,<kbd>C</kbd>,<kbd>V</kbd>}
sont devenus indispensables et les projets récents d’optimisation de
disposition clavier ont cherché à les préserver. </p>
<ul>
<li> C’est notamment le cas de <a href="https://colemak.com/">Colemak</a>,
qui revendique une meilleure efficacité que Dvorak tout en préservant les
raccourcis usuels — sauf <kbd>Ctrl</kbd>-<kbd>S</kbd>, décalé d’une
colonne. </li>
<li> La disposition <a href="https://workmanlayout.org/">Workman</a> vise à
améliorer Colemak, notamment en limitant les mouvements horizontaux des
doigts. Là encore, les raccourcis sont préservés — sauf
<kbd>Ctrl</kbd>-<kbd>C</kbd>,<kbd>V</kbd>, décalés d’une colonne. </li>
</ul>
<p> Ergo-L reprend les principes de Colemak et Workman et concerve la plupart
des raccourcis usuels. <kbd>Ctrl</kbd>-<kbd>C</kbd> est déplacé mais reste
accessible d’une main. Nous pensons que le gain en ergonomie justifie ce
décalage. </p>
<h3> Polyvalence français / anglais </h3>
<p> Les dispositions Dvorak, Colemak et Workman sont optimisées pour l’anglais
exclusivement. Les dispositions francophones <a
href="https://www.algo.be/ergo/dvorak-fr.html">Dvorak-fr</a> et <a
href="https://bepo.fr/">Bépo</a> appliquent au français le principe de
Dvorak (donc sans support des raccourcis claviers usuels), quitte à devenir
pénalisantes pour l’anglais. </p>
<p> Pourtant, à une exception près, les 9 lettres les plus fréquentes sont les
mêmes en français (ESANITRUO) et en anglais (ETAOHNISR) :</p>
<table style="font-size: small;">
<tr>
<th> </th>
<th>E</th>
<th>S</th>
<th>A</th>
<th>N</th>
<th>I</th>
<th>T</th>
<th>R</th>
<th>U</th>
<th>O</th>
<th>H</th>
</tr>
<tr>
<th>fr</th>
<td>14.44 %</td>
<td>7.25 %</td>
<td>7.14 %</td>
<td>6.78 %</td>
<td>6.74 %</td>
<td>6.74 %</td>
<td>6.52 %</td>
<td>6.16 %</td>
<td>5.29 %</td>
<td>1.06 %</td>
</tr>
<tr>
<th>en</th>
<td>11.72 %</td>
<td>6.15 %</td>
<td>7.97 %</td>
<td>6.63 %</td>
<td>6.50 %</td>
<td>9.04 %</td>
<td>5.33 %</td>
<td>2.68 %</td>
<td>7.85 %</td>
<td>6.71 %</td>
</tr>
</table>
<p> Ergo-L place donc ces lettres aux emplacements les plus confortables
(suivant les principes de Workman) et fait en sorte qu’aucun enchaînement
fréquent en français ou en anglais ne soit rédhibitoire. On obtient donc une
efficacité supérieure à Bépo ou Dvorak-fr, sans sacrifier la programmation
ou l’anglais. </p>
<h3> Gestion des accents </h3>
<p> Azerty, <a href="https://www.algo.be/ergo/dvorak-fr.html">Dvorak-fr</a>
et <a href="https://bepo.fr/">Bépo</a> gèrent les caractères accentués de
façon assez similaire : </p>
<ul>
<li> certaines lettres comme <kbd>É</kbd><kbd>È</kbd><kbd>À</kbd><kbd>Ç</kbd>
sont accessibles directement ; </li>
<li> l’accent circonflexe et le tréma sont faits avec une touche morte (le
tréma nécessitant <em>en plus</em> <kbd>AltGr</kbd> avec Bépo) ; </li>
<li> certains caractères nécessitent la touche <kbd>AltGr</kbd>, ce qui
complique les enchaînements : Œ, Æ, points de suspension…
et même Ù pour Bépo. </li>
</ul>
<p> C’est la source de deux défauts majeurs dont Qwerty est exempt :</p>
<ul>
<li> les chiffres nécessitent <kbd>Shift</kbd>, ce qui rend fastidieuse la
saisie de nombres ; </li>
<li> certaines lettres ne sont pas accessibles dans la zone confortable des
3×10 touches sous les chiffres, ce qui impose des extensions de doigt :
<kbd>É</kbd><kbd>È</kbd><kbd>À</kbd><kbd>Ç</kbd> pour Azerty,
<kbd>È</kbd><kbd>Z</kbd><kbd>W</kbd> pour Dvorak-fr,
<kbd>M</kbd><kbd>Z</kbd><kbd>W</kbd><kbd>Ç</kbd><kbd>Ê</kbd> pour Bépo.
</li>
</ul>
<p> Pour éviter cela, Ergo-L utilise une touche morte de type
<a href="https://qwerty-lafayette.org/">Qwerty-Lafayette</a> pour tous les
caractères accentués et ponctuations spéciales. Cela occasionne environ 4 %
de frappes supplémentaires pour un texte francophone, ce qui est négligeable
comparé au gain de confort que cela apporte. La touche <kbd>AltGr</kbd> peut
ainsi être dédiée aux seuls symboles de programmation. </p>
<h2 id="ergomonie"> Principes d’ergonomie </h2>
<h3> Une approche moderne de la saisie de texte </h3>
<p> Il n’y a pas de lettres à l’extérieur des 3×10 touches du centre pour
éviter le manque de confort et de précision causé par les extensions. Cela
implique que : </p>
<ul>
<li> Les lettres accentuées et ponctuations spéciales soient obtenues avec une touche morte :
<ul>
<li> C’est moins intuitif qu’une couche <kbd>AltGr</kbd>, mais favorise
les enchaînements et l’apprentissage en mémoire musculaire. </li>
<li> La touche morte ajoute aux voyelles qui suivent un accent grave (ou les
transforme en leur diacritique principal si elles n’ont pas d’accent grave).</li>
<li> Les accents circonflexes se font avec une touche à côté de la touche de la
voyelle, et les trémas avec shift + touche morte, puis la voyelle. Ce n’est pas
du tout intuitif, mais ça permet de garder tous les accents courants en accès rapide.</li>
<li> Faire shift + voyelle <b>après</b> la touche morte permet d’avoir les lettres
accentuées en majuscule. Oubliez vos alt codes !</li>
<li> Une exception : le <code>é</code> se fait en touche morte -> <code> s </code>
pour garder l’enchaînement <code>ée</code> efficace.</li>
</ul>
</li>
<li> La couche AltGr (voir ci-dessous) est réservée aux symboles de programmation :
<ul>
<li> Tous les symboles de programmation sont en AltGr. </li>
<li> Accolades, crochets et parenthèses sont sur les 6 touches les plus accessibles. </li>
<li> La disposition est optimisée pour les enchaînements fréquents en programmation :
<code> -> => </ /> (0) [0] [''] ("") {} ~/ </code> … </li>
</ul>
</li>
</ul>
<p> La touche morte et la couche AltGr rendent la disposition <strong>compatible avec les
claviers ultra compacts</strong> (34 touches minimum). </p>
<p> <img src="img/ergol_1dk.svg" alt="La touche morte de la disposition."> </p>
<p> <img src="img/ergol_altgr.svg" alt="La couche AltGr de la disposition."> </p>
<p> Les chiffres sont en accès direct, sans <kbd>Shift</kbd>, pour faciliter
leur enchaînement (= la saisie de nombres). Oubliez votre pavé numérique ! </p>
<p> Les raccourcis usuels
<kbd>Ctrl</kbd>-{<kbd>Q</kbd>,<kbd>A</kbd>,<kbd>S</kbd>,<kbd>Z</kbd>,<kbd>X</kbd>,<kbd>V</kbd>} </li>
ont été conservés car le gain marginal d’ergonomie en mettant une autre
lettre à la place n’est pas suffisant pour compenser la perte de ces
raccourcis — loin s’en faut (une exception : <kbd>Ctrl</kbd>-<kbd>C</kbd>
qui a permis un gain important d’ergonomie, et a été modifié de sorte à
gêner le moins possible). </p>
<p> Beaucoup d’attention a été portée sur les enchaînements de lettres, avec
la plupart des enchaînements fréquents qui se font soit avec une alternance
main gauche / main droite, soit avec un roulement intérieur (se terminant
sur le majeur ou l’index). Les lettres fréquemment doublées (e.g.
<kbd>L</kbd> et <kbd>M</kbd>) sont placées sous les index. <strong>On
privilégie le confort sur la vitesse</strong> : il est possible de taper
vite avec n’importe quelle disposition de clavier. </p>
<h3> Ergo-L vs Bépo </h3>
<p> Ergo-L poursuit les mêmes objectifs que <a href="https://bepo.fr">Bépo</a>
pour le français, mais d’une façon différente. </p>
<ul>
<li> <i lang="en">Heatmap</i> :
<ul>
<li> Bépo est typé « Dvorak », i.e. les touches fréquentes sont étalées
sur toute la <i lang="en">home row</i> ; </li>
<li> Ergo-L est typé « Workman », i.e. on évite les deux colonnes du
centre pour limiter les extensions de l’index. </li>
</ul>
</li>
<li> Charge des doigts :
<ul>
<li> Bépo charge surtout les index et les auriculaires (notamment
l’auriculaire droit) ; </li>
<li> Ergo-L répartit la charge sur tous les doigts, en mettant plus de
charge sur les doigts forts (index, majeur) et en allégeant les
auriculaires — surtout l’auriculaire droit, déjà très sollicité par
<kbd>Shift</kbd> / <kbd>Entrée</kbd> / <kbd>Backspace</kbd>. </li>
</ul>
</li>
<li> Enchaînements :
<ul>
<li> Bépo privilégie les accès directs et étale les lettres sur tout
le clavier, quitte à requérir des extensions de doigts
(<kbd>M</kbd><kbd>Z</kbd><kbd>W</kbd><kbd>Ç</kbd><kbd>Ê</kbd>) ou
l’utilisation de <kbd>AltGr</kbd> (Ù, tréma, ponctuation…) ; </li>
<li> Ergo-L privilégie la fluidité et ne place aucune lettre hors de la
zone principale de 3×10 touches ou dans la couche <kbd>AltGr</kbd>. </li>
</ul>
</li>
<li> Typographie :
<ul>
<li> Bépo permet une typographie soignée à condition de s’en donner la
peine (beaucoup de symboles en <kbd>AltGr</kbd>) ; </li>
<li> Ergo-L hérite du Qwerty-Lafayette la facilité de soigner la typo —
les ponctuations spéciales sont toutes derrière la touche morte, comme
l’apostrophe typographique en touche morte + espace, le point médian en
touche morte + virgule, le point de suspension en touche morte + point, etc.
</ul>
</li>
<li> <abbr title="La proportion totale d’enchaînements effectués avec le même doigt,
un type d’enchaînement très inconfortable"> SFU (same finger usage) </abbr> :
<ul>
<li> Bépo a environ 2.55% de SFU en Français, dont la moitié sont retrouvés
sur l’index gauche, qui est déjà trop chargé (23% de la charge totale), et 0.3%
se trouvent sur l’auriculaire gauche, trop pour un doigt aussi faible.
De plus, une grande partie des touches doublées se trouvent sur
l’auriculaire droit (et souvent en extension !) </li>
<li> Ergo-L n’a que 1.36% de SFU en Français, et aucun doigt ne fait trop
d’effort. Les auriculaires n’ont pratiquement pas de touches doublées. </li>
</ul>
</li>
</ul>
<table>
<caption style="caption-side: bottom;">
Comparaison des charges des doigts entre Ergo-L et Bépo<br>
<small> (cliquer sur l’image pour plus d’infos) </small> </p>
</caption>
<tr>
<th> </th>
<th> Ergo-L </th>
<th> Bépo </th>
</tr>
<tr>
<th> fr </th>
<td> <a href="stats#/ergol/iso/fr"><img src="img/charge_ergol_fr.png"></a> </td>
<td> <a href="stats#/bepo/iso/fr"><img src="img/charge_bepo_fr.png"></a> </td>
</tr>
<tr>
<th> fr<br>en </th>
<td> <a href="stats#/ergol/iso/en+fr"><img src="img/charge_ergol_en_fr.png"></a> </td>
<td> <a href="stats#/bepo/iso/en+fr"><img src="img/charge_bepo_en_fr.png"></a> </td>
</tr>
<tr>
<th> en </th>
<td> <a href="stats#/ergol/iso/en"><img src="img/charge_ergol_en.png"></a> </td>
<td> <a href="stats#/bepo/iso/en"><img src="img/charge_bepo_en.png"></a> </td>
</tr>
</table>
<h3> Expériences rejetées et évolutions possibles </h3>
<p> Le layout est encore en cours de développement, notamment pour améliorer l’efficacité
de la couche AltGr. Vous pouvez participer aux travaux en rejoignant le
<a href="https://discord.gg/RH34GjQEgC">serveur Discord</a> dédié. </p>
<p> On a envisagé par le passé de placer le <kbd>E</kbd> sous l’index, comme
en Bépo, parce que c’est la lettre la plus fréquente en français ; mais cela
ruine l’équilibre de la charge des doigts et complique beaucoup
d’enchaînements. De même, on a essayé de mettre toutes les voyelles d’un
côté (comme Dvorak ou Bépo) mais cela engendrait plus de problèmes que
cela n’en résolvait. </p>
<footer>
<a href="https://github.com/Nuclear-Squid/ErgoL">dépôt GitHub</a> |
<a href="https://discord.gg/RH34GjQEgC">serveur Discord</a>
</footer>
</body>
</html>