L’univers du développement web est jalonné de concepts majeurs, parmi lesquels les balises HTML tiennent une place prépondérante. Ces éléments de code sont les briques fondamentales qui structurent et donnent du sens aux pages web. Elles déterminent non seulement la hiérarchie de l’information mais aussi la manière dont le contenu est présenté aux utilisateurs. De la balise titre à l’élément de paragraphe, en passant par les liens hypertextes et les images, une maîtrise des balises HTML est indispensable pour tout aspirant développeur web. Aborder leur diversité et leur fonctionnement est donc essentiel pour édifier des sites internet robustes et accessibles.
Les bases du HTML et la structure d’une page web
Découvrez les fondements du Hypertext Markup Language (HTML), ce langage de balisage qui sert à écrire et organiser le contenu sur le web. Le document HTML débute par un ‘doctype html’ qui signale au navigateur la version du langage utilisée. La structure d’une page se déploie ensuite, ordonnée par des balises HTML qui dictent la disposition du contenu. Chaque balise a un rôle défini, servant à structurer les composants de la page, de l’en-tête au pied de page, en passant par les sections et les articles.
Lire également :
Les tendances actuelles dans le domaine des objets connectés pour une maison intelligente, une ville connectée et une santé connectée
Au cœur de cette architecture, les balises de premier niveau comme », » et » encadrent les informations essentielles et le contenu visible de la page. La balise » regroupe des éléments majeurs tels que les métadonnées, les liens vers les feuilles de style et les scripts. Au sein de », le contenu interactif prend forme, structuré par des balises sectionnantes et de texte. Ces éléments sont interdépendants : le HTML est composé de balises HTML qui, à leur tour, servent à la structure d’une page web.
La conception d’une page web efficace exige une compréhension claire de la fonction et de l’usage des diverses balises. Les balises d’en-tête comme ‘
‘, » ou » sont vitales pour le référencement et la liaison avec d’autres ressources les balises de structuration du texte, telles que ‘</p><p>
<strong><i>Lire également :</i></strong>
<a href="" title="Les tendances actuelles dans le domaine des objets connectés pour une maison intelligente, une ville connectée et une santé connectée">Les tendances actuelles dans le domaine des objets connectés pour une maison intelligente, une ville connectée et une santé connectée</a>
</p>
<h1>‘ pour les titres ou ‘</p>
<p>‘ pour les paragraphes, organisent le contenu de manière logique pour l’utilisateur et les moteurs de recherche. La relation symbiotique entre les <strong>balises HTML</strong> et la <strong>structure d’une page web</strong> reflète la complexité et la beauté inhérentes au développement web.</p>
<h2><span id="Les-principales-balises-HTML-et-leur-fonction">Les principales balises HTML et leur fonction</span></h2>
<p>Abordons les <strong>balises HTML</strong> qui constituent le squelette d’une page web. Les <strong>balises de premier niveau</strong> comme , et forment la structure de base. accueille des balises <strong>d’en-tête</strong> telles que , , , et <title>, essentielles pour définir le comportement et l’apparence de la page ainsi que son interaction avec les moteurs de recherche et les navigateurs. Le , quant à lui, englobe le contenu visible par l’internaute. </p>
<p>Poursuivez avec les <strong>balises de structuration du texte</strong> : </p>
<h1> pour les titres principaux, </p>
<p> pour les paragraphes, <strong> et <em> pour mettre en exergue ou accentuer des portions de texte. Ces éléments contribuent à une hiérarchisation claire, facilitant la lecture et l’indexation par les moteurs de recherche. Les <strong>balises de liste</strong>, </p>
<ul> pour les listes non ordonnées, </p>
<ol> pour celles ordonnées et </p>
<li> pour chaque élément de liste, organisent les informations en points clés ou en séquences numériques.
<p>Considérez les <strong>balises de tableau</strong> : </p>
<table> définit un tableau, </p>
<tr> une ligne, </p>
<th> une cellule d’en-tête et </p>
<td> une cellule standard. Ces balises permettent la présentation de données complexes de manière structurée et accessible. Les <strong>balises de formulaire</strong> comme , et <label> sont déterminantes pour la collecte d’informations et l’interaction utilisateur. </p>
<p>les <strong>balises sectionnantes</strong> telles que </p>
<header>, </p>
<footer>, </p>
<section>, </p>
<article> et </p>
<aside> aident à découper le contenu en sections logiques, améliorant ainsi la navigation et la compréhension de la structure de la page. Les <strong>balises génériques</strong> </p>
<div> et <span>, quant à elles, offrent une flexibilité supplémentaire pour le groupement et la mise en forme du contenu sans impliquer de signification sémantique spécifique. Ces éléments sont la toile sur laquelle les développeurs tissent l’expérience web, chaque balise jouant sa partition spécifique dans la symphonie du développement web.</p>
<h2><span id="Lrsquoimportance-des-balises-HTML-dans-le-developpement-web">L’importance des balises HTML dans le développement web</span></h2>
<p>Les <strong>balises HTML</strong> incarnent le fondement du développement web. Sans elles, impossible d’imaginer le moindre site internet. Chaque balise, précise et fonctionnelle, joue un rôle déterminant dans la <strong>structure d’une page web</strong>. Le HTML, ou Hypertext Markup Language, n’est pas qu’un simple langage de programmation ; c’est le tissu conjonctif qui relie les éléments entre eux, permettant la création de contenus dynamiques et interactifs. </p>
<p>Dans cette architecture numérique, les <strong>balises de premier niveau</strong> comme , et définissent le canevas de base sur lequel s’articulent toutes les autres balises. Ce sont les fondations qui soutiennent l’édifice complexe du contenu web. Leur présence est non négociable, chaque document HTML débutant par une déclaration de type de document pour s’assurer de sa compatibilité avec les navigateurs. </p>
<p>Les <strong>balises d’en-tête</strong>, telles que , , , et <title>, influencent directement l’optimisation pour les moteurs de recherche. Elles orientent le référencement, affectent la charge des ressources et déterminent le comportement de la page. Leur configuration astucieuse est un levier puissant pour améliorer la visibilité en ligne et l’expérience utilisateur. </p>
<p>Les <strong>balises de structuration du texte</strong> et les <strong>balises sectionnantes</strong>, par exemple </p>
<h1>, </p>
<p>, </p>
<header> ou </p>
<footer>, ne sont pas en reste. Elles structurent l’information, lui donnent du sens et guident l’internaute dans sa navigation. De manière similaire, les <strong>balises de liste</strong> et les <strong>balises de tableau</strong> organisent les données, les rendant plus digestes et accessibles. Ces balises, par leur simplicité d’emploi et leur impact direct sur la mise en page, sont indispensables pour les développeurs soucieux de construire des sites web clairs et efficaces.</p>
<h2><span id="Comment-utiliser-les-balises-HTML-dans-la-pratique">Comment utiliser les balises HTML dans la pratique</span></h2>
<p>Entrons dans le vif du sujet : la mise en pratique des <strong>balises HTML</strong> dans la rédaction web. Une bonne maîtrise des balises génériques s’avère essentielle. Prenons </p>
<div> et <span>, des balises omniprésentes qui agissent comme des conteneurs pour d’autres éléments ou pour appliquer des styles spécifiques. Leur force réside dans leur flexibilité et leur capacité à s’intégrer harmonieusement au sein de la structure d’une page web. </p>
<p>Focus sur les <strong>attributs des balises</strong> qui, bien employés, décuplent l’efficacité du code. Les attributs ‘class’ et ‘id’, par exemple, sont majeurs pour identifier des éléments au sein du CSS et du JavaScript, permettant une personnalisation et une manipulation précises. L’attribut ‘style’, quant à lui, insère des règles CSS directement dans une balise, bien que son usage soit à limiter en faveur de feuilles de style externes pour une meilleure maintenance du code. </p>
<p>Abordons les <strong>balises spécifiques</strong> comme <img> et <a>, qui requièrent des attributs tels que ‘src’ pour les images et ‘href’ pour les liens. L’attribut ‘alt’, indispensable pour les images, fournit une description textuelle qui améliore l’accessibilité et le référencement. Ces balises enrichissent le contenu en y intégrant des ressources externes et en facilitant la navigation. </p>
<p>La précision dans l’utilisation des <strong>balises de formulaire</strong> est capitale pour recueillir des informations utilisateur. définit le début et la fin d’un formulaire, tandis que les balises , <textarea> et <button> déclinent les divers champs interactifs. Leur association avec les attributs ‘name’ et ‘type’ garantit leur bon fonctionnement et une collecte de données structurée. </p>
<p>Maîtrisez ces éléments, et le langage HTML n’aura plus de secrets pour vous. Le développement de sites web élégants, fonctionnels et optimisés s’offre alors à ceux qui savent jongler avec les balises et leurs attributs.</p>
</div><!-- .post-content -->
</div>
</div>
<div class="post-share">
<span class="text">Partager.</span>
<span class="share-links">
<a href="http://twitter.com/home?status=https%3A%2F%2Fasknerd.net%2Fcomprendre-les-balises-html-types-essentiels-et-leur-utilisation%2F" class="fa fa-twitter" title="Tweet It" target="_blank">
<span class="visuallyhidden">Twitter</span></a>
<a href="http://www.facebook.com/sharer.php?u=https%3A%2F%2Fasknerd.net%2Fcomprendre-les-balises-html-types-essentiels-et-leur-utilisation%2F" class="fa fa-facebook" title="Share on Facebook" target="_blank">
<span class="visuallyhidden">Facebook</span></a>
<a href="http://plus.google.com/share?url=https%3A%2F%2Fasknerd.net%2Fcomprendre-les-balises-html-types-essentiels-et-leur-utilisation%2F" class="fa fa-google-plus" title="Share on Google+" target="_blank">
<span class="visuallyhidden">Google+</span></a>
<a href="http://pinterest.com/pin/create/button/?url=https%3A%2F%2Fasknerd.net%2Fcomprendre-les-balises-html-types-essentiels-et-leur-utilisation%2F&media=https%3A%2F%2Fasknerd.net%2Fwp-content%2Fuploads%2Fa61bbca5-642c-45c3-ba0d-913ecca8da6b-1.png" class="fa fa-pinterest"
title="Share on Pinterest" target="_blank">
<span class="visuallyhidden">Pinterest</span></a>
<a href="http://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fasknerd.net%2Fcomprendre-les-balises-html-types-essentiels-et-leur-utilisation%2F" class="fa fa-linkedin" title="Share on LinkedIn" target="_blank">
<span class="visuallyhidden">LinkedIn</span></a>
<a href="http://www.tumblr.com/share/link?url=https%3A%2F%2Fasknerd.net%2Fcomprendre-les-balises-html-types-essentiels-et-leur-utilisation%2F&name=Comprendre+les+balises+HTML+%3A+types+essentiels+et+leur+utilisation" class="fa fa-tumblr"
title="Share on Tumblr" target="_blank">
<span class="visuallyhidden">Tumblr</span></a>
<a href="mailto:?subject=Comprendre%20les%20balises%20HTML%20%3A%20types%20essentiels%20et%20leur%20utilisation&body=https%3A%2F%2Fasknerd.net%2Fcomprendre-les-balises-html-types-essentiels-et-leur-utilisation%2F" class="fa fa-envelope-o"
title="Share via Email">
<span class="visuallyhidden">Email</span></a>
</span>
</div>
</article>
<section class="navigate-posts">
<div class="previous"><span class="main-color title"><i class="fa fa-chevron-left"></i> Article précédent</span><span class="link"><a href="https://asknerd.net/les-secrets-du-reveil-connecte-pour-optimiser-votre-routine-matinale/" rel="prev">Les secrets du réveil connecté pour optimiser votre routine matinale</a></span> </div>
<div class="next"><span class="main-color title">Article suivant <i class="fa fa-chevron-right"></i></span><span class="link"><a href="https://asknerd.net/vitesse-de-processeur-ideale-criteres-pour-performances-pc-optimales/" rel="next">Vitesse de processeur idéale : critères pour performances PC optimales</a></span> </div>
</section>
</div>
<aside class="col-4 sidebar">
<div class="">
<ul>
<li id="search-2" class="widget widget_search"><form role="search" method="get" class="search-form" action="https://asknerd.net/">
<label>
<span class="screen-reader-text">Rechercher :</span>
<input type="search" class="search-field" placeholder="Rechercher…" value="" name="s" />
</label>
<input type="submit" class="search-submit" value="Rechercher" />
</form></li>
<li id="categories-2" class="widget widget_categories"><div class="widgettitle">Catégories</div>
<ul>
<li class="cat-item cat-item-3"><a href="https://asknerd.net/bureautique/">Bureautique</a>
</li>
<li class="cat-item cat-item-4"><a href="https://asknerd.net/high-tech/">Hardware</a>
</li>
<li class="cat-item cat-item-5"><a href="https://asknerd.net/informatique/">Informatique</a>
</li>
<li class="cat-item cat-item-6"><a href="https://asknerd.net/marketing/">Marketing</a>
</li>
<li class="cat-item cat-item-1"><a href="https://asknerd.net/actu/">News</a>
</li>
<li class="cat-item cat-item-7"><a href="https://asknerd.net/securite/">Sécurité</a>
</li>
<li class="cat-item cat-item-8"><a href="https://asknerd.net/seo/">SEO</a>
</li>
<li class="cat-item cat-item-9"><a href="https://asknerd.net/web/">Web</a>
</li>
</ul>
</li>
<li id="media_image-2" class="widget widget_media_image"><img width="400" height="267" src="https://asknerd.net/wp-content/uploads/Image1.jpg" class="image wp-image-229 attachment-full size-full" alt="" style="max-width: 100%; height: auto;" decoding="async" loading="lazy" srcset="https://asknerd.net/wp-content/uploads/Image1.jpg 400w, https://asknerd.net/wp-content/uploads/Image1-300x200.jpg 300w" sizes="(max-width: 400px) 100vw, 400px" /></li>
<li id="bunyad-latest-posts-widget-2" class="widget latest-posts">
<div class="widgettitle">Articles récents</div>
<ul class="posts-list">
<li>
<a href="https://asknerd.net/streamonsport-nouvelle-adresse-en-juin-2023-pour-les-fans-de-sport/"><img width="110" height="96" src="https://asknerd.net/wp-content/uploads/c9a065ed-66aa-4f0e-9d25-1086c72b408c-110x96.png" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" title="Streamonsport : nouvelle adresse en juin 2023 pour les fans de sport" decoding="async" />
</a>
<div class="content">
<div class="cf listing-meta meta above">
<time datetime="2024-04-09T05:10:00+02:00" class="meta-item">avril 9, 2024</time>
</div>
<a href="https://asknerd.net/streamonsport-nouvelle-adresse-en-juin-2023-pour-les-fans-de-sport/" title="Streamonsport : nouvelle adresse en juin 2023 pour les fans de sport">
Streamonsport : nouvelle adresse en juin 2023 pour les fans de sport</a>
</div>
</li>
<li>
<a href="https://asknerd.net/reram-linnovation-qui-transforme-lindustrie-informatique/"><img width="110" height="96" src="https://asknerd.net/wp-content/uploads/37e5271b-c378-49d7-9a05-a5ddd01addbe-110x96.png" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" title="ReRAM : l’innovation qui transforme l’industrie informatique" decoding="async" />
</a>
<div class="content">
<div class="cf listing-meta meta above">
<time datetime="2024-04-03T01:35:00+02:00" class="meta-item">avril 3, 2024</time>
</div>
<a href="https://asknerd.net/reram-linnovation-qui-transforme-lindustrie-informatique/" title="ReRAM : l’innovation qui transforme l’industrie informatique">
ReRAM : l’innovation qui transforme l’industrie informatique</a>
</div>
</li>
<li>
<a href="https://asknerd.net/appeler-un-contact-bloque-est-ce-possible-et-comment-proceder/"><img width="110" height="96" src="https://asknerd.net/wp-content/uploads/13271082-f3f9-48ed-a182-db45f626f9cf-110x96.png" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" title="Appeler un contact bloqué : est-ce possible et comment procéder ?" decoding="async" loading="lazy" />
</a>
<div class="content">
<div class="cf listing-meta meta above">
<time datetime="2024-03-31T01:35:00+01:00" class="meta-item">mars 31, 2024</time>
</div>
<a href="https://asknerd.net/appeler-un-contact-bloque-est-ce-possible-et-comment-proceder/" title="Appeler un contact bloqué : est-ce possible et comment procéder ?">
Appeler un contact bloqué : est-ce possible et comment procéder ?</a>
</div>
</li>
<li>
<a href="https://asknerd.net/comprendre-lutilite-des-detecteurs-dia-dans-la-cybersecurite-moderne/"><img width="110" height="96" src="https://asknerd.net/wp-content/uploads/eaa22fc2-639b-4d7f-b363-56e406f2fbde-110x96.png" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" title="Comprendre l’utilité des détecteurs d’IA dans la cybersécurité moderne" decoding="async" loading="lazy" />
</a>
<div class="content">
<div class="cf listing-meta meta above">
<time datetime="2024-03-29T05:10:00+01:00" class="meta-item">mars 29, 2024</time>
</div>
<a href="https://asknerd.net/comprendre-lutilite-des-detecteurs-dia-dans-la-cybersecurite-moderne/" title="Comprendre l’utilité des détecteurs d’IA dans la cybersécurité moderne">
Comprendre l’utilité des détecteurs d’IA dans la cybersécurité moderne</a>
</div>
</li>
<li>
<a href="https://asknerd.net/protection-des-donnees-personnelles-quelles-autorites-en-france/"><img width="110" height="96" src="https://asknerd.net/wp-content/uploads/f5328604-48e5-4276-a4e2-2536142927e9-110x96.png" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" title="Protection des données personnelles : quelles autorités en France ?" decoding="async" loading="lazy" />
</a>
<div class="content">
<div class="cf listing-meta meta above">
<time datetime="2024-03-27T01:35:00+01:00" class="meta-item">mars 27, 2024</time>
</div>
<a href="https://asknerd.net/protection-des-donnees-personnelles-quelles-autorites-en-france/" title="Protection des données personnelles : quelles autorités en France ?">
Protection des données personnelles : quelles autorités en France ?</a>
</div>
</li>
</ul>
</li>
</ul>
</div>
</aside>
</div> <!-- .row -->
</div> <!-- .main -->
<footer class="main-footer">
<div class="wrap">
<ul class="widgets row cf">
<li class="widget col-4 widget_text"> <div class="textwidget"><p>asknerd.net © 2023</p>
</div>
</li> </ul>
</div>
<div class="lower-foot">
<div class="wrap">
<div class="widgets">
<div class="menu-footer-container"><ul id="menu-footer" class="menu"><li id="menu-item-1193" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1193"><a href="https://asknerd.net/contact/">Contact</a></li>
<li id="menu-item-1194" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1194"><a href="https://asknerd.net/mentions-legales/">Mentions Légales</a></li>
<li id="menu-item-1195" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1195"><a href="https://asknerd.net/sitemap/">Sitemap</a></li>
</ul></div> </div>
</div>
</div>
</footer>
</div> <!-- .main-wrap -->
<script type="application/ld+json">{"@context":"http:\/\/schema.org","@type":"Article","headline":"Comprendre les balises HTML : types essentiels et leur utilisation","url":"https:\/\/asknerd.net\/comprendre-les-balises-html-types-essentiels-et-leur-utilisation\/","image":{"@type":"ImageObject","url":"https:\/\/asknerd.net\/wp-content\/uploads\/a61bbca5-642c-45c3-ba0d-913ecca8da6b-1-702x336.png","width":702,"height":336},"datePublished":"2024-02-28T01:35:00+01:00","dateModified":"2024-03-07T12:58:54+01:00","author":{"@type":"Person","name":"Watson"},"publisher":{"@type":"Organization","name":"Ask Nerd","logo":{"@type":"ImageObject","url":"https:\/\/asknerd.net\/wp-content\/uploads\/asknerd.net_.png"}},"mainEntityOfPage":{"@type":"WebPage","@id":"https:\/\/asknerd.net\/comprendre-les-balises-html-types-essentiels-et-leur-utilisation\/"}}</script>
<script type="text/javascript" src="https://asknerd.net/wp-content/plugins/table-of-contents-plus/front.min.js?ver=2302" id="toc-front-js" defer></script>
<script 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}();
/* ]]> */
</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:\/\/asknerd.net","onHoverDelay":"100","rateThrottle":"3"};
/* ]]> */
</script>
<script 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();
}());
/* ]]> */
</script>
<script type="text/javascript" id="bunyad-theme-js-extra">
/* <![CDATA[ */
var Bunyad = {"ajaxurl":"https:\/\/asknerd.net\/wp-admin\/admin-ajax.php"};
/* ]]> */
</script>
<script data-minify="1" type="text/javascript" src="https://asknerd.net/wp-content/cache/min/1/wp-content/themes/smart-mag-child/js/bunyad-theme.js?ver=1712678412" id="bunyad-theme-js" defer></script>
<script type="text/javascript" src="https://asknerd.net/wp-content/themes/smart-mag-child/js/jquery.flexslider-min.js?ver=3.1.0" id="flex-slider-js" defer></script>
<script type="text/javascript" src="https://asknerd.net/wp-content/themes/smart-mag-child/js/jquery.sticky-sidebar.min.js?ver=3.1.0" id="sticky-sidebar-js" defer></script>
<script type="text/javascript">
var sc_project=11969566;
var sc_invisible=1;
var sc_security="edc77dcc";
</script>
<script type="text/javascript"
src="https://www.statcounter.com/counter/counter.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@1714262049 --> 
