Η αυτόματη συμπλήρωση και τα προσυμπληρωμένα πεδία είναι δύο τρόποι να μειώσεις το πληκτρολόγιο που χρειάζεται να κάνουν οι επισκέπτες. Η αυτόματη συμπλήρωση δουλεύει από την πλευρά του browser. Τα προσυμπληρωμένα πεδία δουλεύουν από το backend σου. Μαζί, ανεβάζουν σημαντικά τα ποσοστά ολοκλήρωσης.
Αυτό το κεφάλαιο εξηγεί τι κάνουν και τα δύο, πώς δουλεύουν, πότε να χρησιμοποιείς το καθένα και πώς να τα εφαρμόσεις σωστά.
Τα μετρήσιμα οφέλη της αυτόματης συμπλήρωσης και των προσυμπληρωμένων πεδίων
Μια μελέτη των Chrome Developers παρακολούθησε χιλιάδες φόρμες στις Ηνωμένες Πολιτείες. Όταν οι επισκέπτες χρησιμοποιούν την αυτόματη συμπλήρωση του browser, ολοκληρώνουν τις φόρμες περίπου 35% πιο γρήγορα. Το ποσοστό εγκατάλειψής τους πέφτει περίπου 75%, ακόμη κι όταν η αυτόματη συμπλήρωση γεμίζει μόνο μέρος της φόρμας. Οι χρήστες πρέπει ακόμη να ελέγξουν και να επιβεβαιώσουν αυτό που συμπλήρωσε ο browser, αλλά η μείωση της προσπάθειας πληκτρολόγησης κάνει τη διαφορά.
Σε ένα σύνολο δεδομένων από πολλούς τύπους φορμών, το 23% των χρηστών ενεργοποίησε την αυτόματη συμπλήρωση στη διαδρομή του στη φόρμα. Αυτοί οι χρήστες ολοκλήρωσαν τη φόρμα στο 71% των περιπτώσεων. Για τους επισκέπτες που δεν χρησιμοποίησαν αυτόματη συμπλήρωση, το ποσοστό ολοκλήρωσης ήταν 59%. Αυτή η διαφορά 12 ποσοστιαίων μονάδων μαζεύεται γρήγορα όταν τρέχεις φόρμες σε μεγάλη κλίμακα.
Τα προσυμπληρωμένα πεδία δείχνουν παρόμοια κίνηση. Όταν μια φόρμα εμφανίζεται μερικώς συμπληρωμένη, οι χρήστες είναι πιο πιθανό να την ολοκληρώσουν απ' ό,τι όταν βλέπουν μια κενή φόρμα. Αυτό δουλεύει γιατί το να ολοκληρώσεις κάτι που ήδη κινείται φαίνεται πιο εύκολο από το να ξεκινήσεις από λευκό χαρτί.
Πώς δουλεύει η αυτόματη συμπλήρωση και τι χρειάζεται να κάνεις για να την υποστηρίξεις
Οι περισσότεροι επισκέπτες σήμερα χρησιμοποιούν browser με αυτόματη συμπλήρωση. Το έχουν Chrome και οι άλλοι μεγάλοι browsers. Πολλοί χρησιμοποιούν διαχειριστές κωδικών, που επεκτείνουν ακόμη περισσότερο τη δυνατότητα αυτόματης συμπλήρωσης. Η αυτόματη συμπλήρωση όμως δουλεύει μόνο αν η φόρμα σου είναι στημένη να τη δέχεται.
Ο browser κοιτάζει το όνομα κάθε πεδίου εισαγωγής και το χαρακτηριστικό type. Αν το πεδίο σου λέγεται κάτι γενικό όπως "field1" ή "input2", ο browser δεν έχει ιδέα με τι να το γεμίσει. Αν το ονομάσεις "email" και ορίσεις type "email", ο browser ξέρει. Αν το ονομάσεις "shipping_address_line_1" και ορίσεις το χαρακτηριστικό autocomplete σε "address-line1", ο browser ξέρει ακριβώς τι να βάλει εκεί.
Το HTML σου πρέπει να ταιριάζει με αυτό που περιμένουν οι browsers. Χρησιμοποίησε τυπικά ονόματα πεδίων. Όρισε το σωστό χαρακτηριστικό type (email, tel, number, text). Πρόσθεσε το χαρακτηριστικό autocomplete με τη σωστή τιμή για κάθε πεδίο. Τα πιο συνηθισμένα που περιμένουν οι χρήστες να χειρίζεται η αυτόματη συμπλήρωση περιλαμβάνουν πεδία email (type="email" και autocomplete="email"), πεδία τηλεφώνου (type="tel" και autocomplete="tel"), πεδία διεύθυνσης (συγκεκριμένες τιμές autocomplete όπως autocomplete="address-line1" για την οδό, autocomplete="address-level1" για την πολιτεία, autocomplete="postal-code" για τον ταχυδρομικό κώδικα) και πεδία ονόματος (type="text" και είτε autocomplete="given-name" για το μικρό όνομα είτε autocomplete="family-name" για το επώνυμο).
Αν η φόρμα σου παραλείπει εντελώς το χαρακτηριστικό autocomplete, οι browsers θα προσπαθήσουν πάλι να μαντέψουν με βάση τα ονόματα των πεδίων. Οι ρητές τιμές autocomplete όμως δουλεύουν καλύτερα. Η επένδυση στη σωστή ρύθμιση αυτών των χαρακτηριστικών αποδίδει κάθε φορά που ο browser κάποιου γεμίζει τη διεύθυνσή του χωρίς να τη γράψει.
Πώς δουλεύουν τα προσυμπληρωμένα πεδία και πότε βοηθούν πραγματικά
Τα προσυμπληρωμένα πεδία δουλεύουν καλύτερα όταν ο χρήστης ξέρει ότι έχεις την πληροφορία. Αν κάποιος έχει συνδεθεί στον λογαριασμό του, περιμένει το τηλέφωνο και το όνομά του να είναι ήδη εκεί. Αν πάτησε έναν σύνδεσμο σε ένα email που έλεγε "Επιβεβαίωσε τη διεύθυνσή σου", περιμένει να εμφανιστεί προσυμπληρωμένη η διεύθυνση. Τα δεδομένα δεν είναι έκπληξη.
Προσυμπλήρωσε κοινά πεδία που οι χρήστες σου έχουν ήδη δώσει. Το email αν γράφτηκαν με email. Το όνομα της εταιρείας αν εγγράφηκαν με εταιρεία. Κάθε διεύθυνση που έχεις ήδη ζητήσει. Άφησε κενά τα πεδία που ζητούν νέες πληροφορίες. Ο επισκέπτης θέλει να δει ότι θυμήθηκες αυτά που σου είπε, αλλά θέλει και έλεγχο πάνω σε αυτά που μπαίνουν στη φόρμα που πρόκειται να στείλει.
Η διαφάνεια έχει σημασία εδώ. Κάν' το σαφές γιατί αυτά τα πεδία είναι προσυμπληρωμένα. Το "Έχουμε το όνομα της εταιρείας σου στα αρχεία μας" ή το "Αυτή είναι η διεύθυνση που μας έδωσες την προηγούμενη φορά" παίρνει δύο δευτερόλεπτα να προστεθεί ως μικρή σημείωση πάνω από τη φόρμα και αφαιρεί τη σύγχυση. Η τριβή εμφανίζεται όταν τα πεδία φαίνονται συμπληρωμένα χωρίς συναίνεση.
Πότε να συγκρατηθείς στην προσυμπλήρωση και τι μπορεί να πάει στραβά
Τα προσυμπληρωμένα πεδία δουλεύουν μόνο όταν τα δεδομένα είναι ακριβή και τρέχοντα. Αν ένας επισκέπτης άλλαξε το τηλέφωνό του αλλά η φόρμα τραβά από μια παλιά βάση δεδομένων, βλέπει λάθος πληροφορίες και πρέπει να τις διορθώσει. Αυτή η τριβή ακυρώνει τον σκοπό. Δώσε πάντα στους χρήστες τη δυνατότητα να επεξεργαστούν και να διορθώσουν τα προσυμπληρωμένα δεδομένα. Μην κλειδώνεις ποτέ ένα πεδίο αναγκάζοντάς τους να επικοινωνήσουν με την υποστήριξη για να το αλλάξουν.
Αν δεν είσαι σίγουρος για την ακρίβεια των δεδομένων, προσυμπλήρωσε μόνο τα πεδία που ενημερώνεις τακτικά και άφησε τα υπόλοιπα κενά. Για ρυθμιζόμενους κλάδους όπως οι χρηματοοικονομικές υπηρεσίες ή η υγεία, παράλειψε την προσυμπλήρωση ευαίσθητων πεδίων ακόμη κι αν έχεις τα δεδομένα. Μην προσυμπληρώνεις τρόπους πληρωμής στην ολοκλήρωση αγοράς, εκτός αν ο επισκέπτης έχει αποθηκεύσει συγκεκριμένα αυτόν τον τρόπο. Ο στόχος είναι να μειώσεις την τριβή για τους επισκέπτες, όχι να δημιουργήσεις την ψευδαίσθηση μιας ολοκληρωμένης φόρμας.
Χρήση αυτόματης συμπλήρωσης και προσυμπληρωμένων πεδίων μαζί για μέγιστο αποτέλεσμα
Η πιο δυνατή προσέγγιση χρησιμοποιεί και τα δύο ταυτόχρονα. Για επισκέπτες που έχουν συνδεθεί, προσυμπλήρωσε τα δεδομένα που έχει το σύστημά σου. Για επισκέπτες που χρησιμοποιούν νέο browser ή συσκευή, φρόντισε να έχεις ορίσει σωστά τα χαρακτηριστικά autocomplete ώστε να δουλέψει η αυτόματη συμπλήρωση του browser τους. Κάποιοι επισκέπτες θα δουν προσυμπληρωμένα δεδομένα. Κάποιοι θα χρησιμοποιήσουν την αυτόματη συμπλήρωση του browser. Κάποιοι θα κάνουν και τα δύο. Κι έτσι κι αλλιώς, η φόρμα απαιτεί λιγότερο πληκτρολόγιο και τα ποσοστά ολοκλήρωσης βελτιώνονται.
Οι διαφορετικοί επισκέπτες φτάνουν σε διαφορετική κατάσταση. Ένας πελάτης που επιστρέφει και έχει συνδεθεί είναι ένα σενάριο. Ένας νέος επισκέπτης στην πρώτη του αλληλεπίδραση είναι άλλο. Ένας επισκέπτης που επιστρέφει από νέα συσκευή είναι τρίτο. Ο καθένας ωφελείται από τον έναν μηχανισμό ή τον άλλον. Μαζί, δημιουργούν μια εμπειρία φόρμας που φαίνεται αποδοτική όποια διαδρομή κι αν ακολουθήσει ο επισκέπτης.
Τι αξίζει να προσυμπληρώνεις και τι να αφήνεις κενό
Η αυτόματη συμπλήρωση και η προσυμπλήρωση είναι πιο αποτελεσματικές για γενικές πληροφορίες. Email, τηλέφωνο, όνομα, διεύθυνση, όνομα εταιρείας, ταχυδρομικός κώδικας. Αυτά τα πεδία εμφανίζονται σε πολλές φόρμες, οπότε και οι επισκέπτες και οι browsers ωφελούνται όταν τα θυμούνται.
Για ευαίσθητες πληροφορίες, γίνε επιλεκτικός. Οι χρηματοοικονομικές φόρμες δεν πρέπει να προσυμπληρώνουν τρόπους πληρωμής, εκτός αν ο επισκέπτης έχει αποθηκεύσει ρητά έναν. Οι φόρμες υγείας δεν πρέπει να προσυμπληρώνουν ιατρικό ιστορικό. Τα πεδία ασφαλείας όπως οι κωδικοί δεν πρέπει ποτέ να προσυμπληρώνονται χειροκίνητα (οι διαχειριστές κωδικών το χειρίζονται αυτόματα). Αν ο κλάδος σου έχει απαιτήσεις συμμόρφωσης, ακολούθησε τις οδηγίες ανεξάρτητα από τα οφέλη ευκολίας.
Πώς να μετρήσεις τον αντίκτυπο στα ποσοστά ολοκλήρωσής σου
Δεν μπορείς να δεις στις αποστολές της φόρμας σου αν ένας επισκέπτης χρησιμοποίησε αυτόματη συμπλήρωση ή όχι. Μπορείς όμως να μετρήσεις τον αντίκτυπο συγκρίνοντας τα ποσοστά ολοκλήρωσης πριν και μετά την υποστήριξη αυτόματης συμπλήρωσης. Αν σήμερα ο κώδικάς σου δεν είναι φιλικός προς την αυτόματη συμπλήρωση, ρύθμισε σωστά τα χαρακτηριστικά autocomplete. Μέτρα το ποσοστό ολοκλήρωσης για μία εβδομάδα και μετά σύγκρινέ το με την επόμενη εβδομάδα. Πρέπει να εμφανιστεί μια μετρήσιμη αύξηση.
Για τα προσυμπληρωμένα πεδία, η δοκιμή είναι παρόμοια. Αν μπορείς να τμηματοποιήσεις το κοινό σου, δείξε σε κάποιους επισκέπτες προσυμπληρωμένα δεδομένα και σε άλλους κενά πεδία. Το ποσοστό ολοκλήρωσης πρέπει να είναι υψηλότερο για την ομάδα με τα προσυμπληρωμένα. Αν δεν είναι, είτε τα δεδομένα σου είναι ανακριβή είτε ο αριθμός των πεδίων που προσυμπληρώνεις δημιουργεί σύγχυση αντί για δυναμική.
Συχνές ερωτήσεις
Δουλεύει η αυτόματη συμπλήρωση το ίδιο στο κινητό όπως στον υπολογιστή;
Είναι ασφαλές να χρησιμοποιώ αυτόματη συμπλήρωση σε πεδία κωδικού;
Μπορώ να προσυμπληρώσω μια φόρμα μέσω παραμέτρου URL;
Τι γίνεται αν τα δεδομένα της αυτόματης συμπλήρωσης είναι λάθος;
Μειώνει η προσυμπλήρωση μιας φόρμας την ποιότητα δεδομένων ή εισάγει παλιές πληροφορίες;
Ποιοι τύποι φορμών ωφελούνται περισσότερο από την αυτόματη συμπλήρωση και την προσυμπλήρωση;
Η αυτόματη συμπλήρωση και τα προσυμπληρωμένα πεδία δίνουν μετρήσιμα αποτελέσματα. Η βελτίωση ταχύτητας 35% και η μείωση εγκατάλειψης 75% αφορούν τους επισκέπτες που τα χρησιμοποιούν. Δουλεύουν καλύτερα μαζί με μια σύντομη φόρμα και καθαρές ετικέτες. Μαζί, αυτά τα τρία στοιχεία πολλαπλασιάζουν σημαντικά τα κέρδη ολοκλήρωσης.
Μάθε περισσότερα για τη μείωση του μήκους φόρμας στον πλήρη οδηγό για το ιδανικό μήκος φόρμας. Για την τεχνική υλοποίηση, δες πώς να προσυμπληρώνεις φόρμες με δεδομένα χρήστη. Για την ευρύτερη στρατηγική βελτιστοποίησης, εξερεύνησε τον οδηγό βελτιστοποίησης ποσοστού μετατροπής φόρμας.