Web

Balise de code en HTML : comment l’utiliser et la balise de fermeture ?

HTML, le langage fondamental du web, repose sur des balises pour structurer le contenu des pages. Une balise essentielle est la balise de code, utilisée pour afficher du texte en tant que code source. La syntaxe est simple : on ouvre avec `` et on ferme avec ``. Tout ce qui se trouve entre ces balises sera présenté avec une police à espacement fixe, idéale pour des extraits de code.

Par exemple, pour afficher du HTML dans une page web, on pourrait écrire : `<html> ...</html>`. L’utilisation correcte de ces balises garantit une meilleure lisibilité et compréhension du code pour les développeurs et les lecteurs.

A lire aussi : Optimisez les performances de votre site web grâce à ces bonnes pratiques

Qu’est-ce qu’une balise de code en HTML ?

HTML, ou Hypertext Markup Language, est le langage utilisé pour structurer les pages web. Les balises en HTML permettent de définir des éléments de contenu variés, allant des titres aux paragraphes, en passant par les liens et les images. Parmi ces balises, la balise `` joue un rôle fondamental en affichant du texte en tant que code source. Cette balise est particulièrement utile pour les développeurs qui souhaitent illustrer des exemples de code dans leurs articles ou documentations.

Exemple de balise de code :

A découvrir également : 5 moyens simples d'augmenter sa libido

<html> ...</html>

Le texte entre les balises `` et `` est rendu avec une police à espacement fixe, ce qui le distingue visuellement du reste du contenu. Cette présentation facilite la lecture et la compréhension des extraits de code, surtout lorsqu'il s'agit de langages nécessitant une indentation précise.

Utilisation dans les CMS

Les CMS (Content Management Systems) comme WordPress, Joomla! ou Drupal, utilisent HTML pour structurer les pages web. Ces plateformes intègrent souvent des éditeurs de texte enrichis permettant aux utilisateurs d'insérer facilement des balises de code dans leurs contenus. Cette fonctionnalité est essentielle pour les blogs techniques et les sites d'apprentissage en ligne.

  • WordPress : CMS open-source largement utilisé par les particuliers et les professionnels.
  • Joomla! : CMS open-source populaire avant l'avènement de WordPress.
  • Drupal : Un des grands CMS open-source du marché.

Ces CMS offrent souvent des plugins ou des modules supplémentaires pour améliorer la gestion et l'affichage des balises de code, rendant ainsi le processus plus intuitif pour les utilisateurs novices et experts.

Comment utiliser la balise de code en HTML

Pour insérer une balise de code en HTML, commencez par utiliser la balise d'ouverture ``. À l'intérieur de cette balise, placez le texte ou le code que vous souhaitez afficher. Terminez avec la balise de fermeture ``. Cette structure simple permet aux navigateurs de reconnaître et de formater le contenu comme du code.

<p>Ceci est un exemple de code HTML</p>

La balise `` peut être utilisée à l'intérieur de plusieurs autres balises HTML, comme `

`, `

` ou même `` pour des blocs de code plus longs. Utiliser cette balise dans un élément `` permet de conserver les espaces et les sauts de ligne, améliorant ainsi la lisibilité des extraits de code.

Exemple avec la balise `` :

<p>Ceci est un exemple de code HTML</p>

Les balises `` et `` sont particulièrement utiles lorsqu'il s'agit de présenter des exemples de code dans des tutoriels, des documentations ou des articles techniques.

Bonnes pratiques

Pour optimiser l'utilisation de la balise de code en HTML, suivez ces recommandations :

  • Utilisez des balises de commentaire HTML `` pour ajouter des notes explicatives à votre code.
  • Appliquez des styles CSS pour personnaliser l'apparence du code :

    css

    code {

    background-color: #f5f5f5;

    padding: 2px 4px;

    border-radius: 4px;

    }

  • Testez votre code dans différents navigateurs (Chrome, Firefox, Edge) pour garantir une compatibilité optimale.

Exemples pratiques d'utilisation de la balise de code

L'utilisation de la balise `` s'étend bien au-delà des simples extraits de code. Dans des CMS comme WordPress ou Joomla!, cette balise facilite la présentation de morceaux de code dans les articles de blog, les tutoriels ou les documentations.

WordPress

WordPress, open-source et largement adopté, permet d'intégrer des balises `` via l'éditeur Gutenberg. Ajoutez un bloc de code, insérez votre texte entre les balises `` et publiez. Le rendu est optimisé grâce à des styles CSS prédéfinis.

Joomla!

Avant l'essor de WordPress, Joomla! dominait le marché des CMS open source. Avec Joomla!, insérez la balise `` directement dans l'éditeur d'article. Utilisez le plugin 'CodeHighlight' pour une mise en forme visuellement attrayante.

Autres CMS

  • Ibexa : Originaire de Norvège, Ibexa, anciennement eZ Platform, propose une gestion avancée des extraits de code grâce à des modules intégrés.
  • Drupal : Drupal, un autre poids lourd open source, offre des modules comme 'SyntaxHighlighter' pour styliser les balises ``.
  • SquareSpace : SquareSpace, très populaire aux États-Unis et en France, permet l'insertion de balises `` via des blocs de code personnalisés.

Shopify et PrestaShop

Pour les sites e-commerce, Shopify et PrestaShop permettent aussi l'intégration de balises ``. Utilisez-les pour afficher des exemples de produits ou des scripts personnalisés dans les pages de votre boutique.

Adobe Commerce

Adobe Commerce, anciennement Magento, est reconnu pour sa puissance. Utilisez la balise `` pour intégrer des snippets de code dans les descriptions de produits, les tutoriels ou les pages d'aide.

Utiliser efficacement la balise `` améliore non seulement la lisibilité du contenu technique mais renforce aussi l'expérience utilisateur dans des environnements variés.

code html

La balise de fermeture en HTML : importance et bonnes pratiques

En HTML, chaque balise d'ouverture doit être suivie d'une balise de fermeture. Cette règle garantit que les navigateurs interprètent correctement le code et affichent fidèlement le contenu. Les balises de fermeture, notées avec une barre oblique avant le nom de la balise, sont essentielles pour maintenir la structure et l'intégrité du document.

Exemple :

<div> ...</div>

Règles de base

  • Balises obligatoires : Les balises telles que ``, ``, ``, `` requièrent obligatoirement une balise de fermeture.</li> <li><strong>Self-closing tags</strong> : Certaines balises, comme `<br /><img>`, `<input>`, ` <p>`, n'ont pas de balise de fermeture. Elles se terminent par une barre oblique directement dans la balise d'ouverture.</li> </ul> <h3><span id="Consequences-dune-balise-manquante">Conséquences d'une balise manquante</span></h3> <p>Omettre une balise de fermeture peut entraîner des erreurs de rendu. Les navigateurs tenteront de corriger ces erreurs, mais cela peut altérer l'affichage et la fonctionnalité.</p> <p><strong>Exemple :</strong></p> <p><code><div> ...<p>Texte ici</code></p> <p>Sans balise de fermeture `</p> <div>`, le navigateur pourrait mal interpréter la structure.</p> <h3><span id="Bonnes-pratiques-2">Bonnes pratiques</span></h3> <p>Respectez toujours la hiérarchie des balises. Chaque balise ouverte doit être fermée dans l'ordre inverse de son ouverture.</p> <p><strong>Exemple :</strong></p> <p><code><div><p>Texte</p></div></code></p> <p>Cette syntaxe assure une structure claire et évite les erreurs d'interprétation par les navigateurs.</p> <p>Suivez ces principes pour garantir une lecture optimale du code HTML par les navigateurs, assurant ainsi une présentation cohérente et fonctionnelle.</p> </div></div><!-- single entry wrap--></div><!-- single content wrap --><aside class="hidden" style="display: none;"><meta itemprop="mainEntityOfPage" content="https://www.bordel-de-nerd.net/balise-de-code-en-html-comment-lutiliser-et-la-balise-de-fermeture/"><span style="display: none;" class="vcard author" itemprop="author" content="Watson"><span class="fn">Watson</span></span><time class="date published entry-date" datetime="2025-05-03T05:08:00+00:00" content="2025-05-03T05:08:00+00:00" itemprop="datePublished">mai 3, 2025</time><meta class="updated" itemprop="dateModified" content="2025-05-03T05:08:00+00:00"><span style="display: none;" itemprop="image" itemscope itemtype="https://schema.org/ImageObject"><meta itemprop="url" content="https://www.bordel-de-nerd.net/wp-content/uploads/generated_9221187252951220751.png"><meta itemprop="width" content="1200"><meta itemprop="height" content="800"></span><span style="display: none;" itemprop="publisher" itemscope itemtype="https://schema.org/Organization"><span style="display: none;" itemprop="logo" itemscope itemtype="https://schema.org/ImageObject"><meta itemprop="url" content="https://www.bordel-de-nerd.net/wp-content/uploads/bordel-de-nerd.net-retina.png"></span><meta itemprop="name" content="Watson"></span></aside></div><!-- single post body --></div><!-- single post content outer --><div class="single-post-box-outer"><nav class="single-nav single-box row"><div class="col-sm-6 col-xs-12 nav-el nav-left post-title is-size-6"><a href="https://www.bordel-de-nerd.net/outils-no-code-definition-et-avantages-des-outils-sans-programmation/" rel="bookmark" title="Outils no-code : définition et avantages des outils sans programmation"><span class="ruby-nav-icon nav-left-icon"><i class="fa fa-angle-left"></i></span><span class="ruby-nav-link nav-left-link">Outils no-code : définition et avantages des outils sans programmation</span></a></div><div class="col-sm-6 col-xs-12 nav-el nav-right post-title is-size-6"></div></nav></div><!-- single post box outer --></div><!-- page--><aside class="sidebar-wrap col-sm-4 col-xs-12 clearfix" ><div class="ruby-sidebar-sticky"><div class="sidebar-inner"><section id="search-2" class="widget widget_search"><form method="get" id="searchform" action="https://www.bordel-de-nerd.net/"> <div class="ruby-search"> <span class="search-input"><input type="text" id="s" placeholder="Rechercher et appuyer sur Entrée…" value="" name="s" title="Search for:"/></span> <span class="search-submit"><input type="submit" value="" /><i class="fa fa-search"></i></span> </div> </form> </section><section id="custom_html-2" class="widget_text widget widget_custom_html"><div class="widget-title block-title"><h3>Facebook</h3></div><div class="textwidget custom-html-widget"><div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = 'https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v3.2'; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> <div class="fb-page" data-href="https://www.facebook.com/Bordel-de-nerd-1976937779040948/" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><blockquote cite="https://www.facebook.com/Bordel-de-nerd-1976937779040948/" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/Bordel-de-nerd-1976937779040948/">bordel-de-nerd.net</a></blockquote></div></div></section><section id="bingo_ruby_sb_subscribe_widget-2" class="widget sb-widget-subscribe"> <div class="widget-content-wrap"> <div class="subscribe-wrap no-color-bg subscribe-big is-dark-text" > <span class="subscribe-icon-mail"><i class="fa fa-envelope-o"></i></span> <div class="subscribe-title-wrap"><h3>Inscription à la newsletter</h3></div> <div class="subscribe-text-wrap">Recevez tous les derniers contenus directement dans votre boîte de réception. </div> <div class="subscribe-content-wrap"> <div class="subscribe-form-wrap"> <script type="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.10.3 - https://wordpress.org/plugins/mailchimp-for-wp/ --><form id="mc4wp-form-1" class="mc4wp-form mc4wp-form-77" method="post" data-id="77" data-name="inscription" ><div class="mc4wp-form-fields"><p> <label>Adresse Email: </label> <input type="email" name="EMAIL" placeholder="Votre adresse email" required /> </p> <p> <input type="submit" value="S'inscrire" /> </p></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="1746288121" /><input type="hidden" name="_mc4wp_form_id" value="77" /><input type="hidden" name="_mc4wp_form_element_id" value="mc4wp-form-1" /><div class="mc4wp-response"></div></form><!-- / Mailchimp for WordPress Plugin --> </div> </div> </div> </div> </section><section id="bingo_ruby_sb_ad_widget-2" class="widget sb-widget sb-widget-ad"> <div class="widget-ad-content-wrap widget-content-wrap clearfix"> <div class="ad-title"><span>- Publicité -</span></div> <div class="widget-ad-script"> <a href="http://www.liberation.fr/"><img width="646" height="422" class="widget-ad-image-url" src="https://www.bordel-de-nerd.net/wp-content/uploads/4462216-liberation-article_media_image-2.jpg.webp" alt="Bordel de Nerd"></a> </div> </div> </section><section id="bingo_ruby_sb_widget_post-3" class="widget sb-widget sb-widget-post"><div class="widget-title block-title"><h3>Articles populaires</h3></div><div class="widget-content-wrap"><div class="post-widget-inner style-1"><article class="post-wrap post-list-4 clearfix"><div class="post-thumb-outer"><div class=" post-thumb is-image"><a href="https://www.bordel-de-nerd.net/pourquoi-est-il-important-de-maitriser-excel-de-nos-jours/" title="Pourquoi est-il important de maîtriser Excel de nos jours ?" rel="bookmark"><span class="thumbnail-resize"><span class="thumbnail-image"><img width="110" height="74" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20110%2074'%3E%3C/svg%3E" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" data-lazy-srcset="https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel.jpg.webp 1920w,https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel-300x203.jpg.webp 300w,https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel-768x518.jpg.webp 768w,https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel-1024x691.jpg.webp 1024w,https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel-295x202.jpg 295w" data-lazy-sizes="(max-width: 110px) 100vw, 110px" data-lazy-src="https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel.jpg.webp" /><noscript><img width="110" height="74" src="https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel.jpg.webp" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" srcset="https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel.jpg.webp 1920w,https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel-300x203.jpg.webp 300w,https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel-768x518.jpg.webp 768w,https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel-1024x691.jpg.webp 1024w,https://www.bordel-de-nerd.net/wp-content/uploads/Tableaux-Excel-295x202.jpg 295w" sizes="(max-width: 110px) 100vw, 110px" /></noscript></span></span><!-- thumbnail resize--></a></div><!-- post thumbnail--></div><div class="post-body"><h2 class="post-title entry-title is-size-6"><a class="post-title-link" href="https://www.bordel-de-nerd.net/pourquoi-est-il-important-de-maitriser-excel-de-nos-jours/" rel="bookmark" title="Pourquoi est-il important de maîtriser Excel de nos jours ?">Pourquoi est-il important de maîtriser Excel de nos jours ?</a></h2><!--#post title--><div class="post-meta-info post-meta-s"></div></div></article><article class="post-wrap post-list-4 clearfix"><div class="post-thumb-outer"><div class=" post-thumb is-image"><a href="https://www.bordel-de-nerd.net/les-logiciels-de-cfao-une-solution-performante/" title="Les logiciels de CFAO : une solution performante" rel="bookmark"><span class="thumbnail-resize"><span class="thumbnail-image"><img width="110" height="85" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20110%2085'%3E%3C/svg%3E" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" data-lazy-src="https://www.bordel-de-nerd.net/wp-content/uploads/CFAO-110x85.jpg.webp" /><noscript><img width="110" height="85" src="https://www.bordel-de-nerd.net/wp-content/uploads/CFAO-110x85.jpg.webp" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" /></noscript></span></span><!-- thumbnail resize--></a></div><!-- post thumbnail--></div><div class="post-body"><h2 class="post-title entry-title is-size-6"><a class="post-title-link" href="https://www.bordel-de-nerd.net/les-logiciels-de-cfao-une-solution-performante/" rel="bookmark" title="Les logiciels de CFAO : une solution performante">Les logiciels de CFAO : une solution performante</a></h2><!--#post title--><div class="post-meta-info post-meta-s"></div></div></article><article class="post-wrap post-list-4 clearfix"><div class="post-thumb-outer"><div class=" post-thumb is-image"><a href="https://www.bordel-de-nerd.net/quels-sont-les-avantages-de-lutilisation-dun-logiciel-calcul-escalier/" title="Quels sont les avantages de l’utilisation d’un logiciel calcul escalier ?" rel="bookmark"><span class="thumbnail-resize"><span class="thumbnail-image"><img width="110" height="85" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20110%2085'%3E%3C/svg%3E" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" data-lazy-src="https://www.bordel-de-nerd.net/wp-content/uploads/escalier-2-110x85.jpg.webp" /><noscript><img width="110" height="85" src="https://www.bordel-de-nerd.net/wp-content/uploads/escalier-2-110x85.jpg.webp" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" /></noscript></span></span><!-- thumbnail resize--></a></div><!-- post thumbnail--></div><div class="post-body"><h2 class="post-title entry-title is-size-6"><a class="post-title-link" href="https://www.bordel-de-nerd.net/quels-sont-les-avantages-de-lutilisation-dun-logiciel-calcul-escalier/" rel="bookmark" title="Quels sont les avantages de l’utilisation d’un logiciel calcul escalier ?">Quels sont les avantages de l’utilisation d’un logiciel calcul escalier ?</a></h2><!--#post title--><div class="post-meta-info post-meta-s"></div></div></article><article class="post-wrap post-list-4 clearfix"><div class="post-thumb-outer"><div class=" post-thumb is-image"><a href="https://www.bordel-de-nerd.net/les-meilleurs-convertisseurs-video-pour-votre-pc-et-une-utilisation-pratique/" title="Les meilleurs convertisseurs vidéo pour votre PC et une utilisation pratique" rel="bookmark"><span class="thumbnail-resize"><span class="thumbnail-image"><img width="110" height="85" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20110%2085'%3E%3C/svg%3E" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="Un homme regarde son ordinateur" decoding="async" data-lazy-src="https://www.bordel-de-nerd.net/wp-content/uploads/yoiipcrwhji-110x85.jpg.webp" /><noscript><img width="110" height="85" src="https://www.bordel-de-nerd.net/wp-content/uploads/yoiipcrwhji-110x85.jpg.webp" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="Un homme regarde son ordinateur" decoding="async" /></noscript></span></span><!-- thumbnail resize--></a></div><!-- post thumbnail--></div><div class="post-body"><h2 class="post-title entry-title is-size-6"><a class="post-title-link" href="https://www.bordel-de-nerd.net/les-meilleurs-convertisseurs-video-pour-votre-pc-et-une-utilisation-pratique/" rel="bookmark" title="Les meilleurs convertisseurs vidéo pour votre PC et une utilisation pratique">Les meilleurs convertisseurs vidéo pour votre PC et une utilisation pratique</a></h2><!--#post title--><div class="post-meta-info post-meta-s"></div></div></article></div><!-- #post widget inner --></div><!-- #post widget content wrap --></section><section id="bingo_ruby_sb_widget_post-2" class="widget sb-widget sb-widget-post"><div class="widget-title block-title"><h3>Derniers Articles </h3></div><div class="widget-content-wrap"><div class="post-widget-inner style-6"><div class="is-top-row"><article class="post-wrap post-overlay-4"><div class="post-thumb-outer"><div class="post-thumb-overlay"></div><div class="is-bg-thumb post-thumb is-image"><a href="https://www.bordel-de-nerd.net/balise-de-code-en-html-comment-lutiliser-et-la-balise-de-fermeture/" title="Balise de code en HTML : comment l’utiliser et la balise de fermeture ?" rel="bookmark"><span class="thumbnail-resize"><span class="thumbnail-image"><img width="540" height="370" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20540%20370'%3E%3C/svg%3E" class="attachment-bingo_ruby_crop_540x370 size-bingo_ruby_crop_540x370 wp-post-image" alt="" decoding="async" data-lazy-src="https://www.bordel-de-nerd.net/wp-content/uploads/generated_9221187252951220751-540x370.png" /><noscript><img width="540" height="370" src="https://www.bordel-de-nerd.net/wp-content/uploads/generated_9221187252951220751-540x370.png" class="attachment-bingo_ruby_crop_540x370 size-bingo_ruby_crop_540x370 wp-post-image" alt="" decoding="async" /></noscript></span></span><!-- thumbnail resize--></a></div><!-- post thumbnail--></div><div class="post-header-outer is-header-overlay is-absolute is-light-text"><div class="post-header"><h2 class="post-title entry-title is-size-5"><a class="post-title-link" href="https://www.bordel-de-nerd.net/balise-de-code-en-html-comment-lutiliser-et-la-balise-de-fermeture/" rel="bookmark" title="Balise de code en HTML : comment l’utiliser et la balise de fermeture ?">Balise de code en HTML : comment l’utiliser et la balise de fermeture ?</a></h2><!--#post title--></div><!-- post header--></div></article></div><div class="post-outer"><article class="post-wrap post-list-4 clearfix"><div class="post-thumb-outer"><div class=" post-thumb is-image"><a href="https://www.bordel-de-nerd.net/outils-no-code-definition-et-avantages-des-outils-sans-programmation/" title="Outils no-code : définition et avantages des outils sans programmation" rel="bookmark"><span class="thumbnail-resize"><span class="thumbnail-image"><img width="110" height="85" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20110%2085'%3E%3C/svg%3E" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" data-lazy-src="https://www.bordel-de-nerd.net/wp-content/uploads/generated_906492680128073055-110x85.png" /><noscript><img width="110" height="85" src="https://www.bordel-de-nerd.net/wp-content/uploads/generated_906492680128073055-110x85.png" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" /></noscript></span></span><!-- thumbnail resize--></a></div><!-- post thumbnail--></div><div class="post-body"><h2 class="post-title entry-title is-size-6"><a class="post-title-link" href="https://www.bordel-de-nerd.net/outils-no-code-definition-et-avantages-des-outils-sans-programmation/" rel="bookmark" title="Outils no-code : définition et avantages des outils sans programmation">Outils no-code : définition et avantages des outils sans programmation</a></h2><!--#post title--><div class="post-meta-info post-meta-s"></div></div></article></div><div class="post-outer"><article class="post-wrap post-list-4 clearfix"><div class="post-thumb-outer"><div class=" post-thumb is-image"><a href="https://www.bordel-de-nerd.net/preparer-son-audit-interne-les-etapes-cles-pour-reussir/" title="Préparer son audit interne : les étapes clés pour réussir !" rel="bookmark"><span class="thumbnail-resize"><span class="thumbnail-image"><img width="110" height="85" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20110%2085'%3E%3C/svg%3E" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" data-lazy-src="https://www.bordel-de-nerd.net/wp-content/uploads/generated_14015809824876786785-110x85.png" /><noscript><img width="110" height="85" src="https://www.bordel-de-nerd.net/wp-content/uploads/generated_14015809824876786785-110x85.png" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" /></noscript></span></span><!-- thumbnail resize--></a></div><!-- post thumbnail--></div><div class="post-body"><h2 class="post-title entry-title is-size-6"><a class="post-title-link" href="https://www.bordel-de-nerd.net/preparer-son-audit-interne-les-etapes-cles-pour-reussir/" rel="bookmark" title="Préparer son audit interne : les étapes clés pour réussir !">Préparer son audit interne : les étapes clés pour réussir !</a></h2><!--#post title--><div class="post-meta-info post-meta-s"></div></div></article></div><div class="post-outer"><article class="post-wrap post-list-4 clearfix"><div class="post-thumb-outer"><div class=" post-thumb is-image"><a href="https://www.bordel-de-nerd.net/outil-generation-de-leads-hubspot-efficace-pour-votre-prospection/" title="Outil génération de leads : HubSpot, efficace pour votre prospection ?" rel="bookmark"><span class="thumbnail-resize"><span class="thumbnail-image"><img width="110" height="85" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20110%2085'%3E%3C/svg%3E" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" data-lazy-src="https://www.bordel-de-nerd.net/wp-content/uploads/generated_11334241919140819400-110x85.png" /><noscript><img width="110" height="85" src="https://www.bordel-de-nerd.net/wp-content/uploads/generated_11334241919140819400-110x85.png" class="attachment-bingo_ruby_crop_110x85 size-bingo_ruby_crop_110x85 wp-post-image" alt="" decoding="async" /></noscript></span></span><!-- thumbnail resize--></a></div><!-- post thumbnail--></div><div class="post-body"><h2 class="post-title entry-title is-size-6"><a class="post-title-link" href="https://www.bordel-de-nerd.net/outil-generation-de-leads-hubspot-efficace-pour-votre-prospection/" rel="bookmark" title="Outil génération de leads : HubSpot, efficace pour votre prospection ?">Outil génération de leads : HubSpot, efficace pour votre prospection ?</a></h2><!--#post title--><div class="post-meta-info post-meta-s"></div></div></article></div></div><!-- #post widget inner --></div><!-- #post widget content wrap --></section></div></div></aside></div><!-- page content--></article><!-- single post--></div></div> <footer id="footer" class="footer-wrap" > <div class="footer-inner is-light-text"> <div class="bottom-footer-wrap"> <div class="ruby-container"> <div class="bottom-footer-inner"> <nav id="ruby-footer-navigation" class="footer-menu-wrap"> <div class="menu-footer-container"><ul id="footer-nav" class="footer-menu-inner"><li id="menu-item-141" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-141"><a href="https://www.bordel-de-nerd.net/mentions-legales/">Mentions légales</a></li> <li id="menu-item-142" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-142"><a href="https://www.bordel-de-nerd.net/contact/">Contact</a></li> <li id="menu-item-2047" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2047"><a href="https://www.bordel-de-nerd.net/sitemap/">Sitemap</a></li> </ul></div> </nav> </div> </div> </div> </div> </footer><!-- footer --> </div> </div> <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\/bingo-child\/*","\/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} </script> <script type="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 data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/plugins/bingo-ruby-core/assets/script.js?ver=1741938289" id="bingo_ruby_plugin_scripts-js" data-rocket-defer defer></script> <script type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/plugins/table-of-contents-plus/front.min.js?ver=2302" id="toc-front-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/v2/js/data.js?ver=1741938289" id="widget-logic_live_match_widget-js" data-rocket-defer defer></script> <script type="text/javascript" id="rocket_lazyload_css-js-extra"> /* <![CDATA[ */ var rocket_lazyload_css_data = {"threshold":"300"}; /* ]]> */ </script> <script type="text/javascript" id="rocket_lazyload_css-js-after"> /* <![CDATA[ */ !function o(n,c,a){function u(t,e){if(!c[t]){if(!n[t]){var r="function"==typeof require&&require;if(!e&&r)return r(t,!0);if(s)return s(t,!0);throw(e=new Error("Cannot find module '"+t+"'")).code="MODULE_NOT_FOUND",e}r=c[t]={exports:{}},n[t][0].call(r.exports,function(e){return u(n[t][1][e]||e)},r,r.exports,o,n,c,a)}return c[t].exports}for(var s="function"==typeof require&&require,e=0;e<a.length;e++)u(a[e]);return u}({1:[function(e,t,r){"use strict";{const c="undefined"==typeof rocket_pairs?[]:rocket_pairs,a=(("undefined"==typeof rocket_excluded_pairs?[]:rocket_excluded_pairs).map(t=>{var e=t.selector;document.querySelectorAll(e).forEach(e=>{e.setAttribute("data-rocket-lazy-bg-"+t.hash,"excluded")})}),document.querySelector("#wpr-lazyload-bg-container"));var o=rocket_lazyload_css_data.threshold||300;const u=new IntersectionObserver(e=>{e.forEach(t=>{t.isIntersecting&&c.filter(e=>t.target.matches(e.selector)).map(t=>{var e;t&&((e=document.createElement("style")).textContent=t.style,a.insertAdjacentElement("afterend",e),t.elements.forEach(e=>{u.unobserve(e),e.setAttribute("data-rocket-lazy-bg-"+t.hash,"loaded")}))})})},{rootMargin:o+"px"});function n(){0<(0<arguments.length&&void 0!==arguments[0]?arguments[0]:[]).length&&c.forEach(t=>{try{document.querySelectorAll(t.selector).forEach(e=>{"loaded"!==e.getAttribute("data-rocket-lazy-bg-"+t.hash)&&"excluded"!==e.getAttribute("data-rocket-lazy-bg-"+t.hash)&&(u.observe(e),(t.elements||=[]).push(e))})}catch(e){console.error(e)}})}n(),function(){const r=window.MutationObserver;return function(e,t){if(e&&1===e.nodeType)return(t=new r(t)).observe(e,{attributes:!0,childList:!0,subtree:!0}),t}}()(document.querySelector("body"),n)}},{}]},{},[1]); /* ]]> */ </script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-modernizr.js?ver=1741938289" id="modernizr-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-totop.js?ver=1741938289" id="uitotop-js" data-rocket-defer defer></script> <script type="text/javascript" src="https://www.bordel-de-nerd.net/wp-includes/js/imagesloaded.min.js?ver=5.0.0" id="imagesloaded-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-waypoints.js?ver=1741938289" id="waypoints-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-slick.js?ver=1741938289" id="slick-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-tipsy.js?ver=1741938289" id="tipsy-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-magnificpopup.js?ver=1741938289" id="magnific-popup-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-justified.js?ver=1741938289" id="justified-gallery-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-backstretch.js?ver=1741938289" id="backstretch-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-smoothscroll.js?ver=1741938289" id="smoothscroll-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-bootstrap.js?ver=1741938289" id="bootstrap-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-fitvids.js?ver=1741938289" id="fitvids-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-sticky.js?ver=1741938289" id="sticky-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/external/lib-rubysticky.js?ver=1741938289" id="ruby-sticky-js" data-rocket-defer defer></script> <script type="text/javascript" id="bingo_ruby_script_main-js-extra"> /* <![CDATA[ */ var bingo_ruby_to_top = "1"; var bingo_ruby_social_tooltip = "1"; var bingo_ruby_single_image_popup = "1"; /* ]]> */ </script> <script data-minify="1" type="text/javascript" src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/themes/bingo-child/assets/js/theme-script.js?ver=1741938289" id="bingo_ruby_script_main-js" data-rocket-defer defer></script> <script data-minify="1" type="text/javascript" defer src="https://www.bordel-de-nerd.net/wp-content/cache/min/1/wp-content/plugins/mailchimp-for-wp/assets/js/forms.js?ver=1741938289" id="mc4wp-forms-api-js"></script> <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://www.bordel-de-nerd.net/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_webp/ID/hqdefault.webp" alt="" width="480" height="360"><noscript><img src="https://i.ytimg.com/vi_webp/ID/hqdefault.webp" alt="" width="480" height="360"></noscript>',a='<button class="play" aria-label="play Youtube video"></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_webp/ID/hqdefault.webp'),(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><script>var rocket_beacon_data = {"ajax_url":"https:\/\/www.bordel-de-nerd.net\/wp-admin\/admin-ajax.php","nonce":"50c4220999","url":"https:\/\/www.bordel-de-nerd.net\/balise-de-code-en-html-comment-lutiliser-et-la-balise-de-fermeture","is_mobile":false,"width_threshold":1600,"height_threshold":700,"delay":500,"debug":null,"status":{"atf":true,"lrc":true},"elements":"img, video, picture, p, main, div, li, svg, section, header, span","lrc_threshold":1800}</script><script data-name="wpr-wpr-beacon" src='https://www.bordel-de-nerd.net/wp-content/plugins/wp-rocket/assets/js/wpr-beacon.min.js' async></script></body> </html> <!-- This website is like a Rocket, isn't it? Performance optimized by WP Rocket. Learn more: https://wp-rocket.me - Debug: cached@1746288121 -->