Cela fait quelques semaines que j’apprends les langages HTML et CSS, et pour bien comprendre et intégrer ces deux technologies, il est important de mettre en pratique ses connaissances théoriques. Donc on m’a confié la tâche de dédier quelques heures par semaine au développement de mon propre blog ! Après avoir réalisé la maquette, je me mets à la réalisation du code en lui même…

 

Update #1

 

On commence par la base : j’apprends le HTML et le CSS, et je construis mon blog avec ces deux technologies.

 

 

HTML qu’est ce que c’est ?

 

C’est le squelette du site internet, un langage qui permet de créer des blocs et d’organiser une page. On doit faire attention à l’ordre dans lequel on écrit : les blocs créés sont “lu” de haut en bas et donc rangés en conséquence.

Exemple :

 

 

 

 

 

Hello World!

Welcome to the world of web development.

This is my first html web page.

 

 

 

Résultat : 

 

 

 

CSS qu’est ce que c’est ?

 

C’est ce qui permet de donner l’esthétique de la page, son design, c’est la musculature et la forme du corps pour reprendre la métaphore du “squelette HTML”. Par exemple la police, la taille, la couleur du contenu (titres, textes etc..) sont gérés en CSS.

 

 

Premiers pas en HTML et CSS

 

Une fois que j’ai relativement bien intégré la différence entre HTML et CSS, je me lance dans le grand bain : Je crée mes blocs en HTML avec mon titre, et mes blocs de menu pour l’instant. Je passe en CSS pour mettre en page, car sans CSS je ne vous dit pas la tête que ça a…

Heureusement que Charles me guide, car comprendre la logique de la construction d’un site internet prend du temps, alors je me trompe souvent. Donc je fonctionne par étapes : j’actualise le HTML ou le CSS à chaque fois que je fais une modif dans les blocs ou bien dans le design, et actualise la page web : qu’est ce qui a changé, est ce que c’est le résultat escompté ? Je travaille avec Google Chrome, ce qui me permet de faire un clic droit > inspecter la page, et en sélectionnant le sélecteur je comprend un peu mieux quel bloc je viens de modifier, pourquoi je me suis trompée et comment rectifier mon erreur. Rebelote, dans le code HTML, ou CSS, où j’effectue les modifications, j’actualise, etc….

Au bout de deux bonnes heures de codage, voilà un semblant de résultat :

(Cliquez  sur l'image pour l'agrandir)

C’est encore loin de la maquette que j’ai réalisée, mais c’est déjà un petit pas !

 

Conclusion de ces premiers pas dans le monde du développement web :

 

Il faut être patient

Il faut être très patient

Il faut être résolutif

Il faut aussi être créatif