Ce qu'il faut savoir
- Faites un clic droit sur la page Web et choisissez Afficher la source de la page .
- Raccourci : Appuyez sur Ctrl + DANS (PC Windows) ou Commande + Option + DANS (Mac).
- Pour utiliser les outils de développement de Chrome, sélectionnez Menu (trois points) > Plus d'outils > Outils de développement .
Cet article explique comment accéder au code source HTML d'un site Web dans le navigateur Web Google Chrome, ainsi qu'accéder et utiliser les outils de développement de Chrome. Afficher le code source d'un site est un excellent moyen pour les débutants d'apprendre le HTML.
Afficher le code source dans Chrome
Alors, comment visualiser le code source d’un site Web ? Voici les instructions étape par étape pour le faire à l'aide du navigateur Google Chrome.
-
Ouvrez le Navigateur Web Google Chrome (si vous n'avez pas Google Chrome installé , C'est un téléchargement gratuit).
-
Accédez au page Web que vous aimeriez examiner .
-
Clic-droit la page et regardez le menu qui apparaît. Dans ce menu, cliquez sur Afficher la source de la page .
-
Le code source de cette page apparaîtra désormais sous la forme d'un nouvel onglet dans le navigateur.
-
Alternativement, vous pouvez également utiliser les raccourcis clavier de Ctrl + DANS sur un PC pour ouvrir une fenêtre avec le code source d'un site affiché. Sur un Mac, ce raccourci est Commande + Option + DANS .
Hilary Allison / Lifewire
cómo enviar un snapchat sin que ellos lo sepan
Utilisez les outils de développement de Chrome
En plus du simpleAfficher la source de la pagecapacité qu'offre Google Chrome, vous pouvez également profiter de leur excellent Outils de développement pour creuser encore plus profondément dans un site. Ces outils vous permettront non seulement de voir le HTML, mais également le CSS qui s'applique aux éléments d'affichage de ce document HTML.
Pour utiliser les outils de développement de Chrome :
-
Ouvrir Google Chrome .
-
Aller vers la page Web que vous souhaitez examiner .
-
Sélectionnez le menu à trois points dans le coin supérieur droit de la fenêtre du navigateur.
-
Dans le menu, survolez Plus d'outils puis choisissez Outils de développement dans le menu qui apparaît.
-
Une fenêtre s'ouvrira affichant le code source HTML à gauche du volet et le CSS associé à droite.
-
Alternativement, si vous faites un clic droit un élément dans une page Web et sélectionnez Inspecter dans le menu qui apparaît, les outils de développement de Chrome apparaîtront et mettront en évidence la partie spécifique que vous avez choisie dans le HTML avec le CSS correspondant affiché à droite. C'est très utile si vous souhaitez en savoir plus sur un élément particulier d'un site.
cómo sacar a la gente de tu hulu
La visualisation du code source est-elle légale ?
Au fil des années, de nombreux nouveaux concepteurs de sites Web se sont demandés s'il était acceptable de consulter le code source d'un site et de l'utiliser pour leur formation et, en fin de compte, pour leur travail. Bien que copier le code d'un site en gros et le faire passer pour le vôtre sur un site Web ne soit certainement pas acceptable, utiliser ce code comme tremplin pour tirer des leçons est en fait le nombre de progrès réalisés dans ce secteur.
cómo instalar mods para minecraft windows 10
Comme nous l'avons mentionné au début de cet article, vous auriez du mal à trouver aujourd'hui un professionnel du Web qui n'a pas appris quelque chose en consultant les sources d'un site ! Oui, voir le code source d’un site est légal. Utiliser ce code comme ressource pour créer quelque chose de similaire est également sûr. Prendre le code tel quel et le faire passer pour votre travail est le point où vous commencez à rencontrer des problèmes.
En fin de compte, les professionnels du Web apprennent les uns des autres et améliorent souvent le travail qu'ils voient et qui s'en inspirent. N'hésitez donc pas à consulter le code source d'un site et à l'utiliser comme outil d'apprentissage.
Plus que du HTML
Une chose à retenir est que les fichiers sources peuvent être très compliqués (et plus le site Web que vous consultez est complexe, plus le code de ce site est susceptible de l'être). En plus de la structure HTML qui compose la page, il y aura également des CSS (feuilles de style en cascade) qui dicteront l'apparence visuelle de ce site. De plus, de nombreux sites Web incluent aujourd'hui des fichiers de script avec le code HTML.
Il est probable que plusieurs fichiers de script soient inclus ; en fait, chacun alimente différents aspects du site. Franchement, le code source d'un site peut sembler écrasant, surtout si vous débutez dans ce domaine. Ne soyez pas frustré si vous ne parvenez pas à comprendre immédiatement ce qui se passe sur ce site. La visualisation de la source HTML n'est que la première étape de ce processus. Avec un peu d'expérience, vous commencerez à mieux comprendre comment tous ces éléments s'assemblent pour créer le site Web que vous voyez dans votre navigateur. Au fur et à mesure que vous vous familiariserez avec le code, vous pourrez en apprendre davantage, et cela ne vous semblera pas si intimidant.
FAQ- Comment modifier le code HTML dans Chrome ?
Ouvrez les outils de développement dans Chrome en appuyant sur Ctrl (ou Commande sur un Mac) + Maj + I . De là, appuyez sur Ctrl ( Commande sur Mac) + O et sélectionnez le fichier source enregistré que vous souhaitez modifier pour l'ouvrir.
- Comment afficher le code source de la page dans Chrome si Afficher la source est désactivé ?
Si un site Web a désactivé l'option Afficher la source, vous pourrez peut-être toujours jeter un œil sous le capot. En haut de la fenêtre du navigateur, sélectionnez Voir > Développeur > Voir la source , qui devrait extraire le code source de la page Web.
- Comment afficher le code source d'un site dans Chrome à l'aide de mon appareil Android ?
Accédez au site Web que vous souhaitez consulter à l'aide de l'application Chrome de votre appareil, puis sélectionnez la barre d'adresse du navigateur. Déplacez le curseur de texte à l'extrême gauche, devant l'URL, et tapez voir la source , puis appuyez Entrer ou sélectionnez Aller .