Guide Ultime pour Créer un Site Web High-Tech

Guide Ultime pour Créer un Site Web High-Tech

Aujourd’hui, avoir un site web high-tech n’est plus une option, c’est une nécessité. Que vous soyez une start-up en technologie, un blogueur passionné ou une entreprise bien établie, un site web est un outil essentiel pour atteindre et interagir avec votre audience.

Dans cet article, nous allons découvrir les différentes étapes pour créer un site web high-tech performant. De la préparation à la mise en ligne, en passant par des conseils sur la conception et l’intégration de fonctionnalités high-tech, nous avons couvert tous les aspects essentiels.

2. Préparation et Planification

Définir les objectifs de votre site web

La première étape pour créer un site web est de déterminer pourquoi vous le faites. Est-ce pour vendre des produits ? Pour partager des connaissances ? Pour créer une communauté ? Identifier vos objectifs vous aidera à rester concentré et à faire des choix éclairés tout au long du processus.

Analyser la concurrence

L’analyse des sites web de vos concurrents peut vous donner une idée des tendances du marché et de ce qui fonctionne (ou non) dans votre niche. Notez les styles de design, les types de contenu, et les fonctionnalités qu’ils offrent.

Choisir un nom de domaine

Votre nom de domaine est l’adresse par laquelle les gens trouveront votre site. Choisissez un nom simple, mémorable et pertinent par rapport à votre entreprise. Des sites comme Namecheap ou GoDaddy peuvent faciliter ce processus.

3. Choix de la Plateforme

Comparaison des CMS populaires

Pour créer un site web efficace, il est crucial de choisir le bon CMS (Content Management System). Voici une comparaison des plus populaires :

  • WordPress : Très populaire, flexible et avec une grande communauté. Idéal pour les blogs et les sites d’entreprise.
  • Joomla : Un bon compromis entre flexibilité et facilité d’utilisation. Convient aux sites d’entreprise et e-commerce.
  • Drupal : Très puissant et flexible, mais peut être complexe. Convient aux sites qui requièrent une grande personnalisation.

Avantages et inconvénients de chaque plateforme

WordPress : Facile à utiliser mais peut être vulnérable aux attaques si mal géré.
Joomla : Flexible mais a une courbe d’apprentissage plus élevée.
Drupal : Très sécurisé et personnalisable mais complexe à maîtriser.

4. Conception du Site Web

Sélection de thèmes et templates

Le design de votre site joue un rôle crucial dans son attrait. Sélectionnez un thème ou un template qui reflète votre secteur d’activité et qui soit compatible avec vos objectifs. Des sites comme ThemeForest offrent une grande variété de choix.

Importance de l’UX/UI design

L’UX (User Experience) et l’UI (User Interface) design sont essentiels pour garder vos visiteurs engagés. Une excellente navigation, une structure clairement définie, et une apparence visuelle attrayante peuvent faire toute la différence.

Utilisation des éléments graphiques et typographiques

Les éléments graphiques et typographiques peuvent enrichir votre site. Utilisez des images de haute qualité, des icônes vectorielles, et des polices lisibles pour créer une identité visuelle forte.

5. Contenu

Création de contenu de qualité

Un site web sans contenu de qualité est comme une coquille vide. Investissez du temps dans la création d’articles, de tutoriels, de vidéos et d’autres types de contenus qui apporteront de la valeur à vos visiteurs.

Optimisation SEO (Search Engine Optimization)

L’optimisation pour les moteurs de recherche (SEO) est cruciale pour augmenter votre visibilité. Utilisez des mots-clés pertinents (comme « Comment créer un site web »), optimisez les balises </code> et <code><meta></code>, et assurez-vous que votre site est rapide et mobile-friendly.</p> <h3>Structuration des pages et du menu</h3> <p>La structure de votre site doit être intuitive. Utilisez une hiérarchie claire des pages et un menu de navigation simple pour permettre aux utilisateurs de trouver facilement ce qu’ils cherchent.</p> </section> <section id="fonctionnalites"> <h2>6. Fonctionnalités High-Tech</h2> <h3>Intégrer des plugins et extensions</h3> <p>Des plugins peuvent ajouter des fonctionnalités à votre site sans nécessiter de compétences en codage. Par exemple, pour WordPress, des plugins comme <a href="https://yoast.com" target="_blank" rel="noopener">Yoast SEO</a>, <a href="https://woocommerce.com" target="_blank" rel="noopener">WooCommerce</a>, et <a href="https://contactform7.com" target="_blank" rel="noopener">Contact Form 7</a> peuvent être très utiles.</p> <h3>Ajouter des fonctionnalités avancées</h3> <p>Selon vos besoins, vous pourriez vouloir ajouter des fonctionnalités plus avancées, telles que l’e-commerce, les forums, ou les sections de membres. Des plateformes comme Shopify pour l’e-commerce ou bbPress pour les forums peuvent être intégrées facilement avec les CMS utilisés.</p> <h3>Utilisation des APIs et des intégrations tierces</h3> <p>Les APIs et les intégrations tierces peuvent grandement enrichir votre site. Par exemple, vous pouvez intégrer des services de paiement (comme Stripe), des newsletters (comme MailChimp), ou des systèmes de gestion de contenu tiers.</p> </section> <section id="tests"> <h2>7. Tests et Optimisation</h2> <h3>Tests de performance et de compatibilité</h3> <p>Avant de lancer votre site, procédez à des tests approfondis de performance et de compatibilité. Utilisez des outils comme <a href="https://developers.google.com/speed/pagespeed/insights/" target="_blank" rel="noopener">Google PageSpeed Insights</a> pour évaluer la vitesse de votre site et assurez-vous qu’il fonctionne correctement sur différents navigateurs et appareils.</p> <h3>Paramètres de sécurité</h3> <p>La sécurité de votre site est primordiale. Utilisez des certificats SSL, gardez votre CMS et vos plugins à jour, et envisagez des solutions comme <a href="https://sucuri.net" target="_blank" rel="noopener">Sucuri</a> ou <a href="https://www.wordfence.com" target="_blank" rel="noopener">Wordfence</a> pour protéger votre site contre les attaques.</p> <h3>Outils d’analyse et de suivi</h3> <p>L’utilisation d’outils d’analyse comme <a href="https://analytics.google.com" target="_blank" rel="noopener">Google Analytics</a> vous donnera des détails précieux sur le comportement de vos visiteurs. Identifiez ce qui fonctionne et ce qui doit être amélioré pour optimiser l’expérience utilisateur.</p> </section> <section id="lancement"> <h2>8. Lancement du Site</h2> <h3>Processus de mise en ligne</h3> <p>Une fois que vous êtes satisfait des tests et des optimisations, il est temps de mettre votre site en ligne. Choisissez un hébergeur fiable et suivez les étapes de déploiement pour rendre votre site accessible au public.</p> <h3>Stratégies de promotion</h3> <p>La promotion de votre site est essentielle pour attirer des visiteurs. Utilisez les réseaux sociaux, les newsletters, et le marketing de contenu pour faire connaître votre site. Envisagez également des campagnes publicitaires payantes pour un coup de pouce supplémentaire.</p> <h3>Importance des mises à jour et maintenance régulière</h3> <p>Lancer votre site n’est que le début. Pour qu’il reste performant et sécurisé, veillez à effectuer des mises à jour régulières de votre CMS, de vos plugins, et de votre contenu. La maintenance continue est la clé du succès à long terme.</p> </section> <section> <p>Voilà, vous avez maintenant une vue d’ensemble complète des étapes pour <em>créer un site web high-tech</em>. De la planification initiale à la mise en ligne, en passant par la conception et l’optimisation, chaque étape est cruciale. Alors, n’attendez plus, lancez-vous dans cette aventure numérique passionnante et faites briller votre présence en ligne !</p> </section> <p></body></html></p> </div> </div> </div> </div> </div> </section> </div> <div data-elementor-type="footer" data-elementor-id="63" class="elementor elementor-63 elementor-location-footer" data-elementor-post-type="elementor_library"> <section data-particle_enable="false" data-particle-mobile-disabled="false" class="elementor-section elementor-top-section elementor-element elementor-element-1e2de4c1 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="1e2de4c1" data-element_type="section" data-settings="{"background_background":"classic"}"> <div class="elementor-container elementor-column-gap-default"> <div class="elementor-column elementor-col-25 elementor-top-column elementor-element elementor-element-2b86ae88" data-id="2b86ae88" data-element_type="column"> <div class="elementor-widget-wrap"> </div> </div> <div class="elementor-column elementor-col-25 elementor-top-column elementor-element elementor-element-dd44736" data-id="dd44736" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-72bdc4f4 elementor-widget elementor-widget-heading" data-id="72bdc4f4" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h6 class="elementor-heading-title elementor-size-default">Informations</h6> </div> </div> <div class="elementor-element elementor-element-582b6aa elementor-nav-menu--dropdown-tablet elementor-nav-menu__text-align-aside elementor-nav-menu--toggle elementor-nav-menu--burger elementor-widget elementor-widget-nav-menu" data-id="582b6aa" data-element_type="widget" data-settings="{"layout":"vertical","submenu_icon":{"value":"<i class=\"fas fa-caret-down\"><\/i>","library":"fa-solid"},"toggle":"burger"}" data-widget_type="nav-menu.default"> <div class="elementor-widget-container"> <nav aria-label="Menu" class="elementor-nav-menu--main elementor-nav-menu__container elementor-nav-menu--layout-vertical e--pointer-none"> <ul id="menu-1-582b6aa" class="elementor-nav-menu sm-vertical"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-26"><a rel="nofollow" href="https://www.creation-site-internet-toulon.net/mentions-legales/" class="elementor-item">Mentions légales</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-27"><a rel="nofollow" href="https://www.creation-site-internet-toulon.net/nous-contacter/" class="elementor-item">Nous contacter</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-28"><a href="https://www.creation-site-internet-toulon.net/sitemap.xml" class="elementor-item">Sitemap</a></li> </ul> </nav> <div class="elementor-menu-toggle" role="button" tabindex="0" aria-label="Menu Toggle" aria-expanded="false"> <i aria-hidden="true" role="presentation" class="elementor-menu-toggle__icon--open eicon-menu-bar"></i><i aria-hidden="true" role="presentation" class="elementor-menu-toggle__icon--close eicon-close"></i> <span class="elementor-screen-only">Menu</span> </div> <nav class="elementor-nav-menu--dropdown elementor-nav-menu__container" aria-hidden="true"> <ul id="menu-2-582b6aa" class="elementor-nav-menu sm-vertical"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-26"><a rel="nofollow" href="https://www.creation-site-internet-toulon.net/mentions-legales/" class="elementor-item" tabindex="-1">Mentions légales</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-27"><a rel="nofollow" href="https://www.creation-site-internet-toulon.net/nous-contacter/" class="elementor-item" tabindex="-1">Nous contacter</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-28"><a href="https://www.creation-site-internet-toulon.net/sitemap.xml" class="elementor-item" tabindex="-1">Sitemap</a></li> </ul> </nav> </div> </div> </div> </div> <div class="elementor-column elementor-col-25 elementor-top-column elementor-element elementor-element-226da978" data-id="226da978" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-2320843e elementor-widget elementor-widget-heading" data-id="2320843e" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h6 class="elementor-heading-title elementor-size-default">Contact</h6> </div> </div> <section data-particle_enable="false" data-particle-mobile-disabled="false" class="elementor-section elementor-inner-section elementor-element elementor-element-61347724 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="61347724" data-element_type="section"> <div class="elementor-container elementor-column-gap-default"> <div class="elementor-column elementor-col-100 elementor-inner-column elementor-element elementor-element-76259761" data-id="76259761" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-aec3b7b elementor-widget__width-auto elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="aec3b7b" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="mailto:contact@creation-site-internet-toulon.net"> <span class="elementor-icon-list-text">contact@creation-site-internet-toulon.net</span> </a> </li> </ul> </div> </div> </div> </div> </div> </section> </div> </div> <div class="elementor-column elementor-col-25 elementor-top-column elementor-element elementor-element-4d569749" data-id="4d569749" data-element_type="column"> <div class="elementor-widget-wrap"> </div> </div> </div> </section> <section data-particle_enable="false" data-particle-mobile-disabled="false" class="elementor-section elementor-top-section elementor-element elementor-element-6a2a7a1c elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="6a2a7a1c" data-element_type="section" data-settings="{"background_background":"classic"}"> <div class="elementor-container elementor-column-gap-default"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-3150ff16" data-id="3150ff16" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-5491a14d elementor-widget elementor-widget-text-editor" data-id="5491a14d" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> © 2023 – Création site internet Toulon – Tous droit réservé – 3 Av. Abadie, 33015 Bordeaux </div> </div> </div> </div> </div> </section> </div> <script type='text/javascript'> const lazyloadRunObserver = () => { const lazyloadBackgrounds = document.querySelectorAll( `.e-con.e-parent:not(.e-lazyloaded)` ); const lazyloadBackgroundObserver = new IntersectionObserver( ( entries ) => { entries.forEach( ( entry ) => { if ( entry.isIntersecting ) { let lazyloadBackground = entry.target; if( lazyloadBackground ) { lazyloadBackground.classList.add( 'e-lazyloaded' ); } lazyloadBackgroundObserver.unobserve( entry.target ); } }); }, { rootMargin: '200px 0px 200px 0px' } ); lazyloadBackgrounds.forEach( ( lazyloadBackground ) => { lazyloadBackgroundObserver.observe( lazyloadBackground ); } ); }; const events = [ 'DOMContentLoaded', 'elementor/lazyload/observe', ]; events.forEach( ( event ) => { document.addEventListener( event, lazyloadRunObserver ); } ); </script> <link rel='stylesheet' id='widget-image-css' href='https://www.creation-site-internet-toulon.net/wp-content/plugins/elementor/assets/css/widget-image.min.css?ver=3.24.3' media='all' /> <link rel='stylesheet' id='widget-heading-css' href='https://www.creation-site-internet-toulon.net/wp-content/plugins/elementor/assets/css/widget-heading.min.css?ver=3.24.3' media='all' /> <link rel='stylesheet' id='widget-icon-list-css' href='https://www.creation-site-internet-toulon.net/wp-content/uploads/elementor/css/custom-widget-icon-list.min.css?ver=1718165180' media='all' /> <link rel='stylesheet' id='widget-text-editor-css' href='https://www.creation-site-internet-toulon.net/wp-content/plugins/elementor/assets/css/widget-text-editor.min.css?ver=3.24.3' media='all' /> <script src="https://www.creation-site-internet-toulon.net/wp-includes/js/dist/hooks.min.js?ver=2810c76e705dd1a53b18" id="wp-hooks-js"></script> <script src="https://www.creation-site-internet-toulon.net/wp-includes/js/dist/i18n.min.js?ver=5e580eb46a90c2b997e6" id="wp-i18n-js"></script> <script id="wp-i18n-js-after"> wp.i18n.setLocaleData( { 'text direction\u0004ltr': [ 'ltr' ] } ); </script> <script src="https://www.creation-site-internet-toulon.net/wp-content/plugins/contact-form-7/includes/swv/js/index.js?ver=5.9.8" id="swv-js"></script> <script id="contact-form-7-js-extra"> var wpcf7 = {"api":{"root":"https:\/\/www.creation-site-internet-toulon.net\/wp-json\/","namespace":"contact-form-7\/v1"},"cached":"1"}; </script> <script src="https://www.creation-site-internet-toulon.net/wp-content/plugins/contact-form-7/includes/js/index.js?ver=5.9.8" id="contact-form-7-js"></script> <script src="https://www.creation-site-internet-toulon.net/wp-content/themes/hello-elementor/assets/js/hello-frontend.min.js?ver=3.1.1" id="hello-theme-frontend-js"></script> <script id="eael-general-js-extra"> var localize = {"ajaxurl":"https:\/\/www.creation-site-internet-toulon.net\/wp-admin\/admin-ajax.php","nonce":"24c471e257","i18n":{"added":"Added ","compare":"Compare","loading":"Loading..."},"eael_translate_text":{"required_text":"is a required field","invalid_text":"Invalid","billing_text":"Billing","shipping_text":"Shipping","fg_mfp_counter_text":"of"},"page_permalink":"https:\/\/www.creation-site-internet-toulon.net\/guide-ultime-pour-creer-un-site-web-high-tech\/","cart_redirectition":"","cart_page_url":"","el_breakpoints":{"mobile":{"label":"Mobile Portrait","value":767,"default_value":767,"direction":"max","is_enabled":true},"mobile_extra":{"label":"Mobile Landscape","value":880,"default_value":880,"direction":"max","is_enabled":false},"tablet":{"label":"Tablet Portrait","value":1024,"default_value":1024,"direction":"max","is_enabled":true},"tablet_extra":{"label":"Tablet Landscape","value":1200,"default_value":1200,"direction":"max","is_enabled":true},"laptop":{"label":"Laptop","value":1366,"default_value":1366,"direction":"max","is_enabled":false},"widescreen":{"label":"Widescreen","value":2400,"default_value":2400,"direction":"min","is_enabled":false}},"ParticleThemesData":{"default":"{\"particles\":{\"number\":{\"value\":160,\"density\":{\"enable\":true,\"value_area\":800}},\"color\":{\"value\":\"#ffffff\"},\"shape\":{\"type\":\"circle\",\"stroke\":{\"width\":0,\"color\":\"#000000\"},\"polygon\":{\"nb_sides\":5},\"image\":{\"src\":\"img\/github.svg\",\"width\":100,\"height\":100}},\"opacity\":{\"value\":0.5,\"random\":false,\"anim\":{\"enable\":false,\"speed\":1,\"opacity_min\":0.1,\"sync\":false}},\"size\":{\"value\":3,\"random\":true,\"anim\":{\"enable\":false,\"speed\":40,\"size_min\":0.1,\"sync\":false}},\"line_linked\":{\"enable\":true,\"distance\":150,\"color\":\"#ffffff\",\"opacity\":0.4,\"width\":1},\"move\":{\"enable\":true,\"speed\":6,\"direction\":\"none\",\"random\":false,\"straight\":false,\"out_mode\":\"out\",\"bounce\":false,\"attract\":{\"enable\":false,\"rotateX\":600,\"rotateY\":1200}}},\"interactivity\":{\"detect_on\":\"canvas\",\"events\":{\"onhover\":{\"enable\":true,\"mode\":\"repulse\"},\"onclick\":{\"enable\":true,\"mode\":\"push\"},\"resize\":true},\"modes\":{\"grab\":{\"distance\":400,\"line_linked\":{\"opacity\":1}},\"bubble\":{\"distance\":400,\"size\":40,\"duration\":2,\"opacity\":8,\"speed\":3},\"repulse\":{\"distance\":200,\"duration\":0.4},\"push\":{\"particles_nb\":4},\"remove\":{\"particles_nb\":2}}},\"retina_detect\":true}","nasa":"{\"particles\":{\"number\":{\"value\":250,\"density\":{\"enable\":true,\"value_area\":800}},\"color\":{\"value\":\"#ffffff\"},\"shape\":{\"type\":\"circle\",\"stroke\":{\"width\":0,\"color\":\"#000000\"},\"polygon\":{\"nb_sides\":5},\"image\":{\"src\":\"img\/github.svg\",\"width\":100,\"height\":100}},\"opacity\":{\"value\":1,\"random\":true,\"anim\":{\"enable\":true,\"speed\":1,\"opacity_min\":0,\"sync\":false}},\"size\":{\"value\":3,\"random\":true,\"anim\":{\"enable\":false,\"speed\":4,\"size_min\":0.3,\"sync\":false}},\"line_linked\":{\"enable\":false,\"distance\":150,\"color\":\"#ffffff\",\"opacity\":0.4,\"width\":1},\"move\":{\"enable\":true,\"speed\":1,\"direction\":\"none\",\"random\":true,\"straight\":false,\"out_mode\":\"out\",\"bounce\":false,\"attract\":{\"enable\":false,\"rotateX\":600,\"rotateY\":600}}},\"interactivity\":{\"detect_on\":\"canvas\",\"events\":{\"onhover\":{\"enable\":true,\"mode\":\"bubble\"},\"onclick\":{\"enable\":true,\"mode\":\"repulse\"},\"resize\":true},\"modes\":{\"grab\":{\"distance\":400,\"line_linked\":{\"opacity\":1}},\"bubble\":{\"distance\":250,\"size\":0,\"duration\":2,\"opacity\":0,\"speed\":3},\"repulse\":{\"distance\":400,\"duration\":0.4},\"push\":{\"particles_nb\":4},\"remove\":{\"particles_nb\":2}}},\"retina_detect\":true}","bubble":"{\"particles\":{\"number\":{\"value\":15,\"density\":{\"enable\":true,\"value_area\":800}},\"color\":{\"value\":\"#1b1e34\"},\"shape\":{\"type\":\"polygon\",\"stroke\":{\"width\":0,\"color\":\"#000\"},\"polygon\":{\"nb_sides\":6},\"image\":{\"src\":\"img\/github.svg\",\"width\":100,\"height\":100}},\"opacity\":{\"value\":0.3,\"random\":true,\"anim\":{\"enable\":false,\"speed\":1,\"opacity_min\":0.1,\"sync\":false}},\"size\":{\"value\":50,\"random\":false,\"anim\":{\"enable\":true,\"speed\":10,\"size_min\":40,\"sync\":false}},\"line_linked\":{\"enable\":false,\"distance\":200,\"color\":\"#ffffff\",\"opacity\":1,\"width\":2},\"move\":{\"enable\":true,\"speed\":8,\"direction\":\"none\",\"random\":false,\"straight\":false,\"out_mode\":\"out\",\"bounce\":false,\"attract\":{\"enable\":false,\"rotateX\":600,\"rotateY\":1200}}},\"interactivity\":{\"detect_on\":\"canvas\",\"events\":{\"onhover\":{\"enable\":false,\"mode\":\"grab\"},\"onclick\":{\"enable\":false,\"mode\":\"push\"},\"resize\":true},\"modes\":{\"grab\":{\"distance\":400,\"line_linked\":{\"opacity\":1}},\"bubble\":{\"distance\":400,\"size\":40,\"duration\":2,\"opacity\":8,\"speed\":3},\"repulse\":{\"distance\":200,\"duration\":0.4},\"push\":{\"particles_nb\":4},\"remove\":{\"particles_nb\":2}}},\"retina_detect\":true}","snow":"{\"particles\":{\"number\":{\"value\":450,\"density\":{\"enable\":true,\"value_area\":800}},\"color\":{\"value\":\"#fff\"},\"shape\":{\"type\":\"circle\",\"stroke\":{\"width\":0,\"color\":\"#000000\"},\"polygon\":{\"nb_sides\":5},\"image\":{\"src\":\"img\/github.svg\",\"width\":100,\"height\":100}},\"opacity\":{\"value\":0.5,\"random\":true,\"anim\":{\"enable\":false,\"speed\":1,\"opacity_min\":0.1,\"sync\":false}},\"size\":{\"value\":5,\"random\":true,\"anim\":{\"enable\":false,\"speed\":40,\"size_min\":0.1,\"sync\":false}},\"line_linked\":{\"enable\":false,\"distance\":500,\"color\":\"#ffffff\",\"opacity\":0.4,\"width\":2},\"move\":{\"enable\":true,\"speed\":6,\"direction\":\"bottom\",\"random\":false,\"straight\":false,\"out_mode\":\"out\",\"bounce\":false,\"attract\":{\"enable\":false,\"rotateX\":600,\"rotateY\":1200}}},\"interactivity\":{\"detect_on\":\"canvas\",\"events\":{\"onhover\":{\"enable\":true,\"mode\":\"bubble\"},\"onclick\":{\"enable\":true,\"mode\":\"repulse\"},\"resize\":true},\"modes\":{\"grab\":{\"distance\":400,\"line_linked\":{\"opacity\":0.5}},\"bubble\":{\"distance\":400,\"size\":4,\"duration\":0.3,\"opacity\":1,\"speed\":3},\"repulse\":{\"distance\":200,\"duration\":0.4},\"push\":{\"particles_nb\":4},\"remove\":{\"particles_nb\":2}}},\"retina_detect\":true}","nyan_cat":"{\"particles\":{\"number\":{\"value\":150,\"density\":{\"enable\":false,\"value_area\":800}},\"color\":{\"value\":\"#ffffff\"},\"shape\":{\"type\":\"star\",\"stroke\":{\"width\":0,\"color\":\"#000000\"},\"polygon\":{\"nb_sides\":5},\"image\":{\"src\":\"http:\/\/wiki.lexisnexis.com\/academic\/images\/f\/fb\/Itunes_podcast_icon_300.jpg\",\"width\":100,\"height\":100}},\"opacity\":{\"value\":0.5,\"random\":false,\"anim\":{\"enable\":false,\"speed\":1,\"opacity_min\":0.1,\"sync\":false}},\"size\":{\"value\":4,\"random\":true,\"anim\":{\"enable\":false,\"speed\":40,\"size_min\":0.1,\"sync\":false}},\"line_linked\":{\"enable\":false,\"distance\":150,\"color\":\"#ffffff\",\"opacity\":0.4,\"width\":1},\"move\":{\"enable\":true,\"speed\":14,\"direction\":\"left\",\"random\":false,\"straight\":true,\"out_mode\":\"out\",\"bounce\":false,\"attract\":{\"enable\":false,\"rotateX\":600,\"rotateY\":1200}}},\"interactivity\":{\"detect_on\":\"canvas\",\"events\":{\"onhover\":{\"enable\":false,\"mode\":\"grab\"},\"onclick\":{\"enable\":true,\"mode\":\"repulse\"},\"resize\":true},\"modes\":{\"grab\":{\"distance\":200,\"line_linked\":{\"opacity\":1}},\"bubble\":{\"distance\":400,\"size\":40,\"duration\":2,\"opacity\":8,\"speed\":3},\"repulse\":{\"distance\":200,\"duration\":0.4},\"push\":{\"particles_nb\":4},\"remove\":{\"particles_nb\":2}}},\"retina_detect\":true}"},"eael_login_nonce":"c177d49707","eael_register_nonce":"995c699a7c","eael_lostpassword_nonce":"19e6cf6c9e","eael_resetpassword_nonce":"e350fcd533"}; </script> <script src="https://www.creation-site-internet-toulon.net/wp-content/plugins/essential-addons-for-elementor-lite/assets/front-end/js/view/general.min.js?ver=6.0.5" id="eael-general-js"></script> <script src="https://www.creation-site-internet-toulon.net/wp-content/plugins/elementor-pro/assets/lib/smartmenus/jquery.smartmenus.min.js?ver=1.2.1" id="smartmenus-js"></script> <script src="https://www.creation-site-internet-toulon.net/wp-content/plugins/elementor-pro/assets/js/webpack-pro.runtime.min.js?ver=3.23.3" id="elementor-pro-webpack-runtime-js"></script> <script src="https://www.creation-site-internet-toulon.net/wp-content/plugins/elementor/assets/js/webpack.runtime.min.js?ver=3.24.3" id="elementor-webpack-runtime-js"></script> <script src="https://www.creation-site-internet-toulon.net/wp-content/plugins/elementor/assets/js/frontend-modules.min.js?ver=3.24.3" id="elementor-frontend-modules-js"></script> <script id="elementor-pro-frontend-js-before"> var ElementorProFrontendConfig = {"ajaxurl":"https:\/\/www.creation-site-internet-toulon.net\/wp-admin\/admin-ajax.php","nonce":"2a9db01d92","urls":{"assets":"https:\/\/www.creation-site-internet-toulon.net\/wp-content\/plugins\/elementor-pro\/assets\/","rest":"https:\/\/www.creation-site-internet-toulon.net\/wp-json\/"},"shareButtonsNetworks":{"facebook":{"title":"Facebook","has_counter":true},"twitter":{"title":"Twitter"},"linkedin":{"title":"LinkedIn","has_counter":true},"pinterest":{"title":"Pinterest","has_counter":true},"reddit":{"title":"Reddit","has_counter":true},"vk":{"title":"VK","has_counter":true},"odnoklassniki":{"title":"OK","has_counter":true},"tumblr":{"title":"Tumblr"},"digg":{"title":"Digg"},"skype":{"title":"Skype"},"stumbleupon":{"title":"StumbleUpon","has_counter":true},"mix":{"title":"Mix"},"telegram":{"title":"Telegram"},"pocket":{"title":"Pocket","has_counter":true},"xing":{"title":"XING","has_counter":true},"whatsapp":{"title":"WhatsApp"},"email":{"title":"Email"},"print":{"title":"Print"},"x-twitter":{"title":"X"},"threads":{"title":"Threads"}},"facebook_sdk":{"lang":"fr_FR","app_id":""},"lottie":{"defaultAnimationUrl":"https:\/\/www.creation-site-internet-toulon.net\/wp-content\/plugins\/elementor-pro\/modules\/lottie\/assets\/animations\/default.json"}}; </script> <script src="https://www.creation-site-internet-toulon.net/wp-content/plugins/elementor-pro/assets/js/frontend.min.js?ver=3.23.3" id="elementor-pro-frontend-js"></script> <script src="https://www.creation-site-internet-toulon.net/wp-includes/js/jquery/ui/core.min.js?ver=1.13.3" id="jquery-ui-core-js"></script> <script id="elementor-frontend-js-before"> var elementorFrontendConfig = {"environmentMode":{"edit":false,"wpPreview":false,"isScriptDebug":false},"i18n":{"shareOnFacebook":"Share on Facebook","shareOnTwitter":"Share on Twitter","pinIt":"Pin it","download":"Download","downloadImage":"Download image","fullscreen":"Fullscreen","zoom":"Zoom","share":"Share","playVideo":"Play Video","previous":"Previous","next":"Next","close":"Close","a11yCarouselWrapperAriaLabel":"Carousel | Horizontal scrolling: Arrow Left & Right","a11yCarouselPrevSlideMessage":"Previous slide","a11yCarouselNextSlideMessage":"Next slide","a11yCarouselFirstSlideMessage":"This is the first slide","a11yCarouselLastSlideMessage":"This is the last slide","a11yCarouselPaginationBulletMessage":"Go to slide"},"is_rtl":false,"breakpoints":{"xs":0,"sm":480,"md":768,"lg":1025,"xl":1440,"xxl":1600},"responsive":{"breakpoints":{"mobile":{"label":"Mobile Portrait","value":767,"default_value":767,"direction":"max","is_enabled":true},"mobile_extra":{"label":"Mobile Landscape","value":880,"default_value":880,"direction":"max","is_enabled":false},"tablet":{"label":"Tablet Portrait","value":1024,"default_value":1024,"direction":"max","is_enabled":true},"tablet_extra":{"label":"Tablet Landscape","value":1200,"default_value":1200,"direction":"max","is_enabled":true},"laptop":{"label":"Laptop","value":1366,"default_value":1366,"direction":"max","is_enabled":false},"widescreen":{"label":"Widescreen","value":2400,"default_value":2400,"direction":"min","is_enabled":false}}},"version":"3.24.3","is_static":false,"experimentalFeatures":{"additional_custom_breakpoints":true,"container_grid":true,"e_swiper_latest":true,"e_nested_atomic_repeaters":true,"e_onboarding":true,"theme_builder_v2":true,"hello-theme-header-footer":true,"home_screen":true,"ai-layout":true,"landing-pages":true,"link-in-bio":true,"floating-buttons":true,"display-conditions":true,"form-submissions":true,"taxonomy-filter":true},"urls":{"assets":"https:\/\/www.creation-site-internet-toulon.net\/wp-content\/plugins\/elementor\/assets\/","ajaxurl":"https:\/\/www.creation-site-internet-toulon.net\/wp-admin\/admin-ajax.php"},"nonces":{"floatingButtonsClickTracking":"19b26029ca"},"swiperClass":"swiper","settings":{"page":[],"editorPreferences":[]},"kit":{"active_breakpoints":["viewport_mobile","viewport_tablet","viewport_tablet_extra"],"global_image_lightbox":"yes","lightbox_enable_counter":"yes","lightbox_enable_fullscreen":"yes","lightbox_enable_zoom":"yes","lightbox_enable_share":"yes","lightbox_title_src":"title","lightbox_description_src":"description","hello_header_logo_type":"title","hello_header_menu_layout":"horizontal","hello_footer_logo_type":"logo"},"post":{"id":640,"title":"Guide%20Ultime%20pour%20Cr%C3%A9er%20un%20Site%20Web%20High-Tech","excerpt":"","featuredImage":"https:\/\/www.creation-site-internet-toulon.net\/wp-content\/uploads\/2024\/08\/Guide_Ultime_pour_Creer_un_Site_Web_High_Tech-1024x578.webp"}}; </script> <script src="https://www.creation-site-internet-toulon.net/wp-content/plugins/elementor/assets/js/frontend.min.js?ver=3.24.3" id="elementor-frontend-js"></script> <script src="https://www.creation-site-internet-toulon.net/wp-content/plugins/elementor-pro/assets/js/elements-handlers.min.js?ver=3.23.3" id="pro-elements-handlers-js"></script> <!-- Unlimited Elements 1.5.122 Scripts --> <script type='text/javascript' id='unlimited-elements-scripts'> /* WordPress Menu scripts: */ jQuery(document).ready(function(){ //jquery objects var g_objMenu = jQuery('#uc_nav_menu_elementor_04292ea'); var g_objFirstLevelMenuItems = g_objMenu.find('.ue-menu > .menu-item-has-children'); var g_objMenuItems = g_objMenu.find('.menu-item-has-children'); var g_objMenuInnerItems = g_objMenu.find('.menu-item-has-children .menu-item-has-children'); var g_objMenuLinks = g_objMenu.find('a'); var objExpandIcon = g_objMenu.find('.ue-nav-menu-icon-expand'); var g_objBurger = g_objMenu.find('.ue-nav-menu-mobile'); var g_objOpenBurgerIcon = g_objMenu.find('.ue-nav-menu-mobile-icon-open'); var g_objCloseBurgerIcon = g_objMenu.find('.ue-nav-menu-mobile-icon-close'); //classes var g_classActive = 'uc-active'; var hasChildrenClass = 'menu-item-has-children'; //selectors var menuItemSelector = '.'+hasChildrenClass; var iconsSelector = '.ue-nav-menu-icon'; var subMenuSelector = '.sub-menu'; var linkSelector = '> a'; //data attributes var g_showIcons = g_objMenu.data('show-icons'); var dataCustomBreakpoint = g_objMenu.data('breakpoint'); //html elements var g_expandIconHtml = objExpandIcon.html(); //window width var g_viewportWidth = jQuery(window).width(); var g_isResponsiveViewport = window.matchMedia("(max-width: "+dataCustomBreakpoint+"px)"); function setHoverEffects(){ var dataEffect = g_objMenu.data("effect-style"); if(dataEffect == "no-hover-effects") return(false); if(!g_objMenuLinks) return(false); g_objMenuLinks.each(function(){ var objLink = jQuery(this); var objParent = objLink.parent(); objParent.addClass(dataEffect); var objLinkText = objLink.text(); objLink.attr("data-hover", objLinkText); }); } function isClickedItemOnFirstLevel(objIcon){ var firstLevelIconClass = 'uc-first-level-item'; //check if clicked itcon is not first level icon var objFirstLevelIcons = g_objFirstLevelMenuItems.find(linkSelector).find(iconsSelector); objFirstLevelIcons.addClass(firstLevelIconClass); if(objIcon.hasClass(firstLevelIconClass) == true) return(true); else return(false); } function setActiveIcon(objClicked){ if(g_showIcons == false) return(false); if(objClicked.hasClass(g_classActive) == false) return(false); var objIcon = objClicked.find(iconsSelector); var collapseIconHtml = g_objMenu.find('.ue-nav-menu-icon-collapse').html(); if(isClickedItemOnFirstLevel(objIcon) == true) return(false); objIcon.html(collapseIconHtml); } function setDisactiveIcon(objClicked){ if(g_showIcons == false) return(false); var objIcon = objClicked.find(iconsSelector); if(isClickedItemOnFirstLevel(objIcon) == true) return(false); objIcon.html(g_expandIconHtml); } function cancelFullWidth(objMobileMenu){ objMobileMenu.css({ 'width': '', 'left': '' }); } function setMenuToFullWidth(objMobileMenu){ var dataFullWidth = g_objMenu.data('full-width'); if(dataFullWidth == false) return(false); //if not mobile viewport - cancel full width and exit function if(g_isResponsiveViewport.matches == false){ cancelFullWidth(objMobileMenu); return(false); } //set width to full objMobileMenu.css('width', g_viewportWidth+'px'); //set left position var menuLeftPosition = g_objMenu.offset().left; objMobileMenu.css('left', -menuLeftPosition+'px'); } function initResponsiveMode(isResize){ var objSubMenus = g_objMenu.find(subMenuSelector); var objMobileMenu = g_objMenu.find('.ue-menu'); var mobileClass = 'uc-mobile'; //update viewport width value g_viewportWidth = jQuery(window).width(); //set full width if needed setTimeout(function(){ setMenuToFullWidth(objMobileMenu); },200); if(g_isResponsiveViewport.matches == false){ //remove mobile class from menu objMobileMenu.removeClass(mobileClass); if(!isResize || isResize == false) objSubMenus.slideDown(300); var objLinks = objSubMenus.prev(); correctOpenMenuPosition(objLinks); } if(g_isResponsiveViewport.matches == true){ //add mobile class to menu objMobileMenu.addClass(mobileClass); if(!isResize || isResize == false) objSubMenus.slideUp(300); if(g_objBurger.hasClass(g_classActive) == true){ g_objOpenBurgerIcon.removeClass(g_classActive); g_objCloseBurgerIcon.addClass(g_classActive); }else{ g_objOpenBurgerIcon.addClass(g_classActive); g_objCloseBurgerIcon.removeClass(g_classActive); } } } /* * correct menu item position when there is no space inside viewport */ function correctOpenMenuPosition(objTarget){ //only on desktop if(g_isResponsiveViewport.matches == true) return(false); var objSubMenu = objTarget.next(); // if no sub menus return if(!objSubMenu.length) return(false); var objParentSubMenus = objTarget.parents(subMenuSelector); //search only from second level menu items if(!objParentSubMenus.length) return(false); //each parent submenu objParentSubMenus.each(function(parentIndex, parent){ var objParentSubMenu = jQuery(this); // Get the position of the menu item relative to the viewport var objChildSubMenus = objParentSubMenu.find('li >'+subMenuSelector); if(!objChildSubMenus.length) return(true); //each child submenu objChildSubMenus.each(function(childIndex, child){ var objChildSubMenu = jQuery(this); //width of the child var menuItemChildWidth = objChildSubMenu.width(); //width of the parent var menuItemParentWidth = objParentSubMenu.width(); //right offset of the parent var menuItemRightOffset = objParentSubMenu.offset().left + menuItemParentWidth; var menuItemLeftOffset = objParentSubMenu.offset().left; // Get the available space on both sides of the screen var spaceRight = window.innerWidth - menuItemRightOffset; //get inset-inline-start value var insetInlineStart = objChildSubMenu.css('inset-inline-start'); // if there is NOT enough room (left or right) then invert insert-inline-start if (menuItemChildWidth >= spaceRight || menuItemChildWidth >= menuItemLeftOffset) objChildSubMenu.css('inset-inline-start', '-'+insetInlineStart); // if there is NOT enough room anywhere if (menuItemChildWidth >= spaceRight && menuItemChildWidth >= menuItemLeftOffset){ console.log('Can"t correct position of the dropdown, please adjust width of menu items'); return(true); } //if there is enough room then cancel invert insert-inline-start if (menuItemChildWidth < spaceRight && childIndex != parentIndex){ //menuItemChildWidth x2 times because its equal to inset-inline-start var childSubMenuOffsetRight = objParentSubMenu.offset().left + menuItemParentWidth + menuItemChildWidth + menuItemChildWidth; //cancel when child sub-menu offset right is not grater then viewport width (must check if after canceling won't be any horizontal scroll) if(childSubMenuOffsetRight < window.innerWidth) objChildSubMenu.css('inset-inline-start', ''); } }); }); } /* * responsive mode menu item click */ function onMenuLinkClick(e){ if(g_isResponsiveViewport.matches == false) return(true); var objLink = jQuery(this); var objSubMenu = objLink.next(); //if click on active item then close it if(objLink.hasClass(g_classActive) == true){ setDisactiveIcon(objLink); objSubMenu.slideUp(300); objLink.removeClass(g_classActive); return(true); } var objSubMenusParent = objSubMenu.parents(subMenuSelector); var objSubMenusNotParents = g_objMenu.find(subMenuSelector).not(objSubMenusParent); var objMenuLinksParent = objLink.parents(subMenuSelector).prev(); var objMenuLinksNotParents = g_objMenu.find('a').not(objMenuLinksParent); objMenuLinksNotParents.removeClass(g_classActive); objLink.addClass(g_classActive); setDisactiveIcon(objMenuLinksNotParents); setActiveIcon(objLink); objSubMenusNotParents.slideUp(300); objSubMenu.slideDown(300); if(objSubMenu.length > 0) e.preventDefault(); } function onMenuInnerItemMouseover(e){ if(g_isResponsiveViewport.matches == true) return(false); var objHovered = jQuery(this); var objItem = objHovered.find(linkSelector); setTimeout(function(){ setActiveIcon(objItem); },100); var objTarget = jQuery(e.target); correctOpenMenuPosition(objTarget); } function onMenuInnerItemMouseLeave(){ if(g_isResponsiveViewport.matches == true) return(false); var objMenuItem = jQuery(this); var objItem = objMenuItem.find(linkSelector); setDisactiveIcon(objItem); } /** * use this funciton to add active class to all menu item links */ function onMenuItemMouseover(){ if(g_isResponsiveViewport.matches == true) return(false); var objHovered = jQuery(this); var objItem = objHovered.find(linkSelector); g_objMenuItems.removeClass(g_classActive); objItem.addClass(g_classActive); } /** * use this funciton to add active class to all menu item links */ function onMenuItemMouseLeave(){ if(g_isResponsiveViewport.matches == true) return(false); var objHovered = jQuery(this); var objItem = objHovered.find(linkSelector); objItem.removeClass(g_classActive); } function setFirstLevelIcons(){ if(g_showIcons == false) return(false); var objFirstLevelMenuLinks = g_objFirstLevelMenuItems.find(linkSelector); var objFirstLevelExpandIcon = g_objMenu.find('.ue-nav-menu-icon-first-level-expand'); var firstLevelExpandIconHtml = objFirstLevelExpandIcon.html(); var iconWrapperHtml = "<span class='ue-nav-menu-icon'>"+firstLevelExpandIconHtml+"</span>"; objFirstLevelMenuLinks.append(iconWrapperHtml); } function setIcons(){ if(g_showIcons == false) return(false); if(!g_objMenuInnerItems) return(false); var objMenuLinks = g_objMenuInnerItems.find(linkSelector); var iconHtml = "<span class='ue-nav-menu-icon'>"+g_expandIconHtml+"</span>"; objMenuLinks.append(iconHtml); } function onBurgerClick(){ if(g_objBurger.hasClass(g_classActive) == true){ g_objOpenBurgerIcon.addClass(g_classActive); g_objCloseBurgerIcon.removeClass(g_classActive); g_objBurger.removeClass(g_classActive); }else{ g_objOpenBurgerIcon.removeClass(g_classActive); g_objCloseBurgerIcon.addClass(g_classActive); g_objBurger.addClass(g_classActive); } } function onKeyDown(e){ //only on desktop if(g_isResponsiveViewport.matches == true) return(true); //listen only after 'tab' key if(e.keyCode != 9) return(true); //find all 'li' tags var objItems = g_objMenu.find('li'); //set small timeout, so current menu item was mark as focused and triggered setTimeout(function(){ //look after all menu 'li' tags objItems.each(function(){ var objItem = jQuery(this); //if link not focused - skip if(objItem.find(linkSelector).is(':focus') == false) return(true); var objLink = objItem.find(linkSelector); var objSubMenu = objLink.next(); //remove active class from others menu items except parent ones var objMenuLinksParent = objLink.parents(subMenuSelector).prev(); var objMenuLinksNotParents = g_objMenu.find('.ue-menu '+menuItemSelector+' '+subMenuSelector+' a').not(objMenuLinksParent); var objParentsMenuitems = objItem.parents(menuItemSelector); var objMenuItemsNotParents = objItems.not(objParentsMenuitems); var objFirstLevelMenuLinks = jQuery('.ue-nav-menu .ue-menu > li '+linkSelector+''); var isFocusedFirstLevelActiveChildrenLinks = objFirstLevelMenuLinks.next().find('li '+linkSelector).is(':focus'); //if there is no expanded menu items inside first level menu items then remove active class if(isFocusedFirstLevelActiveChildrenLinks == false) objFirstLevelMenuLinks.removeClass(g_classActive); objMenuLinksNotParents.removeClass(g_classActive); objMenuItemsNotParents.removeClass(g_classActive); setDisactiveIcon(objMenuLinksNotParents); //add active class and use css to open sub menu objItem.addClass(g_classActive); objLink.addClass(g_classActive); var objParentMenuItemNum = objLink.parents(menuItemSelector).length; if(objParentMenuItemNum > 1) setActiveIcon(objLink); }); },50) } /** * close menu on body click */ function onBodyClick(e){ if(g_isResponsiveViewport.matches == true) return(true); var objTarget = jQuery(e.target); var objTargetParents = objTarget.parents(); if(objTargetParents.hasClass('ue-nav-menu')) return(true); g_objMenuItems.removeClass(g_classActive); g_objMenuLinks.removeClass(g_classActive); setDisactiveIcon(g_objMenuLinks); } setFirstLevelIcons(); setIcons(); initResponsiveMode(false); setHoverEffects(); //init events jQuery(window).on('resize', function(){ initResponsiveMode(true); }); g_objMenuLinks.on('click', onMenuLinkClick); g_objBurger.on('click', onBurgerClick); if(g_objMenuInnerItems){ g_objMenuInnerItems.on('mouseover', onMenuInnerItemMouseover); g_objMenuInnerItems.on('mouseleave', onMenuInnerItemMouseLeave); } if(g_objMenuItems){ g_objMenuItems.on('mouseover', onMenuItemMouseover); g_objMenuItems.on('mouseleave', onMenuItemMouseLeave); } jQuery(document).on('keydown', onKeyDown); jQuery('body').on('click', function(e){ onBodyClick(e); }); }); </script> </body> </html>