{"id":104026,"date":"2021-10-19T16:36:24","date_gmt":"2021-10-19T14:36:24","guid":{"rendered":"http:\/\/fabnum.tech\/?p=104026"},"modified":"2021-10-20T00:11:21","modified_gmt":"2021-10-19T22:11:21","slug":"mes-premiers-pas","status":"publish","type":"post","link":"https:\/\/fabnum.tech\/index.php\/2021\/10\/19\/mes-premiers-pas\/","title":{"rendered":"Mes premiers pas"},"content":{"rendered":"

[vc_row unlock_row_content=\u00a0\u00bbyes\u00a0\u00bb row_height_percent=\u00a0\u00bb0″ override_padding=\u00a0\u00bbyes\u00a0\u00bb h_padding=\u00a0\u00bb0″ top_padding=\u00a0\u00bb0″ bottom_padding=\u00a0\u00bb0″ overlay_alpha=\u00a0\u00bb50″ equal_height=\u00a0\u00bbyes\u00a0\u00bb gutter_size=\u00a0\u00bb0″ column_width_percent=\u00a0\u00bb100″ shift_y=\u00a0\u00bb0″ z_index=\u00a0\u00bb0″ el_class=\u00a0\u00bbinverted-device-order\u00a0\u00bb][vc_column column_width_use_pixel=\u00a0\u00bbyes\u00a0\u00bb gutter_size=\u00a0\u00bb3″ override_padding=\u00a0\u00bbyes\u00a0\u00bb column_padding=\u00a0\u00bb5″ overlay_alpha=\u00a0\u00bb50″ shift_x=\u00a0\u00bb0″ shift_y=\u00a0\u00bb0″ shift_y_down=\u00a0\u00bb0″ z_index=\u00a0\u00bb0″ medium_width=\u00a0\u00bb0″ mobile_width=\u00a0\u00bb0″ width=\u00a0\u00bb1\/2″ column_width_pixel=\u00a0\u00bb528″][vc_custom_heading text_size=\u00a0\u00bbfontsize-155944″]Mon CV[\/vc_custom_heading][vc_column_text text_lead=\u00a0\u00bbyes\u00a0\u00bb]Je suis \u00e0 Simplon et je n’ai vraiment aucune exp\u00e9rience en programmation.\u00a0Jonathan, mon formateur, nous a montr\u00e9 quelques notions basiques afin de cr\u00e9er une page internet qui serait notre CV.[\/vc_column_text][vc_column_text text_lead=\u00a0\u00bbyes\u00a0\u00bb]A droite, ce sont mes premi\u00e8res lignes de code.\u00a0Je vais vous expliquer ce que ces lignes veulent dire.[\/vc_column_text][\/vc_column][vc_column column_width_percent=\u00a0\u00bb100″ gutter_size=\u00a0\u00bb3″ overlay_alpha=\u00a0\u00bb50″ shift_x=\u00a0\u00bb0″ shift_y=\u00a0\u00bb0″ shift_y_down=\u00a0\u00bb0″ z_index=\u00a0\u00bb0″ medium_width=\u00a0\u00bb0″ mobile_width=\u00a0\u00bb0″ width=\u00a0\u00bb1\/2″ mobile_height=\u00a0\u00bb340″][vc_single_image media=\u00a0\u00bb104030″ media_width_percent=\u00a0\u00bb100″ shape=\u00a0\u00bbimg-round\u00a0\u00bb radius=\u00a0\u00bbstd\u00a0\u00bb shadow=\u00a0\u00bbyes\u00a0\u00bb shadow_weight=\u00a0\u00bbstd\u00a0\u00bb css_animation=\u00a0\u00bbright-t-left\u00a0\u00bb animation_delay=\u00a0\u00bb400″][\/vc_column][\/vc_row][vc_row row_height_percent=\u00a0\u00bb50″ override_padding=\u00a0\u00bbyes\u00a0\u00bb h_padding=\u00a0\u00bb2″ top_padding=\u00a0\u00bb2″ bottom_padding=\u00a0\u00bb2″ overlay_alpha=\u00a0\u00bb50″ gutter_size=\u00a0\u00bb4″ column_width_percent=\u00a0\u00bb100″ shift_y=\u00a0\u00bb0″ z_index=\u00a0\u00bb0″][vc_column width=\u00a0\u00bb1\/2″][vc_single_image media=\u00a0\u00bb104034″ media_width_percent=\u00a0\u00bb100″ alignment=\u00a0\u00bbcenter\u00a0\u00bb shape=\u00a0\u00bbimg-round\u00a0\u00bb radius=\u00a0\u00bbstd\u00a0\u00bb shadow=\u00a0\u00bbyes\u00a0\u00bb shadow_weight=\u00a0\u00bbstd\u00a0\u00bb css_animation=\u00a0\u00bbright-t-left\u00a0\u00bb animation_delay=\u00a0\u00bb600″][\/vc_column][vc_column column_width_use_pixel=\u00a0\u00bbyes\u00a0\u00bb position_vertical=\u00a0\u00bbmiddle\u00a0\u00bb gutter_size=\u00a0\u00bb3″ overlay_alpha=\u00a0\u00bb50″ shift_x=\u00a0\u00bb0″ shift_y=\u00a0\u00bb0″ shift_y_down=\u00a0\u00bb0″ z_index=\u00a0\u00bb0″ medium_width=\u00a0\u00bb0″ mobile_width=\u00a0\u00bb0″ width=\u00a0\u00bb1\/2″ column_width_pixel=\u00a0\u00bb900″][vc_column_text text_lead=\u00a0\u00bbyes\u00a0\u00bb]L’\u00e9l\u00e9ment \u00a0<header><\/code><\/strong>\u00a0 repr\u00e9sente un ensemble de contenu introductif ou de contenu aidant \u00e0 la navigation. Il peut contenir des \u00e9l\u00e9ments de titre, mais aussi d’autres \u00e9l\u00e9ments tels qu’un logo, un formulaire de recherche, etc.<\/p>\n

Il permet de choisir les origines du site. Par exemple dans \u00ab\u00a0lang\u00a0\u00bb, nous avons mis \u00ab\u00a0FR\u00a0\u00bb pour pr\u00e9ciser que le site sera en fran\u00e7ais et que par cons\u00e9quent, il s’adressera \u00e0 un public francophone.<\/p>\n

Il y a aussi la balise <title> qui permet de donner un nom \u00e0 sa page quand il est dans un navigateur comme Google. Ici le titre de ma page et \u00ab\u00a0document\u00a0\u00bb alors quand il sera ouvert sur une page internet, il aura ce nom-l\u00e0 sur l’onglet de ma page web.[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=\u00a0\u00bb50″ override_padding=\u00a0\u00bbyes\u00a0\u00bb h_padding=\u00a0\u00bb2″ top_padding=\u00a0\u00bb2″ bottom_padding=\u00a0\u00bb5″ overlay_alpha=\u00a0\u00bb50″ gutter_size=\u00a0\u00bb4″ column_width_percent=\u00a0\u00bb100″ shift_y=\u00a0\u00bb0″ z_index=\u00a0\u00bb0″][vc_column column_width_use_pixel=\u00a0\u00bbyes\u00a0\u00bb position_vertical=\u00a0\u00bbmiddle\u00a0\u00bb gutter_size=\u00a0\u00bb3″ overlay_alpha=\u00a0\u00bb50″ shift_x=\u00a0\u00bb0″ shift_y=\u00a0\u00bb0″ shift_y_down=\u00a0\u00bb0″ z_index=\u00a0\u00bb0″ medium_width=\u00a0\u00bb0″ mobile_width=\u00a0\u00bb0″ width=\u00a0\u00bb1\/2″ column_width_pixel=\u00a0\u00bb900″][vc_column_text text_lead=\u00a0\u00bbyes\u00a0\u00bb]Le, il s\u2019agit de la partis coordonn\u00e9es de mon CV. Mais tout d\u2019abord, lorsque qu\u2019on \u00e9dite des lignes de code, il faut les mettre entre les balises ouvrante (<body>) et fermante(<\/body>).<\/p>\n

Le <header> est le squelette d\u2019un site et le <body> le corps. Tout ce qui est visible par l\u2019utilisateur est dedans.<\/p>\n

Ensuite, il y a les balises <h2> <\/h2>.<\/p>\n

C\u2019est une balise qui permet de mettre des titres de diff\u00e9rentes tailles dont la plus grande est le <h1> utiliser pour le titre principal d\u2019une page et le <h6> utiliser la plus part du temps pour les footers ( les petits textes en bas des pages internet \ud83d\ude09). Ces balise jouent un r\u00f4le important dans le r\u00e9f\u00e9rencement du site. Cette balise fait en sorte que les mots qui compose un H1 soit mis en avant lors d\u2019une recherche internet. Par exemple, si mon H1 est \u00ab\u00a0Les meilleurs Hits des ann\u00e9es 80\u00a0\u00bb, si une recherche comporte les mots cl\u00e9s \u00ab\u00a0Hits\u00a0\u00bb ou \u00ab\u00a0ann\u00e9es 80\u00a0\u00bb, il y a de forte chance que le site soi mis en avant.[\/vc_column_text][\/vc_column][vc_column column_width_percent=\u00a0\u00bb100″ gutter_size=\u00a0\u00bb3″ overlay_alpha=\u00a0\u00bb50″ shift_x=\u00a0\u00bb0″ shift_y=\u00a0\u00bb0″ shift_y_down=\u00a0\u00bb0″ z_index=\u00a0\u00bb0″ medium_width=\u00a0\u00bb0″ mobile_width=\u00a0\u00bb0″ width=\u00a0\u00bb1\/2″][vc_single_image media=\u00a0\u00bb104051″ media_width_percent=\u00a0\u00bb100″ alignment=\u00a0\u00bbcenter\u00a0\u00bb shape=\u00a0\u00bbimg-round\u00a0\u00bb radius=\u00a0\u00bbstd\u00a0\u00bb shadow=\u00a0\u00bbyes\u00a0\u00bb shadow_weight=\u00a0\u00bbstd\u00a0\u00bb css_animation=\u00a0\u00bbright-t-left\u00a0\u00bb animation_delay=\u00a0\u00bb600″][\/vc_column][\/vc_row][vc_row row_height_percent=\u00a0\u00bb0″ override_padding=\u00a0\u00bbyes\u00a0\u00bb h_padding=\u00a0\u00bb2″ top_padding=\u00a0\u00bb5″ bottom_padding=\u00a0\u00bb5″ overlay_alpha=\u00a0\u00bb50″ gutter_size=\u00a0\u00bb3″ column_width_percent=\u00a0\u00bb100″ shift_y=\u00a0\u00bb0″ z_index=\u00a0\u00bb2″ bottom_divider=\u00a0\u00bbswoosh-opacity\u00a0\u00bb][vc_column column_width_use_pixel=\u00a0\u00bbyes\u00a0\u00bb position_vertical=\u00a0\u00bbmiddle\u00a0\u00bb align_horizontal=\u00a0\u00bbalign_center\u00a0\u00bb gutter_size=\u00a0\u00bb3″ overlay_alpha=\u00a0\u00bb50″ shift_x=\u00a0\u00bb0″ shift_y=\u00a0\u00bb0″ shift_y_down=\u00a0\u00bb0″ shift_y_down_fixed=\u00a0\u00bbyes\u00a0\u00bb z_index=\u00a0\u00bb0″ medium_width=\u00a0\u00bb0″ align_mobile=\u00a0\u00bbalign_center_mobile\u00a0\u00bb mobile_width=\u00a0\u00bb0″ width=\u00a0\u00bb1\/1″ column_width_pixel=\u00a0\u00bb900″][vc_row_inner][vc_column_inner column_width_use_pixel=\u00a0\u00bbyes\u00a0\u00bb align_horizontal=\u00a0\u00bbalign_center\u00a0\u00bb gutter_size=\u00a0\u00bb2″ override_padding=\u00a0\u00bbyes\u00a0\u00bb column_padding=\u00a0\u00bb0″ overlay_alpha=\u00a0\u00bb50″ shift_x=\u00a0\u00bb0″ shift_y=\u00a0\u00bb0″ shift_y_down=\u00a0\u00bb0″ z_index=\u00a0\u00bb0″ medium_width=\u00a0\u00bb0″ mobile_width=\u00a0\u00bb0″ width=\u00a0\u00bb1\/1″ column_width_pixel=\u00a0\u00bb900″][vc_single_image media=\u00a0\u00bb104036″ media_width_percent=\u00a0\u00bb100″ shadow=\u00a0\u00bbyes\u00a0\u00bb shadow_weight=\u00a0\u00bblg\u00a0\u00bb css_animation=\u00a0\u00bbzoom-in\u00a0\u00bb animation_delay=\u00a0\u00bb600″][vc_column_text text_lead=\u00a0\u00bbyes\u00a0\u00bb]On a aussi appris a ins\u00e9rer des images. Ici c\u2019est la balise <img> qui elle n\u2019a pas pas de balise fermante et ou l\u2019image est mis entre les \u00ab\u00a0<>\u00a0\u00bb qui en HTML ne contiennent (la plus part du temps) que le nom d\u2019une balise qu\u2019on veux utilis\u00e9. \u00ab\u00a0src\u00a0\u00bb qui veut dire \u00ab\u00a0source\u00a0\u00bb est l\u2019endroit o\u00f9 nous allons appeler l\u2019image qui porte elle m\u00eame un nom. Ici \u00ab\u00a0img_0899.png\u00a0\u00bb. \u00ab\u00a0Alt\u00a0\u00bb qui veut dire \u00ab\u00a0alternative\u00a0\u00bb est une courte description de nous mettons si l\u2019image n\u2019apparait pas aux yeux de l\u2019utilisateur. Si \u00e7a avait \u00e9t\u00e9 une photo de chien, en alternative nous aurions \u00e9crit \u00a0\u00bb photo de chien\u00a0\u00bb<\/p>\n

Voici ce que j\u2019ai appris \u00e0 mon premiers jour d\u2019apprentissage du HTML. Comme rien n\u2019est jamais plus parlant qu\u2019une image, je vous laisse un lien clicable ci-dessous<\/p>\n

 <\/p>\n

ps: Il n\u2019est pas beau mais tout s\u2019affiche comme d\u00e9sir\u00e9[\/vc_column_text][vc_column_text text_lead=\u00a0\u00bbyes\u00a0\u00bb css_animation=\u00a0\u00bbtop-t-bottom\u00a0\u00bb]Le site<\/a>[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row]<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"

[vc_row unlock_row_content=\u00a0\u00bbyes\u00a0\u00bb row_height_percent=\u00a0\u00bb0″ override_padding=\u00a0\u00bbyes\u00a0\u00bb h_padding=\u00a0\u00bb0″ top_padding=\u00a0\u00bb0″ bottom_padding=\u00a0\u00bb0″ overlay_alpha=\u00a0\u00bb50″ equal_height=\u00a0\u00bbyes\u00a0\u00bb gutter_size=\u00a0\u00bb0″ column_width_percent=\u00a0\u00bb100″ shift_y=\u00a0\u00bb0″ z_index=\u00a0\u00bb0″ el_class=\u00a0\u00bbinverted-device-order\u00a0\u00bb][vc_column column_width_use_pixel=\u00a0\u00bbyes\u00a0\u00bb gutter_size=\u00a0\u00bb3″ override_padding=\u00a0\u00bbyes\u00a0\u00bb column_padding=\u00a0\u00bb5″ overlay_alpha=\u00a0\u00bb50″ shift_x=\u00a0\u00bb0″ […]<\/p>\n","protected":false},"author":27,"featured_media":104017,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[124],"tags":[],"class_list":["post-104026","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-kendra-p9"],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/fabnum.tech\/wp-content\/uploads\/2021\/10\/Internet1-1.jpeg","_links":{"self":[{"href":"https:\/\/fabnum.tech\/index.php\/wp-json\/wp\/v2\/posts\/104026","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fabnum.tech\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fabnum.tech\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fabnum.tech\/index.php\/wp-json\/wp\/v2\/users\/27"}],"replies":[{"embeddable":true,"href":"https:\/\/fabnum.tech\/index.php\/wp-json\/wp\/v2\/comments?post=104026"}],"version-history":[{"count":31,"href":"https:\/\/fabnum.tech\/index.php\/wp-json\/wp\/v2\/posts\/104026\/revisions"}],"predecessor-version":[{"id":104063,"href":"https:\/\/fabnum.tech\/index.php\/wp-json\/wp\/v2\/posts\/104026\/revisions\/104063"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/fabnum.tech\/index.php\/wp-json\/wp\/v2\/media\/104017"}],"wp:attachment":[{"href":"https:\/\/fabnum.tech\/index.php\/wp-json\/wp\/v2\/media?parent=104026"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fabnum.tech\/index.php\/wp-json\/wp\/v2\/categories?post=104026"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fabnum.tech\/index.php\/wp-json\/wp\/v2\/tags?post=104026"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}