Hur man förminskar HTML, CSS och JavaScript med Autoptimera plugin

04.06.2020
HUR 'Hur man förminskar HTML, CSS och JavaScript med Autoptimera plugin
0 6 мин.

Google och andra sökmotorer ger värde till din webbplats om den laddas så snabbt. Eftersom ingen av tittarna har många patienter att vänta länge för att se ditt innehåll och du har bara 1,5 sekunder att få deras uppmärksamhet. Om din webbplats tar för lång tid att öppna förlorar du vanligtvis tittarna. Så detta är viktigt för att påskynda din webbplats. Det finns flera sätt att optimera din webbplats. Men en av de viktigaste delarna är att Förminska HTML, CSS och JavaScript.


Om du någonsin gjort ett hastighetstest på Google PageSpeed eller GTmetrix, du ser förmodligen det alternativet.

Varje webbplats som laddas med många filer innehåller HTML, CSS och JavaScript. Och de flesta filer innehåller mycket utrymme, kommentarer, blockavgränsare etc. Så det tar betydligt extra tider att ladda ordentligt.

Detta beror också på temakvaliteten. Exempelvis är ett premiumtema alltid bättre än ett gratis tema. Premiumtema är välkodade och byggda av mycket skickliga utvecklare. Men alla teman är inte desamma och har olika typer av funktioner. Så, av Att minimera dessa HTML-, CSS- och JavaScript-filer kan du strategiskt öka din webbplatshastighet och göra dina besökare lyckliga.

Vad är Minify och varför det är fördelaktigt?

minification är ett programmeringsspråk som tar bort alla onödiga tecken från källkoden utan att ändra dess funktionalitet. Dessa onödiga tecken innehåller vanligtvis “vitrumstecken, nya linjetecken, kommentarer, och blockera avgränsare ”. 

Innan Minify och After Minify

De används för att lägga till läsbarhet till koden men krävs inte för att den ska kunna köras. På detta sätt minskar den mängden kod som måste överföras över webben och sparar din bandbredd. Så av minifiera HTML, CSS och JavaScript, kan du enkelt ta bort onödiga tecken från din webbplats och påtagligt öka din webbplatshastighet. 

Hur man minifierar HTML, CSS och JavaScript

Det finns två sätt du kan Minifiera HTML, CSS & JavaScript. Antingen kan du göra genom att redigera din temakod eller så kan du använda ett WordPress-plugin, kallad Autoptimize. I den här artikeln visar vi dig båda processerna om Hur man minifierar HTML, CSS och JavaScript.

För att känna till exakt HTML-, CSS- eller JavaScript-fil som orsakar problemet måste du kontrollera den på alla webbplatshastighetstestverktyg som Google PageSpeed-verktyg eller GTmetrix. Eftersom inte alla dina filer innehåller den här typen av onödiga tecken.

När du har kontrollerat ditt webbplatsresultat får du det. Här är en bild nedan på min webbplats som överväger fixa CSS och JavaScript.

Minifiera Css, JavaScript

Det utgår ifrån din temakvalitet. Så ingenting att oroa sig om du ser att båda sägs Minify och det är bättre att få ett Premium-tema.

Det finns några onlineverktyg som du kan Minifiera HTML, CSS och JavaScript-kod. 

Innan du gör någon ändring, ta en säkerhetskopia av den filen.

# 1 Förminska koden:

Förminska kodverktyget

Förminska koden är ett All in One Minifying-verktyg. Det kan Minifiera dina JavaScript-, CSS- och HTML-koder. Allt du behöver för att kopiera HTML- eller CSS- eller JavaScript-koden och klistra in den här. Klicka sedan på minify Alternativ. Verktyget Minifierar automatiskt din kod. Kopiera sedan den Minifierade koden i den filen.

Du kan också förminska din CSS- och JavaScript-kod som HTML-kod med det verktyget.

# 2 Willpeavy:

Willpeavy

Willpeavy är ett annat bra verktyg att Förminska HTML koder. Detta verktyg fungerar på samma sätt som minifieringskod gör. Det förminskar HTML och alla CSS eller JS som ingår i din markering. För att använda detta verktyg behöver du bara kopiera din kod här och klicka på Minify.

Förminska med Autoptimera plugin

Autoptimize

Om du inte känner till sådan kodning är det bättre att använda ett plugin och rekommenderas för nybörjare. Så här kommer Autoptimera plugin för WordPress användare.

Autoptimera sammanfogar alla skript och stilkoder och gör dem mindre som laddas så snabbt. Det minifierar all HTML, CSS & Javascript kodar sig själv och gör din sida verkligen lätt. Med Minification lägger detta tillägg till utgående rubriker och flyttar stilar till sidhuvudet och kan flytta skript till sidfot.

Autoptimera rekommendationsinställningarna

Du kan enkelt göra allt från insticksinställningar. Gå till till när du har aktiverat detta plugin inställningar> Autoptimize.  Klicka på knappen “Visa avancerade inställningar”.

I html , se “Optimera HTML-kod” och “Håll HTML-kommentarer” för snabbare prestanda.

Autoptimera HTML-alternativ

I JavaScript avsnitt, aktivera “Optimera JavaScript-kod”. Du kan också aktivera “Tvinga JavaScript in” för att ladda JS tidigt och minska risken för JS-fel. Om din JS bryter skript kan du aktivera “Lägg till try-catch wrapping”.
Autoptimera JavaScript-alternativ

I CSS avsnitt, aktivera “Optimera CSS-kod”, “Även aggregerad inline CSS”. Du kan också aktivera “Inline and Defer CSS” om du har förminskat CSS. Prova detta verktyg för att minifiera din CSS och klistra in den i rutan.

Autoptimera CSS-alternativ

Ange din CDN URL i fältet “CDN Base URL”. Till exempel “//cdn.example.com/”.

Och sist aktiverar du “Spara aggregerat skript / css som statisk fil”. Men se till att din webbserver kan hantera komprimering och löptid korrekt.

Autoptimera CDN-alternativ

När du har förminskat din kod, glöm inte att kontrollera din webbplatshastighet igen. Jämför sedan det med tidigare resultat. Om din webbplats får något problem eller inte visas korrekt kan du försöka rensa cache

Slutsats

Minifiera HTML, CSS och JS är fördelaktigt för din webbplats. Den tar bort onödiga tecken på din kod och gör dem mindre som är webbläsarvänliga. På så sätt kan du förbättra din webbplatshastighet.

Om denna självstudie hjälper till att Minifiera HTML, CSS och JavaScript, vänligen dela den här artikeln om Facebook, Twitter, Google+.

relaterade artiklar,

  • Hur man utnyttjar webbläsarcaching på WordPress
  • Hur man optimerar WordPress-databasen med hjälp av WP-Sweep
  • 7 Bästa Image Optimizer för WordPress 2017
  • Hur man enkelt aktiverar Gzip-komprimering i WordPress för snabbare laddning
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Понравилась статья?
    Комментарии (0)
    Комментариев нет, будьте первым кто его оставит

    Комментарии закрыты.

    Adblock
    detector