Vous souhaitez développer des pages web optimisées sur votre site internet ?
Vous manquez d’idées pour remplir vos pages web ?
Alors, vous êtes au bon endroit !
Afin d’améliorer l’UX de vos pages web, il est possible d’afficher son contenu sous diverses formes : Tableaux, images, listes à puces.
Dans cet article, Kevin Benabdelhak, graphiste indépendant chez K-Graphiste, vous propose simplement de (re)découvrir 10 éléments HTML à publier sur votre site web pour optimiser votre référencement naturel et enrichir votre contenu.
Table des matières
Qu’est-ce qu’un élément HTML ?
Si vous êtes débutant dans le développement web, alors voici une introduction aux éléments HTML.
En maîtrisant les balises du langage HTML, vous pouvez :
- Gagner du temps sur les aspects techniques
- Optimiser chaque type de contenus
Définition
Un élément HTML est une balise utilisée pour structurer le contenu d’une page web. Il s’agit d’un élément de code qui définit une partie spécifique du contenu et lui donne du sens…
Les éléments HTML incluent des titres, des paragraphes, des listes, des liens, des images, des tableaux et des formulaires.
Bien sûr, chaque élément HTML dispose d’un objectif bien précis sur une page web.
C’est ce que nous allons voir ensemble.
Comment fonctionnent les balises HTML ?
Chacune des balises HTML se compose d’un nom, d’un ou plusieurs attributs et d’un contenu spécifique.
Par exemple, pour insérer une image sur une page web, vous utilisez la balise .
Il est possible de lui spécifier des options supplémentaires sous la forme d’attribut HTML.
Les attributs HTML sont simplement des informations supplémentaires sur l’élément et peuvent inclure des informations de style, de classe et de contenu.
Par exemple, voici comment afficher notre image :
Cet exemple contient :
- L’attribut “src” pour renseigner l’emplacement du fichier de l’image,
- Ainsi que l’attribut “alt” pour indiquer la description.
Quels sont les 8 types de balises HTML fondamentales ?
Il existe plusieurs types de balise HTML, certaines sont dédiées à la structure de votre page, et d’autres propres aux contenus.
Voici les types de balises HTML utilisées très fréquemment et accompagnées de quelques exemples.
Note : il en existe plein d’autres, voici guide complet des éléments HTML de Mozilla.
Balises de structure de base
Les balises de structure de base sont essentielles pour la création d’un document HTML.
Elles définissent les principales sections du document et contiennent des informations telles que le titre et les métadonnées.
C’est ainsi que les navigateurs web déchiffrent le contenu de la page et l’affichent correctement.
Exemples
- encadre tout le contenu de la page et indique au navigateur qu’il s’agit d’une page HTML.
- contient des informations concernant le document HTML, comme le titre de la page, les métadonnées et les liens vers les feuilles de style externes.
spécifie le titre de la page web, qui est affiché dans le titre de la fenêtre du navigateur et dans les résultats des moteurs de recherche.</li> <li><body> contient tout le contenu visible de la page web, comme le texte, les images, le contenu multimédia et les liens.</li> </ul> <h3 id="h.t2jusj2emahz"><span id="Balises-de-section">Balises de section</span></h3> <p><img decoding="async" class="aligncenter wp-image-41498 size-full" title="Balises HTML de section" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20350'%3E%3C/svg%3E" alt="Balises HTML de section" width="1000" height="350" data-lazy-srcset="https://audreytips.com/wp-content/uploads/2023/01/sections-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/sections-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/sections-html-768x269.jpg 768w" data-lazy-sizes="(max-width: 1000px) 100vw, 1000px" data-lazy-src="https://audreytips.com/wp-content/uploads/2023/01/sections-html.jpg" /><noscript><img decoding="async" class="aligncenter wp-image-41498 size-full" title="Balises HTML de section" src="https://audreytips.com/wp-content/uploads/2023/01/sections-html.jpg" alt="Balises HTML de section" width="1000" height="350" srcset="https://audreytips.com/wp-content/uploads/2023/01/sections-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/sections-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/sections-html-768x269.jpg 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></noscript></p> <p>Avec les balises de section, le développeur web organise son contenu en plusieurs sections logiques, telles que des articles, un contenu principal ou des informations supplémentaires.</p> <p>Ces balises servent à donner une structure à un document HTML et à organiser son contenu en différents blocs qui peuvent être facilement identifiés par les navigateurs web.</p> <p><strong>Exemple</strong></p> <ul> <li><section> regroupe des contenus liés qui forment une section logique d’un document HTML.</li> <li><article> encadre un contenu autonome qui peut être réutilisé ou redistribué indépendamment du document HTML dans lequel il se trouve.</li> <li><main> encadre le contenu principal d’un document HTML.</li> <li><nav> encadre le contenu de la navigation principale d’un document HTML.</li> <li><aside> encadre des contenus qui ne sont pas directement liés au contenu principal d’un document HTML, comme des informations supplémentaires ou des liens vers des pages externes.</li> <li><header> encadre le contenu du haut de la page, comme le titre, la navigation, les logos et les liens vers des pages externes.</li> </ul> <h3 id="h.z0wicbdc91x"><span id="Balises-de-titre">Balises de titre</span></h3> <p><img decoding="async" class="aligncenter wp-image-41499 size-full" title="Balises de titre" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20350'%3E%3C/svg%3E" alt="Balises de titre" width="1000" height="350" data-lazy-srcset="https://audreytips.com/wp-content/uploads/2023/01/titres-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/titres-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/titres-html-768x269.jpg 768w" data-lazy-sizes="(max-width: 1000px) 100vw, 1000px" data-lazy-src="https://audreytips.com/wp-content/uploads/2023/01/titres-html.jpg" /><noscript><img loading="lazy" decoding="async" class="aligncenter wp-image-41499 size-full" title="Balises de titre" src="https://audreytips.com/wp-content/uploads/2023/01/titres-html.jpg" alt="Balises de titre" width="1000" height="350" srcset="https://audreytips.com/wp-content/uploads/2023/01/titres-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/titres-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/titres-html-768x269.jpg 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></noscript></p> <p>Les balises de titre servent à ajouter du texte au document HTML qui apparaît comme un titre ou sous-titre sur la page web affichée par un navigateur web.</p> <p>Les balises H1, H2, H3 et H4 sont les principales balises de titre pour organiser le contenu avec différents niveaux de titres.</p> <p><strong>Exemples</strong></p> <ul> <li><h1> encadre le titre principal d’un document HTML.</li> <li><h2> encadre des titres secondaires qui sont des sous-titres de niveau 2.</li> <li><h3> encadre des titres tertiaires qui sont des sous-titres avec un niveau inférieur aux titres secondaires.</li> <li><h4> encadre des titres quaternaires qui sont des sous-titres avec un niveau inférieur aux titres tertiaires.</li> </ul> <h3 id="h.tn6vv0h93ifb"><span id="Balises-de-liste">Balises de liste</span></h3> <p><img decoding="async" class="aligncenter wp-image-41500 size-full" title="Balises de liste" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20350'%3E%3C/svg%3E" alt="Balises de liste" width="1000" height="350" data-lazy-srcset="https://audreytips.com/wp-content/uploads/2023/01/listes-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/listes-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/listes-html-768x269.jpg 768w" data-lazy-sizes="(max-width: 1000px) 100vw, 1000px" data-lazy-src="https://audreytips.com/wp-content/uploads/2023/01/listes-html.jpg" /><noscript><img loading="lazy" decoding="async" class="aligncenter wp-image-41500 size-full" title="Balises de liste" src="https://audreytips.com/wp-content/uploads/2023/01/listes-html.jpg" alt="Balises de liste" width="1000" height="350" srcset="https://audreytips.com/wp-content/uploads/2023/01/listes-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/listes-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/listes-html-768x269.jpg 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></noscript></p> <p>Les balises de liste servent à ajouter des listes au document HTML. Elles permettent aux codeurs web d’organiser le contenu en groupes logiques pour faciliter la lecture et la navigation.</p> <p>Il existe 3 principales balises de liste :</p> <ul> <li>ul (liste non-ordonnée),</li> <li>ol (liste ordonnée),</li> <li>et dl (liste de définitions).</li> </ul> <p><strong>Exemples</strong></p> <ul> <li><ul> crée une liste non-ordonnée. C’est une liste dont les éléments ne sont pas numérotés.</li> <li><li> encadre chaque élément d’une liste.</li> <li><dl> crée une liste de définitions. C’est une liste qui contient des définitions ou des explications.</li> <li><ol> crée une liste ordonnée. C’est une liste dont les éléments sont numérotés.</li> </ul> <h3 id="h.tqqbo89gpaie"><span id="Balises-dimage">Balises d’image</span></h3> <p><img decoding="async" class="aligncenter wp-image-41505 size-full" title="Balises d’image" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20350'%3E%3C/svg%3E" alt="Balises d’image" width="1000" height="350" data-lazy-srcset="https://audreytips.com/wp-content/uploads/2023/01/images-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/images-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/images-html-768x269.jpg 768w" data-lazy-sizes="(max-width: 1000px) 100vw, 1000px" data-lazy-src="https://audreytips.com/wp-content/uploads/2023/01/images-html.jpg" /><noscript><img loading="lazy" decoding="async" class="aligncenter wp-image-41505 size-full" title="Balises d’image" src="https://audreytips.com/wp-content/uploads/2023/01/images-html.jpg" alt="Balises d’image" width="1000" height="350" srcset="https://audreytips.com/wp-content/uploads/2023/01/images-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/images-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/images-html-768x269.jpg 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></noscript></p> <p>Les balises d’image servent à insérer des images ou des contenus multimédias au document HTML.</p> <p>Grâce à ces balises, les codeurs web ajoutent du contenu visuel à une page, ce qui peut être utile pour attirer l’attention sur un produit ou service ou tout simplement pour rendre une page plus attrayante.</p> <p>La balise img est généralement utilisée pour insérer des images, tandis que la balise figure est utilisée pour encadrer des contenus multimédias comme des vidéos.</p> <p><strong>Exemples</strong></p> <ul> <li><img> insère une image dans un document HTML.</li> <li><figure> encadre un contenu multimédia, comme une image ou une vidéo.</li> </ul> <h3 id="h.46c9rfzi1w3r"><span id="Balises-de-texte">Balises de texte</span></h3> <p><img decoding="async" class="aligncenter wp-image-41501 size-full" title="Balises de texte" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20350'%3E%3C/svg%3E" alt="Balises de texte" width="1000" height="350" data-lazy-srcset="https://audreytips.com/wp-content/uploads/2023/01/textes-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/textes-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/textes-html-768x269.jpg 768w" data-lazy-sizes="(max-width: 1000px) 100vw, 1000px" data-lazy-src="https://audreytips.com/wp-content/uploads/2023/01/textes-html.jpg" /><noscript><img loading="lazy" decoding="async" class="aligncenter wp-image-41501 size-full" title="Balises de texte" src="https://audreytips.com/wp-content/uploads/2023/01/textes-html.jpg" alt="Balises de texte" width="1000" height="350" srcset="https://audreytips.com/wp-content/uploads/2023/01/textes-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/textes-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/textes-html-768x269.jpg 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></noscript></p> <p>Les balises de texte servent à ajouter du contenu textuel au document HTML.</p> <p>Ainsi, les développeurs web organisent le texte en paragraphes lisibles et metent en évidence certains mots ou phrases.</p> <p>Les principales balises de texte sont :</p> <ul> <li>p (paragraphe),</li> <li>span (mots ou phrases),</li> <li>strong (texte mis en évidence).</li> </ul> <p><strong>Exemples</strong></p> <ul> <li><p> encadre un paragraphe de texte.</li> <li><span> encadre des éléments de texte plus petits qu’un paragraphe, comme des mots, des phrases ou des lignes.</li> <li><strong> met en évidence un texte, en le rendant plus visible ou plus important.</li> </ul> <h3 id="h.pql1a7maitmb"><span id="Balises-de-formulaire">Balises de formulaire</span></h3> <p><img decoding="async" class="aligncenter wp-image-41502 size-full" title="Balises de formulaire" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20350'%3E%3C/svg%3E" alt="Balises de formulaire" width="1000" height="350" data-lazy-srcset="https://audreytips.com/wp-content/uploads/2023/01/formulaires-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/formulaires-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/formulaires-html-768x269.jpg 768w" data-lazy-sizes="(max-width: 1000px) 100vw, 1000px" data-lazy-src="https://audreytips.com/wp-content/uploads/2023/01/formulaires-html.jpg" /><noscript><img loading="lazy" decoding="async" class="aligncenter wp-image-41502 size-full" title="Balises de formulaire" src="https://audreytips.com/wp-content/uploads/2023/01/formulaires-html.jpg" alt="Balises de formulaire" width="1000" height="350" srcset="https://audreytips.com/wp-content/uploads/2023/01/formulaires-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/formulaires-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/formulaires-html-768x269.jpg 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></noscript></p> <p>Les balises de formulaire servent à créer des formulaires HTML qui peuvent être remplis par les utilisateurs.</p> <p>Les codeurs web définissent les champs et zones de saisie au document, ce qui s’avère utile pour recueillir des informations telles que le nom, l’adresse e-mail ou les informations bancaires d’un utilisateur.</p> <p>Les principales balises de formulaire sont form, input et textarea.</p> <p><strong>Exemples</strong></p> <ul> <li><form> crée un formulaire. C’est l’ensemble des champs qui sont renseignés par un utilisateur.</li> <li><input> crée un champ dans un formulaire dans lequel un utilisateur va saisir ses informations.</li> <li><textarea> crée un champ de texte dans un formulaire dans lequel un utilisateur peut entrer un bloc de texte.</li> </ul> <h3 id="h.x4dyq8upu0dn"><span id="Balises-de-medias">Balises de médias</span></h3> <p><img decoding="async" class="aligncenter wp-image-41503 size-full" title="Balises de médias" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20350'%3E%3C/svg%3E" alt="Balises de médias" width="1000" height="350" data-lazy-srcset="https://audreytips.com/wp-content/uploads/2023/01/media-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/media-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/media-html-768x269.jpg 768w" data-lazy-sizes="(max-width: 1000px) 100vw, 1000px" data-lazy-src="https://audreytips.com/wp-content/uploads/2023/01/media-html.jpg" /><noscript><img loading="lazy" decoding="async" class="aligncenter wp-image-41503 size-full" title="Balises de médias" src="https://audreytips.com/wp-content/uploads/2023/01/media-html.jpg" alt="Balises de médias" width="1000" height="350" srcset="https://audreytips.com/wp-content/uploads/2023/01/media-html.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/media-html-300x105.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/media-html-768x269.jpg 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></noscript></p> <p>Les balises de médias servent à intégrer des médias tels que des vidéos ou des fichiers audio au document HTML.</p> <p>Grâce aux balises de médias, un développeur peut ajouter du contenu multimédia à une page web, ce qui peut être utile pour montrer un produit ou service en action ou simplement pour ajouter un peu plus d’interactivité à une page.</p> <p>La balise video est généralement utilisée pour insérer des vidéos, tandis que la balise audio est utilisée pour insérer des fichiers audio.</p> <p><strong>Exemples</strong></p> <ul> <li><video> insère une vidéo dans un document HTML.</li> <li><audio> insère un fichier audio dans un document HTML.</li> </ul> <div class="crp_related crp_related_shortcode crp-text-only"><strong>Sur le même sujet </strong>: <a href="https://audreytips.com/wordpress-guide-debutant/" class="crp_link post-32695"><span class="crp_title">Qu'est-ce que WordPress et pourquoi l'utiliser pour votre site ?</span></a><div class="crp_clear"></div></div> <h2 id="h.748qnujl2wwm"><span id="10-elements-HTML-a-mettre-en-place">10 éléments HTML à mettre en place</span></h2> <p><img decoding="async" class="aligncenter wp-image-41507 size-full" title="10 éléments HTML à mettre en place" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20563'%3E%3C/svg%3E" alt="10 éléments HTML à mettre en place" width="1000" height="563" data-lazy-srcset="https://audreytips.com/wp-content/uploads/2023/01/elements-HTML.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-300x169.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-768x432.jpg 768w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-354x200.jpg 354w" data-lazy-sizes="(max-width: 1000px) 100vw, 1000px" data-lazy-src="https://audreytips.com/wp-content/uploads/2023/01/elements-HTML.jpg" /><noscript><img loading="lazy" decoding="async" class="aligncenter wp-image-41507 size-full" title="10 éléments HTML à mettre en place" src="https://audreytips.com/wp-content/uploads/2023/01/elements-HTML.jpg" alt="10 éléments HTML à mettre en place" width="1000" height="563" srcset="https://audreytips.com/wp-content/uploads/2023/01/elements-HTML.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-300x169.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-768x432.jpg 768w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-354x200.jpg 354w" sizes="(max-width: 1000px) 100vw, 1000px" /></noscript></p> <p>Quel que soit l’objectif de votre site internet, il est nécessaire d’inclure plusieurs éléments HTML pour mettre en forme vos pages web.</p> <p><strong>Enrichissez le contenu de vos pages web en publiant ces </strong><strong>10 éléments HTML :</strong></p> <ol start="1"> <li>Titres et sous-titres (h1, h2, h3, etc.)</li> <li>Paragraphes</li> <li>Listes (numérotées et non numérotées)</li> <li>Liens</li> <li>Images</li> <li>Formulaires</li> <li>Tableaux</li> <li>Vidéos</li> <li>Audio</li> <li>Boutons</li> </ol> <p>Voyons tout ça en détail…</p> <h3 id="h.z2vn08micp12"><span id="1-Titres-h1-h2-h38230">1. Titres (h1, h2, h3…)</span></h3> <p style="text-align: center;"><h1>Titre principal du contenu</h1></p> <p>Les titres sont un moyen efficace de <a href="https://audreytips.com/seo-aujourdhui/">structurer le contenu</a> de votre site web et de le rendre plus lisible.</p> <p>Les balises h1 à h6 vous aide à faire passer votre message et à mettre en évidence les parties importantes de votre contenu.</p> <h3 id="h.yrzqd7y7fyp"><span id="2-Paragraphes">2. Paragraphes</span></h3> <p style="text-align: center;"><p>Un paragraphe descriptif</p></p> <p>Les paragraphes sont essentiels pour rédiger du texte descriptif ou informatif. En utilisant des paragraphes, vous pouvez organiser votre contenu et le rendre plus facile à lire et à comprendre.</p> <p>Veillez toutefois à sauter des lignes afin d’<a href="https://audreytips.com/7-conseils-mieux-rediger-contenu-web/">améliorer la lisibilité du texte</a>.</p> <h3 id="h.j7f6tkwblcj9"><span id="3-Listes-a-puces">3. Listes à puces</span></h3> <p>Les listes sont un moyen pratique pour la mise en forme de vos idées ou d’informations importantes.</p> <p>Les types de listes <ol> et <ul> sont utiles pour hiérarchiser le contenu et le rendre <a href="https://audreytips.com/4-conseils-mise-en-forme-contenu-lisible/">plus accessible à lire</a> et à comprendre.</p> <p><strong>Exemple</strong></p> <p><ul></p> <p style="padding-left: 40px;"><li>Élément 1</li></p> <p style="padding-left: 40px;"><li>Élément 2</li></p> <p style="padding-left: 40px;"><li>Élément 3</li></p> <p></ul></p> <h3 id="h.y22puysb3x3j"><span id="4-Liens">4. Liens</span></h3> <p style="text-align: center;"><a href= »url-du-site »>Lien vers le site</a></p> <p>Les liens sont essentiels pour relier votre contenu à d’autres pages de votre site ou à d’autres sites.</p> <p><a href="https://audreytips.com/pourquoi-comment-batir-maillage-liens-internes/">Lier vos pages web entre elles</a> améliore également votre référencement naturel et amène plus de visiteurs sur votre site internet.</p> <h3 id="h.bq8bkggoa45x"><span id="5-Images">5. Images</span></h3> <p style="text-align: center;"><img src= »url-de-limage.jpg » alt= »Description de l’image »></p> <p>Une image vaut mille mots !</p> <p>Et c’est d’autant plus vrai sur une page web.</p> <p>Les images <a href="https://audreytips.com/images-illustrations-seo/">ajoutent du contexte</a> et du visuel à votre contenu, ce qui le rend plus intéressant et le démarque.</p> <h3 id="h.oeg4tys0eafi"><span id="6-Formulaires">6. Formulaires</span></h3> <p><img decoding="async" class="aligncenter wp-image-41508 size-full" title="10 éléments HTML à mettre en place (formulaire)" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20563'%3E%3C/svg%3E" alt="10 éléments HTML à mettre en place (formulaire)" width="1000" height="563" data-lazy-srcset="https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-suite.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-suite-300x169.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-suite-768x432.jpg 768w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-suite-354x200.jpg 354w" data-lazy-sizes="(max-width: 1000px) 100vw, 1000px" data-lazy-src="https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-suite.jpg" /><noscript><img loading="lazy" decoding="async" class="aligncenter wp-image-41508 size-full" title="10 éléments HTML à mettre en place (formulaire)" src="https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-suite.jpg" alt="10 éléments HTML à mettre en place (formulaire)" width="1000" height="563" srcset="https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-suite.jpg 1000w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-suite-300x169.jpg 300w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-suite-768x432.jpg 768w, https://audreytips.com/wp-content/uploads/2023/01/elements-HTML-suite-354x200.jpg 354w" sizes="(max-width: 1000px) 100vw, 1000px" /></noscript></p> <p>Les formulaires sont un moyen pratique de recueillir des informations auprès de vos utilisateurs.</p> <p>Recueillez des informations utiles telles que des noms, des adresses e-mail et des commentaires.</p> <p><strong>Exemple</strong></p> <p><form action= »url-du-formulaire »></p> <p style="padding-left: 40px;"><input type= »text » name= »nom » placeholder= »Votre nom »></p> <p style="padding-left: 40px;"><input type= »email » name= »email » placeholder= »Votre email »></p> <p style="padding-left: 40px;"><input type= »submit » value= »Envoyer »></p> <p></form></p> <h3 id="h.820ywyp1y9bv"><span id="7-Tableaux">7. Tableaux</span></h3> <p>Les tableaux HTML sont utiles pour afficher des informations ou des données en lignes et en colonnes.</p> <p>Les tableaux sont un outil pratique pour organiser et présenter votre contenu de manière attrayante et facilement lisible.</p> <p>Un super moyen pour comparer des données en fonction de leurs caractéristiques ou des propriétés distinctes.</p> <p>Les tableaux HTML sont également utiles pour créer des formulaires et des systèmes de navigation.</p> <p>Vous pouvez par ailleurs utiliser des tableaux pour organiser des images, des liens et des informations connexes.</p> <p><strong>Exemple</strong></p> <p><table></p> <p style="padding-left: 40px;"><tr></p> <p style="padding-left: 80px;"><th>Nom</th></p> <p style="padding-left: 80px;"><th>Age</th></p> <p style="padding-left: 40px;"></tr></p> <p style="padding-left: 40px;"><tr></p> <p style="padding-left: 80px;"><td>Jean Dupont</td></p> <p style="padding-left: 80px;"><td>35 ans</td></p> <p style="padding-left: 40px;"></tr></p> <p style="padding-left: 40px;"><tr></p> <p style="padding-left: 80px;"><td>Louise Martin</td></p> <p style="padding-left: 80px;"><td>25 ans</td></p> <p style="padding-left: 40px;"></tr></p> <p></table></p> <h3 id="h.9wj704pwu870"><span id="8-Videos">8. Vidéos</span></h3> <p>Les vidéos sont une excellente façon de <a href="https://audreytips.com/avantages-video-animee/">présenter votre contenu de manière dynamique et interactive</a>.</p> <p>Par ailleurs, les vidéos sont utilisées pour améliorer le référencement de votre site web et pour encourager les visiteurs à rester plus longtemps sur votre site.</p> <p><strong>Exemple</strong></p> <p><video width= »400″ controls></p> <p style="padding-left: 40px;"><source src= »url-de-la-video.mp4″ type= »video/mp4″></p> <p style="padding-left: 40px;">Votre navigateur ne supporte pas les vidéos HTML</p> <p></video></p> <h3 id="h.me1wo1iyoc1o"><span id="9-Audio">9. Audio</span></h3> <p>Les fichiers audio sont un moyen pratique de transmettre votre message à vos utilisateurs.</p> <p>Les fichiers audio peuvent être utilisés pour <a href="https://audreytips.com/podcast-seo/">créer des podcasts</a>, des conférences en ligne et bien plus encore.</p> <p><strong>Exemple</strong></p> <p><audio controls></p> <p style="padding-left: 40px;"><source src= »url-du-fichier-audio.mp3″ type= »audio/mpeg »></p> <p style="padding-left: 40px;">Votre navigateur ne supporte pas les fichiers audio HTML</p> <p></audio></p> <h3 id="h.imqe6qrbjv3i"><span id="10-Boutons">10. Boutons</span></h3> <p style="text-align: center;"><button type= »submit »>Envoyer</button></p> <p>Les boutons HTML sont un moyen efficace de guider vos utilisateurs à travers votre site web et de leur donner des moyens d’interaction.</p> <p>Les boutons peuvent être utilisés pour créer des liens, des formulaires, <a href="https://audreytips.com/3-cta-augmenter-conversions/">des boutons d’appel à l’action</a> (CTA)…</p> <p><strong>Conseil supplémentaire :</strong> pensez à <a href="https://validator.w3.org/">tester votre code HTML sur W3C</a>. Cet outil gratuit vous permettra de découvrir les erreurs de hiérarchie et de syntaxe dans votre code. Idéal pour trouver ce que vous pourriez améliorer sur vos pages web !</p> <blockquote><p>audrey : merci Kévin sur cette introduction aux principaux éléments HTML. Je permets d’ajouter qu’il est utile d’avoir des notions sur les principaux éléments de HTML même si vous n’êtes pas développeur. Ainsi, vous comprenez comment les pages web sont construites. Vous allez communiquer de manière plus efficace avec les développeurs web, voire créer des pages web simples par vous-même.</p></blockquote> <h2 id="h.nl0jrq87irb6">FAQ – 3 questions courantes sur les éléments HTML</h2> <section class="sc_fs_faq sc_card "> <div> <h4>Pourquoi respecter les balises HTML ?</h4> <div> <p> Les balises HTML sont importantes pour bien organiser le contenu du site internet de votre entreprise. Cela le rend plus agréable pour les utilisateurs et plus accessible aux robots d’explorations des moteurs de recherches. En respectant les balises HTML, vous optimisez donc le référencement de votre site internet pour le rendre plus visible sur les moteurs de recherche. </p> </div> </div> </section> <section class="sc_fs_faq sc_card "> <div> <h4>Quels sont les autres éléments HTML que je peux publier ?</h4> <div> <p> En plus des éléments HTML mentionnés dans l’article, il existe d’autres éléments HTML tels que les blocs de citation, les commentaires, les marqueurs de code, les sauts de ligne, les légendes, les entrées cachées, les balises meta, les blocs de code HTML et bien d’autres. </p> </div> </div> </section> <section class="sc_fs_faq sc_card "> <div> <h4>Comment utiliser correctement les balises HTML ?</h4> <div> <p> Pour utiliser correctement les balises HTML, vous devez vous assurer que vous respectez les normes HTML et que vous respectez la syntaxe correcte. Vous devriez également vérifier que vos balises HTML sont correctement fermées et que vous utilisez le bon type d’élément HTML pour le contenu que vous souhaitez publier. </p> </div> </div> </section> <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "FAQPage", "mainEntity": [ { "@type": "Question", "name": "Pourquoi respecter les balises HTML ?", "acceptedAnswer": { "@type": "Answer", "text": "Les balises HTML sont importantes pour bien organiser le contenu du site internet de votre entreprise. Cela le rend plus agréable pour les utilisateurs et plus accessible aux robots d’explorations des moteurs de recherches. En respectant les balises HTML, vous optimisez donc le référencement de votre site internet pour le rendre plus visible sur les moteurs de recherche." } } , { "@type": "Question", "name": "Quels sont les autres éléments HTML que je peux publier ?", "acceptedAnswer": { "@type": "Answer", "text": "En plus des éléments HTML mentionnés dans l’article, il existe d’autres éléments HTML tels que les blocs de citation, les commentaires, les marqueurs de code, les sauts de ligne, les légendes, les entrées cachées, les balises meta, les blocs de code HTML et bien d’autres." } } , { "@type": "Question", "name": "Comment utiliser correctement les balises HTML ?", "acceptedAnswer": { "@type": "Answer", "text": "Pour utiliser correctement les balises HTML, vous devez vous assurer que vous respectez les normes HTML et que vous respectez la syntaxe correcte. Vous devriez également vérifier que vos balises HTML sont correctement fermées et que vous utilisez le bon type d’élément HTML pour le contenu que vous souhaitez publier." } } ] } </script> <h2 id="h.xzi6mnsjt1rc"><span id="Conclusion-sur-les-elements-HTML-necessaires-pour-enrichir">Conclusion sur les éléments HTML nécessaires pour enrichir</span></h2> <p>En Marketing Digital, il est important de rendre votre contenu plus efficace et plus facile à lire.</p> <p>C’est pourquoi les balises HTML sont essentielles pour structurer et organiser le contenu de votre site web.</p> <p><strong>Un dernier conseil</strong> : n’intégrez pas forcément toutes les balises HTML possibles sur vos pages… Le plus important est de respecter son objectif ainsi que l’intention de recherche.</p> <p>Ainsi, vous pourrez améliorer le référencement de votre site et encourager les visiteurs à rester plus longtemps sur votre site.</p> <p>Assurez-vous de respecter correctement les balises HTML et d’améliorer continuellement votre code HTML !</p> <p>Encore un petit effort et vous disposerez de <a href="https://audreytips.com/creer-theme-wordpress/">votre propre thème WordPress</a>.</p> <p><em>Avez-vous déjà manipulé du code HTML ? Si oui, à quelle occasion ?</em></p> <div class="cb"></div> </div> </div> <!--.single-content-holder--> <div class="share-block"> <span class="share-this-text"> <span> Partager </span> </span> <ul class="share-buttons"> <li class="facebook_icon"><a href="https://www.facebook.com/sharer/sharer.php?u=https://audreytips.com/elements-html-exemples/&t=Éléments HTML : 10 idées pour enrichir vos pages web" target="_blank" title="Partager sur Facebook"><i class="fa fa-facebook"></i></a></li> <li class="twitter_icon"><a href="https://twitter.com/intent/tweet?source=https://audreytips.com/elements-html-exemples/&text=Éléments HTML : 10 idées pour enrichir vos pages web:%20https://audreytips.com/elements-html-exemples/" target="_blank" title="Partager sur Twitter"><i class="fa fa-twitter"></i></a></li> <li class="linkedin_icon"><a href="http://www.linkedin.com/shareArticle?mini=true&url=https://audreytips.com/elements-html-exemples/&title=Éléments HTML : 10 idées pour enrichir vos pages web&summary=&source=https://audreytips.com/elements-html-exemples/" target="_blank" title="Partager sur LinkedIn"><i class="fa fa-linkedin"></i></a></li> <li class="email_icon"><a href="mailto:?subject=Éléments HTML : 10 idées pour enrichir vos pages web&body=https://audreytips.com/elements-html-exemples/" target="_blank" title="Envoyer par Email"><i class="fa fa-envelope"></i></a></li> </ul> <div class="cb"></div> </div> <!-- .share-block--> <div class="author-area"> <span class="byline"><span class="author vcard"><img alt='' src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20100%20100'%3E%3C/svg%3E" data-lazy-srcset='https://secure.gravatar.com/avatar/e68d387bc4c05e2ab8e0d423fd7bf6e2903dbbf7a829def1125671a72aba00d4?s=200&d=blank&r=g 2x' class='avatar avatar-100 photo' height='100' width='100' decoding='async' data-lazy-src="https://secure.gravatar.com/avatar/e68d387bc4c05e2ab8e0d423fd7bf6e2903dbbf7a829def1125671a72aba00d4?s=100&d=blank&r=g"/><noscript><img alt='' src='https://secure.gravatar.com/avatar/e68d387bc4c05e2ab8e0d423fd7bf6e2903dbbf7a829def1125671a72aba00d4?s=100&d=blank&r=g' srcset='https://secure.gravatar.com/avatar/e68d387bc4c05e2ab8e0d423fd7bf6e2903dbbf7a829def1125671a72aba00d4?s=200&d=blank&r=g 2x' class='avatar avatar-100 photo' height='100' width='100' decoding='async'/></noscript> <a class="url fn n" href="https://audreytips.com/expert/audrey/">Audrey Tips</a></span></span> <div class="author-bio"> Je suis votre coach virtuel. Je vous accompagne dans le monde du Marketing Digital, avec l'aide de Laurent et son équipe. Je relaie également les articles de nos experts invités qui partagent leurs connaissances avec vous. </div> <div class="author-links"> <ul class="nav navbar-nav"> <li> <a href="https://audreytips.com/expert/audrey/" rel="nofollow">Voir tous mes articles</a> </li> <li> <a href="https://audreytips.com/passionnee-de-webmarketing-voici-histoire/">Qui suis-je ?</a> </li> </ul> </div> <div class="cb"></div> </div> <div class="single-tags"> <span> </span><a href="https://audreytips.com/tag/gagner-du-temps-sur-les-aspects-techniques/" rel="tag">Gagner du temps sur les aspects techniques</a> </div> <nav class="navigation post-navigation" aria-label="Publications"> <h2 class="screen-reader-text">Navigation de l’article</h2> <div class="nav-links"><div class="nav-previous"><a href="https://audreytips.com/exemples-utilisation-ugc/" rel="prev"><span class="meta-nav" aria-hidden="true">Précédent</span> <span class="screen-reader-text">Article précédent :</span> <span class="post-title">4 façons de réutiliser le contenu généré par vos clients</span></a></div><div class="nav-next"><a href="https://audreytips.com/trouver-community-manager/" rel="next"><span class="meta-nav" aria-hidden="true">Suivant</span> <span class="screen-reader-text">Article suivant :</span> <span class="post-title">Comment trouver le Community Manager idéal pour votre projet ?</span></a></div></div> </nav> <div class="cb"></div> <div class="related-wrapper"> <div class="related-heading"> articles similaires </div> <div class="related-post-wrapper"> <div class="related_post"> <div class="related_thumb"> <a href="https://audreytips.com/choisir-crm-ia-pme/"><img width="177" height="130" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20177%20130'%3E%3C/svg%3E" class="attachment-skin_related_thumb size-skin_related_thumb wp-post-image" alt="CRM IA PME : choisir entre HubSpot, Salesforce, Zoho et Pipedrive selon vos priorités business" decoding="async" data-lazy-src="https://audreytips.com/wp-content/uploads/2026/04/choisir-crm-ia-pme-177x130.jpg" /><noscript><img width="177" height="130" src="https://audreytips.com/wp-content/uploads/2026/04/choisir-crm-ia-pme-177x130.jpg" class="attachment-skin_related_thumb size-skin_related_thumb wp-post-image" alt="CRM IA PME : choisir entre HubSpot, Salesforce, Zoho et Pipedrive selon vos priorités business" decoding="async" /></noscript> </a> </div> <div class="related-title"> <a href="https://audreytips.com/choisir-crm-ia-pme/" rel="bookmark">Quels outils CRM IA choisir pour une PME : HubSpot, Salesforce, Zoho ou Pipedrive ?</a> </div> </div> <div class="related_post"> <div class="related_thumb"> <a href="https://audreytips.com/pourquoi-choisir-breeze-ia-hubspot-crm/"><img width="177" height="130" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20177%20130'%3E%3C/svg%3E" class="attachment-skin_related_thumb size-skin_related_thumb wp-post-image" alt="Breeze AI HubSpot CRM automatisation marketing et vente avec assistant et agents IA intégrés" decoding="async" data-lazy-src="https://audreytips.com/wp-content/uploads/2026/04/pourquoi-choisir-breeze-ia-hubspot-crm-177x130.jpg" /><noscript><img width="177" height="130" src="https://audreytips.com/wp-content/uploads/2026/04/pourquoi-choisir-breeze-ia-hubspot-crm-177x130.jpg" class="attachment-skin_related_thumb size-skin_related_thumb wp-post-image" alt="Breeze AI HubSpot CRM automatisation marketing et vente avec assistant et agents IA intégrés" decoding="async" /></noscript> </a> </div> <div class="related-title"> <a href="https://audreytips.com/pourquoi-choisir-breeze-ia-hubspot-crm/" rel="bookmark">Pourquoi choisir Breeze AI pour automatiser votre HubSpot CRM ?</a> </div> </div> <div class="related_post"> <div class="related_thumb"> <a href="https://audreytips.com/upsell-hubspot-ia/"><img width="177" height="130" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20177%20130'%3E%3C/svg%3E" class="attachment-skin_related_thumb size-skin_related_thumb wp-post-image" alt="Illustration d’une analyse de croissance pour détecter des opportunités d’upsell avec l’IA dans HubSpot CRM." decoding="async" data-lazy-src="https://audreytips.com/wp-content/uploads/2026/04/upsell-hubspot-ia-177x130.jpg" /><noscript><img width="177" height="130" src="https://audreytips.com/wp-content/uploads/2026/04/upsell-hubspot-ia-177x130.jpg" class="attachment-skin_related_thumb size-skin_related_thumb wp-post-image" alt="Illustration d’une analyse de croissance pour détecter des opportunités d’upsell avec l’IA dans HubSpot CRM." decoding="async" /></noscript> </a> </div> <div class="related-title"> <a href="https://audreytips.com/upsell-hubspot-ia/" rel="bookmark">Comment détecter les opportunités d’upsell avec l’IA dans HubSpot CRM ?</a> </div> </div> <div class="related_post"> <div class="related_thumb"> <a href="https://audreytips.com/crm-revenu-client-retention/"><img width="177" height="130" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20177%20130'%3E%3C/svg%3E" class="attachment-skin_related_thumb size-skin_related_thumb wp-post-image" alt="Illustration de deux personnes construisant une croissance client, pour piloter le revenu par client avec HubSpot CRM sans fragiliser la rétention." decoding="async" data-lazy-src="https://audreytips.com/wp-content/uploads/2026/04/crm-revenu-client-retention-177x130.jpg" /><noscript><img width="177" height="130" src="https://audreytips.com/wp-content/uploads/2026/04/crm-revenu-client-retention-177x130.jpg" class="attachment-skin_related_thumb size-skin_related_thumb wp-post-image" alt="Illustration de deux personnes construisant une croissance client, pour piloter le revenu par client avec HubSpot CRM sans fragiliser la rétention." decoding="async" /></noscript> </a> </div> <div class="related-title"> <a href="https://audreytips.com/crm-revenu-client-retention/" rel="bookmark">Comment utiliser un CRM pour faire progresser le revenu par client sans dégrader la rétention ?</a> </div> </div> <div class="cb"></div> </div> </div> <div id="comments" class="comments-area"> <div id="respond" class="comment-respond"> <h3 id="reply-title" class="comment-reply-title">Laisser un commentaire <small><a rel="nofollow" id="cancel-comment-reply-link" href="/elements-html-exemples/#respond" style="display:none;">Annuler la réponse</a></small></h3><form action="https://audreytips.com/wp-comments-post.php" method="post" id="commentform" class="comment-form"><input type="hidden" autocomplete="off" autocorrect="off" name="x-rw-E-qmY-OR-qyh-C" value="" /><p class="comment-notes"><span id="email-notes">Votre adresse e-mail ne sera pas publiée.</span> <span class="required-field-message">Les champs obligatoires sont indiqués avec <span class="required">*</span></span></p><p class="comment-form-comment"><label for="comment">Commentaire <span class="required">*</span></label> <textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required></textarea></p><p class="comment-form-author"><label for="author">Nom <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" autocomplete="name" required /></p> <p class="comment-form-email"><label for="email">E-mail <span class="required">*</span></label> <input id="email" name="email" type="email" value="" size="30" maxlength="100" aria-describedby="email-notes" autocomplete="email" required /></p> <p class="comment-form-url"><label for="url">Site web</label> <input id="url" name="url" type="url" value="" size="30" maxlength="200" autocomplete="url" /></p> <!-- Mailchimp for WordPress v4.12.2 - https://www.mc4wp.com/ --><input type="hidden" name="_mc4wp_subscribe_wp-comment-form" value="0" /><p class="mc4wp-checkbox mc4wp-checkbox-wp-comment-form "><label><input type="checkbox" name="_mc4wp_subscribe_wp-comment-form" value="1" ><span>Inscrivez-moi à la newsletter</span></label></p><!-- / Mailchimp for WordPress --><p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Laisser un commentaire" /> <input type='hidden' name='comment_post_ID' value='41509' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /> </p><p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="42fe871402" /></p><p style="display: none !important;" class="akismet-fields-container" data-prefix="ak_"><label>Δ<textarea name="ak_hp_textarea" cols="45" rows="8" maxlength="100"></textarea></label><input type="hidden" id="ak_js_1" name="ak_js" value="70"/><script type="text/rocketlazyloadscript" data-rocket-type="text/javascript"> /* <![CDATA[ */ document.getElementById( "ak_js_1" ).setAttribute( "value", ( new Date() ).getTime() ); /* ]]> */ </script> </p></form> </div><!-- #respond --> </div> </div><!-- .content-wrapper --> <div class="sidebar-wrapper col-md-4"> <aside id="secondary" class="sidebar widget-area" role="complementary"> <section id="custom_html-11" class="widget_text widget widget_custom_html"><div class="textwidget custom-html-widget"><div style="border:1px solid #EEEEEE; padding-bottom: 15px; background-color:#8E24AA; text-align:center; color:#ffffff;"> <p style="clear: both; line-height:150%; font-size: 27px; margin: 0 0 10px 0; padding:15px; text-transform: none;">🔎 Nouveau !<br><b>Audit SEO Gratuit</b></p> <p class="entry" style="padding: 0px 25px; margin-top: 8px;">Vous cherchez à attirer plus de visiteurs sur votre site Internet ? La réponse pourrait bien se trouver dans ce rapport GRATUIT ! </p> <p style="text-align: center; margin-top: 24px;"> <a class="button1" href="https://audreytips.com/audit-seo/">JE TESTE MON SITE</a> </p> </div></div></section><section id="custom_html-10" class="widget_text widget widget_custom_html"><div class="textwidget custom-html-widget"><div style="border:1px solid #EEEEEE; padding-bottom: 15px;"> <div style="background-color:#EF4A58"> <p style="text-align:center; clear: both; font-size: 27px; margin: 0 0 10px 0; color:#ffffff; padding:35px 15px; text-transform: none; line-height: 29px;">Vous voulez<br><b>plus de trafic Web ? </b></p> </div> <div class="entry" style="padding: 0px 25px; margin-top: 8px;">Vous avez besoin de conseils personnalisés pour développer votre entreprise avec Internet ? </div> <p style="text-align: center; margin-top: 24px;"> <a class="button1" href="https://audreytips.com/contactez-moi/">CONTACTEZ-NOUS !</a> </p> </div></div></section><section id="mc4wp_form_widget-3" class="widget widget_mc4wp_form_widget"><script type="text/rocketlazyloadscript">(function() { window.mc4wp = window.mc4wp || { listeners: [], forms: { on: function(evt, cb) { window.mc4wp.listeners.push( { event : evt, callback: cb } ); } } } })(); </script><!-- Mailchimp for WordPress v4.12.2 - https://wordpress.org/plugins/mailchimp-for-wp/ --><form id="mc4wp-form-1" class="mc4wp-form mc4wp-form-39 mc4wp-form-basic" method="post" data-id="39" data-name="Inscription newsletter" ><input type="hidden" autocomplete="off" autocorrect="off" name="x-rw-E-qmY-OR-qyh-C" value="" /><div class="mc4wp-form-fields"> <div style= "border:1px solid #E2DFDC; background-color:#8e24aa; padding: 10px 25px 0px 25px; text-align:center;"> <p style="color:#FFFFFF; font-size: 26px;">Entrepreneurs,<br /> <b>attirez plus de visiteurs</b><br /> sur votre site Web</p> <p style="color:#FFFFFF; font-size: 17px;">Chaque vendredi, 1 email, 3 articles. Gratuit pour toujours.</p> <p><input type="text" name="FNAME" placeholder="Prénom" required="" style= "display:block; margin:auto;" /></p> <p><input type="email" name="EMAIL" placeholder="Adresse email" style= "display:block; margin:auto;" required="" /></p> <p style="color:#FFFFFF; font-size: 14px;">Respect de la vie privée : nous ne vous spammerons jamais !</p> <p style="text-align:center"><input style= "border:0px; background-color:#E53B2C; padding:15px 20px 15px 20px; color:#FFFFFF; font-weight:bold;" type= "submit" value=" JE M'ABONNE " /></p> </div><script type="text/rocketlazyloadscript" data-rocket-type="text/javascript"> //<![CDATA[ mc4wp.forms.on('subscribed', function(form) { window.dataLayer = window.dataLayer || []; window.dataLayer.push({ 'event' : 'Sign-up', 'name' : form.name + ' ID: ' + form.id }); }); //]]> </script> </div><label style="display: none !important;">Laissez ce champ vide si vous êtes humain : <input type="text" name="_mc4wp_honeypot" value="" tabindex="-1" autocomplete="off" /></label><input type="hidden" name="_mc4wp_timestamp" value="1777711259" /><input type="hidden" name="_mc4wp_form_id" value="39" /><input type="hidden" name="_mc4wp_form_element_id" value="mc4wp-form-1" /><div class="mc4wp-response"></div></form><!-- / Mailchimp for WordPress Plugin --></section><section id="custom_html-6" class="widget_text widget widget_custom_html"><div class="textwidget custom-html-widget"><div style="border:1px solid #EEEEEE; padding-bottom: 15px;"> <div> <img width="354" height="200" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20354%20200'%3E%3C/svg%3E" class="attachment-content_one_thumb size-content_one_thumb wp-post-image" alt="Qui est Audrey ?" data-lazy-srcset="https://audreytips.com/wp-content/uploads/2017/04/audrey1-e1492157273181.jpg 354w, https://audreytips.com/wp-content/uploads/2017/04/audrey1-e1492157273181-300x170.jpg 300w, https://audreytips.com/wp-content/uploads/2017/04/audrey1-e1492157273181.jpg 768w, https://audreytips.com/wp-content/uploads/2017/04/audrey1-e1492157273181.jpg 1000w" data-lazy-sizes="(max-width: 354px) 100vw, 354px" data-lazy-src="https://audreytips.com/wp-content/uploads/2017/04/audrey1-e1492157273181.jpg" /><noscript><img width="354" height="200" src="https://audreytips.com/wp-content/uploads/2017/04/audrey1-e1492157273181.jpg" class="attachment-content_one_thumb size-content_one_thumb wp-post-image" alt="Qui est Audrey ?" srcset="https://audreytips.com/wp-content/uploads/2017/04/audrey1-e1492157273181.jpg 354w, https://audreytips.com/wp-content/uploads/2017/04/audrey1-e1492157273181-300x170.jpg 300w, https://audreytips.com/wp-content/uploads/2017/04/audrey1-e1492157273181.jpg 768w, https://audreytips.com/wp-content/uploads/2017/04/audrey1-e1492157273181.jpg 1000w" sizes="(max-width: 354px) 100vw, 354px" /></noscript> </div> <div style="padding: 15px 25px"> <p style="color: #333; font-weight: 600;">QUI EST AUDREY ?</p> <div>Je suis votre coach virtuel, imaginé par <a href="https://audreytips.com/qui-a-imagine-audrey/">Laurent</a>, un entrepreneur du Web. Notre objectif est d'aider concrètement et en toute transparence, les chefs d’entreprise qui veulent gagner de nouveaux clients grâce au Marketing Digital. </div> </div> <p style="text-align: center; margin-top: 24px;"> <a class="button1" href="https://audreytips.com/qui-a-imagine-audrey/">En savoir plus</a> </p> </div></div></section><section id="search-2" class="widget widget_search"><form role="search" method="get" class="search-form" action="https://audreytips.com/"> <label> <span class="screen-reader-text">Search for:</span> <input type="search" class="search-field" placeholder="Rechercher" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Rechercher'"value="" name="s" title="Search for:"/> </label> <button type="submit" class="search-submit"><i class="fa fa-search fa-2x"></i></button> </form></section><section id="custom_html-9" class="widget_text widget widget_custom_html"><div class="textwidget custom-html-widget"><style> table { border-spacing: 0; width: 100%; border: 1px solid #EEEEEE; } th, td { text-align: left; padding: 8px; vertical-align: middle; border-bottom: 1px solid #EEEEEE; border-top: 0px solid #EEEEEE; border-right: 0px solid #EEEEEE; border-left: 0px solid #EEEEEE; } </style> <div style="overflow-x:auto;"> <table> <tr> <td colspan="2" bgcolor="#F9F9F9"><p style="color: #333; font-weight: 600; margin-bottom: 0px;">NOS HUBS MARKETING</p></td> </tr> <tr> <td><a href="https://audreytips.com/marketing-digital-entrepreneur/"><img width="65" height="65" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2065%2065'%3E%3C/svg%3E" title="Marketing Digital : le guide complet de l’entrepreneur" alt="Marketing Digital : le guide complet de l'entrepreneur" data-lazy-src="https://audreytips.com/wp-content/uploads/2018/06/marketing-digital-le-guide-complet-de-l-entrepreneur-1-65x65.jpg"/><noscript><img width="65" height="65" src="https://audreytips.com/wp-content/uploads/2018/06/marketing-digital-le-guide-complet-de-l-entrepreneur-1-65x65.jpg" title="Marketing Digital : le guide complet de l’entrepreneur" alt="Marketing Digital : le guide complet de l'entrepreneur"/></noscript></a></td> <td><a href="https://audreytips.com/marketing-digital-entrepreneur/">Marketing Digital</a> : le guide complet de l’entrepreneur</td> </tr> <tr> <td><a href="https://audreytips.com/faire-connaitre-entreprise-internet/"><img width="65" height="65" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2065%2065'%3E%3C/svg%3E" title="Comment faire connaître votre entreprise sur Internet ?" alt="Comment faire connaître votre entreprise sur Internet ?" data-lazy-src="https://audreytips.com/wp-content/uploads/2018/05/comment-faire-connaitre-votre-entreprise-sur-internet-65x65.jpg" /><noscript><img width="65" height="65" src="https://audreytips.com/wp-content/uploads/2018/05/comment-faire-connaitre-votre-entreprise-sur-internet-65x65.jpg" title="Comment faire connaître votre entreprise sur Internet ?" alt="Comment faire connaître votre entreprise sur Internet ?" /></noscript></a></td> <td><a href="https://audreytips.com/faire-connaitre-entreprise-internet/">Donner de la visibilité</a> à votre entreprise sur Internet</td> </tr> <tr> <td><a href="https://audreytips.com/hub/strategie-seo-pour-le-marketing-b2b/"><img width="65" height="65" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2065%2065'%3E%3C/svg%3E" title="19 ressources pour maîtriser le SEO" alt="Le Référencement Naturel (SEO) : c'est quoi ? Quelles sont les bonnes pratiques ?" data-lazy-src="https://audreytips.com/wp-content/uploads/2022/11/guide-seo-65x65-1.jpg" /><noscript><img width="65" height="65" src="https://audreytips.com/wp-content/uploads/2022/11/guide-seo-65x65-1.jpg" title="19 ressources pour maîtriser le SEO" alt="Le Référencement Naturel (SEO) : c'est quoi ? Quelles sont les bonnes pratiques ?" /></noscript></a></td> <td><strong>19 ressources</strong> pour <a href="https://audreytips.com/hub/strategie-seo-pour-le-marketing-b2b/">maîtriser le Référencement Naturel</a> (SEO)</td> </tr> <tr> <td><a href="https://audreytips.com/hub/strategie-contenu-marketing-b2b/"><img width="65" height="65" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2065%2065'%3E%3C/svg%3E" title="23 ressources pour maitriser le Marketing de Contenu" alt="Marketing de Contenu : C'est quoi ? Quelles sont les bonnes pratiques ?" data-lazy-src="https://audreytips.com/wp-content/uploads/2022/12/guide-content-marketing-65x65-1.jpg" /><noscript><img width="65" height="65" src="https://audreytips.com/wp-content/uploads/2022/12/guide-content-marketing-65x65-1.jpg" title="23 ressources pour maitriser le Marketing de Contenu" alt="Marketing de Contenu : C'est quoi ? Quelles sont les bonnes pratiques ?" /></noscript></a></td> <td><strong>24 ressources</strong> pour <a href="https://audreytips.com/hub/strategie-contenu-marketing-b2b/">maîtriser le Marketing de Contenu</a></td> </tr> <tr> <td><a href="https://audreytips.com/marketing-reseaux-sociaux/"><img width="65" height="65" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2065%2065'%3E%3C/svg%3E" title="Comprendre le Marketing des réseaux sociaux [Guide]" alt="Comprendre le Marketing des réseaux sociaux [Guide]" data-lazy-src="https://audreytips.com/wp-content/uploads/2018/07/comprendre-le-marketing-des-reseaux-sociaux-guide-8-65x65.jpg" /><noscript><img width="65" height="65" src="https://audreytips.com/wp-content/uploads/2018/07/comprendre-le-marketing-des-reseaux-sociaux-guide-8-65x65.jpg" title="Comprendre le Marketing des réseaux sociaux [Guide]" alt="Comprendre le Marketing des réseaux sociaux [Guide]" /></noscript></a></td> <td>Comprendre le <a href="https://audreytips.com/marketing-reseaux-sociaux/">Marketing des réseaux sociaux</a></td> </tr> <tr> <td><a href="https://audreytips.com/hub/linkedin-marketing-b2b/"><img width="65" height="65" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2065%2065'%3E%3C/svg%3E" title="HUB Marketing B2B LinkedIn : Transformez votre présence en business" alt="HUB Marketing B2B LinkedIn : Transformez votre présence en business" data-lazy-src="https://audreytips.com/wp-content/uploads/2018/06/social-selling-sur-linkedin-comment-faire-du-business-3-65x65.jpg" /><noscript><img width="65" height="65" src="https://audreytips.com/wp-content/uploads/2018/06/social-selling-sur-linkedin-comment-faire-du-business-3-65x65.jpg" title="HUB Marketing B2B LinkedIn : Transformez votre présence en business" alt="HUB Marketing B2B LinkedIn : Transformez votre présence en business" /></noscript></a></td> <td><strong>17 ressources</strong> pour <a href="https://audreytips.com/hub/linkedin-marketing-b2b/">maîtriser LinkedIn</a></td> </tr> <tr> <td><a href="https://audreytips.com/hub/strategie-email-marketing-b2b/"><img width="65" height="65" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2065%2065'%3E%3C/svg%3E" title="Hub Marketing sur l’email marketing en B2B" alt="Optimisez vos campagnes d’emails : créez, connectez, convertissez [HUB]" data-lazy-src="https://audreytips.com/wp-content/uploads/2022/12/guide-emailing-65x65-1.jpg" /><noscript><img width="65" height="65" src="https://audreytips.com/wp-content/uploads/2022/12/guide-emailing-65x65-1.jpg" title="Hub Marketing sur l’email marketing en B2B" alt="Optimisez vos campagnes d’emails : créez, connectez, convertissez [HUB]" /></noscript></a></td> <td><strong>26 ressources</strong> pour <a href="https://audreytips.com/hub/strategie-email-marketing-b2b/">maîtriser l'Email Marketing</a></td> </tr> <tr> <td><a href="https://audreytips.com/hub/strategie-google-ads-pour-le-marketing-b2b/"><img width="65" height="65" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2065%2065'%3E%3C/svg%3E" title="Google Ads : Tout savoir sur les Publicités sur Google" alt="Google Ads : Cest quoi ? Quelles sont les bonnes pratiques ?" data-lazy-src="https://audreytips.com/wp-content/uploads/2022/11/google-ads-guide-65x65-1.jpg" /><noscript><img width="65" height="65" src="https://audreytips.com/wp-content/uploads/2022/11/google-ads-guide-65x65-1.jpg" title="Google Ads : Tout savoir sur les Publicités sur Google" alt="Google Ads : Cest quoi ? Quelles sont les bonnes pratiques ?" /></noscript></a></td> <td><strong>13 ressources</strong> pour <a href="https://audreytips.com/hub/strategie-google-ads-pour-le-marketing-b2b/"> maîtriser Google Ads</a></td> </tr> <tr> <td><a href="https://audreytips.com/pourquoi-generer-trafic-site-internet/"><img width="65" height="65" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2065%2065'%3E%3C/svg%3E" title="Pourquoi générer du Trafic sur votre site Internet ?" alt="Pourquoi générer du Trafic sur votre site Internet ?" data-lazy-src="https://audreytips.com/wp-content/uploads/2018/04/pourquoi-generer-du-trafic-sur-votre-site-internet-65x65.jpg" /><noscript><img width="65" height="65" src="https://audreytips.com/wp-content/uploads/2018/04/pourquoi-generer-du-trafic-sur-votre-site-internet-65x65.jpg" title="Pourquoi générer du Trafic sur votre site Internet ?" alt="Pourquoi générer du Trafic sur votre site Internet ?" /></noscript></a></td> <td>Savoir <a href="https://audreytips.com/pourquoi-generer-trafic-site-internet/">générer du Trafic</a> sur votre site Internet ?</td> </tr> </table> </div> </div></section><section id="custom_html-7" class="widget_text widget widget_custom_html"><div class="textwidget custom-html-widget"><div style="border:1px solid #EEEEEE; padding-bottom: 15px;"> <div style="background-color:#EF4A58"> <p style="text-align:center; clear: both; font-size: 27px; margin: 0 0 10px 0; color:#ffffff; padding:35px 10px; text-transform: none; line-height: 30px;">Repensons ensemble<br><b>votre stratégie digitale</b><br></p> </div> <div class="entry" style="padding: 0px 25px; margin-top: 8px;">Vous voulez appliquer les méthodes de Marketing Digital décrites dans nos articles ? Alors parlons-en. </div> <p style="text-align: center; margin-top: 24px;"> <a class="button1" href="https://zcal.co/audreytips/decouverte">JE RÉSERVE MA SÉANCE DÉCOUVERTE</a> </p> </div></div></section> </aside><!-- .sidebar .widget-area --> </div><!-- .sidebar-wrapper --> </div><!-- .row --> </div><!-- .container --> </div><!-- .main-wrapper --> </main> <!-- </div> id="canvas" </div> id="container" --> <footer data-wpr-lazyrender="1"> <div class="main-footer"> <div class="container"> <div class="row"> <div class="col-md-4 col-sm-4"> <aside id="secondary" class="sidebar widget-area" role="complementary"> <section id="custom_html-3" class="widget_text widget widget_custom_html"><div class="textwidget custom-html-widget"><h4>Nous vous aidons à :</h4> <ul> <li class="cat-item cat-item-15"> <a href="https://audreytips.com/faire-connaitre-entreprise-internet/">Donner de la visibilité à votre entreprise</a> </li> <li class="cat-item cat-item-12"> <a href="https://audreytips.com/pme-conquerir-nouveaux-clients-marketing-digital/">Conquérir de nouveaux clients</a> </li> <li class="cat-item cat-item-76"> <a href="https://audreytips.com/pme-se-demarquer-concurrence-marketing-digital/">Vous démarquer de la concurrence</a></li> <li class="cat-item cat-item-11"> <a href="https://audreytips.com/pme-gagner-temps-aspects-techniques-marketing-digital/">Gagner du temps sur les aspects techniques</a> </li> </ul></div></section> </aside><!-- .sidebar .widget-area --> </div><!-- .sidebar-wrapper --> <div class="col-md-4 col-sm-4"> <aside id="secondary" class="sidebar widget-area" role="complementary"> <section id="custom_html-4" class="widget_text widget widget_custom_html"><div class="textwidget custom-html-widget"><h4>A propos</h4> <ul> <li class="cat-item cat-item-12"> <a href="https://audreytips.com/qui-a-imagine-audrey/">Qui se cache derrière Audrey ?</a> </li> <li class="cat-item cat-item-76"> <a href="https://audreytips.com/passionnee-de-webmarketing-voici-histoire/">Qui est Audrey ?</a></li> <li class="cat-item cat-item-11"> <a href="https://audreytips.com/mes-sources-dinspiration/">Comment sont élaborés nos articles ?</a> </li> <li class="cat-item cat-item-11"> <a href="https://audreytips.com/glossaire-web/">Le Glossaire du Marketing Digital</a> </li> <li class="cat-item cat-item-11"> <a href="https://audreytips.com/mentions-legales/">Mentions légales</a> </li> </ul></div></section> </aside><!-- .sidebar .widget-area --> </div><!-- .sidebar-wrapper --> <div class="col-md-4 col-sm-4"> <aside id="secondary" class="sidebar widget-area" role="complementary"> <section id="custom_html-5" class="widget_text widget widget_custom_html"><div class="textwidget custom-html-widget"><h4>Restons en contact</h4> <ul> <li class="cat-item cat-item-12"> <a href="https://audreytips.com/newsletter/">Recevoir la newsletter</a> </li> <li class="cat-item cat-item-76"> <a href="https://audreytips.com/contactez-moi/">Nous contacter</a></li> <li class="cat-item cat-item-11"> <a href="https://audreytips.com/proposer-article-invite/">Proposer un article</a> </li> </ul> <div class="social-icons icon_type_light"> <ul> <li><a href="https://www.twitter.com/audreytipsfr"><i class="fa fa-twitter fa-2x"></i></a></li> <li><a href="https://www.facebook.com/audreytips"><i class="fa fa-facebook fa-2x"></i></a></li> <li><a href="https://www.linkedin.com/company/audreytips/"><i class="fa fa-linkedin fa-2x"></i></a></li> </ul> </div></div></section> </aside><!-- .sidebar .widget-area --> </div><!-- .sidebar-wrapper --> </div> </div> </div> <div class="sub-footer"> <div class="container"> <div class="row"> <div class="col-md-12 text-center"> <p>© 2026 #audreytips</p> </div> </div> </div> </div> </footer> <script type="speculationrules"> {"prefetch":[{"source":"document","where":{"and":[{"href_matches":"/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/wp-content/uploads/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/AudreyTips/*","/wp-content/themes/skin/*","/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} </script> <script type="text/rocketlazyloadscript">window.wpsc_print_css_uri = 'https://audreytips.com/wp-content/plugins/structured-content/dist/print.css';</script><script type="text/rocketlazyloadscript">(function() {function maybePrefixUrlField () { const value = this.value.trim() if (value !== '' && value.indexOf('http') !== 0) { this.value = 'http://' + value } } const urlFields = document.querySelectorAll('.mc4wp-form input[type="url"]') for (let j = 0; j < urlFields.length; j++) { urlFields[j].addEventListener('blur', maybePrefixUrlField) } })();</script><script type="text/rocketlazyloadscript" id='kirki-viewport-lists'>var kirkiViewports = {"md":{"value":1200,"scale":1,"minWidth":1200,"maxWidth":1200,"title":"Desktop","icon":"desktop","activeIcon":"desktop-hover","id":"md","type":"max"},"tablet":{"value":991,"scale":1,"minWidth":991,"maxWidth":991,"title":"Tablet","icon":"tablet-default","activeIcon":"tablet-hover","type":"max","id":"tablet"},"mobileLandscape":{"value":767,"scale":1,"minWidth":767,"maxWidth":767,"title":"Landscape","icon":"phone-hr-default","activeIcon":"phone-hr-hover","type":"max","id":"mobileLandscape"},"mobile":{"value":575,"scale":1,"minWidth":575,"maxWidth":575,"title":"Mobile","icon":"phone-vr-default","activeIcon":"phone-vr-hover","type":"max","id":"mobile"}};</script><script type="text/rocketlazyloadscript" id='kirki-variable-lists'>var kirkiCSSVariable = {"data":[{"title":"Colors","key":"color","modes":[{"title":"Default","key":"default"}],"variables":[]},{"title":"Numbers","key":"size","modes":[{"title":"Default","key":"default"}],"variables":[]},{"title":"Font Family","key":"font-family","modes":[{"title":"Default","key":"default"}],"variables":[]},{"title":"Text Styles","key":"text-style","modes":[{"title":"Default","key":"default"}],"variables":[]}]};</script><script type="text/rocketlazyloadscript" id="kirki-api-and-nonce"> window.wp_kirki = { ajaxUrl: "https://audreytips.com/wp-admin/admin-ajax.php", restUrl: "https://audreytips.com/wp-json/", siteUrl: "https://audreytips.com", apiVersion: "v1", postId: "41509", nonce: "ee6b6063dd", call_from: "", templateId: "", context: {"id":41509,"type":"post"} }; </script><a href="#" class="back-to-top"> top </a> <script type="text/rocketlazyloadscript"> 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> <!-- Extrait Google Tag Manager (noscript) ajouté par Site Kit --> <noscript> <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-WD4VRCD" height="0" width="0" style="display:none;visibility:hidden"></iframe> </noscript> <!-- End Google Tag Manager (noscript) snippet added by Site Kit --> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript">!function(t,e){"use strict";function n(){if(!a){a=!0;for(var t=0;t<d.length;t++)d[t].fn.call(window,d[t].ctx);d=[]}}function o(){"complete"===document.readyState&&n()}t=t||"docReady",e=e||window;var d=[],a=!1,c=!1;e[t]=function(t,e){return a?void setTimeout(function(){t(e)},1):(d.push({fn:t,ctx:e}),void("complete"===document.readyState||!document.attachEvent&&"interactive"===document.readyState?setTimeout(n,1):c||(document.addEventListener?(document.addEventListener("DOMContentLoaded",n,!1),window.addEventListener("load",n,!1)):(document.attachEvent("onreadystatechange",o),window.attachEvent("onload",n)),c=!0)))}}("wpBruiserDocReady",window); (function(){var wpbrLoader = (function(){var g=document,b=g.createElement('script'),c=g.scripts[0];b.async=1;b.src='https://audreytips.com/?gdbc-client=3.1.43-'+(new Date()).getTime();c.parentNode.insertBefore(b,c);});wpBruiserDocReady(wpbrLoader);window.onunload=function(){};window.addEventListener('pageshow',function(event){if(event.persisted){(typeof window.WPBruiserClient==='undefined')?wpbrLoader():window.WPBruiserClient.requestTokens();}},false);})(); </script><script type="text/rocketlazyloadscript" data-minify="1" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/cache/min/1/wp-content/plugins/structured-content/dist/app.build.js?ver=1772435057" id="structured-content-frontend-js" data-rocket-defer defer></script> <script type="text/rocketlazyloadscript" data-minify="1" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/cache/min/1/wp-content/plugins/copy-the-code/assets/frontend/js/lib/ctc.js?ver=1772435057" id="ctc-lib-core-js" data-rocket-defer defer></script> <script type="text/rocketlazyloadscript" data-minify="1" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/cache/min/1/wp-content/plugins/copy-the-code/includes/assets/js/core.js?ver=1772435057" id="ctc-blocks-core-js" data-rocket-defer defer></script> <script type="text/rocketlazyloadscript" data-minify="1" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/cache/min/1/wp-content/plugins/copy-the-code/includes/elementor/widgets/deal/script.js?ver=1772435057" id="ctc-el-deal-js" data-rocket-defer defer></script> <script type="text/rocketlazyloadscript" data-minify="1" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/cache/min/1/wp-content/plugins/copy-the-code/includes/elementor/widgets/coupon/script.js?ver=1772435057" id="ctc-el-coupon-js" data-rocket-defer defer></script> <script type="text/rocketlazyloadscript" data-minify="1" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/cache/min/1/wp-content/plugins/copy-the-code/includes/elementor/widgets/ai-prompt-generator/script.js?ver=1772435057" id="ctc-el-ai-prompt-generator-js" data-rocket-defer defer></script> <script type="text/javascript" id="leadin-script-loader-js-js-extra"> /* <![CDATA[ */ var leadin_wordpress = {"userRole":"visitor","pageType":"post","leadinPluginVersion":"11.3.45"}; //# sourceURL=leadin-script-loader-js-js-extra /* ]]> */ </script> <script type="text/rocketlazyloadscript" data-minify="1" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/cache/min/1/4173084.js?ver=1772435057" id="leadin-script-loader-js-js" data-rocket-defer defer></script> <script type="text/javascript" id="wpil-frontend-script-js-extra"> /* <![CDATA[ */ var wpilFrontend = {"ajaxUrl":"/wp-admin/admin-ajax.php","postId":"41509","postType":"post","openInternalInNewTab":"0","openExternalInNewTab":"0","disableClicks":"0","openLinksWithJS":"0","trackAllElementClicks":"0","clicksI18n":{"imageNoText":"Image in link: No Text","imageText":"Image Title: ","noText":"No Anchor Text Found"}}; //# sourceURL=wpil-frontend-script-js-extra /* ]]> */ </script> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/plugins/link-whisper-premium/js/frontend.min.js?ver=1776324821" id="wpil-frontend-script-js" data-rocket-defer defer></script> <script type="text/javascript" id="toc-front-js-extra"> /* <![CDATA[ */ var tocplus = {"smooth_scroll":"1","visibility_show":"afficher","visibility_hide":"cacher","width":"100%"}; //# sourceURL=toc-front-js-extra /* ]]> */ </script> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/plugins/table-of-contents-plus/front.min.js?ver=2411.1" id="toc-front-js" data-rocket-defer defer></script> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-includes/js/dist/hooks.min.js?ver=dd5603f07f9220ed27f1" id="wp-hooks-js"></script> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-includes/js/dist/i18n.min.js?ver=c26c3dc7bed366793375" id="wp-i18n-js"></script> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript" id="wp-i18n-js-after"> /* <![CDATA[ */ wp.i18n.setLocaleData( { 'text direction\u0004ltr': [ 'ltr' ] } ); //# sourceURL=wp-i18n-js-after /* ]]> */ </script> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/plugins/kirki/assets/js/kirki.min.js?ver=6.0.2" id="kirki-js" data-rocket-defer defer></script> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript" id="rocket-browser-checker-js-after"> /* <![CDATA[ */ "use strict";var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}();function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}var RocketBrowserCompatibilityChecker=function(){function RocketBrowserCompatibilityChecker(options){_classCallCheck(this,RocketBrowserCompatibilityChecker),this.passiveSupported=!1,this._checkPassiveOption(this),this.options=!!this.passiveSupported&&options}return _createClass(RocketBrowserCompatibilityChecker,[{key:"_checkPassiveOption",value:function(self){try{var options={get passive(){return!(self.passiveSupported=!0)}};window.addEventListener("test",null,options),window.removeEventListener("test",null,options)}catch(err){self.passiveSupported=!1}}},{key:"initRequestIdleCallback",value:function(){!1 in window&&(window.requestIdleCallback=function(cb){var start=Date.now();return setTimeout(function(){cb({didTimeout:!1,timeRemaining:function(){return Math.max(0,50-(Date.now()-start))}})},1)}),!1 in window&&(window.cancelIdleCallback=function(id){return clearTimeout(id)})}},{key:"isDataSaverModeOn",value:function(){return"connection"in navigator&&!0===navigator.connection.saveData}},{key:"supportsLinkPrefetch",value:function(){var elem=document.createElement("link");return elem.relList&&elem.relList.supports&&elem.relList.supports("prefetch")&&window.IntersectionObserver&&"isIntersecting"in IntersectionObserverEntry.prototype}},{key:"isSlowConnection",value:function(){return"connection"in navigator&&"effectiveType"in navigator.connection&&("2g"===navigator.connection.effectiveType||"slow-2g"===navigator.connection.effectiveType)}}]),RocketBrowserCompatibilityChecker}(); //# sourceURL=rocket-browser-checker-js-after /* ]]> */ </script> <script type="text/javascript" id="rocket-preload-links-js-extra"> /* <![CDATA[ */ var RocketPreloadLinksConfig = {"excludeUris":"/(?:.+/)?feed(?:/(?:.+/?)?)?$|/(?:.+/)?embed/|/(index.php/)?(.*)wp-json(/.*|$)|/refer/|/go/|/recommend/|/recommends/","usesTrailingSlash":"1","imageExt":"jpg|jpeg|gif|png|tiff|bmp|webp|avif|pdf|doc|docx|xls|xlsx|php","fileExt":"jpg|jpeg|gif|png|tiff|bmp|webp|avif|pdf|doc|docx|xls|xlsx|php|html|htm","siteUrl":"https://audreytips.com","onHoverDelay":"100","rateThrottle":"3"}; //# sourceURL=rocket-preload-links-js-extra /* ]]> */ </script> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript" id="rocket-preload-links-js-after"> /* <![CDATA[ */ (function() { "use strict";var r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e=function(){function i(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(e,t,n){return t&&i(e.prototype,t),n&&i(e,n),e}}();function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var t=function(){function n(e,t){i(this,n),this.browser=e,this.config=t,this.options=this.browser.options,this.prefetched=new Set,this.eventTime=null,this.threshold=1111,this.numOnHover=0}return e(n,[{key:"init",value:function(){!this.browser.supportsLinkPrefetch()||this.browser.isDataSaverModeOn()||this.browser.isSlowConnection()||(this.regex={excludeUris:RegExp(this.config.excludeUris,"i"),images:RegExp(".("+this.config.imageExt+")$","i"),fileExt:RegExp(".("+this.config.fileExt+")$","i")},this._initListeners(this))}},{key:"_initListeners",value:function(e){-1<this.config.onHoverDelay&&document.addEventListener("mouseover",e.listener.bind(e),e.listenerOptions),document.addEventListener("mousedown",e.listener.bind(e),e.listenerOptions),document.addEventListener("touchstart",e.listener.bind(e),e.listenerOptions)}},{key:"listener",value:function(e){var t=e.target.closest("a"),n=this._prepareUrl(t);if(null!==n)switch(e.type){case"mousedown":case"touchstart":this._addPrefetchLink(n);break;case"mouseover":this._earlyPrefetch(t,n,"mouseout")}}},{key:"_earlyPrefetch",value:function(t,e,n){var i=this,r=setTimeout(function(){if(r=null,0===i.numOnHover)setTimeout(function(){return i.numOnHover=0},1e3);else if(i.numOnHover>i.config.rateThrottle)return;i.numOnHover++,i._addPrefetchLink(e)},this.config.onHoverDelay);t.addEventListener(n,function e(){t.removeEventListener(n,e,{passive:!0}),null!==r&&(clearTimeout(r),r=null)},{passive:!0})}},{key:"_addPrefetchLink",value:function(i){return this.prefetched.add(i.href),new Promise(function(e,t){var n=document.createElement("link");n.rel="prefetch",n.href=i.href,n.onload=e,n.onerror=t,document.head.appendChild(n)}).catch(function(){})}},{key:"_prepareUrl",value:function(e){if(null===e||"object"!==(void 0===e?"undefined":r(e))||!1 in e||-1===["http:","https:"].indexOf(e.protocol))return null;var t=e.href.substring(0,this.config.siteUrl.length),n=this._getPathname(e.href,t),i={original:e.href,protocol:e.protocol,origin:t,pathname:n,href:t+n};return this._isLinkOk(i)?i:null}},{key:"_getPathname",value:function(e,t){var n=t?e.substring(this.config.siteUrl.length):e;return n.startsWith("/")||(n="/"+n),this._shouldAddTrailingSlash(n)?n+"/":n}},{key:"_shouldAddTrailingSlash",value:function(e){return this.config.usesTrailingSlash&&!e.endsWith("/")&&!this.regex.fileExt.test(e)}},{key:"_isLinkOk",value:function(e){return null!==e&&"object"===(void 0===e?"undefined":r(e))&&(!this.prefetched.has(e.href)&&e.origin===this.config.siteUrl&&-1===e.href.indexOf("?")&&-1===e.href.indexOf("#")&&!this.regex.excludeUris.test(e.href)&&!this.regex.images.test(e.href))}}],[{key:"run",value:function(){"undefined"!=typeof RocketPreloadLinksConfig&&new n(new RocketBrowserCompatibilityChecker({capture:!0,passive:!0}),RocketPreloadLinksConfig).init()}}]),n}();t.run(); }()); //# sourceURL=rocket-preload-links-js-after /* ]]> */ </script> <script type="text/javascript" src="https://audreytips.com/wp-content/themes/skin/assets/js/bootstrap.min.js?ver=1" id="skin-bootstrap-js-js"></script> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/themes/skin/assets/js/swiper.min.js?ver=1" id="skin-swiper-slider-js" data-rocket-defer defer></script> <script type="text/rocketlazyloadscript" data-minify="1" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/cache/min/1/wp-content/themes/skin/assets/js/custom.js?ver=1772435057" id="skin-custom-js-js" data-rocket-defer defer></script> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-includes/js/comment-reply.min.js?ver=6.9.4" id="comment-reply-js" async="async" data-wp-strategy="async" fetchpriority="low"></script> <script type="text/javascript" id="ctc-global-injector-frontend-js-extra"> /* <![CDATA[ */ var ctcGlobalInjector = {"rules":[{"id":59492,"selector":"pre","exclude_selector":"","visual_style":"cover","button_text":"Copier","success_text":"Copi\u00e9","tooltip_text":"Copy to clipboard","button_position":"inside_top_right","copy_format":"default","copy_as":"text_and_html","analytics_enabled":true,"icon_enabled":true,"icon_position":"left","icon_key":"clipboard","style":{"overlay_color":"#0f172a","hover_overlay_color":"#4f46e5","overlay_opacity":20,"blur":2,"cover_text_color":"#ffffff","cover_bg_color":"#ffffff","cover_hover_bg_color":"#f1f5f9","cover_border_radius":9999,"cover_font_size":13,"cover_padding_x":12,"cover_padding_y":6}}],"apiUrl":"https://audreytips.com/wp-json/ctc/v1/rules","eventsUrl":"https://audreytips.com/wp-json/ctc/v1/analytics/events","isPro":"","postId":"41509","postType":"post","pageUrl":"https://audreytips.com/elements-html-exemples/","pageContext":{"post_type":"post","post_id":41509,"page_id":0,"user_logged_in":"no","user_role":"","url":"https://audreytips.com/elements-html-exemples","device":"desktop"},"debug":"","styles":{"button":{"defaultConfig":{"text":{"button_text":"Copy Code","success_text":"Copied!"},"icon":{"enabled":true,"position":"left","icon_key":"clipboard","custom_url":null},"style":{"text_color":"#ffffff","background_color":"#4f46e5","hover_background_color":"#4338ca","font_size":"12px","font_weight":"700","padding_x":"12px","padding_y":"6px","border_radius":"6px"}},"icons":{"clipboard":{"label":"Clipboard","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"/\u003E\u003C/svg\u003E"},"copy":{"label":"Copy","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m0 0h2a2 2 0 012 2v3m2 4H10m0 0l3-3m-3 3l3 3\"/\u003E\u003C/svg\u003E"},"paperclip":{"label":"Attachment","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13\"/\u003E\u003C/svg\u003E"},"link":{"label":"Link","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1\"/\u003E\u003C/svg\u003E"},"document":{"label":"Document","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"/\u003E\u003C/svg\u003E"},"check":{"label":"Checkmark","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\"/\u003E\u003C/svg\u003E"}},"successIcon":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\"/\u003E\u003C/svg\u003E","baseCSS":"\n\t\t\t.ctc-copy-button {\n\t\t\t\t/* User-customizable via CSS variables */\n\t\t\t\tcolor: var(--ctc-text-color, #ffffff);\n\t\t\t\tbackground-color: var(--ctc-bg, #4f46e5);\n\t\t\t\tfont-size: var(--ctc-font-size, 12px);\n\t\t\t\tfont-weight: var(--ctc-font-weight, 700);\n\t\t\t\tpadding: var(--ctc-padding-y, 6px) var(--ctc-padding-x, 12px);\n\t\t\t\tborder-radius: var(--ctc-border-radius, 6px);\n\n\t\t\t\t/* Hidden CSS - always applied, not customizable via UI */\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: 4px;\n\t\t\t\tborder: none;\n\t\t\t\tcursor: pointer;\n\t\t\t\ttransition: background-color 0.2s ease;\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: 8px;\n\t\t\t\tright: 8px;\n\t\t\t\tz-index: 10;\n\t\t\t\tfont-family: inherit;\n\t\t\t\tline-height: 1;\n\t\t\t}\n\n\t\t\t.ctc-copy-button:hover {\n\t\t\t\tbackground-color: var(--ctc-hover-bg, #4338ca);\n\t\t\t}\n\n\t\t\t.ctc-copy-button:focus {\n\t\t\t\toutline: 2px solid var(--ctc-bg, #4f46e5);\n\t\t\t\toutline-offset: 2px;\n\t\t\t}\n\n\t\t\t.ctc-copy-button .ctc-btn-icon {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t}\n\n\t\t\t.ctc-copy-button .ctc-btn-icon svg {\n\t\t\t\twidth: 14px;\n\t\t\t\theight: 14px;\n\t\t\t}\n\n\t\t\t.ctc-copy-button .ctc-btn-icon img {\n\t\t\t\twidth: 14px;\n\t\t\t\theight: 14px;\n\t\t\t\tobject-fit: contain;\n\t\t\t}\n\n\t\t\t.ctc-copy-button .ctc-btn-text {\n\t\t\t\twhite-space: nowrap;\n\t\t\t}\n\n\t\t\t/* Success state */\n\t\t\t.ctc-copy-button.ctc-copied {\n\t\t\t\tbackground-color: #059669;\n\t\t\t}\n\n\t\t\t.ctc-copy-button.ctc-copied:hover {\n\t\t\t\tbackground-color: #047857;\n\t\t\t}\n\t\t"},"icon":{"defaultConfig":{"text":{"tooltip_text":"Copy to clipboard","success_text":"Copied!"},"icon":{"icon_key":"clipboard","custom_url":null},"style":{"icon_color":"#6b7280","icon_hover_color":"#4f46e5","bg_color":"#ffffff","border_color":"#e5e7eb","icon_size":"16px","padding":"8px","border_radius":"8px","border_width":"1px"}},"icons":{"clipboard":{"label":"Clipboard","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"/\u003E\u003C/svg\u003E"},"copy":{"label":"Copy","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m0 0h2a2 2 0 012 2v3m2 4H10m0 0l3-3m-3 3l3 3\"/\u003E\u003C/svg\u003E"},"paperclip":{"label":"Attachment","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13\"/\u003E\u003C/svg\u003E"},"link":{"label":"Link","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1\"/\u003E\u003C/svg\u003E"},"document":{"label":"Document","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z\"/\u003E\u003C/svg\u003E"},"check":{"label":"Checkmark","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\"/\u003E\u003C/svg\u003E"}},"successIcon":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\"/\u003E\u003C/svg\u003E","baseCSS":"\n\t\t\t.ctc-copy-icon {\n\t\t\t\t/* User-customizable via CSS variables */\n\t\t\t\tcolor: var(--ctc-icon-color, #6b7280);\n\t\t\t\tbackground-color: var(--ctc-icon-bg, #ffffff);\n\t\t\t\tborder-color: var(--ctc-icon-border, #e5e7eb);\n\t\t\t\tborder-width: var(--ctc-icon-border-width, 1px);\n\t\t\t\tpadding: var(--ctc-icon-padding, 8px);\n\t\t\t\tborder-radius: var(--ctc-icon-radius, 8px);\n\n\t\t\t\t/* Hidden CSS - always applied, not customizable via UI */\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\tborder-style: solid;\n\t\t\t\tcursor: pointer;\n\t\t\t\ttransition: all 0.2s ease;\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: 8px;\n\t\t\t\tright: 8px;\n\t\t\t\tz-index: 10;\n\t\t\t\tbox-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n\t\t\t}\n\n\t\t\t.ctc-copy-icon:hover {\n\t\t\t\tcolor: var(--ctc-icon-hover-color, #4f46e5);\n\t\t\t\tbackground-color: var(--ctc-icon-bg, #ffffff);\n\t\t\t}\n\n\t\t\t.ctc-copy-icon:focus {\n\t\t\t\toutline: 2px solid var(--ctc-icon-hover-color, #4f46e5);\n\t\t\t\toutline-offset: 2px;\n\t\t\t}\n\n\t\t\t.ctc-copy-icon .ctc-icon-svg {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t}\n\n\t\t\t.ctc-copy-icon .ctc-icon-svg svg {\n\t\t\t\twidth: var(--ctc-icon-size, 16px);\n\t\t\t\theight: var(--ctc-icon-size, 16px);\n\t\t\t}\n\n\t\t\t.ctc-copy-icon .ctc-icon-img {\n\t\t\t\twidth: var(--ctc-icon-size, 16px);\n\t\t\t\theight: var(--ctc-icon-size, 16px);\n\t\t\t\tobject-fit: contain;\n\t\t\t}\n\n\t\t\t/* Success state */\n\t\t\t.ctc-copy-icon.ctc-copied {\n\t\t\t\tcolor: #059669;\n\t\t\t\tborder-color: #a7f3d0;\n\t\t\t\tbackground-color: #ecfdf5;\n\t\t\t}\n\n\t\t\t/* Tooltip */\n\t\t\t.ctc-copy-icon[data-tooltip]::before {\n\t\t\t\tcontent: attr(data-tooltip);\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: 50%;\n\t\t\t\tright: calc(100% + 8px);\n\t\t\t\ttransform: translateY(-50%);\n\t\t\t\tpadding: 4px 8px;\n\t\t\t\tbackground: #1e293b;\n\t\t\t\tcolor: white;\n\t\t\t\tfont-size: 11px;\n\t\t\t\tfont-weight: 500;\n\t\t\t\tborder-radius: 4px;\n\t\t\t\twhite-space: nowrap;\n\t\t\t\topacity: 0;\n\t\t\t\tvisibility: hidden;\n\t\t\t\ttransition: opacity 0.2s ease, visibility 0.2s ease;\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\n\t\t\t.ctc-copy-icon:hover[data-tooltip]::before,\n\t\t\t.ctc-copy-icon:focus[data-tooltip]::before {\n\t\t\t\topacity: 1;\n\t\t\t\tvisibility: visible;\n\t\t\t}\n\t\t"},"cover":{"defaultConfig":{"text":{"button_text":"Copy","success_text":"Copied!"},"icon":{"enabled":true,"position":"left","icon_key":"clipboard","custom_url":null},"overlay":{"overlay_color":"#0f172a","hover_overlay_color":"#4f46e5","overlay_opacity":20,"blur":2},"button":{"text_color":"#0f172a","bg_color":"#ffffff","hover_bg_color":"#f1f5f9","border_radius":9999,"font_size":10,"padding_x":12,"padding_y":6}},"icons":{"clipboard":{"label":"Clipboard","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"/\u003E\u003C/svg\u003E"},"copy":{"label":"Copy","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m0 0h2a2 2 0 012 2v3m2 4H10m0 0l3-3m-3 3l3 3\"/\u003E\u003C/svg\u003E"},"eye":{"label":"Eye","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 12a3 3 0 11-6 0 3 3 0 016 0z\"/\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z\"/\u003E\u003C/svg\u003E"},"click":{"label":"Click","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 15l-2 5L9 9l11 4-5 2zm0 0l5 5M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122\"/\u003E\u003C/svg\u003E"},"lock":{"label":"Lock","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z\"/\u003E\u003C/svg\u003E"},"check":{"label":"Checkmark","svg":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\"/\u003E\u003C/svg\u003E"}},"successIcon":"\u003Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\u003E\u003Cpath stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\"/\u003E\u003C/svg\u003E","baseCSS":"\n\t\t\t/* Cover overlay - hidden by default, visible on hover */\n\t\t\t.ctc-cover-overlay {\n\t\t\t\tposition: absolute;\n\t\t\t\tinset: 0;\n\t\t\t\tz-index: 20;\n\t\t\t\tborder-radius: inherit;\n\t\t\t\ttransition: all 0.3s ease;\n\t\t\t\tcursor: pointer;\n\n\t\t\t\t/* Hidden by default */\n\t\t\t\topacity: 0;\n\t\t\t\tbackground: var(--ctc-cover-overlay, rgba(15, 23, 42, 0.2));\n\t\t\t\tbackdrop-filter: blur(0px);\n\t\t\t\t-webkit-backdrop-filter: blur(0px);\n\t\t\t}\n\n\t\t\t/* Show overlay on hover */\n\t\t\t.ctc-cover-overlay:hover {\n\t\t\t\topacity: 1;\n\t\t\t\tbackground: var(--ctc-cover-hover-overlay, rgba(79, 70, 229, 0.3));\n\t\t\t\tbackdrop-filter: blur(var(--ctc-cover-blur, 2px));\n\t\t\t\t-webkit-backdrop-filter: blur(var(--ctc-cover-blur, 2px));\n\t\t\t}\n\n\t\t\t/* Copy button - centered, appears with overlay on hover */\n\t\t\t.ctc-cover-button {\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: 50%;\n\t\t\t\tleft: 50%;\n\t\t\t\ttransform: translate(-50%, -50%) scale(0.9);\n\t\t\t\topacity: 0;\n\t\t\t\ttransition: all 0.2s ease;\n\n\t\t\t\t/* Button styles from CSS variables */\n\t\t\t\tcolor: var(--ctc-cover-btn-text, #0f172a);\n\t\t\t\tbackground: var(--ctc-cover-btn-bg, rgba(255, 255, 255, 0.95));\n\t\t\t\tfont-size: var(--ctc-cover-btn-font-size, 10px);\n\t\t\t\tfont-weight: 700;\n\t\t\t\tpadding: var(--ctc-cover-btn-padding-y, 6px) var(--ctc-cover-btn-padding-x, 12px);\n\t\t\t\tborder-radius: var(--ctc-cover-btn-radius, 9999px);\n\n\t\t\t\t/* Fixed styles */\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: 6px;\n\t\t\t\tborder: 1px solid rgba(255, 255, 255, 0.5);\n\t\t\t\tbox-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n\t\t\t\twhite-space: nowrap;\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\n\t\t\t/* Show button when overlay is hovered */\n\t\t\t.ctc-cover-overlay:hover .ctc-cover-button {\n\t\t\t\topacity: 1;\n\t\t\t\ttransform: translate(-50%, -50%) scale(1);\n\t\t\t}\n\n\t\t\t.ctc-cover-button:hover {\n\t\t\t\tbackground: var(--ctc-cover-btn-hover-bg, #f1f5f9);\n\t\t\t\ttransform: translate(-50%, -50%) scale(1.05);\n\t\t\t}\n\n\t\t\t.ctc-cover-button:active {\n\t\t\t\ttransform: translate(-50%, -50%) scale(0.95);\n\t\t\t}\n\n\t\t\t/* Icon styles */\n\t\t\t.ctc-cover-icon {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t}\n\n\t\t\t.ctc-cover-icon svg {\n\t\t\t\twidth: 12px;\n\t\t\t\theight: 12px;\n\t\t\t}\n\n\t\t\t.ctc-cover-icon img {\n\t\t\t\twidth: 12px;\n\t\t\t\theight: 12px;\n\t\t\t\tobject-fit: contain;\n\t\t\t}\n\n\t\t\t.ctc-cover-text {\n\t\t\t\twhite-space: nowrap;\n\t\t\t}\n\n\t\t\t/* Success state */\n\t\t\t.ctc-cover-overlay.ctc-copied .ctc-cover-button {\n\t\t\t\tbackground: #059669;\n\t\t\t\tcolor: #ffffff;\n\t\t\t\tborder-color: #059669;\n\t\t\t}\n\n\t\t\t/* Ensure parent has relative positioning */\n\t\t\t.ctc-cover-wrapper {\n\t\t\t\tposition: relative;\n\t\t\t}\n\n\t\t\t/* Disable text selection on covered content */\n\t\t\t.ctc-cover-wrapper.ctc-covered {\n\t\t\t\tuser-select: none;\n\t\t\t}\n\t\t"}}}; //# sourceURL=ctc-global-injector-frontend-js-extra /* ]]> */ </script> <script type="text/rocketlazyloadscript" data-minify="1" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/cache/min/1/wp-content/plugins/copy-the-code/assets/frontend/js/global-injector.js?ver=1772435057" id="ctc-global-injector-frontend-js" data-rocket-defer defer></script> <script type="text/javascript" id="q2w3_fixed_widget-js-extra"> /* <![CDATA[ */ var q2w3_sidebar_options = [{"sidebar":"sidebar-1","use_sticky_position":false,"margin_top":100,"margin_bottom":0,"stop_elements_selectors":"reply-title","screen_max_width":0,"screen_max_height":0,"widgets":["#custom_html-7"]}]; //# sourceURL=q2w3_fixed_widget-js-extra /* ]]> */ </script> <script type="text/rocketlazyloadscript" data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/plugins/q2w3-fixed-widget/js/frontend.min.js?ver=6.2.3" id="q2w3_fixed_widget-js" data-rocket-defer defer></script> <script type="text/rocketlazyloadscript" data-minify="1" defer data-rocket-type="text/javascript" data-rocket-src="https://audreytips.com/wp-content/cache/min/1/wp-content/plugins/akismet/_inc/akismet-frontend.js?ver=1772435062" id="akismet-frontend-js"></script> <script type="text/rocketlazyloadscript" data-minify="1" data-rocket-type="text/javascript" defer data-rocket-src="https://audreytips.com/wp-content/cache/min/1/wp-content/plugins/mailchimp-for-wp/assets/js/forms.js?ver=1772435057" id="mc4wp-forms-api-js"></script> <!-- Compliance by Hu-manity.co plugin v3.0.2 https://hu-manity.co/ --> <div id="cookie-notice" role="dialog" class="cookie-notice-hidden cookie-revoke-hidden cn-position-bottom" aria-label="Compliance by Hu-manity.co" style="background-color: rgba(51,51,51,1);"><div class="cookie-notice-container" style="color: #fff"><span id="cn-notice-text" class="cn-text-container">Nous diffusons des cookies sur #audreytips afin d'analyser le trafic et vous procurer la meilleure expérience.</span><span id="cn-notice-buttons" class="cn-buttons-container"><button id="cn-accept-cookie" data-cookie-set="accept" class="cn-set-cookie cn-button cn-button-custom button" aria-label="C'est noté, merci">C'est noté, merci</button><button id="cn-refuse-cookie" data-cookie-set="refuse" class="cn-set-cookie cn-button cn-button-custom button" aria-label="Je refuse">Je refuse</button><button data-link-url="https://audreytips.com/mentions-legales/" data-link-target="_self" id="cn-more-info" class="cn-more-info cn-button cn-button-custom button" aria-label="En savoir plus">En savoir plus</button></span><button type="button" id="cn-close-notice" data-cookie-set="accept" class="cn-close-icon" aria-label="Je refuse"></button></div> </div> <!-- / Compliance by Hu-manity.co plugin --><script>window.lazyLoadOptions=[{elements_selector:"img[data-lazy-src],.rocket-lazyload,iframe[data-lazy-src]",data_src:"lazy-src",data_srcset:"lazy-srcset",data_sizes:"lazy-sizes",class_loading:"lazyloading",class_loaded:"lazyloaded",threshold:300,callback_loaded:function(element){if(element.tagName==="IFRAME"&&element.dataset.rocketLazyload=="fitvidscompatible"){if(element.classList.contains("lazyloaded")){if(typeof window.jQuery!="undefined"){if(jQuery.fn.fitVids){jQuery(element).parent().fitVids()}}}}}},{elements_selector:".rocket-lazyload",data_src:"lazy-src",data_srcset:"lazy-srcset",data_sizes:"lazy-sizes",class_loading:"lazyloading",class_loaded:"lazyloaded",threshold:300,}];window.addEventListener('LazyLoad::Initialized',function(e){var lazyLoadInstance=e.detail.instance;if(window.MutationObserver){var observer=new MutationObserver(function(mutations){var image_count=0;var iframe_count=0;var rocketlazy_count=0;mutations.forEach(function(mutation){for(var i=0;i<mutation.addedNodes.length;i++){if(typeof mutation.addedNodes[i].getElementsByTagName!=='function'){continue} if(typeof mutation.addedNodes[i].getElementsByClassName!=='function'){continue} images=mutation.addedNodes[i].getElementsByTagName('img');is_image=mutation.addedNodes[i].tagName=="IMG";iframes=mutation.addedNodes[i].getElementsByTagName('iframe');is_iframe=mutation.addedNodes[i].tagName=="IFRAME";rocket_lazy=mutation.addedNodes[i].getElementsByClassName('rocket-lazyload');image_count+=images.length;iframe_count+=iframes.length;rocketlazy_count+=rocket_lazy.length;if(is_image){image_count+=1} if(is_iframe){iframe_count+=1}}});if(image_count>0||iframe_count>0||rocketlazy_count>0){lazyLoadInstance.update()}});var b=document.getElementsByTagName("body")[0];var config={childList:!0,subtree:!0};observer.observe(b,config)}},!1)</script><script data-no-minify="1" async src="https://audreytips.com/wp-content/plugins/wp-rocket/assets/js/lazyload/17.8.3/lazyload.min.js"></script><script>function lazyLoadThumb(e,alt,l){var t='<img data-lazy-src="https://i.ytimg.com/vi/ID/hqdefault.jpg" alt="" width="480" height="360"><noscript><img src="https://i.ytimg.com/vi/ID/hqdefault.jpg" alt="" width="480" height="360"></noscript>',a='<button class="play" aria-label="Lire la vidéo Youtube"></button>';if(l){t=t.replace('data-lazy-','');t=t.replace('loading="lazy"','');t=t.replace(/<noscript>.*?<\/noscript>/g,'');}t=t.replace('alt=""','alt="'+alt+'"');return t.replace("ID",e)+a}function lazyLoadYoutubeIframe(){var e=document.createElement("iframe"),t="ID?autoplay=1";t+=0===this.parentNode.dataset.query.length?"":"&"+this.parentNode.dataset.query;e.setAttribute("src",t.replace("ID",this.parentNode.dataset.src)),e.setAttribute("frameborder","0"),e.setAttribute("allowfullscreen","1"),e.setAttribute("allow","accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"),this.parentNode.parentNode.replaceChild(e,this.parentNode)}document.addEventListener("DOMContentLoaded",function(){var exclusions=[];var e,t,p,u,l,a=document.getElementsByClassName("rll-youtube-player");for(t=0;t<a.length;t++)(e=document.createElement("div")),(u='https://i.ytimg.com/vi/ID/hqdefault.jpg'),(u=u.replace('ID',a[t].dataset.id)),(l=exclusions.some(exclusion=>u.includes(exclusion))),e.setAttribute("data-id",a[t].dataset.id),e.setAttribute("data-query",a[t].dataset.query),e.setAttribute("data-src",a[t].dataset.src),(e.innerHTML=lazyLoadThumb(a[t].dataset.id,a[t].dataset.alt,l)),a[t].appendChild(e),(p=e.querySelector(".play")),(p.onclick=lazyLoadYoutubeIframe)});</script><div data-wpr-lazyrender="1" id="tt" role="tooltip" aria-label="Tooltip content" class="cmtt"></div> <script>(()=>{class RocketElementorPreload{constructor(){this.deviceMode=document.createElement("span"),this.deviceMode.id="elementor-device-mode-wpr",this.deviceMode.setAttribute("class","elementor-screen-only"),document.body.appendChild(this.deviceMode)}t(){let t=getComputedStyle(this.deviceMode,":after").content.replace(/"/g,"");this.animationSettingKeys=this.i(t),document.querySelectorAll(".elementor-invisible[data-settings]").forEach(t=>{const e=t.getBoundingClientRect();if(e.bottom>=0&&e.top<=window.innerHeight)try{this.o(t)}catch(t){}})}o(t){const e=JSON.parse(t.dataset.settings),i=e.m||e.animation_delay||0,n=e[this.animationSettingKeys.find(t=>e[t])];if("none"===n)return void t.classList.remove("elementor-invisible");t.classList.remove(n),this.currentAnimation&&t.classList.remove(this.currentAnimation),this.currentAnimation=n;let o=setTimeout(()=>{t.classList.remove("elementor-invisible"),t.classList.add("animated",n),this.l(t,e)},i);window.addEventListener("rocket-startLoading",function(){clearTimeout(o)})}i(t="mobile"){const e=[""];switch(t){case"mobile":e.unshift("_mobile");case"tablet":e.unshift("_tablet");case"desktop":e.unshift("_desktop")}const i=[];return["animation","_animation"].forEach(t=>{e.forEach(e=>{i.push(t+e)})}),i}l(t,e){this.i().forEach(t=>delete e[t]),t.dataset.settings=JSON.stringify(e)}static run(){const t=new RocketElementorPreload;requestAnimationFrame(t.t.bind(t))}}document.addEventListener("DOMContentLoaded",RocketElementorPreload.run)})();</script></body> </html> <!-- Performance optimized by Redis Object Cache. Learn more: https://wprediscache.com --> <!-- Cached for great performance -->