Google AMP - Μείωση κατά 70% του ποσοστού μετατροπών μας.

Αυγό. Επί. Πρόσωπο. Μόλις τελειώσαμε με λιγότερα από 3 άρθρα και 3 βίντεο από το YouTube που καυχιέται για το πόσο μεγάλη είναι η δουλειά μου στο σχεδιασμό για να επιτύχουμε 500% βελτίωση στο ρυθμό μετατροπής μας.

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

Ας μιλήσουμε για το Google AMP. Το AMP σημαίνει Accelerated-Mobile-Pages. Πρόκειται για μια τεχνολογία που η Google παρουσίασε αρχικά για να επιτύχει τους προγραμματιστές ιστού να επιταχύνουν τις ιστοσελίδες τους για κινητές συσκευές και δίκτυα κινητής τηλεφωνίας. Αλλά με πολλούς τρόπους μοιάζει με μεγάλη τεχνολογία για οποιαδήποτε συσκευή ή δίκτυο. Ποιος δεν θέλει γρήγορους ιστότοπους;

Δεν υπάρχει τίποτα μαγικό γι 'αυτό. Ένα μεγάλο μέρος της ενίσχυσης της απόδοσης είναι απλά τα πρότυπά της: δεν javascript, όλα inline CSS, και το CSS μπορεί να μετρήσει μόνο 50KB ή λιγότερο. Πρόκειται να κάνετε οποιαδήποτε φόρτωση σελίδας γρηγορότερα με αυτές τις απαιτήσεις.

Αλλά η Google φιλοξενεί επίσης σελίδες AMP από το δικό τους CDN. Έτσι, ορισμένες σελίδες που εισάγετε από τα οργανικά αποτελέσματα αναζήτησης (και τώρα οι διαφημίσεις Google) θα προβάλλουν στην πραγματικότητα τη σελίδα σας από τους δικούς της διακομιστές της Google. Ναι! Αυτό πρέπει να είναι γρήγορο.

Στις οργανικές τοποθετήσεις (και πρόσφατα καταβληθείσες) της σελίδας σας, υπάρχει ακόμα και ένα έξυπνο εικονίδιο με βλήματα AMP.

Και έχει ειπωθεί ότι η Google μπορεί να κατατάσσει αυτές τις τοποθετήσεις υψηλότερα από τις σελίδες που δεν ανήκουν στην AMP.

Ας πάρουμε για αυτό!

Έτσι λοιπόν, πέρασα τις τελευταίες δύο εβδομάδες που έγιναν βαθιά στην ανακατασκευή των εμπειριών της σελίδας προορισμού στο Google AMP. Ήμουν ψυχισμένος. Ήμουν ήδη ψηλά στις προηγούμενες νίκες μου, και τώρα τα πράγματα πρέπει να γίνουν ακόμα καλύτερα. Οι πρώτες δοκιμές φαίνονταν θετικές. 100% στο φάρο του Google Chrome (ένα εργαλείο ελέγχου απόδοσης που έχει ψηθεί στο πρόγραμμα περιήγησης). Ευθεία Από το webpagetest.org. Φέρτε την κυκλοφορία από αυτούς τους επισκέπτες που ευλόγησε η Google μπροστά μου!

Κρίκετ.

Όχι ακριβώς τους γρύλους, αλλά η ροή μολύβδου γρήγορα (και στατιστικά) επιβραδύνθηκε. Ίσως μόνο τις καλοκαιρινές διακοπές; Όχι, όχι επειδή συγκρίνω τους αριθμούς μας με κάποια μεγάλη απόδοση μετατροπής που είχε συμβεί κατά τη διάρκεια των διακοπών των ΗΠΑ. Αυτό ήταν πραγματικά κακό.

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

Είναι μια απάτη;

Ένα πράγμα που θα παρατηρήσετε καθώς πληκτρολογείτε μια σελίδα Google AMP είναι ότι τώρα οι σελίδες σας, εάν έχουν πρόσβαση από μια συσκευή κινητής τηλεφωνίας / tablet, είναι πιθανότατα μέσα στο "Πρόγραμμα προβολής Google AMP".

google.com βρίσκεται στη γραμμή διεύθυνσης URL με κάποια επιπλέον χρώμιο UI στο επάνω μέρος. Τώρα, η κατοχή google.com μπορεί να είναι σήμα εμπιστοσύνης για τους λαούς.

Αλλά είναι όλη την ώρα;

Έχω μια αίσθηση όχι σε πολλές περιπτώσεις. Για την ανάγνωση των ειδήσεων είναι ωραία. Αλλά προσπαθώ να εδραιώσω την εταιρεία μου ως νόμιμη επιχείρηση που μπορεί να εμπιστευτεί κάποιος ξένος για να χτίσει λογισμικό για αυτούς. Έχοντας google.com reeks μιας απάτης ηλεκτρονικού "ψαρέματος" (phishing scam) ή να πετάξει από νυχτερινή λειτουργία που δεν θα μπορούσε να αντέξει το δικό της domain. Κάνοντας κλικ στο "μενού χάμπουργκερ", μια τυπική πρακτική σχεδιασμού τώρα, δεν βοηθά.

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

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

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

Ίσως η AMP να είναι πραγματικά σπασμένη.

Η δοκιμή σελίδων AMP δεν είναι επίσης το πιο απλό πράγμα στον κόσμο. Μερικές φορές οι σελίδες σας προβάλλονται από τον τομέα σας, μερικές φορές δεν είναι και είναι από το CDN της Google. Έτσι, βεβαιωθείτε ότι δοκιμάζετε διεξοδικά και από τις δύο.

Ένα πράγμα που μπορείτε να κάνετε για να δοκιμάσετε τις σελίδες σας είναι να χρησιμοποιήσετε τον εξομοιωτή συσκευής του Google Chrome για να μιμηθεί μια συσκευή κινητού ή tablet.

Αυτό μπορεί να είναι δύσκολο για σας. Θα πρέπει πρώτα να βρείτε την ιστοσελίδα σας μέσω της Google. Αναζητήστε το ελπίζω με λέξεις-κλειδιά που θα φέρουν τον ιστότοπό σας στα κορυφαία αποτελέσματα. Κάντε κλικ σε εκείνη την οργανική λίστα και μπορείτε να δοκιμάσετε τον ιστότοπό σας.

Αλλά ένα πρόβλημα. Μερικές φορές έχω κενές σελίδες.

Δεν υπάρχει τίποτα στην κονσόλα Javascript για σφάλματα (το AMP έχει το δικό του Javascript από το δρόμο). Νόμιζα ότι ήταν απλώς ένα quirk να κάνει μια δοκιμή σε ένα εξομοιωτή, αλλά τώρα δεδομένη απόδοση απόδοση του ρυθμού μου δεν είμαι τόσο σίγουρος.

Υπάρχουν πολλά θέματα σχετικά με αυτό το ζήτημα.

Η πρώτη συμβουλή είναι να μην χρησιμοποιήσετε το html {position: relative}. Δεν ήμουν. Αυτή είναι η μόνη συμβουλή.

Και το πρόβλημα είναι διαλείπον. Δεν υπάρχει κανένας λόγος ή λόγος όταν εμφανίζεται. Επίσης, δεν κατάφερα να το δω με τις λίγες πραγματικές συσκευές στις οποίες έχω δοκιμάσει. Είναι αυτό ένα πραγματικό πρόβλημα στην παραγωγή;

Δεν έχω ιδέα. Αλλά μπορεί να είναι. Έχω δημιουργήσει εξελιγμένες ιστοσελίδες για πάνω από 20 χρόνια, και δεν μπορώ να είμαι καν βέβαιος ότι το Google εξυπηρετεί το περιεχόμενό μου με συνέπεια;

Είναι τα σχέδια πραγματικά τα ίδια.

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

Έτσι λοιπόν πέρασα έναν τόνο χρόνου που αντιπροσώπευε τα sites, αλλά δεν ήταν τέλειο. Για παράδειγμα, σε ένα ορισμένο πλάτος, ο κύριος τίτλος μου πηγαίνει σε 3 γραμμές έναντι 2 στην έκδοση μη AMP.

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

Είναι αυτό το κομμάτι του σχεδιασμού κατασκευασμένο από την AMP; Καθόλου.

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

Τώρα τι? Λοιπόν, εξακολουθώ να είμαι πολύ αρπαγής σχετικά με την έννοια και τα πρότυπα της AMP. Θα ήθελα τις σελίδες να γίνουν όλο και πιο γρήγορα στον ιστό. Υπάρχει μικρός λόγος ότι ένας ιστότοπος μικρής εταιρείας που θα μπορούσε να φορτώσει σε 100ms ως στατικός ιστότοπος όλων των HTML και χωρίς Javascript είναι στην πραγματικότητα εφαρμογή 100MB React

Αλλά διστάζω να αγκαλιάσω πλήρως το Google οικοσύστημα που παίρνει τον ίδιο έλεγχο στον ιστότοπό μου ως AMP. Μου αρέσει το Google και όλοι, αλλά έχω δυσκολευτεί να φορτώσω το Google Analytics για περισσότερο από 24 ώρες χωρίς απάντηση από την "Υποστήριξη": / Θέλω να κατέχουν ακόμη περισσότερα από την επιχείρησή μου;

Τα καλά νέα είναι ότι η Google υποστηρίζει τη λήψη των καλύτερων δυνατοτήτων του AMP και καθιστώντας το ένα πρότυπο που δεν αφορά πραγματικά την Google.

Το Google υπόσχεται ότι οποιαδήποτε ιστοσελίδα που ταιριάζει με την απόδοση μιας σελίδας AMP θα έχει την ίδια ακριβώς επεξεργασία στην αναζήτηση Google.

Έτσι είμαι ενθουσιασμένος που βλέπω πώς αναπτύσσεται αυτός ο χώρος.

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

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

Και θα πρέπει να με ακολουθήσετε στο YouTube: youtube.com/nathankontny όπου μοιράζομαι περισσότερα για το πώς τρέχω μια επιχείρηση, σχεδιάζω το προϊόν, εμπορεύομαι τον εαυτό μου και απλά περνάω τη ζωή.

Αρχικά δημοσιεύθηκε στη διεύθυνση www.rockstarcoders.com στις 8 Αυγούστου 2018.