De nombreuses technologies entrent dans la création de sites Web. Systèmes de gestion de contenu^{(Content management systems)} , frameworks , différents langages de script et de programmation^{(different scripting and programming languages)} , systèmes de paiement^{(payment systems)} …toutes sortes de choses !

Si vous êtes curieux de savoir comment fonctionne votre site Web préféré ou si vous voulez voir si un site utilise quelque chose de sommaire, cet article vous montrera plusieurs façons de regarder sous le capot et de voir comment il est construit.

Voir le code du site Web

Si vous n'êtes pas développeur ou que vous débutez, vous êtes sur le point d'apprendre le secret d'une meilleure programmation. Regardez le code des autres. Nous vous avons montré comment utiliser les outils de développement de Chrome^{(how to use Chrome’s Developer Tools)} pour y parvenir. 

ChromeDevTools vous aidera à afficher le code HTML^(HTML) , JavaScript et CSS d'un site , à découvrir les sources qu'il peut consommer et à vérifier les performances de chargement d'un site dans le navigateur. Tous les principaux navigateurs Web disposent d'une version des outils de développement.

Construit avec^(BuiltWith)

BuiltWith.com est une ressource de niveau professionnel qui approfondit les sites pour voir toutes les technologies qu'ils utilisent. Actuellement, ils couvrent plus de 673 millions de sites Web et plus encore. L'idée principale derrière le site était d'aider à générer des prospects pour les vendeurs de logiciels.

Les fonctionnalités avancées ne sont disponibles que via un abonnement payant, mais n'importe qui peut accéder à BuiltWith.com , entrer une adresse de site Web, un nom de technologie ou un mot-clé et obtenir un profil technologique détaillé. Créez^(Sign) un compte gratuit et vous pourrez effectuer cinq recherches détaillées par jour.

Rapport de site Netcraft^{(Netcraft Site Report)}

Netcraft est une ressource pour les développeurs Web depuis 1995. Leur expertise de plus de 25 ans se reflète dans l' outil gratuit Site Report de Netcraft. ^{(Site Report)}Il combine un rapport sur la technologie avec un rapport d'information « à qui appartient le site^{(who owns the site)} », de sorte que vous obtenez un aperçu complet du site. Vous saurez où il est hébergé et à qui il appartient, ainsi qu'un historique du domaine.

Le rapport de site Netcraft^{(Netcraft Site Report)} semble permettre des recherches illimitées. Néanmoins, utilisez-le uniquement lorsque vous en avez vraiment besoin. C'est une ressource gratuite et la communauté des développeurs aimerait qu'elle le reste.

Informations sur les sites de W3Techs^{(W3Techs’ Sites Info)}

L'outil d'informations sur les sites de W3Techs fonctionne un peu différemment des autres. Ils conservent une base de données^(database) d'informations, mais uniquement sur les sites qui ont déjà été recherchés via l'outil. Si vous vérifiez sur un site qui n'a pas été vérifié auparavant, il explorera le site instantanément. 

Le rapport fourni est moins approfondi que celui fourni par d'autres services, mais toujours perspicace. Vous obtiendrez le CMS , les langages de programmation, le serveur Web et le fournisseur d'hébergement qu'un site utilise. W3Techs fournit également des extensions de navigateur pour Firefox et Chrome afin que vous puissiez vérifier les sites d'un simple clic ou d'une pression.

Wappalyzer

Si vous préférez avoir un plugin de navigateur pour vérifier les technologies d'un site, Wappalyzer a des plugins pour Firefox , Chrome et Edge . Les plugins sont gratuits, faciles à utiliser et sont présentés dans un design facile à lire. Cliquer sur n'importe quelle technologie dans le rapport vous amènera à une explication de celle-ci, ce qui est formidable s'il trouve quelque chose que vous n'avez jamais vu auparavant. 

Wappalyzer offre une fonctionnalité unique avec la possibilité de créer une alerte pour un site Web. Ils vérifient le site quotidiennement et vous envoient un e-mail s'ils détectent un changement. L'alerte vous demandera de créer un compte gratuit avec Wappalyzer et coûtera 10 crédits par mois.

Mais vous obtenez 50 crédits gratuitement chaque mois et une alerte ne coûte que 10 crédits tous les 30 jours. Les alertes Wappalyzer sont donc gratuites si vous surveillez 5 sites ou moins.

Webspotteur^(Webspotter)

Tous les services de Webspotter sauf^(Webspotter) un sont payants, mais ce n'est pas grave. Leur extension gratuite Webspotter Chrome^{(Webspotter Chrome extension)} compense cela. L' extension Webspotter est similaire à Wappalyzer , mais elle possède quelques fonctionnalités différentes. À côté de chaque technologie répertoriée, il y a des liens vers des statistiques sur la technologie, une liste de sites Web utilisant cette technologie et le site Web officiel de la technologie. 

Une fonctionnalité encore plus intrigante est la capacité de Webspotter à extraire des contacts de messagerie, des liens de médias sociaux, des analyses^{(SEO analytics)} de référencement et d'autres informations sur l'entreprise d'un site Web. Bien que cela ne vous dise pas comment le site est fait, cela pourrait être utile à des fins de marketing en ligne ou même de recherche d'emploi.

Détecteur de thème WordPress^{(WordPress Theme Detector)}

Peut-être n'êtes-vous pas tellement intéressé par le développement Web, mais vous créez un site WordPress et souhaitez inclure des fonctionnalités que vous avez vues ailleurs. Téléchargez le plugin de navigateur WordPress Theme Detector Chrome^{(Download the WordPress Theme Detector Chrome browser plugin)} . 

Non seulement le détecteur de thème WordPress^{(WordPress Theme Detector)} vous dira quel thème WordPress^{(WordPress theme)} utilise un site, mais il vous dira également quels plugins WordPress^{(WordPress plugins)} il utilise. Il vous montre également qui a créé le thème ou le plugin et fournit un lien vers où vous pouvez les obtenir. Cela facilite l'intégration d'éléments dans votre site WordPress que vous avez admirés sur d'autres sites.

Apprenez comment fonctionnent les sites Web

Oui, il est aussi facile de plonger dans n'importe quel site Web sur Internet et de voir de quoi il est fait. Essayez d'utiliser deux ou plusieurs de ces outils, car certains capteront des choses que d'autres ne capteront pas. La plupart de ce que vous voyez sur un site est en fait rendu sur votre ordinateur. C'est ce qui le rend facile à regarder. C'est aussi la raison pour laquelle vous devez rendre votre site Web aussi sécurisé que possible^{(make your website as secure as possible)} . Profitez de votre plongée profonde et faites-nous savoir ce que vous trouvez ou construisez.

How Websites Work: Learn What’s Under the Hood

Many technologies go intо building websites. Content management systems, frameworks, different scripting and programming languages, payment systems…all sorts of things!

If you’re curious how your favorite website works, or want to see if a site is using something sketchy, this article will show you several ways to look under the hood and see how it’s built.

View the Website’s Code

If you’re not a developer, or just starting out, you’re about to learn the secret to better programming. Look at other people’s code. We’ve shown you how to use Chrome’s Developer Tools to do just that. 

ChromeDevTools will help you view a site’s HTML, JavaScript, and CSS code, find out what sources they may be consuming, as well as how to check a site’s loading performance in the browser. All major web browsers have some version of the developer’s tools available.

BuiltWith

BuiltWith.com is a professional-level resource that goes deep into sites to see all the technologies they use. Currently, they cover over 673 million websites and counting. The main idea behind the site was to help generate leads for people in software sales.

The advanced features are only available through a paid subscription, but anyone can go to BuiltWith.com, enter a website address, technology name, or keyword, and get a detailed technology profile. Sign up for a free account and you can do five detailed lookups a day.

Netcraft Site Report

Netcraft has been a resource for web developers since 1995. Their expertise over 25 years shows in Netcraft’s free Site Report tool. It combines a technology report with a “who owns the site” background report, so you get a thorough overview of the site. You’ll know where it’s hosted, and who owns it, plus some domain history.

The Netcraft Site Report appears to allow unlimited lookups. Still, use it only when you really need it. It’s a free resource and the developer community would like to see it stay that way.

W3Techs’ Sites Info

W3Techs’ Sites Info tool works a bit differently from the others. They keep a database of information, but only on sites that have already been searched through the tool. If you’re checking on a site that hasn’t been checked before, it will crawl the site instantly. 

The report provided is less in-depth than other services provide, but still insightful. You’ll get which CMS, programming languages, web server, and hosting provider a site uses. W3Techs also provide browser extensions for Firefox and Chrome so you can check sites with just a click or a tap.

Wappalyzer

If you prefer to have a browser plugin to check a site’s technologies, Wappalyzer has plugins for Firefox, Chrome, and Edge. The plugins are free, easy to use, and are laid out in an easy to read design. Clicking on any technology in the report will take you to an explanation of it, which is great if it finds something you haven’t seen before. 

Wappalyzer offers a unique feature with the ability to create an alert for a website. They check the site daily and email you if they detect a change. The alert will require you to create a free account with Wappalyzer and cost 10 credits per month.

But you get 50 credits for free every month and an alert only costs 10 credits for every 30 days. So Wappalyzer Alerts are basically free if you’re monitoring 5 or fewer sites.

Webspotter

All but one service of Webspotter is a paid service, but that’s okay. Their free Webspotter Chrome extension makes up for that. The Webspotter extension is similar to Wappalyzer, yet it has a few different features. Next to each technology listed, there are links to statistics about the technology, a list of websites using that tech, and the official website for the tech. 

An even more intriguing feature is Webspotter’s ability to pull email contacts, social media links, SEO analytics, and other company information out of a website. Although that doesn’t tell you about how the site is made, it could be useful for online marketing purposes or even job hunting.

WordPress Theme Detector

Maybe, you’re not so interested in web development but you’re putting together a WordPress site and would like to include features you’ve seen elsewhere. Download the WordPress Theme Detector Chrome browser plugin. 

Not only will the WordPress Theme Detector tell you what WordPress theme a site is using, but it’ll also tell you what WordPress plugins it’s using. It also shows you who created the theme or plugin and provides a link to where you can get them. That makes it so easy to incorporate elements into your WordPress site that you’ve admired on other sites.

Learn How Websites Work

Yes, it’s that easy to dive into any website on the Internet and see what it’s made of. Try using two or more of these tools, as some will pick up things that others don’t. Most of what you see on a site is actually rendered on your computer. That’s what makes it easy to look at. It’s also the reason why you need to make your website as secure as possible. Enjoy your deep diving and let us know what you find or build.

Related posts

• Quel est le meilleur service de conférence téléphonique - Les meilleures applications comparées

• Déplacer, supprimer ou copier automatiquement des fichiers dans Windows

• Comment vérifier si la température de votre CPU est trop élevée

• Les 5 meilleures applications de filtrage de la lumière bleue pour Windows, Mac et Linux

• Comment utiliser un gestionnaire de packages Windows pour installer des programmes Windows

• Extension de sécurité en ligne Avast : vaut-elle la peine d'être utilisée ?

• 7 façons d'ouvrir un fichier MDB sans Microsoft Access

• 5 applications portables que vous voulez absolument avoir sur votre clé USB

• Les 4 meilleures alternatives à Google Chromecast

• Choses à considérer avant de créer votre propre wiki

• Utilisez une ancienne webcam pour surveiller votre propriété gratuitement

• 11 meilleurs logiciels de capture d'écran gratuits pour Windows

• Comment bloquer des sites avec un logiciel de contrôle parental gratuit

• Qu'est-ce que Microsoft Power Automate et des modèles gratuits à télécharger

• 7 meilleurs outils de capture pour Chromebook

• Remplissage automatique de Google Chrome : un guide complet

• 5 meilleurs modules complémentaires de confidentialité de Firefox pour la sécurité en ligne

• Meilleurs programmes pour ajouter de nouvelles fonctionnalités à Windows 10

• Comment ripper vos DVD et Blu-Ray sans effort avec MakeMKV

• 5 astuces d'invite de commande pour rendre CMD plus intéressant