Wanneer u met de rechtermuisknop op een webpagina in Safari op Mac klikt, worden de knoppen Paginabron weergeven en Element inspecteren niet weergegeven. Om deze te zien, moet u het menu Ontwikkelen inschakelen. We laten u zien hoe u dat doet.
Nadat u het menu Ontwikkelen heeft ingeschakeld, klikt u met de rechtermuisknop op een lege ruimte op een website om de knoppen Element inspecteren en Paginabron weergeven te openen. Hiermee kunt u de broncode van elke website bekijken, wat handig is voor zaken als het downloaden van afbeeldingen van websites en het debuggen van code of om erachter te komen hoe het eruit ziet achter een site (voor website-ontwerpers).
Hoe het ontwikkelmenu in Safari op Mac te activeren
U kunt het menu Ontwikkelen in Safari eenvoudig inschakelen door een aantal stappen te volgen. Open Safari op uw Mac en klik op de knop “Safari” in de menubalk.
Selecteer vervolgens ‘Voorkeuren’. U kunt ook de sneltoets Command +, (komma) gebruiken. Hierdoor worden ook Safari-voorkeuren geopend.
Ga naar het tabblad “Geavanceerd”.
Vink het vakje aan voor ‘Toon ontwikkelmenu in menubalk’.
Nu verschijnt het menu Ontwikkelen bovenaan tussen Bladwijzers en Venster.
Behalve dat u de paginabron kunt bekijken, krijgt u hiermee toegang tot op ontwikkelaars gerichte functies, zoals het uitschakelen van JavaScript op elke website.
Paginabron bekijken in Safari op Mac
Nadat u het menu Ontwikkelen heeft ingeschakeld, zijn er een aantal manieren om de paginabron in Safari te bekijken.
Open een website in Safari en klik met de rechtermuisknop op de lege ruimte op de pagina. Selecteer nu ‘Paginabron weergeven’. U kunt dit menu ook openen met de sneltoets Option + Command + u.
Als u op een webpagina naar afbeeldingen of andere media-elementen zoekt, kunt u deze in Safari gemakkelijk vinden. In het linkerdeelvenster ziet u verschillende mappen, zoals afbeeldingen, lettertypen, enz. Klik op de map “Afbeeldingen” om snel de foto’s te vinden die u nodig hebt.
Nadat u een afbeelding hebt geselecteerd, kunt u de details gemakkelijk bekijken door de zijbalk met details te openen. De knop om deze te openen bevindt zich rechtsboven in de console, net onder het tandwielpictogram. U kunt dit ook openen met de sneltoets Option + Command + 0.
Klik op “Bron” bovenaan de detailzijbalk om details te zien, zoals de grootte van de afbeelding en de volledige URL.
U kunt de positie van de paginabronconsole ook gemakkelijk wijzigen. Er zijn twee knoppen linksboven op deze console, direct naast de X-knop. Klik op het rechthoekige pictogram om de console naar een andere kant in het browservenster te verplaatsen.
Als u de paginabronconsole in een apart venster wilt openen, klikt u op het pictogram met twee rechthoeken. Hierdoor wordt de console losgemaakt en in een apart venster geopend.
Als u de code voor een specifiek element op de pagina wilt bekijken, klikt u met de rechtermuisknop op dat element en selecteert u ‘Element inspecteren’. Dit brengt je rechtstreeks naar de code voor het element dat je hebt geselecteerd.
Wanneer u klaar bent met het bekijken van de code, klikt u op de X-knop om de paginabronconsole te sluiten en terug te keren naar browsen in Safari. U kunt hier ook bekijken hoe u de paginabron van een website in Google Chrome kunt bekijken.
VERWANT: Hoe de HTML-bron in Google Chrome te bekijken