Manofmany.com is een tijdschrift in Australische stijl gewijd aan mannen.
Elke dag plaatst het team coole dingen op het gebied van stijl, gadgets, technologie, enz.
Na een gesprek met hen op Google+ gaven we hen dit eenvoudige optimalisatierapport.
Laadtijd
Verschillende tools tonen verschillende gegevens:
- Chrome SEO-werkbalk – 7,43 sec
- Pingdom Tools – 12.62 dec
- GTMetrix – 9,86 sec
- Webpaginatest.org – 24,14 sec
Paginagrootte
Verschillende tools tonen verschillende gegevens:
- YSlaag: 3096,5 bytes
- Pingdom-tools: 4,0 MB
- GTMetrix: 3,88 MB
- Webpaginatesst.org: 3.816 KB
Ik ga nog maar één tool gebruiken, YSlow.
Componenten
Te veel http-verzoeken: 51. 51 is niet enorm, maar kan worden verbeterd.
Javascript
Er zijn 15 js-bestanden, totale grootte 627,1 KB:
- https://apis.google.com/js/plusone.js – 22,9 k
- http://platform.twitter.com/widgets.js – 80,7 k
- http://www.google-analytics.com/ga.js – 37,3 k
- http://edge.quantserve.com/quant.js – 5,8 k
- http://manofmany.com/wp-content/themes/clearly/library/js/modernizr.full.min.js – 13,6 k
- http://manofmany.com/wp-content/themes/clearly/library/js/jquery.fitvids.js?… – 2,7 k
- http://manofmany.com/wp-content/themes/clearly/library/js/scripts.js?… – 7,1 k
- http://s3.buysellads.com/ac/bsa.js – 16,1 k
- http://s3.buysellads.com/r/s_74ca33a0013c12e56d70fc5c06b96646.js?… – 2,1 k
- http://pagead2.googlesyndication.com/pagead/show_ads.js – 13,9 k
- http://manofmany.com/wp-content/plugins/contact-form-7/includes/js/jquery.form.min.js?… – 15,1 k
- http://manofmany.com/wp-content/plugins/contact-form-7/includes/js/scripts.js?… – 6,9 k
- https://apis.google.com/…/cb=gapi.loaded_0 – 129,7 k
- http://manofmany.com/wp-includes/js/jquery/jquery.js?… – 93,6 k
- http://connect.facebook.net/en_GB/all.js#xfbml=1&appId=363084773773073 – 178,9 k
JQuery.js kan voor een betere snelheid vanuit de Google-bibliotheek worden geladen.
Het grootste probleem doet zich voor bij de JS-bestanden van sociale media; ze gebruiken absoluut niet de beste plug-in voor het delen van sociale media. Het kan gedaan worden met een enkele JS van 38,5 k of zelfs zonder script.
Dat scheelt 249,6K en laat het JS-nummer op 11. Het is een aanzienlijke verbetering van de paginagrootte.
CSS
Er zijn 12 CSS-bestanden met een totale grootte van 63,7 KB.
De maat is niet zo veel, maar het aantal is nogal hoog.
Er kunnen 3 bestanden worden gecombineerd tot één: het thema stijlen.css en de plug-ins Easy Columns en Contact Form.
De rest zijn lettertypen die zijn geladen vanuit de Google-bibliotheek, dus de vraag hier is: heb je echt 9 lettertypen nodig?
Normaal gesproken zou u twee lettertypen moeten gebruiken: één voor kopteksten en één voor de hoofdtekst.
PT Sans en Open Sans zijn niet zo verschillend, dus je zou slechts één van de twee kunnen gebruiken.
Lora en PT Serif – hetzelfde als hierboven, gebruik er maar één of gebruik gewoon Georgia (het is een prachtig webveilig lettertype).
Nixie One – Ik zie het niet in gebruik op de site.
Voor lettertypen die zelden worden gebruikt, heeft het geen zin om ze elke keer te laden, gebruik gewoon systeemlettertypen: Georgia, Arial, Courier.
Dat zal de verzoeken verbeteren van 12 naar slechts 3-4, de verbeteringen in de grootte zijn niet zo groot, maar het klopt wel.
Afbeeldingen
Dat is het grootste probleem van de website met de grootste impact op de snelheid: 18 afbeeldingen, totale grootte van 2597,5 K.
Dat is enorm; ze moeten de foto's optimaliseren voordat ze worden geüpload.
De grootste afbeelding op de site heeft 420K en een simpele smush.it laat zien dat deze met 27,6% kan worden verbeterd, dat is daar 104K.
Als we alles met 25% kunnen verbeteren, is dat meer dan 600.000 gewichtsverlies.
Oplossingen:
1. Afbeeldingen optimaliseren
Gebruik Photoshop en Save voor internet op 60% en progressief aangevinkt. Als uw bezoekers Chrome, Firefox of IE9 gebruiken, laden de progressieve jpg's supersnel. Voor de rest zal het iets langzamer zijn dan normale jpgs.
Anders gewoon opslaan voor internet met 60% -80% en geoptimaliseerde controle. Dit bespaart normale jpgs.
Ga daarna verder met het uploaden van afbeeldingen naar WordPress.
Geen Photoshop?
Gebruik jpegmini.com om afbeeldingen te optimaliseren voordat u ze uploadt, of gebruik gewoon een WP-plug-in om dit automatisch te doen tijdens het uploaden.
2. Afbeeldingen serveren
Serveer statische inhoud vanuit een domein zonder cookies en parallelliseer downloads over hostnamen.
Deze 2 dingen kunnen worden bereikt door afbeeldingen te laden vanaf een cookieloos subdomein, zoiets als images.manofmany.com.
Nu kan de browser meerdere items tegelijk downloaden, waardoor de snelheid van de website wordt verbeterd.
Lui laden
Dit betekent dat afbeeldingen één voor één worden geladen en alleen zichtbaar zijn voor de gebruikers wanneer dat nodig is.
Ze worden geladen als ze alleen zichtbaar zijn in de browserviewport.
Door alleen afbeeldingen boven de vouw te laden, is de snelheidswinst aanzienlijk.
Andere dingen die je kunt doen
– browsercaching
– combineer js (indien mogelijk)
– voeg verlopen header toe
– comprimeer met gzip
– gebruik van etags
– Profilering van plug-ins om te zien welke de laadtijd beïnvloedt en vervang deze door betere plug-ins
– Gebruik code in functies.php in plaats van plug-ins voor eenvoudige dingen zoals laden van Google Fonts
– los 404-fouten op
– minimaliseer omleidingen
– laad javascript onderaan de pagina
– je kunt slechts 5 berichten per pagina gebruiken in plaats van 10
– je zou kleinere afbeeldingen zoals thumbnails kunnen gebruiken, maar dat betekent interfereren met het ontwerp
Conclusie
Meestal zijn het simpele dingen die een enorme impact kunnen hebben.
Voor een meer geavanceerde optimalisatie moeten we naar het thema en de plug-ins kijken en controleren of er prestatieproblemen zijn.
Laat een reactie achter