Indhold
- Få adgang til udviklerværktøjer i Apples webbrowser
- Sådan aktiveres responsiv designtilstand i Safari
- Safari Developer Tools
Få adgang til udviklerværktøjer i Apples webbrowser
At sikre, at websteder og webapps understøtter et væld af enheder og platforme, er en vigtig opgave for webudviklere. Apples Safari-webbrowser inkluderer en responsiv designtilstand, der giver dig mulighed for at forhåndsvise, hvordan dit websted vil gengives ved forskellige skærmopløsninger og på forskellige iPad-, iPhone- og iPod touch-bygninger.
Instruktioner i denne artikel gælder for Safari 13 til macOS. Responsiv designtilstand er ikke tilgængelig i Windows-versionen.
Sådan aktiveres responsiv designtilstand i Safari
Sådan aktiveres Safari's udviklerværktøjer og tilstanden Responsive Design:
-
Vælg Safari > Indstillinger på Safari-værktøjslinjen.
Du kan også bruge tastaturgenvejen Kommando+Komma (,) for at få adgang til menuen Indstillinger.
-
I menuen Præferencer skal du vælge Fremskreden fane og marker afkrydsningsfeltet ved siden af Vis menuen Udvikl i menulinjen. En ny mulighed skulle nu være tilgængelig på Safari-værktøjslinjen øverst på skærmen.
-
Vælg Udvikle > Gå ind i responsiv designtilstand på Safari-værktøjslinjen.
Du kan også bruge tastaturgenvejen Mulighed+Kommando+R for at gå ind i Responsive Design Mode.
-
Den aktive webside skal nu vises i tilstanden Responsiv design. Vælg en iOS-enhed eller en skærmopløsning øverst på siden for at se, hvordan siden gengives.
Du kan også instruere Safari til at simulere forskellige brugeragenter ved hjælp af rullemenuen direkte over opløsningsikonerne.
Safari Developer Tools
Ud over tilstanden Responsiv design tilbyder Safari's Udvikl-menu mange andre nyttige muligheder, herunder:
- Åbn side med: Åbn den aktive webside i enhver anden browser, der aktuelt er installeret på din Mac.
- Bruger Agent: Ændring af brugeragent får webservere til at identificere din browser som noget andet end Safari.
- Tilslut webinspektør: Vis alle en webside's ressourcer inklusive CSS-information og DOM-metrics.
- Vis fejlkonsol: Vis JavaScript, HTML og XML fejl og advarsler.
- Vis sidekilde: Se og søg på den aktive webside's kildekode.
- Vis side-ressourcer: Vis dokumenter, scripts, CSS og andre ressourcer fra den aktuelle side.
- Vis Snippet Editor: Rediger og udfør fragmenter af kode. Denne funktion er meget nyttig ud fra et testperspektiv.
- Vis udvidelsesbygger: Lav dine egne Safari-udvidelser ved at pakke din kode i overensstemmelse hermed og tilføje metadata.
- Start tidslinjeoptagelse: Registrer netværksanmodninger, JavaScript-udførelse, gengivelse af sider og andre begivenheder i WebKit Inspector.
- Tomme cacher: Slet alle gemte cacher i Safari, ikke kun standard cache-filer på websitet.
- Deaktiver cache: Når cache er deaktiveret, downloades ressourcer fra et websted, hver gang der fremsendes en adgangsanmodning i modsætning til at bruge den lokale cache.
- Tillad JavaScript fra Smart Search Field: Deaktiveret som standard af sikkerhedsmæssige årsager, denne funktion giver dig mulighed for at indtaste webadresser, der indeholder JavaScript i Safaris adresselinje.
- Behandl SHA-1-certifikater som usikre: Short for Secure Hash Algorithm, SHA-1-hash-funktionen har vist sig at være mindre sikker end oprindeligt antaget, og dermed tilføjelsen af denne indstilling i Safari.
