Hoe de HTML-broncode van een webpagina te bekijken

In alle internetbrowsers kunnen gebruikers de HTML-broncode bekijken van elke webpagina die ze bezoeken. De volgende secties bevatten informatie over de verschillende manieren om de broncode in elk van de belangrijkste browsers te bekijken. Om door te gaan, kiest u een item uit de onderstaande lijst en volgt u de instructies voor dat gedeelte.

Wanneer u de broncode van een webpagina bekijkt, is het belangrijk dat u onthoudt dat informatie en code die niet door de server worden verwerkt, niet zullen verschijnen. Bijna alle internetzoekmachines verwerken bijvoorbeeld informatie op een server en geven de resultaten vervolgens weer op een webpagina. Met andere woorden, u kunt de code bekijken die deel uitmaakt van de resultatenpagina, maar u kunt de broncode van de zoekmachine niet bekijken.

Deze regel is van toepassing op alle server-side scripts, SSI en programmacode. Daarom zullen functies, zoals zoekmachines, forums, polls, chat, enzovoort, hun code niet weergeven. Het kopiëren van de informatie uit de broncode kan fouten veroorzaken of u terugleiden naar de pagina van waaruit u de informatie hebt gekopieerd.

Microsoft Edge-gebruikers

Volg de onderstaande stappen om de broncode van een webpagina in Microsoft Edge te bekijken.

  1. Druk op Ctrl + U of F12 op het toetsenbord van uw computer.
  2. Selecteer het tabblad Elementen boven in het rechtervenster.

Of

Of

  1. Open Microsoft Edge en navigeer naar de webpagina van uw keuze.
  2. Klik op de Meer

    pictogram in de rechterbovenhoek van het scherm.
  3. Selecteer Developer Tools in het vervolgkeuzemenu dat verschijnt.
  4. Selecteer het tabblad Elementen boven in het rechtervenster.

Tip: in Microsoft Edge biedt de DOM-tool ook interactie met de broncode en CSS-instellingen, zodat gebruikers kunnen zien hoe wijzigingen in de code de webpagina onmiddellijk beïnvloeden.

Microsoft Internet Explorer-gebruikers

Volg de onderstaande stappen om de broncode van een webpagina in Microsoft Internet Explorer te bekijken.

  1. Druk op Ctrl + U of F12 op het toetsenbord van uw computer.
  2. Klik op het tabblad Foutopsporing boven aan het nieuwe menu.

Of

Of

  1. Open Internet Explorer en navigeer naar de webpagina van uw keuze.
  2. Druk op de Alt- toets om de menubalk van de browser te openen.
  3. Selecteer Weergave en vervolgens Bron in het vervolgkeuzemenu dat verschijnt.
  4. Klik op het tabblad Foutopsporing boven aan het nieuwe menu.

Tip: met de nieuwste versies van Internet Explorer wordt door het indrukken van de F12-toets de DOM-tool geopend. Deze tool biedt veel meer interactie met de broncode en CSS-instellingen, zodat gebruikers kunnen zien hoe wijzigingen in de code de webpagina onmiddellijk beïnvloeden.

Mozilla Firefox- en Netscape-gebruikers

Volg de onderstaande stappen om de broncode van een webpagina in Mozilla Firefox te bekijken.

  1. Druk op Ctrl + U op het toetsenbord van uw computer.

Of

Of

  1. Open Mozilla Firefox en navigeer naar de webpagina van uw keuze.
  2. Druk op de Alt- toets om de menubalk van de browser te openen.
  3. Selecteer Tools, Web Developer en vervolgens Page Source .

Tip: met de nieuwste versies van Firefox brengt het indrukken van de F12-toets of Ctrl + Shift + I de interactieve ontwikkelaarstool naar voren. Deze tool biedt veel meer interactie met de broncode en CSS-instellingen, zodat gebruikers kunnen zien hoe wijzigingen in de code de webpagina onmiddellijk beïnvloeden.

Bekijk een gedeelte van de broncode van de pagina

  1. Markeer het gedeelte van een webpagina waarvoor u de broncode wilt bekijken.
  2. Klik met de rechtermuisknop op dat gemarkeerde gedeelte en klik vervolgens op View Source .

Tip: gebruik de add-on Firebug om niet alleen de broncode van een pagina te bekijken, maar deze wijzigingen live te wijzigen en te bekijken via de browser.

Google Chrome-gebruikers

Volg de onderstaande stappen om de broncode van een webpagina in Google Chrome te bekijken.

  1. Druk op Ctrl + U op het toetsenbord van uw computer.

Of

Of

  1. Open Chrome en navigeer door de webpagina van uw keuze.
  2. Klik op Aanpassen en beheer Google Chrome

    pictogram in de rechterbovenhoek van het browservenster.
  3. Selecteer in het vervolgkeuzemenu dat wordt weergegeven Meer hulpmiddelen en vervolgens Ontwikkelaarstools .
  4. Klik op het tabblad Elementen boven aan het nieuwe gedeelte dat wordt weergegeven.

Tip: met de nieuwste versies van Chrome wordt de interactieve ontwikkelaarshulpmiddel weergegeven door op de F12-toets of Ctrl + Shift + I te drukken. Deze tool biedt veel meer interactie met de broncode en CSS-instellingen, zodat gebruikers kunnen zien hoe wijzigingen in de code de webpagina onmiddellijk beïnvloeden.

Apple Safari-gebruikers

Volg de onderstaande stappen om de broncode van een webpagina in Apple Safari te bekijken.

  1. Druk op Command + Option + U op je toetsenbord.

Of

Of

  1. Open de Safari-browser en navigeer naar de webpagina van uw keuze.
  2. Selecteer het menu Ontwikkelen .
  3. Kies de optie Toon paginabron .

Opera-gebruikers

Volg de onderstaande stappen om de broncode van een webpagina in Opera te bekijken.

  1. Druk op Ctrl + U op uw toetsenbord.

Of

Of

  1. Open Opera en navigeer naar de webpagina van uw keuze.
  2. Klik op de knop Menu

    in de linkerbovenhoek van het browservenster.
  3. Kies Pagina-bron in het submenu Ontwikkelaar .

Tip: als u het Ontwikkelaars- submenu niet ziet, kiest u Meer hulpmiddelen → Toon ontwikkelaar-menu . Klik vervolgens op de menuknop

nog een keer. Nu zou je het Ontwikkelaarsubmenu moeten zien.

Tip: met de nieuwste versies van Opera verschijnt de interactieve ontwikkelaarstool door op de sneltoetscombinatie Ctrl + Shift + I te drukken. Deze tool biedt veel meer interactie met de broncode en CSS-instellingen, zodat gebruikers kunnen zien hoe wijzigingen in de code de webpagina onmiddellijk beïnvloeden.

Android-telefoon met Chrome

  1. Open de Google Chrome-internetbrowser op uw telefoon.
  2. Open de webpagina waarvan u de broncode wilt bekijken.
  3. Tik één keer op de adresbalk en verplaats de cursor vervolgens naar de voorzijde van de URL.
  4. Typ view-source: en druk op Enter of Go .

Tip: als u bijvoorbeeld de code voor onze startpagina wilt weergeven, typt u view-source: //www.computerhope.com

Hoe de broncodepagina of -hulpmiddel te sluiten

Als u klaar bent met het bekijken van de broncode op een webpagina, wilt u deze wellicht afsluiten of sluiten. Het sluiten van de broncode is afhankelijk van de methode die u hebt gebruikt om deze te openen.

  • Als u de Ctrl + U-methode (behalve voor Edge) of de rechtermuisknopmethode hebt gebruikt, sluit u het nieuwe tabblad dat boven in uw browservenster is geopend.
  • Als u de ontwikkelaarsmethode hebt gebruikt (door op F12 of Ctrl + Shift + I te drukken), klikt u op

    in de rechterbovenhoek van het gereedschapsvenster .