Nogle værktøjer til at udføre komprimeringen

Heldigvis behøver du ikke nødvendigvis være udvikler eller kende et af programmeringssprogene for at reducere dit websteds filstørrelser. Minificering er blevet en almindelig praksis i webdesignverdenen. Så du bør ikke blive overrasket over at lære, at der er mange vidunderlige (og gratis) værktøjer derude til at gøre jobbet for dig.

Se også vores 6 WordPress-plugins for at puste nyt liv i dine artikler

Her er en liste over nyttige værktøjer til at komme i gang. Da mange af disse kan minimere flere kodetyper, har jeg inkluderet kodetypeindstillingerne i parentes.

• • cssminifier.com et javascript-minifier.com (CSS og JS) - Disse to minifiers af Andrew Chilton er nemme at bruge. Du skal bare indsætte din kode og derefter klikke på knappen Minify for at få vist den komprimerede kode. Du kan endda downloade exitkoden som en fil for nemheds skyld.
  • htmlcompressor.com (HTML, CSS & JS) - Dette online komprimerings- / minificeringsværktøj understøtter HTML-, CSS- og JS-kodetyper. Det understøtter endda forskellige kombinationer af kodetyper som CSS + PHP og JavaScript + PHP. Og du kan endda kontrollere den komprimerede kode for fejl.

• • csscompressor.net (Kun CSS) - Denne online CSS-kompressor er hurtig, nem og gratis at bruge.

• • jscompress.com (Kun JS) - Dette JavaScript-komprimeringsværktøj giver dig mulighed for at komprimere JavaScript-kode ved at kopiere og indsætte, men du kan også downloade flere JavaScript-filer ad gangen. Dette er ideelt til at kombinere JavaScript-filer i en enkelt fil for bedre sideindlæsningshastighed.
  • Dan's værktøjer - Dans værktøjer foreslå un reducere CSS og minimere JavaScript . Begge værktøjer har en virkelig ren, brugervenlig brugergrænseflade. De tilbyder ingen avancerede muligheder, men de er gode til almindelige minifikationsformål.

• • refresh-sf.com (HTML, CSS og JS) - Denne kompressor reducerer JavaScript-, CSS- og HTML-kodetyper. Det indeholder også alle komprimeringsindstillingerne for hver type kode, hvis du har brug for dem.
  • Closure Compiler (Kun JS) - Closure Compiler er en del af lukning Værktøj , en række værktøjer fra Google Developers. Det giver dig mulighed for at formindske din JavaScript sammen med andre nyttige optimeringer. Du kan bruge din Javascript-kode ved at indtaste URL'en for js-filens placering og derefter vælge, hvordan du vil have koden optimeret og formateret. 

For eksempel vælger du at optimere din kode for kun at fjerne de tomme emner, hvis du vil. Når du har klikket på kompileringsknappen, reducerer den koden (eller kompilerer den) for dig.

• • minifycode.com (HTML, CSS og JS) - Dette websted tilbyder minifiers til JavaScript , CSS et HTML med en enkel og ren brugergrænseflade, der komprimerer din kode med et enkelt klik. Det tilbyder også et "forskønner" -værktøj til at dekomprimere den minificerede kode for at gøre det mere læsbart (det modsatte af minificering).

Hvis du leder efter offlineværktøjer til at minimere din CSS eller JavaScript HTML lokalt, er der nogle muligheder:

• phpied.com/cssmin-js/ (Kun CSS)
• yui.github.io/yuicompressor (JS og CSS)

Sådan reduceres størrelsen på din HTML, CSS og JavaScript ved hjælp af et onlineværktøj

Mange af disse online værktøjer har en lignende proces, der involverer følgende trin:

• Indsæt din kildekode, eller download kildekodefilen. 
• Optimer indstillingerne for en bestemt output (hvis der er tilgængelige indstillinger)
• Klik på en knap for at komprimere koden.
• Kopier det resultat, der er minificeret kode, eller download den minifikrede kodefil.

I dette eksempel skal jeg bruge minify-værktøjerne fra minifycode.com.

Se også: Hvordan at tilføje en CSS kode sikkert på WordPress ved at konsultere dette link.

Find først CSS-filen (ofte kaldet style.css) i dine webstedsfiler og åbn den ved hjælp af en sideditor. Kopier derefter al CSS-koden til dit udklipsholder.

tage til minifycode.com og klik på fanen CSS minifier. Indsæt derefter CSS-koden i indtastningsfeltet, og klik på knappen Minimer CSS.

Når den nye minificerede kode er genereret, skal du kopiere den.

Gå derefter tilbage til dit websteds CSS-fil, og erstatt koden med den nye forenklede version.

Det er alt!

Gentag den samme proces for også at reducere JavaScript og HTML-fil (er) på dit websted.

Sådan minimeres HTML, CSS og JavaScript i WordPress ved hjælp af plugins

Den nemmeste måde at minimere din HTML, CSS og JavaScript på WordPress er at bruge et plugin. Dette giver dig mulighed for automatisk at optimere dine WordPress-webstedsfiler for at reducere sidens indlæsningstid med blot et par klik på knappen.

Der er mange plugins, der får jobbet gjort, men jeg nævner kort et par eksempler.

Autoptimize (FREE)

Autoptimize er sandsynligvis den WordPress plugin af de mest populære minify. Det er populært, fordi det er nemt at bruge og spækket med kraftfulde funktioner. Det kan bundle (kombinere scripts), formindske og cache din kode. Som en bonus har du yderligere muligheder for at optimere Google Fonts, billeder mv.

For at bruge Autoptimize kan du downloade, installere og aktivere plug-in fra WordPress-instrumentbrættet under Plugin> Tilføj nyt.

For mere information, se vores vejledning om:  Sådan installeres et plugin i WordPress

Når plugin er aktiveret, skal du gå til Indstillinger> Automatisk optimering. Kontroller derefter den kode, du vil optimere (HTML, CSS og / eller JavaScript) under fanen Hovedparametre, og klik på Egem ændringer.

Du kan også klikke på knappen Vis avancerede indstillinger øverst på siden for yderligere at tilpasse din kodeoptimering.

Det er mere eller mindre det! Ganske enkelt og kraftfuldt.

W3 Total Cache (GRATIS)

W3 Total Cache er et fremragende cache-plugin, der giver mulighed for at minimere dine HTML-, JS- og CSS-filer.

WP hurtigste cache (GRATIS)

WP hurtigeste cache - Dette plugin WordPress caching er ekstremt populært med høje anmeldelser. Det udfører forskellige præstationsoptimeringer, herunder at kombinere og reducere din HTML CSS og JavaScript for bedre ydelse.

Læs også vores artikel om 8 WordPress plugins til at tilføje en live chat på din blog

Når plugin er installeret, skal du blot klikke på fanen WP hurtigeste cache i WordPress-dashboardets sidepanel. Under fanen Indstillinger, finder du muligheder for at kombinere og reducere HTML- og CSS-filer. Selvom minifiering af JavaScript kun er tilgængelig i pro-versionen.

For at opsummere

Hvis du vil gøre din blog hurtigere og have bedre ydeevne, skal du reducere størrelsen på dine HTML-, CSS- og JavaScript-filer. Med alle tilgængelige onlineværktøjer kan du nemt reducere koden på ethvert websted. 

9 WordPress plugins til at skjule indholdet af din blog at opdage absolut

For dem, der bruger WordPress, har du til rådighed kraftfulde plugins til at minimere disse filer automatisk med et par klik.

Oplev også nogle premium WordPress-plugins  

Du kan bruge andet WordPress plugins for at give et moderne udtryk og for at optimere håndteringen af ​​din blog eller hjemmeside.

Vi tilbyder dig her nogle premium WordPress-plugins, der hjælper dig med det.

Andre anbefalede ressourcer

Vi inviterer dig også til at konsultere nedenstående ressourcer for at komme videre i grebet og kontrollen af ​​dit websted og blog.

Konklusion