Maison >interface Web >tutoriel CSS >Semaine f #DaysOfCode : Flexbox, typographie, accessibilité et plus !
Jour 8 : Aujourd'hui, j'ai terminé le module "Apprendre CSS Flexbox en créant une galerie de photos" sur #freeCodeCamp ! ? Flexbox est un outil essentiel pour les mises en page réactives, et j'ai appris à aligner des images, à créer des grilles flexibles et à structurer une belle galerie de photos réactive. C'est passionnant de voir à quel point Flexbox peut être puissant lorsqu'il s'agit de rendre des mises en page flexibles et adaptatives. Je me sens plus en confiance maintenant ! ?
Jour 9 : La journée d'aujourd'hui était consacrée à la typographie dans la conception de sites Web. J'ai étudié les familles de polices, les épaisseurs de police et l'espacement des lettres pour améliorer la lisibilité et donner à mes créations un aspect plus soigné et professionnel. La typographie comporte de nombreux détails subtils et je commence à comprendre comment des éléments tels que la taille et l’espacement des polices peuvent améliorer considérablement l’expérience utilisateur. ?
Jour 10 : Réalisation d'un projet de quiz pour apprendre l'accessibilité sur #freeCodeCamp. Ce projet m'a mis au défi de réfléchir à l'accessibilité du Web et à la manière de rendre les sites Web accessibles à tous, quel que soit leur handicap. S'assurer que tous les éléments étaient correctement stylés était difficile, mais il est satisfaisant de savoir que je crée des conceptions Web plus inclusives. Cela m'a également fait réaliser que je devais approfondir le HTML et le CSS pour maîtriser les concepts de base. ?
Jour 11 : J'ai passé des heures à plonger profondément dans HTML et CSS via #W3Schools. Je n’avais jamais réalisé à quel point CSS était vaste : il est bien plus étendu que ce que j’imaginais ! Du style de base aux animations complexes, il y a tant de choses à apprendre. Je suis toujours en train de lire, mais j'ai hâte d'appliquer ce que j'ai appris jusqu'à présent. ?
Jour 12 : Réalisation d'un projet de page d'hommage dédié au Dr Norman Borlaug en utilisant HTML & CSS ! ? C'était un autre défi de #freeCodeCamp. J'ai beaucoup appris sur les mises en page, les légendes d'images et le design réactif. C’était un défi mais gratifiant, et je suis content du résultat. Ces jours-ci, j'ai approfondi le CSS via #W3Schools, et cela m'aide à mieux comprendre des concepts qui étaient difficiles pour moi auparavant. CSS est énorme, mais j'apprécie le voyage jusqu'à présent ! ?
Jour 13 : J'ai travaillé sur mon projet "En savoir plus sur le pseudo-en-construisant-un-bilan". Ce projet m'a fait découvrir les pseudo-éléments et pseudo-classes en CSS. C'était un concept assez nouveau, mais apprendre à styliser des parties spécifiques d'éléments sans ajouter de code HTML supplémentaire était époustouflant. Ce projet m'a permis de mieux comprendre les sélecteurs CSS et leur puissance.
Jour 14 : J'ai terminé mon projet "Apprendre le CSS intermédiaire en construisant un chat-peinture". C'était un défi super créatif ! Utiliser CSS pour créer des illustrations a été une expérience unique. Il a fallu un certain temps pour obtenir les bonnes formes et couleurs, mais le processus m'a donné une nouvelle appréciation de ce que CSS peut faire au-delà des mises en page et du style : c'est aussi un outil pour l'art !
Défis :
Flexbox a pris du temps à maîtriser, mais maintenant je me sens plus en confiance pour les conceptions réactives.
La typographie, bien qu'apparemment simple, a nécessité de nombreux ajustements pour rendre le texte à la fois lisible et visuellement attrayant.
L'accessibilité était le plus grand défi : il était difficile de concilier une bonne conception avec les normes d'accessibilité, mais je fais des progrès.
Les pseudo-éléments étaient délicats au début, mais je commence à comprendre comment ils peuvent améliorer le style sans ajouter de balisage supplémentaire.
Progrès jusqu'à présent :
Je suis plus à l'aise avec Flexbox pour les mises en page réactives.
La typographie commence à paraître plus intuitive et je mets en œuvre de meilleures pratiques.
J’ai acquis une meilleure appréciation de la conception Web accessible et j’y prête davantage attention dans mes projets.
Ma compréhension des pseudo-éléments CSS et de l'art CSS s'est élargie et j'ai hâte d'appliquer ces compétences dans de futurs projets.
Restez à l'écoute pour plus de mises à jour alors que je continue d'avancer dans mon voyage #100DaysOfCode ! ??
Voici un aperçu des codes HTML et CSS sur lesquels j'ai travaillé jusqu'à présent. Vous pouvez consulter mon référentiel GitHub où je documente tous mes progrès : https://github.com/heritech9/100-days-of-code.git
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!