Πώς να επιταχύνετε τον ιστότοπό σας εύκολα! – Οι αργές ιστοσελίδες σκοτώνουν τις μετατροπές !!!

Η ταχύτητα είναι δολοφόνος.


Μέσα σε όλες τις συζητήσεις σχεδιασμού, αντιγραφής, δοκιμών και στρατηγικής, είναι εύκολο να ξεχνάμε ότι υπάρχει πρόβλημα με τα παξιμάδια που μπορεί να προκαλέσει ή να σπάσει την απόδοση του ιστότοπού σας. Μιλώ για ταχύτητα φόρτωσης.

Η ταχύτητα φόρτωσης έχει πολύ μεγαλύτερη σημασία από ό, τι νομίζετε.

Είναι ένας παράγοντας κατάταξης:

Δείτε πώς φαίνεται η επίδραση της ταχύτητας φόρτωσης όσον αφορά την τοποθέτηση αποτελεσμάτων αναζήτησης:

(Πηγή: https://ahrefs.com/blog/on-page-seo/)

Αργότερη τοποθεσία = χαμηλότερη θέση. Η ιδανική ταχύτητα φόρτωσης πλησιάζει το μηδέν όσο μπορείτε να το αποκτήσετε: Οι 10 κορυφαίες SERP φορτώνουν λιγότερο από ένα δευτερόλεπτο.

Και έχει σημασία και για τους επισκέπτες.

«Σε παγκόσμιο επίπεδο, οι αργοί χρόνοι φόρτωσης θεωρούνται η μεγαλύτερη απογοήτευση των σύγχρονων χρηστών κινητής τηλεφωνίας», δήλωσε η Episerve στην έκθεση του 2015. Και οι χρήστες κινητής τηλεφωνίας είναι πλέον η πλειονότητα της κίνησης ιστού.

Η επίδραση στις μετατροπές είναι ακόμη πιο δραστική από ό, τι μπορούμε να παρατηρήσουμε για SERPs και πολύ πιο έντονο:

(Πηγή: https://www.soasta.com/blog/mobile-web-performance-monitoring-conversion-rate/)

Το ποσοστό μετατροπής κορυφώνεται στα 2,4 δευτερόλεπτα. προσθέστε δύο δευτερόλεπτα και στα μισά. Προσθέστε ένα δευτερόλεπτο και πέφτει κατά 27%.

Γιατί αυτό εξακολουθεί να αποτελεί πρόβλημα; Με ταχύτερα ευρυζωνικά ευρύτερα κατανεμημένα από ποτέ, και τα smartphone γίνονται γρηγορότερα και πιο ισχυρά, γιατί δεν έχουν διατηρηθεί οι ιστοσελίδες?

Κυρίως επειδή χρησιμοποιούμε αυτό το επιπλέον εύρος ζώνης για να συσκευάσουμε ιστότοπους με τεχνάσματα, cookie παρακολούθησης και τεράστιες εικόνες.

(Πηγή: https://www.cachefly.com/category/faster-websites/)

Οι εικόνες είναι ο κύριος ένοχος, που αυξάνεται 3Χ από το 2011, αλλά τα σενάρια έχουν κάνει επίσης μεγάλο άλμα. Εάν είχατε έναν καθαρό ιστότοπο HTML θα ήταν το ίδιο μέγεθος τώρα με το 2011, όταν οι μέσες ταχύτητες διαδικτύου στις ΗΠΑ ήταν 3Χ πιο αργές.

Ωστόσο, η ταχύτητα φόρτωσης σελίδας δεν είναι μόνο κακή.

Γίνεται χειρότερο.

Η απόδοση του ιστού στο ηλεκτρονικό εμπόριο επιβραδύνεται κατά μέσο όρο 23% ετησίως, σύμφωνα με στοιχεία από το 2014: οι ιστότοποι ηλεκτρονικού εμπορίου χρειάστηκαν 6,5 δευτερόλεπτα για να καταστήσουν το κύριο περιεχόμενό τους – σχεδόν διπλάσιο από αυτό για να φορτώσουν πλήρως.

Ο μέσος ιστότοπος με την κορυφαία κατάταξη διαρκεί τώρα περίπου 9 δευτερόλεπτα για φόρτωση.

(Πηγή: http://www.seochat.com/c/a/google-optimization-help/average-page-load-time-of-top-ranking-websites-in-google/)

(Αυτοί είναι ολόκληροι ιστότοποι, όχι μεμονωμένες σελίδες.)

Ποιος το επηρεάζει?

Ολοι. Η αναπήδηση είναι αρκετά υψηλή σε όλους τους κλάδους, και έτσι είναι η αποτυχία εκτέλεσης των ενεργειών που θέλουμε να κάνουν οι χρήστες, δηλαδή, έλλειψη μετατροπής.

(Πηγή: https://conversionxl.com/guides/bounce-rate/seo-impact/)

Ειδικότερα, οι ιστότοποι ηλεκτρονικού εμπορίου υφίστανται υψηλή εγκατάλειψη και εγκατάλειψη καλαθιού αγορών.

(Πηγή: https://www.barilliance.com/measure-cart-abandonment/)

Η εγκατάλειψη του καλαθιού αγορών μειώθηκε από την κορυφή του 2012 σχεδόν 72% – αλλά μόνο στο 69,23%, μια πολύ μικρή πτώση. Η μεγάλη πλειονότητα των επισκεπτών του ιστότοπου ηλεκτρονικού εμπορίου εγκαταλείπεται.

Συσχετίζεται άμεσα με το χρόνο φόρτωσης.

ποσοστό εγκατάλειψης-σύγκριση με τη φόρτωση σελίδας

(Πηγή: https://bluestout.com/blog/how-to-reduce-mobile-ecommerce-bounce-rate/)

Τι γίνεται με την αναπήδηση?

Το ποσοστό εγκατάλειψης ηλεκτρονικού εμπορίου σχετίζεται επίσης με την ταχύτητα φόρτωσης. Οι χρήστες αυτού του ιστότοπου ηλεκτρονικού εμπορίου αναπήδησαν με ρυθμό 44% – κατά μέσο όρο. Διαχωρίστε τους με την εμπειρία ταχύτητας φόρτωσης και υπάρχει μια σαφής διαφορά:

(Πηγή: https://www.linkedin.com/pulse/how-load-time-affects-bounce-rate-across-devices-report-jack-maden)

Λάβετε υπόψη ότι οι γρήγοροι φορτωτές ορίστηκαν εδώ ως «κάτω από 4 δευτερόλεπτα»! Υπάρχει 24% άλμα στην αναπήδηση για επιτραπέζιους υπολογιστές μεταξύ των ομάδων γρήγορης και αργής φόρτωσης.

Οι ιστότοποι περιεχομένου υποφέρουν από υψηλή αναπήδηση και αυτό σχετίζεται με την ταχύτητα φόρτωσης.

Έτσι, οι ιστότοποι δημιουργίας δυνητικών πελατών για υπηρεσίες.

Τελικά, η σχέση μεταξύ της ταχύτητας αναπήδησης και φόρτωσης μοιάζει λίγο πολύ σε όλες τις βιομηχανίες:

(Πηγή: http://www.ironpaper.com/webintel/articles/web-design-statistics-2017/)

Σας επηρεάζει η αργή ταχύτητα φόρτωσης?

Πώς μπορείτε να γνωρίζετε εάν ο ιστότοπός σας επηρεάζεται από αργή ταχύτητα φόρτωσης; Ξεκινήστε ελέγχοντας τη βασική ταχύτητα φόρτωσης. Μπορείτε να χρησιμοποιήσετε το εργαλείο PageSpeed ​​Insights της Google για να μάθετε πόσο καλά αποδίδει ο ιστότοπός σας.

(Πηγή: https://developers.google.com/speed/pagespeed/insights/)

Εκτελέστε τη διεύθυνση URL σας μέσω του εργαλείου της Google και λαμβάνετε δεδομένα σχετικά με το πόσο γρήγορα φορτώνει ο ιστότοπός σας και συμβουλές σχετικά με ποια στοιχεία θα μπορούσαν να βελτιωθούν για την επιτάχυνσή του.

Σημειώστε ότι το αποτέλεσμα μπορεί να είναι ουσιαστικά διαφορετικό για επιτραπέζιους υπολογιστές έναντι κινητού:

Όμως, ενώ το εργαλείο της Google δεν είναι ένα κακό κατάστημα μίας στάσης για την κάλυψη των βασικών στοιχείων, υπάρχουν πολλά πράγματα κάτω από την κουκούλα που δεν σας δείχνουν.

Ακολουθούν λοιπόν πέντε εξαιρετικά εργαλεία για να βυθιστείτε σε βάθος ακριβώς τι συμβαίνει στον ιστότοπό σας.

GTmetrix

Σας προσφέρει μια λίστα με τα ζητήματα του ιστότοπού σας που έχουν βαθμολογηθεί κατά προτεραιότητα.

Μπορείτε να μετακινήσετε τον διακομιστή σας για να δείτε πώς φαίνεται ο ιστότοπός σας σε όλο τον κόσμο και να λάβετε μια επισκόπηση και μια λίστα με δυνατότητα δράσης βαθμολογημένη από Α σε ΣΤ.

Αναρωτιέστε τι να αντιμετωπίσετε πρώτα; Ξεκινήστε εδώ.

2. Pingdom

Το Pingdom σας δίνει επίσης βαθμούς. Προσφέρει επίσης ανάλυση καταρράκτη, ώστε να μπορείτε να δείτε ακριβώς τι συμβαίνει.

Ωστόσο, δεν είναι δωρεάν, σε αντίθεση με την πλειονότητα των εργαλείων σε αυτήν τη λίστα.

3: Οθόνη Dotcom

Προσφέροντας ανάλυση καταρράκτη και μια σειρά διαφορετικών διακομιστών, επιτρέποντάς σας να δείτε πώς αλληλεπιδρούν οι δύο.

Αντί να μετακινεί το διακομιστή σας, το Dotcom-monitor χρησιμοποιεί μια ποικιλία διακομιστών ταυτόχρονα.

4: Αντίκτυπος φορτίου

Το Load Impact προσφέρει σενάρια περιήγησης και αναλύει επίσης το περιεχόμενό σας.

Είναι δωρεάν, αλλά πρέπει να δημιουργήσετε έναν λογαριασμό και σε σύγκριση με τα άλλα εργαλεία αυτής της λίστας, είναι πολύ πιο περίπλοκο.

5: Ιστοσελίδα

Έσωσα το καλύτερο μέχρι το τελευταίο. Το Webpagetest είναι αυτό που χρησιμοποιώ ως επί το πλείστον.

Η διεπαφή είναι άσχημη του 1996, αλλά η λειτουργικότητα είναι γρήγορη, εύκολη στην πρόσβαση και δίνει τη σωστή λεπτομέρεια.

Οι καταρράκτες, η ανάλυση περιεχομένου και μερικά άλλα εργαλεία σάς επιτρέπουν να πάτε από το “ο ιστότοπός μου είναι πολύ αργός” και να δείτε οπτικά ποια στοιχεία απορροφούν το χρόνο φόρτωσης.

Έκπληξη, έκπληξη: είναι εικόνες και javascript.

Επομένως, έχουμε δει πολλές διαφορετικές μετρήσεις ταχύτητας φόρτωσης. Το ερώτημα είναι, ποια είναι πραγματικά σημαντικά?

Οι ζωτικές μετρήσεις ταχύτητας φόρτωσης είναι αυτές που ενδιαφέρουν πραγματικά τους πελάτες σας:

  • Ώρα στη σελίδα να είναι ορατή
  • Ώρα να βρούμε αυτό που θέλουν
  • Ώρα να μπορέσουμε να κάνουμε ό, τι θέλουν

Αυτός είναι ένας λόγος που οι ιστότοποι ηλεκτρονικού εμπορίου είναι τόσο ευαίσθητοι στην ταχύτητα φόρτωσης. Ένα πλήθος εικόνων και κουμπιών που φορτώνουν αργά και με δυσλειτουργίες και άλματα είναι πολύ πιο απογοητευτικό από μια μεμονωμένη, ανεπιθύμητη υπερκείμενη εικόνα που απαιτεί πολύ χρόνο για φόρτωση. Και οι άνθρωποι έρχονται σε ιστότοπους ηλεκτρονικού εμπορίου για να πάρουν αποφάσεις σχετικά με αυτό που θέλουν – αυτά είναι και τα τρία από τα παραπάνω λίστα, που συμβαίνουν ταυτόχρονα.

Πώς επιδιορθώνουμε έναν ιστότοπο με αργή φόρτωση?

Πώς να επιταχύνετε έναν αργό ιστότοπο

1: Ελαχιστοποίηση αιτημάτων HTTP

Κάθε φορά που ένα αρχείο φορτώνεται στον ιστότοπό σας, ένα αίτημα HTTP αποστέλλεται στον διακομιστή σας από το πρόγραμμα περιήγησης. Ενώ οι δύο υπολογιστές μιλούν, τα πράγματα επιβραδύνονται. Η Yahoo λέει ότι αυτό μπορεί να αντιστοιχεί σε έως και 80% του χρόνου φόρτωσης.

Για να δείτε την αναφορά αιτήματος στο Websitespeedtest, μεταβείτε στη διεύθυνση Αποτέλεσμα δοκιμής>Λεπτομέριες και μετακινηθείτε προς τα κάτω. είναι η τρίτη έκθεση.

(Αυτή είναι μια πολύ απλουστευμένη εξήγηση: εάν θέλετε να πάρετε περισσότερα από την κουκούλα, δείτε αυτήν την ανάρτηση από τον Jimmy Comack του Yoast.)

Όσο περισσότεροι πόροι εκτός σελίδας αποθηκεύονται αλλού η ιστοσελίδα σας πρέπει να φορτώνει, τόσο περισσότερα αιτήματα HTTP πρέπει να στείλει και τόσο πιο αργή θα φορτώσει.

Αυτό επιδεινώνεται επειδή το HTTP είχε αρχικά ρυθμιστεί ώστε να ξεκινά ένα νέο αίτημα μόνο όταν το παλιό είχε τελειώσει. Για να επιταχύνετε τα πράγματα, είναι πλέον δυνατό να υποβάλετε ασύγχρονα αιτήματα (όλα συμβαίνουν το ένα πάνω στο άλλο.) Είναι πιο γρήγορο – αλλά διατρέχει τον κίνδυνο φόρτωσης της σελίδας σας με έναν ακατάστατο, μπερδεμένο τρόπο. Θυμηθείτε, δεν κυνηγούμε αφηρημένες μετρήσεις ταχύτητας φόρτωσης. Θέλουμε οι επισκέπτες να προσανατολιστούν και να δράσουν γρήγορα χωρίς αναπήδηση.

Πώς μειώνουμε τον αριθμό αιτημάτων HTTP; Μειώσαμε τον αριθμό των πόρων που φορτώνονται.

Ξεκινήστε με εικόνες. Απαλλαγείτε από εικόνες που δεν κάνουν κάτι χρήσιμο στη σελίδα. Η ύπαρξη πολλών εικόνων είναι καλό, αλλά αν είναι εκεί μόνο για χάρη της, εξετάστε το ενδεχόμενο να τις αφαιρέσετε.

Το βίντεο είναι επόμενο. Ορισμένοι ιστότοποι με εκτεταμένο βίντεο μπορούν να προσθέσουν ένα ή δύο δευτερόλεπτα στο χρόνο φόρτωσης του ιστότοπου: είναι όλη η ώρα που οι περισσότεροι άνθρωποι είναι πρόθυμοι να περιμένουν, ξοδεύονται σε ένα στοιχείο. Αξίζει πραγματικά?

Η Javascript είναι η δεύτερη μεγαλύτερη αιτία ένοχος μετά από εικόνες. Το Javascript πρέπει να είναι ασύγχρονο, που σημαίνει ότι πρέπει να φορτώνει ταυτόχρονα όλα τα άλλα. Διαφορετικά, όταν το πρόγραμμα περιήγησής σας φτάσει στο Javascript, σταματά να φορτώνει όλα τα άλλα στον ιστότοπο μέχρι να φορτώσει το JS. Κάντε το ασύγχρονο ή απαλλαγείτε εντελώς. Εάν δεν μπορείτε να το κάνετε, τοποθετήστε το στο κάτω μέρος της σελίδας, ώστε να φορτωθεί τελευταία.

Τέλος, CSS. Κάθε αρχείο CSS είναι το δικό του ξεχωριστό αίτημα. Αλλά ένα μόνο αρχείο CSS μπορεί συνήθως να κάνει για όλες τις ανάγκες σας CSS, οπότε συνδυάστε τα σε ένα για να μειώσετε τον αριθμό των αιτημάτων.

2: Ενεργοποίηση συμπίεσης

Για τη φόρτωση μεγάλων σελίδων απαιτείται πολύς χρόνος. Αλλά είναι δυνατό να τα συμπιέσετε, με το εργαλείο ανοιχτού κώδικα Gzip.

Οι περισσότεροι διακομιστές ιστού μπορούν να χρησιμοποιήσουν το Gzip για να συμπιέσουν αρχεία σε αρχεία .zip πριν τα στείλουν. Ενδέχεται να έχετε τον ίδιο αριθμό αρχείων που λαμβάνονται (εάν δεν καταφέρατε να μειώσετε τους αριθμούς αιτημάτων σας ακόμη), αλλά δεν θα έχετε την ίδια ποσότητα πληροφοριών, επομένως οι σελίδες σας θα φορτώνονται γρηγορότερα.

Η Yahoo λέει ότι το Gzip μπορεί να μειώσει το 70% του χρόνου φόρτωσης.

Για να ενεργοποιήσετε το Gzip, αποθέστε αυτόν τον κώδικα στο αρχείο .htaccess:

# συμπίεση κειμένου, html, javascript, css, xml:
AddOutputFilterByType DEFLATE κείμενο / απλό
AddOutputFilterByType DEFLATE κείμενο / html
AddOutputFilterByType DEFLATE κείμενο / xml
AddOutputFilterByType DEFLATE κείμενο / css
AddOutputFilterByType DEFLATE εφαρμογή / xml
AddOutputFilterByType DEFLATE εφαρμογή / xhtml + xml
AddOutputFilterByType DEFLATE εφαρμογή / rss + xml
AddOutputFilterByType DEFLATE εφαρμογή / javascript
AddOutputFilterByType DEFLATE εφαρμογή / x-javascript

# Ή, συμπιέστε συγκεκριμένους τύπους αρχείων κατά επέκταση:

SetOutputFilter DEFLATE

3: Ενεργοποίηση προσωρινής αποθήκευσης του προγράμματος περιήγησης

Η προσωρινή αποθήκευση του προγράμματος περιήγησης επιτρέπει στον επισκέπτη να αποθηκεύει μια έκδοση του ιστότοπού σας στο πρόγραμμα περιήγησής του. Στη συνέχεια, όταν επιστρέψουν στον ιστότοπό σας, πρέπει μόνο να ανοίξουν την πλειονότητα των αρχείων που αποτελούν τον ιστότοπό σας και όχι να τα κατεβάσουν.

Ακούγεται καλό, σωστά?

Ρίξτε μια ματιά στην αναφορά επισκόπησης του Google Analytics, σχετικά με την επιστροφή σας έναντι των νέων επισκεπτών.

Οι νέοι επισκέπτες θα έχουν άδεια cache. Δεν μπορείτε να επιταχύνετε την εμπειρία τους στον ιστότοπό σας με την προσωρινή αποθήκευση του προγράμματος περιήγησης. Ωστόσο, οι επισκέπτες που επιστρέφουν είναι μια άλλη ιστορία: μπορείτε να μειώσετε το μεγαλύτερο μέρος του χρόνου φόρτωσης του ιστότοπου για αυτούς τους επισκέπτες.

Εάν έχετε υψηλό ποσοστό επισκεπτών που επιστρέφουν ή θέλετε να πραγματοποιήσετε κρυφή μνήμη στον ιστότοπό σας, εδώ είναι ένας εξαιρετικός πόρος.

4: Ελαχιστοποιήστε τους πόρους

Πολλοί “δημιουργοί ιστότοπων” που δεν βασίζονται σε δεξιότητες προγραμματιστών συναλλαγών – ή καθόλου – μπορούν να δημιουργήσουν υπέροχους ιστότοπους. Αλλά καταλαβαίνω κάτω από την κουκούλα και ο κώδικας δεν φαίνεται τόσο υπέροχος. Φουσκωμένο και ασταθές, αυτό μπορεί να επιβραδύνει τον ιστότοπό σας.

Τι να κάνω?

Μπορείτε να τακτοποιήσετε τον κώδικα μόνοι σας. Η κατάργηση περιττών αλλαγών γραμμής, εσοχών και κενών στον κώδικά σας μπορεί να την επιταχύνει.

Αλλά η ελαχιστοποίηση είναι ακόμη πιο αποτελεσματική.

Δείτε πώς μοιάζει:

(Πηγή: https://www.wpmyweb.com/how-to/minify-html-css-javascript-autoptimize.html)

Σε αυτό το παράδειγμα, μια απλή ενότητα HTML έχει συρρικνωθεί αυτόματα στο μικρότερο και πιο λεπτό που θα πάει και θα λειτουργήσει. Στη διαδικασία, το 11% του κώδικα έχει απομακρυνθεί.

Για αποτελεσματική ελαχιστοποίηση, δώστε προτεραιότητα: ξεκινήστε με τον κωδικό που προκαλεί τα περισσότερα προβλήματα. Μεταβείτε στο PageSpeed ​​Insights της Google και εκτελέστε μια δοκιμή στη διεύθυνση URL του ιστότοπού σας. Στην ενότητα “πιθανές βελτιστοποιήσεις”, θα δείτε επιλογές για ελαχιστοποίηση CSS, HTML και Javascript.

Η ελαχιστοποίηση αυτών των στοιχείων CSS και μόνο θα μπορούσε να κάνει σημαντική εξοικονόμηση δεδομένων.

Μπορείτε να χρησιμοποιήσετε εργαλεία όπως το Minifycode.com για να ελαχιστοποιήσετε τον κώδικά σας και, στη συνέχεια, να αντικαταστήσετε τον προσβλητικό κώδικα στο HTML, CSS ή Java με την ελαχιστοποιημένη έκδοση.

Εάν χρησιμοποιείτε WordPress, υπάρχει μια προσθήκη αυτόματης βελτιστοποίησης που ελαχιστοποιεί όλο τον κώδικά σας, αν και χρειάζεται λίγη ρύθμιση.

5: Βελτιστοποίηση εικόνων

Οι εικόνες είναι τα περισσότερα στοιχεία που απορροφούν το εύρος ζώνης των περισσότερων ιστότοπων. Τυπικά σφάλματα αφήνουν τις εικόνες σε μορφή πεινασμένου εύρους ζώνης ή σε τεράστια μεγέθη. Δείτε πόσο καιρό χρειάστηκαν να φορτωθούν αυτές οι εικόνες:

Οι μοβ γραμμές είναι εικόνες. Το μεγαλύτερο χρειάστηκε 2,09 δευτερόλεπτα. Μεγάλο πρόβλημα.

Τα τρία πράγματα στα οποία πρέπει να επικεντρωθείτε όταν βελτιστοποιείτε τις εικόνες είναι το μέγεθος, η μορφή και το χαρακτηριστικό src.

Μέγεθος εικόνας

Οι μεγάλες εικόνες απορροφούν το εύρος ζώνης. Εάν η σελίδα σας έχει πλάτος 500 εικονοστοιχεία, γιατί οι εικόνες σας έχουν πλάτος 2500 εικονοστοιχεία?

Αυτό το επιπλέον μέγεθος είναι περιττή επιβάρυνση του χρόνου φόρτωσης του ιστότοπού σας.

Σίγουρα, αυτή η εικόνα θα αλλάξει το μέγεθος στον ιστότοπο όταν αποδίδεται – αλλά ολόκληρο το τεράστιο αρχείο θα φορτώνεται επίσης κάθε φορά. Μην αλλάξετε το μέγεθος των εικόνων: περικόψτε τις ώστε να ταιριάζουν στις μέγιστες διαστάσεις του ιστότοπού σας, σε ένα εργαλείο επεξεργασίας εικόνων.

(Εάν δεν διαθέτετε Photoshop, δοκιμάστε το Pixlr – δωρεάν μέσω προγράμματος περιήγησης.)

Μορφή εικόνας

Η καλύτερη μορφή εικόνας είναι .jpg, με δευτερόλεπτο .png. (Δεν θα αποδίδουν όλα τα προγράμματα περιήγησης .png εικόνες.) Τα BMP, TIFF και Gif απορροφούν όλα το εύρος ζώνης σαν τρελό.

Το χαρακτηριστικό src

Το χαρακτηριστικό src λέει στο πρόγραμμα περιήγησης πού να ψάξει την εικόνα. Σε HTML, μοιάζει με αυτό:

Δεν έχετε αυτά που μοιάζουν με αυτό:

Αυτό σημαίνει ότι δεν υπάρχει καθορισμένη πηγή για την εικόνα. Όταν συμβεί αυτό, το πρόγραμμα περιήγησης θα αρχίσει να το ψάχνει στέλνοντας αιτήματα στην ίδια τη σελίδα, προσθέτοντας στο φορτίο δεδομένων της φόρτωσης της σελίδας – επιπλέον, η εικόνα σας δεν θα φορτωθεί.

6: Βελτιστοποίηση παράδοσης CSS

Το CSS ενημερώνει τα προγράμματα περιήγησης πώς θα φαίνεται κάθε στοιχείο της σελίδας σας. Μπορείτε να το κάνετε με δύο τρόπους, εξωτερικά ή inline.

Το εξωτερικό CSS βρίσκεται στην κεφαλίδα της σελίδας σας, ως εξής:

Όλες οι πληροφορίες που απαιτούνται για την απόδοση της σελίδας σας (σελίδα του Hubspot, σε αυτήν την περίπτωση) βρίσκονται στο φύλλο στυλ CSS.

Αυτό είναι πολύ καλύτερο από το να το κάνετε με ενσωματωμένο CSS, όπου αποθέτετε CSS μεταξύ του HTML σας. Η χρήση ενός φύλλου στυλ μειώνει το μέγεθος του κώδικα σας, ενώ χρησιμοποιώντας μόνο ένα φύλλο στυλ μειώνεται ο αριθμός των αιτημάτων και έτσι μειώνεται ο χρόνος φόρτωσης.

Για να μάθετε πόσα εξωτερικά φύλλα CSS χρησιμοποιεί η σελίδα σας, χρησιμοποιήστε ένα εργαλείο όπως το Εργαλείο παράδοσης CSS της Varvy ή το GiftofSpeed.

Το GiftofSpeed ​​σάς βοηθά να βελτιστοποιήσετε την παράδοση CSS, αλλά αν προτιμάτε να το κάνετε μόνοι σας, η Varvy έχει οδηγίες.

Μια τελική σκέψη:

Τι γίνεται με το AMP?

Η AMP υποτίθεται ότι κάνει τα πάντα εξαιρετικά γρήγορα. Και το κάνει. Αλλά λειτουργεί αναγκάζοντάς σας να χρησιμοποιήσετε μια απογυμνωμένη έκδοση CSS, HTML και Java, χωρίς πολύ χώρο για επιλογή. Σας αναγκάζει να βασιστείτε στο δίκτυο παράδοσης περιεχομένου της Google, το οποίο είναι γρήγορο αλλά αλλάζει όλες τις διευθύνσεις URL σας σε αυτές της Google. Και πρέπει να γίνετε αρκετά χακαρισμένοι για να αποκτήσετε ακόμη και απλά πράγματα όπως φόρμες σε μια σελίδα AMP.

Εάν δημοσιεύετε τακτικά ειδήσεις, αυτό θα μπορούσε να είναι μια καλή επιλογή και ορισμένοι συνιστούν τη χρήση τους για σελίδες προορισμού. Όμως, ως τρόπος επιτάχυνσης του βασικού ιστότοπού σας, είναι λάθος εργαλείο για τη δουλειά.

συμπέρασμα

Η αργή ταχύτητα φόρτωσης ιστότοπου μπορεί να συντρίψει το SEO και τις μετατροπές σας. Η λύση έγκειται στην περικοπή και τον καθαρισμό του βασικού κώδικα του ιστότοπού σας και πολλές από τις διορθώσεις δεν είναι καν τόσο περίπλοκες. Όταν τα κλάσματα του δευτερολέπτου μπορούν να μετρηθούν σε υψηλότερη αναπήδηση, λιγότερες πωλήσεις και δυνητικοί πελάτες και ακόμη και επηρεάζουν SERPs, είναι λογικό να τα αντιμετωπίσετε τώρα.

Εάν άφησα την αγαπημένη σας επιδιόρθωση ταχύτητας φόρτωσης ή θέλετε να προσθέσετε κάτι, επικοινωνήστε με τα σχόλια!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Adblock
    detector