Hello world

Phase 0 : Rentrée scolaire

Pour commencer l’année en douceur on à réaliser ce mini projet. Cela nous mettait dans le bain dès la rentrée scolaire. Son nom est Hello World il consistait à mettre en code toutes les bases apprise durant 2 semaines.

Avant d’expliquer quels ont été les bases à devoir appliquer, j’aimerais mettre une mise en contexte de ce projet, c’est une évaluation non coté qui vise à visualiser ou nous en somme dans l’apprentissage du code html et css via un feedback fait par les profs afin de nous améliorer pour la vrai évaluation que vous êtes en train de lire actuellement.

Pour les bases en html on a apprit plein de choses intéréssente mais fondamentale afin d’avoir des bonnes pratiques.

Dans un premier temps, on a apprit la structure de base de l’html illustré par la photo ci dessous. Cette structure sera le squelette de notre code en html ce sera toujours à partir de ca qu’on commence à coder.

Dans ce squelette on a le «head» qui sert à mettre tous les éléments qui ne seront pas directement visible comme le titre du document, les méta de partage qui comprenne le lien du document ou bien une image lié à ce lien lors du partage de notre site web via un lien.

Ensuite il y a le «body» qui lui est l’inverse du «head» c’est la ou tout ce qui sera visible directement sur la page web se trouvera dedans. Ce «body» est divisé en trois

Header

Il comprend généralement notre navigation et des éléments comme un logo ou diverse identité visuels si besoin.

1

2

3

Main

Ensuite on peut parler du main, cette partie du code comprend le contenu textuel et imagé dans son ensemble. Ce sera le titre, les sous-titres, les paragraphes, boutons, lien, images.

1

2

3

Footer

Qaund au footer, c'est comme un pied de page regroupant des informations générales qui ne sont pas considéré comme notre contenu principale comme les liens de partage des réseaux sociaux, nos crédits, ect...

1

2

3

Voici quelques exemples de balise de base qui se trouve dans le body parmit le header main et le footer

Balise "p"

Cette balise sert à introduire notre texte qui sert de contenu de base à la page web.

1

2

3

4

5

Balise "a"

Cette balise sert à crée des liens pour voyager d'une page à l'autre, c'est grâçe a cette balise qu'un site peux posséder différente interface.

1

2

3

4

5

Balise "h1,h2,..."

Ces balises la sont les titres et les sous titres. Le "h1" sera toujours le titre et on va ensuite utiliser des "h2,h3,..." pour les sous titre. plus on monte dans les chiffres plus c'est un sous sous-titre.

1

2

3

4

5

Balise "img"

Cette balise sert à intégrer des images dans la page web afin d'accompagner certain contenu textuel qui en on besoin.

1

2

3

4

5

Balise "btn"

Cette balise sert à mettre des bouton pour intéragir avec des éléments comme faire des sliders ou pour switch entre plusieurs contenus textuels ou visuels.

1

2

3

4

5

À présent je vais vous parlé de mon projet en tant que tel. Pour celui ci j’avais déjà les bases en question depuis 1an donc il ne m’a pas pris énormément de temps en 1heure il était finalisé.

Je suis parti comme vous le voyez ci-dessus sur une DA simple avec des grandes marges comme j’aime souvent le faire, ici je ne l’ai pas fais mais j’ai pour habitude d’avoir beaucoup d’arrondis dans mes designs en générale c’est un peu ma signature dans mon identité visuelle.

Lorsque j’ai voulu faire validé le projet j’ai du repasser en revue mes alignements verticaux ainsi que l’impact visuel de mon titre car il paraissait sobre avec le texte qui étais pas assez différents du titres en gros il n’était pas assez mis en valeur.