Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

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

528 vues

Publié le

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

Publié dans : Internet
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

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

  1. 1. Cours HTML / CSS Learn to code HTML/CSS easily Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 1
  2. 2. 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 théorie et 70% de pratique, • Finalité : Monter un site en HTML / CSS responsive, • En bonus, utilisation d’outil de versioning Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 2
  3. 3. Rappel du projet Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 3
  4. 4. Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 4
  5. 5. Balises meta Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 5
  6. 6. Balises meta • Une balise meta est une information sur la nature et le contenu d’une page web, ajoutée dans l’en-tête de la page au moyen de marqueurs HTML. • Depuis quelques mois, le nombre de balise meta a considérablement augmenter. • Nous avons : • les balises de base (meta charset, viewport, …) • les balises utile pour le référencement (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 personnalisées (vos propres meta non compatible W3C). Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 6
  7. 7. Balises meta • Une liste non exhaustive est disponible dans ce repository : https://github.com/icom-nicolasaguenot/metalist • Vous pouvez le récupérer sur vos instances locales en faisant un git clone : git clone git@github.com:icom-nicolasaguenot/metalist.git Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 7
  8. 8. La syntaxe MarkDown (fichiers *.md) • Cette syntaxe est simple à prendre en main et permet de créer des fichiers lisible rapidement par les intervenants d’un projet. • Toute la syntaxe est présentée ici : http://bit.ly/1CsYJDL Lien complet : https://github.com/fletcher/MultiMarkdown/blob/master/Documentation/Markdown%20Syntax.md Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 8
  9. 9. Exercice final • Créer un fichier myProject.md dans votre repository GIT. • Si vous avez du mal à créer le même fichier : http://bit.ly/1xpnIbc • Intégrer le contenu comme sur l’image à droite. • Répondez à ces 3 questions en argumentant vos réponses : • Pourquoi mon projet est-il organisé de cette manière ? (Avantages et inconvénient de cette organisation) • Comment suis-je arrivé à ce résultat ? (Différentes étapes, problématiques d’organisation) • Quelles sont les difficultés rencontrés durant ces 6 sessions ? • Une fois terminé, dernier commit -m ‘final commit’ et dernier push. Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 9
  10. 10. Des questions ? Nicolas AGUENOT - Freelance web developer - contact@nicolasaguenot.com - +33 (0)6 27 32 20 52 10

×