nl.hideout-lastation.com
Paradijs Voor Ontwerpers En Ontwikkelaars


Test de mobiele vriendelijkheid van uw website met deze Google-tool

Het jaar 2016 maakte geschiedenis toen mobiel internetgebruik de desktop voor het eerst overtrof . Het moet overduidelijk zijn dat responsief webdesign niet kan worden genegeerd .

Maar alleen omdat u een responsieve lay-out maakt, betekent niet dat de gebruikerservaring geweldig zal zijn. U moet altijd rekening houden met de bruikbaarheid op verschillende apparaten en de totale laadtijd van de pagina .

Google publiceerde onlangs een gloednieuwe tool genaamd de mobiele website testen snelheidstool .

Met deze web-app kunt u elke website analyseren en een score behalen op basis van de gemiddelde laadtijd van de site en de totale responsieve ontwerpkenmerken.

U voert eenvoudig een domein in en laat het uitvoeren . Het testen kan enkele minuten duren, dus probeer geduldig te zijn.

Als het klaar is, ziet u drie scores van 0-100 :

  • Mobiele vriendelijkheid
  • Mobiele snelheid
  • Desktop snelheid

Ik weet niet precies hoe de snelheden voor mobiel en desktop worden berekend, maar ze lijken te verschillen .

Terwijl u door de pagina bladert, vindt u drie verschillende secties voor elke ranglijst.

U kunt op de knop "Meer informatie" klikken voor een modaal venster waarin de specifieke gebieden worden beschreven die in de lijst zijn aangevinkt.

De tester voor mobiele vriendelijkheid controleert bijvoorbeeld de viewport, lettergrootten / kleuren en de grootte van tappable targets zoals knoppen of links.

Dit is de voortgangscheck voor mobiele reactiviteit van Hongkiat.

Het is tamelijk gewoon om minder goede resultaten te behalen voor de snelheidstests (Hongkiat heeft Mashable zelfs verslagen!).

Deze beoordelingen kunnen door veel verschillende dingen worden veroorzaakt en u kunt Google een lijst met hun bevindingen en de mogelijke oplossingen rechtstreeks naar uw e-mail sturen.

Dit is een van de coolste nieuwe apps van Google en ik raad het absoluut aan als algemene testtool voor webontwikkelaars.

Merk op dat dit vergelijkbaar is met Google's twee andere tools voor PageSpeed ​​Insights en de mobielvriendelijke test .

Maar met hun nieuwe testtool voor mobiele sites, kunt u zowel de paginasnelheid als de mobiele-vriendelijkheid in dezelfde analyse controleren. Echt geweldige app en zeker de moeite waard om te bookmarken voor toekomstige referentie.

Een gebruikersinterface voor switches maken met CSS Mask

Een gebruikersinterface voor switches maken met CSS Mask

Bij beeldverwerking is maskeren een techniek waarmee u een afbeelding met een andere kunt verbergen . Een masker wordt gebruikt om een ​​deel van een afbeelding doorzichtig te maken . U kunt maskeren met behulp van CSS met behulp van maskeringseigenschappen.In de post van vandaag maken we een gemaskerde afbeelding met behulp van twee PNG-afbeeldingen en CSS-maskeringstechnieken, en stellen gebruikers in staat om de twee toestanden van de afbeelding ( dag en nacht ) te behandelen met behulp van een gebruikersinterface.Van

(Technische en ontwerptips)

Hoe een refactor CSS - een gids

Hoe een refactor CSS - een gids

CSS-refactoring moet een essentieel onderdeel zijn van de front-end ontwikkelingsworkflow, als we een beheersbare en geoptimaliseerde codebasis willen hebben. Wanneer we CSS refactoren, ruimen we onze bestaande code op en reorganiseren we deze zonder nieuwe functies toe te voegen of bugs te verhelpen

(Technische en ontwerptips)