Archives par mot-clé : lycée

Les jurys ont délibéré…

Bonjour à tous,

les jurys ont délibéré… voici les résultats, par catégorie d’âges.

Ecole

Le jury était composé de …

  • Olivier Dupuy, conseiller pédagogique départemental numérique, Côte-d’Or ;
  • Pascal Blaszyk et Stéphane Tank, animateurs TICE, ensemble, pour une voix représentant la Saône-et-Loire ;
  • Alain Le Luez, animateur TICE, Yonne ;
  • Jonathan Tessé, conseiller au numérique éducatif, DANE Dijon.

Il a nommé l’école élémentaire d’Etigny, pour son blog Mon village, ma géographie, comme grand gagnant de la catégorie école. Félicitations à ces élèves et leur professeur qui ont publié de nombreux et très variés articles, dans un cadre de lecture agréable. Nous vous encourageons à aller découvrir le blog : https://bte.region-academique-bfc.fr/mon-village-ma-geographie/

La professeure viendra chercher le prix le jour de l’UNA.

Collège / Lycée

Pour les catégories collège et lycée, le jury se prononçait sur la première phase qui définit les classes qui participeront à la grande finale le jour de l’UNA (21 septembre 2016). S’opposeront alors des sélections d’élèves (4 par classe retenue) accompagnés d’un  professeur.

La liste des collèges et lycées est donnée par ordre alphabétique des communes afin de ne pas trahir le premier classement (qui compte pour deux tiers du classement final).

Collège

Le jury était composé de :

  • Cécile De Joie, professeure d’histoire-géographie, interlocutrice académique numérique, lycée Parc des Chaumes, Avallon (89) ;
  • Emmanuelle Fleith, professeure en BTS communication, Groupe Arcades, Dijon ;
  • Yohan Goury, professeur de sciences physiques et référent numérique, collège Les Bruyères, La Clayette (Saône-et-Loire) ;
  • Clairelle Lestage, conseillère en numérique éducatif à la DANE Dijon ;
  • Fouzia Salihi, conseillère en numérique éducatif à la DANE Dijon ;
  • Olivier Vendeme, professeur de technologie, interlocuteur académique numérique, collège Louis Pasteur, Saint-Rémy (71).

Trois collèges se distinguent :

Nous attendons avec impatience de vous retrouver à l’UNA pour la grande finale de ce concours !

Lycée

Le jury était composé de :

  • Catherine Gratalori, professeure de BTS communication, Groupe Arcades, Dijon ;
  • Johann Jambu, professeur documentaliste, interlocuteur académique numérique, collège Rameau, Dijon ;
  • Clairelle Lestage, conseillère en numérique éducatif à la DANE Dijon ;

Au départ, nous devions sélectionner trois lycées, mais, deux équipes sont arrivées troisième ex æquo au vingtième de points près ! donc nous invitons quatre équipes pour la finale (rappel : la liste est donnée par ordre alphabétique des communes) :

Vivement la finale pour départager ces belles équipes !

Pour tous ces jurys, le choix a été difficile au vu de la qualité de l’ensemble des productions. Nous avons trouvé des élèves investis et motivés. Parfois, ce qui a fait la différence, c’est la prise en compte des droits (image, mentions légales, etc.).

Comme vous l’avez remarqué, il n’est pas fait mention de catégories (Design Blog, Free Blog, Project Blog) comme cela a été annoncé initialement. En effet, tous les blogs étaient inscrits à la catégorie Project Blog et très peu aux autres. Nous avons donc simplifié pour être juste. Cela nous montre des adaptations à réaliser pour la prochaine édition du concours…

Oui, mais pour gagner quoi ?

Nous avons tout au long de l’année chercher des sponsors. Un premier prix sera remis à l’équipe vainqueur par niveau. De nombreux autres lots seront offerts à l’ensemble des participants de ces finales. Une page présentera bientôt les sponsors de cette édition… nous gardons le suspens sur le détail des prix… Rendez-vous donc, participants et spectateurs, à la finale, le 21 septembre !

Du code oui, mais avec du style

Nous avons pu voir dans un précédent article comment construire une page web avec le langage HTML. Nous allons voir dans cet article comment lui donner du style avec un langage adapté, le CSS.

Le CSS (Cascading Style Sheets ou Feuille de style en cascade) permet de définir la présentation des document HTML et XML.

Avant d’aller plus loin, il est fortement conseillé d’avoir lu l‘article sur l’HTML.

Le style, la base…

Reprenons donc une structure basique de document HTML :

< !-- fichier index.html -->
<!doctype html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Ma page web</title>
        <link rel= « stylesheet » href= « ./css/style.css » >
    </head>
    <body>
        <h1>Mon premier site web!</h1>
    </body>
</html>
Base de notre page web
Base de notre page web

La ligne qui nous intéresse ici, est celle-ci :
<link rel= « stylesheet  » href=  » ./css/style.css  » >. Cette ligne de code, permet de dire au document HTML qu’un fichier CSS se trouve dans le répertoire css et son nom est style.css. C’est dans ce document que nous allons définir la présentation de notre document.

Admettons que nous voulions changer la couleur de fond de notre page web, pour la mettre en rouge. Le principe est le suivant : depuis la feuille de style, nous devons sélectionner l’élément HTML que nous voulons modifier, puis y définir des styles.

< !-- fichier css/style.css →
body {
   background : red ;
}

Sauvegardez le fichier, puis retourner sur votre navigateur et rafraichissez… Magie !

etape1

C’est finalement assez simple de définir une présentation pour un document :

  1. on définit quel élément nous voulons modifier
  2. entre accolades, on inscrit les différentes propriétés que l’on souhaite attribuer à l’élément.

Un autre exemple, avec notre balise de titre <h1>, nous allons changer la couleur du texte :

< !-- fichier css/style.css →
h1 {
   color: white ;
}

Sauvegardez le fichier, puis retournez sur votre navigateur et rafraichissez… Magie !

etape2

Le style, avec classe…

Il paraît évident que dans un même document HTML nous pouvons avoir plusieurs fois le même élément, par exemple dans un article, nous avons plusieurs balises <p> qui vont contenir tous les paragraphes. Alors comment faire pour en modifier qu’un seul ?

Reprenons notre document HTML :

< !-- fichier index.html -->
<!doctype html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Ma page web</title>
        <link rel="stylesheet" href="./css/style.css">
    </head>
    <body>
        <h1>Mon premier site web!</h1>
        <p>Mon premier paragraphe</p>
        <p>Mon deuxieme paragraphe</p>
    </body>
</html>

L’idée est de pouvoir modifier le style du second paragraphe, sans modifier le premier. Pour cela, nous utiliserons l’attribut class des éléments HTML, comme ceci :

< !-- fichier index.html -->
....
    <body>
        ....
        <p class="modifier">Mon deuxieme paragraphe</p>
    </body>
</html>
< !-- fichier css/style.css →
body {
    background : red ;
}
h1 {
    color: white ;
}
.modifier {
     background : black ;
     color : white ;
}

etape4

Nous avons donc rajouté une classe au paragraphe que nous voulions modifier. Si vous allez sur votre navigateur et que vous rafraîchissez vous pourrez voir les modifications.

Il existe énormément de sélecteurs en CSS. Pour en savoir plus, je vous conseille les sites suivants :

 

Vous pouvez faire des essais sur votre blog. En effet, avec le rôle Administrateur, dans Tableau de bord / Apparence, il existe une entrée « Modifier le CSS ». Vous pouvez ajouter le code nécessaire pour modifier l’apparence de votre blog, visualiser en aperçu ce que cela donnerait et enregistrer si cela vous convient. En cas d’erreur, il vous suffit d’effacer la ou les lignes correspondantes pour retrouver l’apparence d’origine.