Workshop HTML/CSS pour débutants

#FreelanceFair #Rennes #LeVivierRennais - Vous êtes graphiste, webdesigner, chef de projet, marketeux ou exercez une profession qui touche au web de près ou de loin ? Vous souhaitez en apprendre plus sur les bases du développement de site web et faire évoluer vos compétences ? Cet atelier sera l’occasion de mettre les main dans le HTML/CSS afin de réaliser une page web simple et découvrir le fonctionnement de l’intégration web.

Transcript

1. Ma première page web Workshop Introduction HTML/CSS kbizien. Freelance Fair
2. Freelancefair @kbizien #freelancefair Kevin Bizien Creative developer cssflip. kbizien.
3. Freelancefair @kbizien #freelancefair Fédérons les compétences et transformons le territoire rennais ensemble ! Derrière Le Vivier Rennais se regroupent des professionnel.le.s du bassin de Rennes qui souhaitent valoriser des compétences et des expertises auprès des entreprises, des associations, des étudiants... Par le biais de rencontres et d'événements, Le Vivier Rennais souhaite développer des échanges au sein des différents réseaux existants et favoriser les occasions de travailler ensemble. https://rennes.levivier.net/
4. Freelancefair @kbizien #freelancefair
5. Freelancefair @kbizien #freelancefair Le navigateur envoie l’URL (requête HTTP vers l’adresse IP du serveur) Le serveur renvoie la page HTML CLIENT SERVEUR
6. Freelancefair @kbizien #freelancefair Place au code !
7. Freelancefair @kbizien #freelancefair Sublime Text https://www.sublimetext.com
8. Freelancefair @kbizien #freelancefair Projet Github https://github.com/KBizien/beginners-html-css
9. Freelancefair @kbizien #freelancefair Ouvrir index.html dans votre navigateur favoris
10. Freelancefair @kbizien #freelancefair
11. Freelancefair @kbizien #freelancefair Ajouter du texte dans le body
12. Freelancefair @kbizien #freelancefair Balises HTML
13. Freelancefair @kbizien #freelancefair Balises HTML format de texte
14. Freelancefair @kbizien #freelancefair Attributs HTML
15. Freelancefair @kbizien #freelancefair Construction d’une page HTML simple
16. Freelancefair @kbizien #freelancefair Cool, mais c’est pas très esthétique tout ça !
17. Freelancefair @kbizien #freelancefair CSS
18. Freelancefair @kbizien #freelancefair CSS
19. Freelancefair @kbizien #freelancefair CSS
20. Freelancefair @kbizien #freelancefair CSS
21. Freelancefair @kbizien #freelancefair CSS • selector correspond au nom de l'élément HTML ou sélecteur CSS. Les sélecteurs servent à cibler les éléments auxquels nous souhaitons attribuer des styles • property correspond à l'effet de style que l'on souhaite appliquer. CSS dispose d'un ensemble de propriétés permettant la mise en forme d'éléments • value correspond à la valeur de la propriété que l'on souhaite appliquer
22. Freelancefair @kbizien #freelancefair
23. Freelancefair @kbizien #freelancefair Cibler des éléments précisément
24. Freelancefair @kbizien #freelancefair
25. Freelancefair @kbizien #freelancefair • id ==> un seul élément d’une page HTML • class ==> autant d'éléments que l'on souhaite id vs class
26. Freelancefair @kbizien #freelancefair Styler notre page HTML simple
27. Freelancefair @kbizien #freelancefair Au boulot ! Retrouvez dans le projet la maquette d’une page web (wireframe et design UI), ainsi qu’un lien vers les specifications de ce design. Voyons ensemble ce qu’il en est…
28. Freelancefair @kbizien #freelancefair Kevin Bizien @kbizien bonjour@kevinbizien.com www.kevinbizien.com Creative developer Merci.