{"id":1145,"date":"2026-02-28T03:09:06","date_gmt":"2026-02-28T02:09:06","guid":{"rendered":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/?p=1145"},"modified":"2026-04-28T03:19:34","modified_gmt":"2026-04-28T01:19:34","slug":"mon-site-personelle","status":"publish","type":"post","link":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/2026\/02\/28\/mon-site-personelle\/","title":{"rendered":"Mon site personelle"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"1145\" class=\"elementor elementor-1145\">\n\t\t\t\t<div class=\"elementor-element elementor-element-001d29a e-flex e-con-boxed e-con e-parent\" data-id=\"001d29a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-97e73c3 elementor-widget elementor-widget-heading\" data-id=\"97e73c3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Site web personnel<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-65a504f elementor-widget elementor-widget-spacer\" data-id=\"65a504f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2fb5895 e-flex e-con-boxed e-con e-parent\" data-id=\"2fb5895\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0008a73 elementor-widget elementor-widget-heading\" data-id=\"0008a73\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Pr\u00e9sentation du projet<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-052b722 elementor-widget elementor-widget-text-editor\" data-id=\"052b722\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p data-start=\"358\" data-end=\"540\">Ce projet a \u00e9t\u00e9 r\u00e9alis\u00e9 en premi\u00e8re ann\u00e9e de BTS SIO. Il s\u2019agissait de cr\u00e9er un site web personnel en utilisant uniquement les langages HTML, CSS et JavaScript, sans utiliser de CMS.<\/p><p data-start=\"542\" data-end=\"717\">C\u2019\u00e9tait mon tout premier projet en d\u00e9veloppement web, r\u00e9alis\u00e9 individuellement. L\u2019objectif \u00e9tait de comprendre les bases de la cr\u00e9ation d\u2019un site internet, en partant de z\u00e9ro.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-37bb9be elementor-widget elementor-widget-heading\" data-id=\"37bb9be\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Objectifs du projet<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9d129c5 elementor-widget elementor-widget-text-editor\" data-id=\"9d129c5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p data-start=\"751\" data-end=\"828\">L\u2019objectif principal \u00e9tait de concevoir un site web fonctionnel et structur\u00e9.<\/p><p data-start=\"830\" data-end=\"852\">Pour cela, je devais :<\/p><ul data-start=\"853\" data-end=\"1021\"><li data-section-id=\"1s1749v\" data-start=\"853\" data-end=\"890\">cr\u00e9er plusieurs pages web en HTML<\/li><li data-section-id=\"1dtb6o8\" data-start=\"891\" data-end=\"934\">organiser le contenu de mani\u00e8re logique<\/li><li data-section-id=\"p19wi3\" data-start=\"935\" data-end=\"966\">appliquer du style avec CSS<\/li><li data-section-id=\"1s3szu9\" data-start=\"967\" data-end=\"1021\">ajouter un minimum d\u2019interactivit\u00e9 avec JavaScript<\/li><\/ul><p data-start=\"1023\" data-end=\"1092\">Ce projet servait surtout \u00e0 d\u00e9couvrir les bases du d\u00e9veloppement web.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a3e05bb elementor-widget elementor-widget-heading\" data-id=\"a3e05bb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Travail r\u00e9alis\u00e9<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1aadab1 elementor-widget elementor-widget-text-editor\" data-id=\"1aadab1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p data-start=\"1123\" data-end=\"1208\">Durant ce projet, j\u2019ai cr\u00e9\u00e9 mon propre site web personnel en partant d\u2019une page vide.<\/p><p data-start=\"1210\" data-end=\"1224\">J\u2019ai r\u00e9alis\u00e9 :<\/p><ul data-start=\"1225\" data-end=\"1461\"><li data-section-id=\"xdvvix\" data-start=\"1225\" data-end=\"1291\">la structure du site en HTML (pages, titres, paragraphes, liens)<\/li><li data-section-id=\"yx4bcd\" data-start=\"1292\" data-end=\"1355\">la mise en page avec CSS (couleurs, disposition, typographie)<\/li><li data-section-id=\"1jqdloi\" data-start=\"1356\" data-end=\"1399\">la navigation entre les diff\u00e9rentes pages<\/li><li data-section-id=\"12oj0s3\" data-start=\"1400\" data-end=\"1461\">quelques interactions en JavaScript (ex : effets, boutons\u2026)<\/li><\/ul><p data-start=\"1463\" data-end=\"1569\">J\u2019ai \u00e9galement appris \u00e0 organiser mes fichiers (HTML, CSS, JS) et \u00e0 structurer correctement un projet web.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c0a972a e-flex e-con-boxed e-con e-parent\" data-id=\"c0a972a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c0bc022 elementor-widget elementor-widget-image-gallery\" data-id=\"c0bc022\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image-gallery.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-image-gallery\">\n\t\t\t\n<a data-elementor-open-lightbox=\"yes\" data-elementor-lightbox-slideshow=\"c0bc022\" data-elementor-lightbox-title=\"Accueil\" data-e-action-hash=\"#elementor-action%3Aaction%3Dlightbox%26settings%3DeyJpZCI6MTE2NywidXJsIjoiaHR0cHM6XC9cL3Npby5seWNlZS1zYWludC1qb2huLXBlcnNlLmZyXC9wb3J0Zm9saW8tcmVuYXVkXC93cC1jb250ZW50XC91cGxvYWRzXC9zaXRlc1wvNzZcLzIwMjZcLzA0XC9BY2N1ZWlsLnBuZyIsInNsaWRlc2hvdyI6ImMwYmMwMjIifQ%3D%3D\" href='https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-content\/uploads\/sites\/76\/2026\/04\/Accueil.png'><img fetchpriority=\"high\" decoding=\"async\" width=\"1200\" height=\"514\" src=\"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-content\/uploads\/sites\/76\/2026\/04\/Accueil-1200x514.png\" class=\"attachment-catchresponsive-slider size-catchresponsive-slider\" alt=\"\" \/><\/a>\n<a data-elementor-open-lightbox=\"yes\" data-elementor-lightbox-slideshow=\"c0bc022\" data-elementor-lightbox-title=\"cv\" data-e-action-hash=\"#elementor-action%3Aaction%3Dlightbox%26settings%3DeyJpZCI6MTE2OCwidXJsIjoiaHR0cHM6XC9cL3Npby5seWNlZS1zYWludC1qb2huLXBlcnNlLmZyXC9wb3J0Zm9saW8tcmVuYXVkXC93cC1jb250ZW50XC91cGxvYWRzXC9zaXRlc1wvNzZcLzIwMjZcLzA0XC9jdi5wbmciLCJzbGlkZXNob3ciOiJjMGJjMDIyIn0%3D\" href='https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-content\/uploads\/sites\/76\/2026\/04\/cv.png'><img decoding=\"async\" width=\"1200\" height=\"514\" src=\"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-content\/uploads\/sites\/76\/2026\/04\/cv-1200x514.png\" class=\"attachment-catchresponsive-slider size-catchresponsive-slider\" alt=\"\" \/><\/a>\n<a data-elementor-open-lightbox=\"yes\" data-elementor-lightbox-slideshow=\"c0bc022\" data-elementor-lightbox-title=\"lyc\u00e9e\" data-e-action-hash=\"#elementor-action%3Aaction%3Dlightbox%26settings%3DeyJpZCI6MTE2OSwidXJsIjoiaHR0cHM6XC9cL3Npby5seWNlZS1zYWludC1qb2huLXBlcnNlLmZyXC9wb3J0Zm9saW8tcmVuYXVkXC93cC1jb250ZW50XC91cGxvYWRzXC9zaXRlc1wvNzZcLzIwMjZcLzA0XC9seWNlZS5wbmciLCJzbGlkZXNob3ciOiJjMGJjMDIyIn0%3D\" href='https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-content\/uploads\/sites\/76\/2026\/04\/lycee.png'><img decoding=\"async\" width=\"1200\" height=\"514\" src=\"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-content\/uploads\/sites\/76\/2026\/04\/lycee-1200x514.png\" class=\"attachment-catchresponsive-slider size-catchresponsive-slider\" alt=\"\" \/><\/a>\n<a data-elementor-open-lightbox=\"yes\" data-elementor-lightbox-slideshow=\"c0bc022\" data-elementor-lightbox-title=\"projet-stage\" data-e-action-hash=\"#elementor-action%3Aaction%3Dlightbox%26settings%3DeyJpZCI6MTE3MCwidXJsIjoiaHR0cHM6XC9cL3Npby5seWNlZS1zYWludC1qb2huLXBlcnNlLmZyXC9wb3J0Zm9saW8tcmVuYXVkXC93cC1jb250ZW50XC91cGxvYWRzXC9zaXRlc1wvNzZcLzIwMjZcLzA0XC9wcm9qZXQtc3RhZ2UucG5nIiwic2xpZGVzaG93IjoiYzBiYzAyMiJ9\" href='https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-content\/uploads\/sites\/76\/2026\/04\/projet-stage.png'><img loading=\"lazy\" decoding=\"async\" width=\"1200\" height=\"514\" src=\"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-content\/uploads\/sites\/76\/2026\/04\/projet-stage-1200x514.png\" class=\"attachment-catchresponsive-slider size-catchresponsive-slider\" alt=\"\" \/><\/a>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1e41c26 elementor-widget elementor-widget-spacer\" data-id=\"1e41c26\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-96bef39 elementor-widget elementor-widget-heading\" data-id=\"96bef39\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Technologies utilis\u00e9es<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3c2fc13 elementor-widget elementor-widget-text-editor\" data-id=\"3c2fc13\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<ul data-start=\"1606\" data-end=\"1697\"><li data-section-id=\"1nphwb9\" data-start=\"1606\" data-end=\"1614\">HTML<\/li><li data-section-id=\"16x0lor\" data-start=\"1615\" data-end=\"1622\">CSS<\/li><li data-section-id=\"1mnqnmj\" data-start=\"1623\" data-end=\"1637\">JavaScript<\/li><li data-section-id=\"1x8i9rw\" data-start=\"1638\" data-end=\"1664\">Navigateur web<\/li><li data-section-id=\"utwk9k\" data-start=\"1665\" data-end=\"1697\">\u00c9diteur de code (VS Code)<\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d5efabc elementor-widget elementor-widget-heading\" data-id=\"d5efabc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Comp\u00e9tences d\u00e9velopp\u00e9es<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7eff1d9 elementor-widget elementor-widget-text-editor\" data-id=\"7eff1d9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p data-start=\"1735\" data-end=\"1818\">Ce projet m\u2019a permis de d\u00e9velopper mes premi\u00e8res comp\u00e9tences en d\u00e9veloppement web :<\/p><ul data-start=\"1820\" data-end=\"2066\"><li data-section-id=\"nzzswn\" data-start=\"1820\" data-end=\"1869\">Comprendre la structure d\u2019une page web (HTML)<\/li><li data-section-id=\"b7edkb\" data-start=\"1870\" data-end=\"1901\">Appliquer du style avec CSS<\/li><li data-section-id=\"1xcoo1v\" data-start=\"1902\" data-end=\"1939\">Manipuler les bases du JavaScript<\/li><li data-section-id=\"1efp8ex\" data-start=\"1940\" data-end=\"1986\">Cr\u00e9er une navigation entre plusieurs pages<\/li><li data-section-id=\"csrnzz\" data-start=\"1987\" data-end=\"2031\">Organiser un projet (fichiers, dossiers)<\/li><li data-section-id=\"76cup7\" data-start=\"2032\" data-end=\"2066\">Tester et corriger des erreurs<\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Site web personnel Pr\u00e9sentation du projet Ce projet a \u00e9t\u00e9 r\u00e9alis\u00e9 en premi\u00e8re ann\u00e9e de BTS SIO. Il s\u2019agissait de cr\u00e9er un site web personnel <a class=\"more-link\" href=\"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/2026\/02\/28\/mon-site-personelle\/\">Lire plus &#8230;<\/a><\/p>\n","protected":false},"author":68,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10],"tags":[],"class_list":["post-1145","post","type-post","status-publish","format-standard","hentry","category-ateliers-professionnels"],"_links":{"self":[{"href":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-json\/wp\/v2\/posts\/1145","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-json\/wp\/v2\/users\/68"}],"replies":[{"embeddable":true,"href":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-json\/wp\/v2\/comments?post=1145"}],"version-history":[{"count":10,"href":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-json\/wp\/v2\/posts\/1145\/revisions"}],"predecessor-version":[{"id":1182,"href":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-json\/wp\/v2\/posts\/1145\/revisions\/1182"}],"wp:attachment":[{"href":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-json\/wp\/v2\/media?parent=1145"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-json\/wp\/v2\/categories?post=1145"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sio.lycee-saint-john-perse.fr\/portfolio-renaud\/wp-json\/wp\/v2\/tags?post=1145"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}