ISCOM::HTML/CSS::session6 (20141119)

Click here to load reader

  • date post

    09-Jul-2015
  • Category

    Internet

  • view

    251
  • download

    0

Embed Size (px)

description

ISCOM::HTML/CSS::session6 (20141119)

Transcript of ISCOM::HTML/CSS::session6 (20141119)

  • Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 1

    Cours HTML / CSSLearn to code

    HTML/CSS easily

  • Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52

    Cours HTML / CSS

    6 Sessions de ~3 heures > ~18 heures au total,

    A chaque sessions aura des objectifs atteindre pour pouvoir continuer la prochaine session,

    30% de thorie et 70% de pratique,

    Finalit : Monter un site en HTML / CSS responsive,

    En bonus, utilisation doutil de versioning

    2

  • Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52

    Rappel du projet

    3

  • Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 4

  • Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52

    Balises meta

    5

  • Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52

    Balises meta Une balise meta est une information sur la nature et le contenu dune page web, ajoute dans len-

    tte de la page au moyen de marqueurs HTML.

    Depuis quelques mois, le nombre de balise meta a considrablement augmenter.

    Nous avons :

    les balises de base (meta charset, viewport, )

    les balises utile pour le rfrencement (meta description, keywords, title, favicon, ),

    les balises de partage social (opengraph) (meta og:title, og:description, ),

    les balises de personnalisation (meta apple-touch-icon, msapplication-TileColor, ),

    les balises personnalises (vos propres meta non compatible W3C).

    6

  • Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52

    Balises meta

    Une liste non exhaustive est disponible dans ce repository :

    https://github.com/icom-nicolasaguenot/metalist

    Vous pouvez le rcuprer sur vos instances locales en faisant un git clone :

    git clone git@github.com:icom-nicolasaguenot/metalist.git

    7

  • Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52

    La syntaxe MarkDown (fichiers *.md)

    Cette syntaxe est simple prendre en main et permet de crer des fichiers lisible rapidement par les intervenants dun projet.

    Toute la syntaxe est prsente ici :

    http://bit.ly/1CsYJDL Lien complet : https://github.com/fletcher/MultiMarkdown/blob/master/Documentation/Markdown%20Syntax.md

    8

  • Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52

    Exercice final Crer un fichier myProject.md dans votre repository GIT.

    Si vous avez du mal crer le mme fichier :

    http://bit.ly/1xpnIbc

    Intgrer le contenu comme sur limage droite.

    Rpondez ces 3 questions en argumentant vos rponses :

    Pourquoi mon projet est-il organis de cette manire ? (Avantages et inconvnient de cette organisation)

    Comment suis-je arriv ce rsultat ? (Diffrentes tapes, problmatiques dorganisation)

    Quelles sont les difficults rencontrs durant ces 6 sessions ?

    Une fois termin, dernier commit -m final commit et dernier push.

    9

  • Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52

    Des questions ?

    10