Een Site In Verschillende Browsers Controleren

Inhoudsopgave:

Een Site In Verschillende Browsers Controleren
Een Site In Verschillende Browsers Controleren

Video: Een Site In Verschillende Browsers Controleren

Video: Een Site In Verschillende Browsers Controleren
Video: How To Test Your Website In Different Browsers and Mobile Devices - Google Chrome & Firefox DevTools 2024, Mei
Anonim

Een HTML-coder moet weten: een teken van professionaliteit is dezelfde weergave en werking van een sitepagina in elke browser, althans in de "grote drie", waaronder de browsers Internet Explorer, Opera, Mozilla Firefox. Het proces van het verifiëren van de juistheid van de siteweergave bestaat uit drie hoofdfasen.

webpagina's in verschillende browsers controleren
webpagina's in verschillende browsers controleren

Het is nodig

  • • Meerdere browsers geïnstalleerd op de computer.
  • • Aandacht.

instructies:

Stap 1

Fase één, voorbereidend

Het voorbereidingsproces bestaat uit het downloaden van de browserdistributiekit en het installeren op de computer. Elk installatieproces eindigt met de vraag: "maak deze browser standaard inbegrepen?". Dus de belangrijkste, of standaard inbegrepen, moet u degene maken die een tussenpositie inneemt in termen van de grootte van mogelijke "stijlen". Volgens de ervaring van vele generaties lay-outontwerpers is dit de Opera-browser.

Nadat u meerdere browsers op uw computer heeft geïnstalleerd, gaat u direct naar het vergelijkingsproces. Om dit te doen, plaatst u de muisaanwijzer op het bestand met de extensie.html, dat de basis zal zijn van de webpagina of de hele sjabloon, en klikt u erop met de rechtermuisknop. Selecteer in het tabblad dat wordt geopend "openen met" en selecteer vervolgens het gewenste type browser. Het bestand kan in meerdere browsers tegelijk worden geopend, waardoor ze geminimaliseerd blijven op de taakbalk van het bureaublad en indien nodig worden geopend.

Stap 2

Fase twee - visuele vergelijking

Visueel kunnen de pagina's van de site in de browser verschillen in drie hoofdparameters:

1. Door het aantal inspringingen en marges tussen pagina-elementen. IE is bijzonder geavanceerd in het berekenen van de werkelijke waarden van de opvul- en marge-eigenschappen.

2. Verschillende browsers geven lettertypen anders weer, zelfs standaardlettertypen zoals Arial en Times New Roman. Dit is het hardst getroffen voor menu-itemregels, die in twee regels kunnen worden weergegeven of volledig naar de tweede rij kunnen worden teruggetrokken.

3. Correctheid van het weergeven van afbeeldingen. In de eenvoudigste gevallen lezen sommige browsers, zoals Opera, de vspace- en hspase-eigenschappen die zijn gespecificeerd in de tagkenmerken niet

… Soms zijn afbeeldingen niet gecentreerd in tabelcellen als de attributen

deze voorwaarde is niet beschreven. Maar het grootste probleem voor de lay-outontwerper is het voorbereiden van het.png-beeldformaat. Het transparante kanaal in de code van dit bestand wordt door alle browsers op zijn eigen manier gelezen, vooral IE slaagt hierin. Daarom worden vaak lelijke grijze vlekken waargenomen in plaats van mooie doorschijnende afbeeldingen.

Fase drie - functionele controle

In dit stadium moet u de "drop-down" menu-items controleren. In hun werk mogen er geen schokken, vertragingen en vooral een sprong in de algemene inhoud van de pagina zijn bij het openen van afzonderlijke menu-items. Hetzelfde geldt voor de tekstelementen van de pagina, die volledig worden uitgevouwen wanneer u op de knop of het opschrift "meer details" klikt.

Tot slot zou ik willen zeggen dat de strijd om "compatibiliteit tussen browsers" - dit is de naam van de eigenschap van een pagina die overal op dezelfde manier moet worden weergegeven, het proces is complex en opwindend en vereist veel praktische ervaring.

Stap 3

Fase drie - functionele controle

In dit stadium moet u de "drop-down" menu-items controleren. In hun werk mogen er geen schokken, vertragingen en vooral een sprong in de algemene inhoud van de pagina zijn bij het openen van afzonderlijke menu-items. Hetzelfde geldt voor de tekstelementen van de pagina, die volledig worden uitgevouwen wanneer u op de knop of het opschrift "meer details" klikt.

Tot slot zou ik willen zeggen dat de strijd om "compatibiliteit tussen browsers" - dit is de naam van de eigenschap van een pagina die overal op dezelfde manier moet worden weergegeven, het proces is complex en opwindend en vereist veel praktische ervaring.

Aanbevolen: