Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
Du kannst nicht mehr als 25 Themen auswählen Themen müssen mit entweder einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

index.html 31KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang=fr>
  4. <!-- Has to be within the first 1024 bytes, hence before the <title>
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset=utf-8>
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name=viewport content="width=device-width,minimum-scale=1,initial-scale=1,shrink-to-fit=no">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Cours IUT : Évaluation et Bilan — David Larlet</title>
  13. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  14. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons/apple-touch-icon.png">
  15. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons/favicon-32x32.png">
  16. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons/favicon-16x16.png">
  17. <link rel="manifest" href="/manifest.json">
  18. <link rel="mask-icon" href="/static/david/icons/safari-pinned-tab.svg" color="#5bbad5">
  19. <link rel="shortcut icon" href="/static/david/icons/favicon.ico">
  20. <meta name="apple-mobile-web-app-title" content="David Larlet">
  21. <meta name="application-name" content="David Larlet">
  22. <meta name="msapplication-TileColor" content="#da532c">
  23. <meta name="msapplication-config" content="/static/david/icons/browserconfig.xml">
  24. <meta name="theme-color" content="#f0f0ea">
  25. <!-- That good ol' feed, subscribe :p. -->
  26. <link rel=alternate type="application/atom+xml" title=Feed href="/david/log/">
  27. <!-- Canonical URL for SEO purposes -->
  28. <link rel="canonical" href="https://larlet.fr/david/blog/2014/cours-iut-evaluation-bilan/">
  29. <!-- SEO/Semantic metadata -->
  30. <meta name="description" content="Je suis contre le système de notation actuel." />
  31. <meta name="twitter:description" property="og:description" itemprop="description" content="Je suis contre le système de notation actuel." />
  32. <meta name="twitter:title" property="og:title" itemprop="name" content="Cours IUT : Évaluation et Bilan" />
  33. <meta name="twitter:card" content="summary" />
  34. <meta name="twitter:creator" content="@davidbgk" />
  35. <meta name="twitter:url" property="og:url" content="https://larlet.fr/david/blog/2014/cours-iut-evaluation-bilan/" />
  36. <meta property="og:type" content="article" />
  37. <meta property="og:site_name" content="David Larlet (@davidbgk)" />
  38. <meta name="twitter:image" property="og:image" itemprop="image" content="https://larlet.fr/static/david/blog/2014/cours-iut-evaluation-bilan.jpg" />
  39. <style>
  40. /* http://meyerweb.com/eric/tools/css/reset/ */
  41. html, body, div, span,
  42. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  43. a, abbr, address, big, cite, code,
  44. del, dfn, em, img, ins,
  45. small, strike, strong, tt, var,
  46. dl, dt, dd, ol, ul, li,
  47. fieldset, form, label, legend,
  48. table, caption, tbody, tfoot, thead, tr, th, td,
  49. article, aside, canvas, details, embed,
  50. figure, figcaption, footer, header, hgroup,
  51. menu, nav, output, ruby, section, summary,
  52. time, mark, audio, video {
  53. margin: 0;
  54. padding: 0;
  55. border: 0;
  56. font-size: 100%;
  57. font: inherit;
  58. vertical-align: baseline;
  59. }
  60. /* HTML5 display-role reset for older browsers */
  61. article, aside, details, figcaption, figure,
  62. footer, header, hgroup, menu, nav, section { display: block; }
  63. body { line-height: 1; }
  64. blockquote, q { quotes: none; }
  65. blockquote:before, blockquote:after,
  66. q:before, q:after {
  67. content: '';
  68. content: none;
  69. }
  70. table {
  71. border-collapse: collapse;
  72. border-spacing: 0;
  73. }
  74. /* http://practicaltypography.com/equity.html */
  75. /* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */
  76. /* https://www.filamentgroup.com/lab/js-web-fonts.html */
  77. @font-face {
  78. font-family: 'EquityTextB';
  79. src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),
  80. url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');
  81. font-weight: 300;
  82. font-style: normal;
  83. font-display: swap;
  84. }
  85. @font-face {
  86. font-family: 'EquityTextB';
  87. src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),
  88. url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');
  89. font-weight: 300;
  90. font-style: italic;
  91. font-display: swap;
  92. }
  93. @font-face {
  94. font-family: 'EquityTextB';
  95. src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),
  96. url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');
  97. font-weight: 700;
  98. font-style: normal;
  99. font-display: swap;
  100. }
  101. @font-face {
  102. font-family: 'ConcourseT3';
  103. src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),
  104. url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');
  105. font-weight: 300;
  106. font-style: normal;
  107. font-display: swap;
  108. }
  109. /* http://practice.typekit.com/lesson/caring-about-opentype-features/ */
  110. body {
  111. /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */
  112. font-family: "EquityTextB", Palatino, serif;
  113. background-color: #f0f0ea;
  114. color: #07486c;
  115. font-kerning: normal;
  116. -moz-osx-font-smoothing: grayscale;
  117. -webkit-font-smoothing: subpixel-antialiased;
  118. text-rendering: optimizeLegibility;
  119. font-variant-ligatures: common-ligatures contextual;
  120. font-feature-settings: "kern", "liga", "clig", "calt";
  121. }
  122. pre, code, kbd, samp, var, tt {
  123. font-family: 'TriplicateT4c', monospace;
  124. }
  125. em {
  126. font-style: italic;
  127. color: #323a45;
  128. }
  129. strong {
  130. font-weight: bold;
  131. color: black;
  132. }
  133. nav {
  134. background-color: #323a45;
  135. color: #f0f0ea;
  136. display: flex;
  137. justify-content: space-around;
  138. padding: 1rem .5rem;
  139. }
  140. nav:last-child {
  141. border-bottom: 1vh solid #2d7474;
  142. }
  143. nav a {
  144. color: #f0f0ea;
  145. }
  146. nav abbr {
  147. border-bottom: 1px dotted white;
  148. }
  149. h1 {
  150. border-top: 1vh solid #2d7474;
  151. border-bottom: .2vh dotted #2d7474;
  152. background-color: #e3e1e1;
  153. color: #323a45;
  154. text-align: center;
  155. padding: 5rem 0 4rem 0;
  156. width: 100%;
  157. font-family: 'ConcourseT3';
  158. display: flex;
  159. flex-direction: column;
  160. }
  161. h1.single {
  162. padding-bottom: 10rem;
  163. }
  164. h1 span {
  165. position: absolute;
  166. top: 1vh;
  167. left: 20%;
  168. line-height: 0;
  169. }
  170. h1 span a {
  171. line-height: 1.7;
  172. padding: 1rem 1.2rem .6rem 1.2rem;
  173. border-radius: 0 0 6% 6%;
  174. background: #2d7474;
  175. font-size: 1.3rem;
  176. color: white;
  177. text-decoration: none;
  178. }
  179. h2 {
  180. margin: 4rem 0 1rem;
  181. border-top: .2vh solid #2d7474;
  182. padding-top: 1vh;
  183. }
  184. h3 {
  185. text-align: center;
  186. margin: 3rem 0 .75em;
  187. }
  188. hr {
  189. height: .4rem;
  190. width: .4rem;
  191. border-radius: .4rem;
  192. background: #07486c;
  193. margin: 2.5rem auto;
  194. }
  195. time {
  196. display: bloc;
  197. margin-left: 0 !important;
  198. }
  199. ul, ol {
  200. margin: 2rem;
  201. }
  202. ul {
  203. list-style-type: square;
  204. }
  205. a {
  206. text-decoration-skip-ink: auto;
  207. text-decoration-thickness: 0.05em;
  208. text-underline-offset: 0.09em;
  209. }
  210. article {
  211. max-width: 50rem;
  212. display: flex;
  213. flex-direction: column;
  214. margin: 2rem auto;
  215. }
  216. article.single {
  217. border-top: .2vh dotted #2d7474;
  218. margin: -6rem auto 1rem auto;
  219. background: #f0f0ea;
  220. padding: 2rem;
  221. }
  222. article p:last-child {
  223. margin-bottom: 1rem;
  224. }
  225. p {
  226. padding: 0 .5rem;
  227. margin-left: 3rem;
  228. }
  229. p + p,
  230. figure + p {
  231. margin-top: 2rem;
  232. }
  233. blockquote {
  234. background-color: #e3e1e1;
  235. border-left: .5vw solid #2d7474;
  236. display: flex;
  237. flex-direction: column;
  238. align-items: center;
  239. padding: 1rem;
  240. margin: 1.5rem;
  241. }
  242. blockquote cite {
  243. font-style: italic;
  244. }
  245. blockquote p {
  246. margin-left: 0;
  247. }
  248. figure {
  249. border-top: .2vh solid #2d7474;
  250. background-color: #e3e1e1;
  251. text-align: center;
  252. padding: 1.5rem 0;
  253. margin: 1rem 0 0;
  254. font-size: 1.5rem;
  255. width: 100%;
  256. }
  257. figure img {
  258. max-width: 250px;
  259. max-height: 250px;
  260. border: .5vw solid #323a45;
  261. padding: 1px;
  262. }
  263. figcaption {
  264. padding: 1rem;
  265. line-height: 1.4;
  266. }
  267. aside {
  268. display: flex;
  269. flex-direction: column;
  270. background-color: #e3e1e1;
  271. padding: 1rem 0;
  272. border-bottom: .2vh solid #07486c;
  273. }
  274. aside p {
  275. max-width: 50rem;
  276. margin: 0 auto;
  277. }
  278. /* https://fvsch.com/code/css-locks/ */
  279. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  280. font-size: 1rem;
  281. line-height: calc( 1.5em + 0.2 * 1rem );
  282. }
  283. h1 {
  284. font-size: 1.9rem;
  285. line-height: calc( 1.2em + 0.2 * 1rem );
  286. }
  287. h2 {
  288. font-size: 1.6rem;
  289. line-height: calc( 1.3em + 0.2 * 1rem );
  290. }
  291. h3 {
  292. font-size: 1.35rem;
  293. line-height: calc( 1.4em + 0.2 * 1rem );
  294. }
  295. @media (min-width: 20em) {
  296. /* The (100vw - 20rem) / (50 - 20) part
  297. resolves to 0-1rem, depending on the
  298. viewport width (between 20em and 50em). */
  299. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  300. font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );
  301. line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );
  302. margin-left: 0;
  303. }
  304. h1 {
  305. font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  306. line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );
  307. }
  308. h2 {
  309. font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  310. line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );
  311. }
  312. h3 {
  313. font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  314. line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );
  315. }
  316. }
  317. @media (min-width: 50em) {
  318. /* The right part of the addition *must* be a
  319. rem value. In this example we *could* change
  320. the whole declaration to font-size:2.5rem,
  321. but if our baseline value was not expressed
  322. in rem we would have to use calc. */
  323. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  324. font-size: calc( 1rem + .6 * 1rem );
  325. line-height: 1.5em;
  326. }
  327. p, li, pre, details {
  328. margin-left: 3rem;
  329. }
  330. h1 {
  331. font-size: calc( 1.9rem + 1.5 * 1rem );
  332. line-height: 1.2em;
  333. }
  334. h2 {
  335. font-size: calc( 1.5rem + 1.5 * 1rem );
  336. line-height: 1.3em;
  337. }
  338. h3 {
  339. font-size: calc( 1.35rem + 1.5 * 1rem );
  340. line-height: 1.4em;
  341. }
  342. figure img {
  343. max-width: 500px;
  344. max-height: 500px;
  345. }
  346. }
  347. figure.unsquared {
  348. margin-bottom: 1.5rem;
  349. }
  350. figure.unsquared img {
  351. height: inherit;
  352. }
  353. @media print {
  354. body { font-size: 100%; }
  355. a:after { content: " (" attr(href) ")"; }
  356. a, a:link, a:visited, a:after {
  357. text-decoration: underline;
  358. text-shadow: none !important;
  359. background-image: none !important;
  360. background: white;
  361. color: black;
  362. }
  363. abbr[title] { border-bottom: 0; }
  364. abbr[title]:after { content: " (" attr(title) ")"; }
  365. img { page-break-inside: avoid; }
  366. @page { margin: 2cm .5cm; }
  367. h1, h2, h3 { page-break-after: avoid; }
  368. p3 { orphans: 3; widows: 3; }
  369. img {
  370. max-width: 250px !important;
  371. max-height: 250px !important;
  372. }
  373. nav, aside { display: none; }
  374. }
  375. ul.with_columns {
  376. column-count: 1;
  377. }
  378. @media (min-width: 20em) {
  379. ul.with_columns {
  380. column-count: 2;
  381. }
  382. }
  383. @media (min-width: 50em) {
  384. ul.with_columns {
  385. column-count: 3;
  386. }
  387. }
  388. ul.with_two_columns {
  389. column-count: 1;
  390. }
  391. @media (min-width: 20em) {
  392. ul.with_two_columns {
  393. column-count: 1;
  394. }
  395. }
  396. @media (min-width: 50em) {
  397. ul.with_two_columns {
  398. column-count: 2;
  399. }
  400. }
  401. .gallery {
  402. display: flex;
  403. flex-wrap: wrap;
  404. justify-content: space-around;
  405. }
  406. .gallery figure img {
  407. margin-left: 1rem;
  408. margin-right: 1rem;
  409. }
  410. .gallery figure figcaption {
  411. font-family: 'ConcourseT3'
  412. }
  413. footer {
  414. font-family: 'ConcourseT3';
  415. display: flex;
  416. flex-direction: column;
  417. border-top: 3px solid white;
  418. padding: 4rem 0;
  419. background-color: #07486c;
  420. color: white;
  421. }
  422. footer > * {
  423. max-width: 50rem;
  424. margin: 0 auto;
  425. }
  426. footer a {
  427. color: #f1c40f;
  428. }
  429. footer .avatar {
  430. width: 200px;
  431. height: 200px;
  432. border-radius: 50%;
  433. float: left;
  434. -webkit-shape-outside: circle();
  435. shape-outside: circle();
  436. margin-right: 2rem;
  437. padding: 2px 5px 5px 2px;
  438. background: white;
  439. border-left: 1px solid #f1c40f;
  440. border-top: 1px solid #f1c40f;
  441. border-right: 5px solid #f1c40f;
  442. border-bottom: 5px solid #f1c40f;
  443. }
  444. </style>
  445. <h1 class="single">
  446. <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  447. Cours IUT : Évaluation et Bilan
  448. <time>Publié le 9 décembre 2014</time>
  449. </h1>
  450. <article class="single">
  451. <blockquote>
  452. <p>Supprimer les notes, c’est assurément une façon de se recentrer sur l’apprentissage ; c’est arrêter de chiffrer quelque chose qui n’est pas chiffrable. Mais, arrêter la note ne veut pas dire arrêter d’évaluer, car, bien évidemment, l’étudiant a besoin de repères, de savoir où il en est. Quand il n’y arrive pas, il le sait : il n’a pas besoin de recevoir une mauvaise note. Il faut trouver comment stimuler son envie de continuer à apprendre, alors que la mauvaise note, en général, lui donne envie de ne plus essayer. La note, pour les bons élèves, sert de carotte : elle est intéressante en terme d’émulation. Mais il faut trouver une autre façon de stimuler l’apprentissage : en disant à la personne que ce qu’elle fait est bien, qu’elle peut être fière d’elle. Si l’enthousiasme est réveillé, elle aura envie de continuer à apprendre.</p>
  453. <p><cite><em><a href="http://www.kaizen-magazine.com/isabelle-peloux-supprimer-les-notes-une-facon-de-se-recentrer-sur-lapprentissage/">Isabelle Peloux : Passer de la note à l’évaluation</a></em></cite></p>
  454. </blockquote>
  455. <p><strong>Je suis contre le système de notation actuel.</strong> Mais il faut pourtant que j’attribue une note à chaque élève. Alors je vais essayer de transformer cela en auto-évaluation. À partir d’un exercice imposé sur une heure, seuls (mais connectés) face à la page blanche, essayer de produire quelque chose à partir des concepts que j’ai essayé de leur transmettre. <em>Au final l’évaluation sera davantage intéressante pour moi.</em> Qu’ont-ils retenu de ces 24 heures passées ensemble ? Un peu, beaucoup, rien du tout ?</p>
  456. <p>Le débriefing/correction sera l’occasion de faire un bilan de ce que l’on a abordé ensemble. D’analyser ce qu’il manque à ce cours pour être plus pertinent et plus engageant. De vérifier qu’il a répondu à leurs craintes initiales. Mon bilan personnel est assez mitigé :</p>
  457. <ul>
  458. <li>la responsable de la promotion est très réactive et compréhensive mais le service technique de la fac est clairement en position de « difficultateur » ;</li>
  459. <li>j’ai pris du plaisir à transmettre des concepts aux élèves mais cela manque cruellement de recul sur la profession ;</li>
  460. <li>les étudiants sont demandeurs mais il faut que ça reste dans le cadre de leurs heures de cours ;</li>
  461. <li>le fil rouge du cours (projet personnel) est motivant mais manque de finitions faute de temps.</li>
  462. </ul>
  463. <p>Malgré ces retenues, <strong>le bilan est globalement positif</strong> et j’espère pouvoir participer par la suite plus en amont pour orienter le programme afin qu’il réponde un peu mieux aux enjeux et pratiques du métier.</p>
  464. <blockquote>
  465. <p>C’est en observant nos deux apprentis tantôt réussir, tantôt échouer, que je fus soudain prise d’empathie. J’ai repensé à mes propres débuts.</p>
  466. <p>J’ai alors eu envie de les aider. Au quotidien, j’essaie de les aider du mieux que je peux, bien que cette aide ne soit pas toujours facile à caser dans un rythme de production soutenu.</p>
  467. <p>C’est pourquoi je publie ici les 24 conseils que j’aurais voulu qu’on me donne aussi quand j’ai débuté, afin que cela puisse servir à d’autres débutants… quitte à prendre moi-même un petit coup de vieux !</p>
  468. <p><cite><em><a href="http://www.24joursdeweb.fr/2014/24-conseils-que-j-aurais-voulu-que-l-on-me-donne-quand-j-ai-debute/">24 conseils que j’aurais voulu que l’on me donne quand j’ai débuté</a></em></cite></p>
  469. </blockquote>
  470. <p>Quelques conseils que j’aimerais leur donner pour la suite :</p>
  471. <ul>
  472. <li><em>Ce que vous avez appris aujourd’hui sera faux demain.</em> Vous devez continuer à expérimenter par vous-même et pratiquer une veille au quotidien ;</li>
  473. <li><em>Validez vos acquis par la transmission.</em> Je n’ai jamais autant appris qu’en essayant de partager le peu que je savais déjà sur le sujet ;</li>
  474. <li><em>Publiez votre travail.</em> Même si ça vous semble parfois dérisoire, racontez le processus qui vous a permis d’arriver à ce résultat ;</li>
  475. <li><em>Rencontrez vos pairs.</em> Rencontrez vos interlocuteurs. Rencontrez vos utilisateurs.</li>
  476. </ul>
  477. </article>
  478. <section>
  479. <h3>Discussion suite à l’article :</h3>
  480. <article id="comment-1" class="comment">
  481. <p>Dommage que cette série s’achève, elle était plus qu’intéressante. Que ce soit pour les explications ou tes impressions personnelles.</p>
  482. <p>Quand je lisais le début de ton billet à propos des évaluations. J’avais une idée qui germait et puis finalement tu le dis en suspens pour ton bilan.</p>
  483. <blockquote>
  484. <p>Validez vos acquis par la transmission.</p>
  485. </blockquote>
  486. <p>Peut-être que ton évaluation est là et ce qu’il faudrait pouvoir faire est la capacité d’un élève à enseigner à un autre élève débutant. De savoir s’il peut transmettre ce qu’il a appris (donc assimiler). En plus cela favorise, la notion du travail d’équipe, de partage au sein d’une entreprise ou de la société.</p>
  487. <p>Enjeux : L’industrialisation des processus de savoir où il faut enseigner à 20 élèves à la fois et évaluer 20 élèves en même temps pour économiser de l’argent. ;)</p>
  488. <p><cite>Karl Dubost, le <a href="#comment-1">2014-12-10 à 05:19</a></cite></p>
  489. </article>
  490. <article id="comment-2" class="comment">
  491. <blockquote>
  492. <p>Peut-être que ton évaluation est là et ce qu’il faudrait pouvoir faire est la capacité d’un élève à enseigner à un autre élève débutant. De savoir s’il peut transmettre ce qu’il a appris (donc assimiler). En plus cela favorise, la notion du travail d’équipe, de partage au sein d’une entreprise ou de la société.</p>
  493. </blockquote>
  494. <p>Je rejoins complètement cette idée qui n’est pas vraiment nouvelle : on apprend de toute façons mieux quand, en parallèle, on enseigne. </p>
  495. <p>C’est d’ailleurs ce constat qui nous a amené à créer <a href="https://traindrop.github.io/">TrainDrop</a> avec Rémy et Delphine (on démarre à peine) : l’offre d’auto-formation est top (je ne vais pas citer tous les MOOC en ligne), mais celle dédiée à la formation (avec un professeur qui dirige l’enseignement) est bien plus réduite. Nous essayons de contribuer des fiches pour enseigner, qui correspondent à des petits exercices que les étudiants peuvent faire, puis éventuellement réutiliser après.</p>
  496. <p>Concrètement, je vais me servir de ces fiches dès janvier chez Ingésup Bordeaux pour des étudiants BAC+2 dans des cours orientés sur le RWD. Mais par la suite, je les accompagne aussi dans des travaux dirigés où eux-même devront se servir de ces mêmes fiches pour instruire des BAC+1 : j’espère qu’il retiendront mieux comme ça...</p>
  497. <p><cite>Boris Schapira, le <a href="#comment-2">2014-12-10 à 10:28</a></cite></p>
  498. </article>
  499. <article id="comment-3" class="comment">
  500. <blockquote>
  501. <p>Je rejoins complètement cette idée qui n’est pas vraiment nouvelle : on apprend de toute façons mieux quand, en parallèle, on enseigne.</p>
  502. </blockquote>
  503. <p>Ce que je trouve intéressant, de plus, c’est que si on a un peu d’honnêteté intellectuelle, on remet en question sa propre pratique, on la regarde avec du recul pour la théoriser quand on doit la transmettre.</p>
  504. <p>Au passage, ça permet aussi de voir qu’on se trompe :)</p>
  505. <p><cite>Stéphane Deschamps, le <a href="#comment-3">2014-12-11 à 00:10</a></cite></p>
  506. </article>
  507. </section>
  508. <figure class="image" property="schema:image">
  509. <img src="/static/david/blog/2014/cours-iut-evaluation-bilan.jpg" alt="" />
  510. </figure>
  511. <nav id="jumpto">
  512. <p>
  513. <a rel=prev href="/david/blog/2014/cours-iut-php-formulaires/">← Cours IUT : PHP et Formulaires</a> | <a href="/david/blog/" title="Retour à la liste des expériences">↑</a> | <a rel=next href="/david/blog/2014/lean-favelas/">Lean et favelas →</a>
  514. </p>
  515. </nav>
  516. <footer>
  517. <div>
  518. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  519. <p>
  520. Bonjour/Hi!
  521. Je suis <a href="/david/" title="Profil public">David&nbsp;Larlet</a>, je vis actuellement à Montréal et j’alimente cet espace depuis 15 ans. <br>
  522. Si tu as apprécié cette lecture, n’hésite pas à poursuivre ton exploration. Par exemple via les <a href="/david/blog/" title="Expériences bienveillantes">réflexions bimestrielles</a>, la <a href="/david/stream/2019/" title="Pensées (dés)articulées">veille hebdomadaire</a> ou en t’abonnant au <a href="/david/log/" title="S’abonner aux publications via RSS">flux RSS</a> (<a href="/david/blog/2019/flux-rss/" title="Tiens c’est quoi un flux RSS ?">so 2005</a>).
  523. </p>
  524. <p>
  525. Je m’intéresse à la place que je peux avoir dans ce monde. En tant qu’humain, en tant que membre d’une famille et en tant qu’associé d’une coopérative. De temps en temps, je fais aussi des <a href="https://github.com/davidbgk" title="Principalement sur Github mais aussi ailleurs">trucs techniques</a>. Et encore plus rarement, <a href="/david/talks/" title="En ce moment je laisse plutôt la place aux autres">j’en parle</a>.
  526. </p>
  527. <p>
  528. Les dernières publications hebdomadaires sont :
  529. </p>
  530. <ul class="with_columns">
  531. <li>
  532. <a href="/david/stream/2019/12/31/">Merci</a>
  533. </li>
  534. <li>
  535. <a href="/david/stream/2019/12/27/">Intemporels</a>
  536. </li>
  537. <li>
  538. <a href="/david/stream/2019/12/24/">Outils</a>
  539. </li>
  540. <li>
  541. <a href="/david/stream/2019/12/17/">Origines</a>
  542. </li>
  543. <li>
  544. <a href="/david/stream/2019/12/10/">Publier</a>
  545. </li>
  546. <li>
  547. <a href="/david/stream/2019/12/03/">En forêt</a>
  548. </li>
  549. <li>
  550. <a href="/david/stream/2019/11/26/">Ecocentric</a>
  551. </li>
  552. <li>
  553. <a href="/david/stream/2019/11/19/">Se livrer</a>
  554. </li>
  555. <li>
  556. <a href="/david/stream/2019/11/12/">Dépendances</a>
  557. </li>
  558. <li>
  559. <a href="/david/stream/2019/11/05/">Positif</a>
  560. </li>
  561. <li>
  562. <a href="/david/stream/2019/10/29/">Dettes</a>
  563. </li>
  564. <li>
  565. <a href="/david/stream/2019/10/22/">Privilèges</a>
  566. </li>
  567. <li>
  568. <a href="/david/stream/2019/10/15/">Discrétion</a>
  569. </li>
  570. <li>
  571. <a href="/david/stream/2019/10/08/">Désespérance</a>
  572. </li>
  573. <li>
  574. <a href="/david/stream/2019/10/01/">Présent</a>
  575. </li>
  576. <li>
  577. <a href="/david/stream/2019/09/24/">Manifester</a>
  578. </li>
  579. <li>
  580. <a href="/david/stream/2019/09/17/">Arpenter</a>
  581. </li>
  582. <li>
  583. <a href="/david/stream/2019/09/10/">Nostalgie</a>
  584. </li>
  585. <li>
  586. <a href="/david/stream/2019/09/03/">Déconstruire</a>
  587. </li>
  588. <li>
  589. <a href="/david/stream/2019/08/27/">Documenter</a>
  590. </li>
  591. <li>
  592. <a href="/david/stream/2019/08/20/">Frustration</a>
  593. </li>
  594. <li>
  595. <a href="/david/stream/2019/08/13/">Holisme</a>
  596. </li>
  597. <li>
  598. <a href="/david/stream/2019/08/06/">1%</a>
  599. </li>
  600. <li>
  601. <a href="/david/stream/2019/07/30/">Exemplarité</a>
  602. </li>
  603. <li>
  604. <a href="/david/stream/2019/07/23/">Timelines</a>
  605. </li>
  606. <li>
  607. <a href="/david/stream/2019/07/16/">Écoute</a>
  608. </li>
  609. <li>
  610. <a href="/david/stream/2019/07/02/">Anxiété</a>
  611. </li>
  612. <li>
  613. <a href="/david/stream/2019/06/21/">À lier</a>
  614. </li>
  615. <li>
  616. <a href="/david/stream/2019/06/14/">Pauvreté</a>
  617. </li>
  618. <li>
  619. <a href="/david/stream/2019/06/07/">Amateur</a>
  620. </li>
  621. <li>
  622. <a href="/david/stream/2019/05/31/">Pollution</a>
  623. </li>
  624. <li>
  625. <a href="/david/stream/2019/05/24/">Apaisement</a>
  626. </li>
  627. <li>
  628. <a href="/david/stream/2019/05/10/">Folie</a>
  629. </li>
  630. <li>
  631. <a href="/david/stream/2019/05/03/">Sympathie</a>
  632. </li>
  633. <li>
  634. <a href="/david/stream/2019/04/12/">Péremption</a>
  635. </li>
  636. <li>
  637. <a href="/david/stream/2019/04/05/">Définitions</a>
  638. </li>
  639. <li>
  640. <a href="/david/stream/2019/03/29/">Acceptation</a>
  641. </li>
  642. <li>
  643. <a href="/david/stream/2019/03/22/">Dissonance</a>
  644. </li>
  645. <li>
  646. <a href="/david/stream/2019/03/15/">Reconnaissance</a>
  647. </li>
  648. <li>
  649. <a href="/david/stream/2019/03/08/">Lecture</a>
  650. </li>
  651. <li>
  652. <a href="/david/stream/2019/03/01/">Journaux</a>
  653. </li>
  654. <li>
  655. <a href="/david/stream/2019/02/22/">Écriture</a>
  656. </li>
  657. <li>
  658. <a href="/david/stream/2019/02/15/">Kyriarchie</a>
  659. </li>
  660. <li>
  661. <a href="/david/stream/2019/02/08/">Mots-serrures</a>
  662. </li>
  663. <li>
  664. <a href="/david/stream/2019/02/01/">Sans voie</a>
  665. </li>
  666. <li>
  667. <a href="/david/stream/2019/01/25/">Auto-diagnostic</a>
  668. </li>
  669. <li>
  670. <a href="/david/stream/2019/01/18/">Agilité</a>
  671. </li>
  672. <li>
  673. <a href="/david/stream/2019/01/11/">Métaphores</a>
  674. </li>
  675. <li>
  676. <a href="/david/stream/2019/01/04/">Balbutiements</a>
  677. </li>
  678. </ul>
  679. <p>
  680. Voici quelques articles choisis :
  681. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  682. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  683. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  684. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  685. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  686. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  687. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  688. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  689. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  690. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  691. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  692. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  693. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  694. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  695. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  696. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  697. </p>
  698. <p>
  699. On peut <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">échanger par courriel</a>. Si éventuellement tu souhaites que l’on travaille ensemble, tu devrais commencer par consulter le <a href="http://larlet.com">profil dédié à mon activité professionnelle</a> et/ou contacter directement <a href="http://scopyleft.fr/">scopyleft</a>, la <abbr title="Société coopérative et participative">SCOP</abbr> dont je fais partie depuis six ans. Je recommande au préalable de lire <a href="/david/blog/2018/cout-site/" title="Attention ce qui va suivre peut vous choquer">combien coûte un site</a> et pourquoi je suis plutôt favorable à une <a href="/david/pro/devis/" title="Discutons-en !">non-demande de devis</a>.
  700. </p>
  701. <p>
  702. Je ne traque pas ta navigation mais mon
  703. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  704. conserve des logs d’accès.
  705. </p>
  706. </div>
  707. </footer>
  708. <script type="text/javascript">
  709. ;(_ => {
  710. const jumper = document.getElementById('jumper')
  711. jumper.addEventListener('click', e => {
  712. e.preventDefault()
  713. const anchor = e.target.getAttribute('href')
  714. const targetEl = document.getElementById(anchor.substring(1))
  715. targetEl.scrollIntoView({behavior: 'smooth'})
  716. })
  717. })()
  718. </script>
  719. <script>
  720. /* Service workers */
  721. if (navigator.serviceWorker) {
  722. window.addEventListener('load', function () {
  723. var selector = 'a[href^="/david/cache/"], a[rel=prev], a[rel=next]'
  724. function sendLinks (selector) {
  725. var links = [].slice.call(document.querySelectorAll(selector)).map(function (link) {
  726. return link.getAttribute('href')
  727. })
  728. links.push(location.pathname) // Put the current page in cache too.
  729. navigator.serviceWorker.controller.postMessage({ links: links })
  730. }
  731. navigator.serviceWorker.getRegistration()
  732. .then(function (registration) {
  733. if (!registration || !navigator.serviceWorker.controller) {
  734. return navigator.serviceWorker.register('/serviceworker.js')
  735. .then(navigator.serviceWorker.ready)
  736. .then(function () {
  737. console.log('[ServiceWorker] Ready to go!')
  738. })
  739. .catch(console.error.bind(console))
  740. } else {
  741. console.log('[ServiceWorker] Send links via registration')
  742. sendLinks(selector)
  743. }
  744. })
  745. navigator.serviceWorker.addEventListener('controllerchange', function () {
  746. console.log('[ServiceWorker] Send links via controller change')
  747. sendLinks(selector)
  748. })
  749. navigator.serviceWorker.addEventListener('message', function (event) {
  750. var link = document.querySelector('a[href="' + event.data.link + '"]')
  751. if (event.data.status && link) {
  752. link.style.backgroundColor = '#2d7474'
  753. link.style.color = '#f0f0ea'
  754. link.setAttribute('title', 'En cache pour consultation sans connexion')
  755. }
  756. })
  757. })
  758. } else {
  759. console.warn('[ServiceWorker] No cache for old browsers.')
  760. }
  761. </script>