Πώς να σχεδιάσεις μια ιστοσελίδα πριν τη φτιάξεις

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

Πρόχειρο

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

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

Βήμα 1. Όρισε ακριβώς τι πρέπει να κάνει η ιστοσελίδα σου

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

Οι περισσότερες ιστοσελίδες επιχειρήσεων αποτυγχάνουν γιατί προσπαθούν να πετύχουν πολλά πράγματα μαζί. Μια αρχική σελίδα που σπρώχνει τους επισκέπτες προς ένα προϊόν, μια υπηρεσία, ένα newsletter, ένα follow στα social και μια δωρεάν συμβουλευτική δεν δίνει σε κανέναν σαφή κατεύθυνση. Οι επισκέπτες μπερδεύονται και φεύγουν. Όταν έχεις ορίσει καλά το βασικό σου αποτέλεσμα, μπορείς να δουλέψεις αντίστροφα από αυτό. Κάθε σελίδα, κάθε κουμπί, κάθε κείμενο στην ιστοσελίδα είτε στηρίζει αυτό το αποτέλεσμα είτε όχι. Έτσι οι αποφάσεις στην ίδια την κατασκευή παίρνονται πολύ πιο γρήγορα.

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

Βήμα 2. Δες πέντε ιστοσελίδες ανταγωνιστών πριν σχεδιάσεις τη δική σου

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

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

Αυτή η έρευνα παίρνει περίπου 30 λεπτά και θα καθορίσει άμεσα ποιες σελίδες θα φτιάξεις, σε ποιες ερωτήσεις πρέπει να απαντούν τα κείμενά σου και πού έχεις πραγματική ευκαιρία να ξεχωρίσεις. Μην την παραλείψεις.

Βήμα 3. Φτιάξε τον χάρτη της ιστοσελίδας πριν ανοίξεις δημιουργό

Ο χάρτης ιστοσελίδας (sitemap) είναι απλώς μια λίστα με κάθε σελίδα που χρειάζεται η ιστοσελίδα σου, οργανωμένη ιεραρχικά. Δεν χρειάζεται να είναι διάγραμμα. Μια απλή λίστα στην εφαρμογή σημειώσεων αρκεί. Σημασία έχει να έχεις ονομάσει κάθε σελίδα και να τις έχεις ομαδοποιήσει λογικά πριν αρχίσεις να χτίζεις.

Για τις περισσότερες ιστοσελίδες μικρών επιχειρήσεων, η δομή μοιάζει κάπως έτσι. Μια αρχική σελίδα. Μια ενότητα υπηρεσιών ή προϊόντων. Μια σελίδα «Σχετικά με εμάς». Μια σελίδα επικοινωνίας. Ένα blog, αν το περιεχόμενο είναι μέρος της στρατηγικής. Καθεμία από αυτές μπορεί να έχει υποσελίδες, ανάλογα με την πολυπλοκότητα της προσφοράς.

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

Βήμα 4. Γράψε το βασικό κείμενο πριν αγγίξεις τον σχεδιασμό

Αυτή είναι η απόφαση σχεδιασμού που οι περισσότεροι κάνουν ανάποδα, και είναι αυτή που αλλάζει περισσότερο το τελικό αποτέλεσμα.

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

Δεν χρειάζεσαι τέλειο τελικό κείμενο σε αυτό το στάδιο. Χρειάζεσαι πραγματικό κείμενο. Γράψε έναν τίτλο για την αρχική που περιγράφει πραγματικά τι κάνεις. Γράψε δύο προτάσεις για κάθε υπηρεσία. Γράψε μια σύντομη ενότητα «Σχετικά με εμάς». Γράψε τι θέλεις να κάνουν οι άνθρωποι στη σελίδα επικοινωνίας και γιατί να το κάνουν. Ακόμα και πρόχειρες εκδοχές είναι απείρως πιο χρήσιμες από κείμενο-παράδειγμα όταν κάτσεις να χτίσεις.

Βήμα 5. Σχεδίασε τη διαδρομή του επισκέπτη, όχι μόνο τη λίστα σελίδων

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

Για κάθε βασική σελίδα, γράψε πού θέλεις να πάει ο επισκέπτης από εκεί. Κάποιος μπαίνει στην αρχική: πηγαίνει στις υπηρεσίες, στις τιμές ή κατευθείαν στη φόρμα επικοινωνίας; Διαβάζει ένα άρθρο: υπάρχει σαφές επόμενο βήμα που τον φέρνει πιο κοντά στο να γίνει πελάτης; Μπαίνει στη σελίδα «Σχετικά με εμάς»: υπάρχει σύνδεσμος που τον τραβά προς κάτι που οδηγεί σε ενέργεια;

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

Βήμα 6. Διάλεξε πλατφόρμα με βάση το πού θα είσαι σε δύο χρόνια, όχι το πού είσαι σήμερα

Οι περισσότεροι διαλέγουν δημιουργό ιστοσελίδων με βάση αυτό που χρειάζονται τώρα. Ένα χρόνο μετά χρειάζονται μια λειτουργία που η πλατφόρμα δεν υποστηρίζει, όπως e-shop, κρατήσεις, blog ή περιεχόμενο σε πολλές γλώσσες, και ξαφνικά αντιμετωπίζουν μια μεταφορά που δεν είχαν προγραμματίσει.

Η αλλαγή πλατφόρμας είναι πιο επίπονη απ' ό,τι φαίνεται στα χαρτιά. Τα URL σου αλλάζουν, κάτι που κλονίζει την κατάταξή σου στην αναζήτηση όσο οι μηχανές αναζήτησης ξαναευρετηριάζουν τα πάντα. Ο σχεδιασμός πρέπει να ξαναφτιαχτεί από την αρχή, γιατί τα θέματα δεν μεταφέρονται. Το περιεχόμενο συνήθως πρέπει να ξαναπληκτρολογηθεί με το χέρι, γιατί οι μορφές εξαγωγής σπάνια ταιριάζουν ανάμεσα στις πλατφόρμες. Όλη η διαδικασία παίρνει εβδομάδες και μπορεί να γυρίσει πίσω την πρόοδο στο SEO που χτίζει αθόρυβα η ιστοσελίδα σου.

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

Πώς σε βοηθά το WEMASY να περάσεις από το σχέδιο στην ιστοσελίδα που είναι live

Όταν έχεις το σχέδιό σου, ο δημιουργός ιστοσελίδων του WEMASY σου δίνει ένα περιβάλλον χωρίς κώδικα για να το υλοποιήσεις. Μπορείς να στήσεις την πλοήγησή σου με βάση τον χάρτη ιστοσελίδας, να επικολλήσεις τα κείμενα που έχεις ήδη γράψει, να φτιάξεις φόρμες, να συνδέσεις το domain σου και να δημοσιεύσεις όταν είσαι έτοιμος. Αν η επιχείρησή σου μεγαλώσει προς e-shop, στατιστικά ή κρατήσεις, αυτές οι λειτουργίες υπάρχουν ήδη στην πλατφόρμα. Δεν χρειάζεται μεταφορά.

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

Συχνές ερωτήσεις

Πόσο πρέπει να διαρκεί ο σχεδιασμός πριν αρχίσεις να χτίζεις;

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

Χρειάζεται πραγματικά να δω ιστοσελίδες ανταγωνιστών πριν σχεδιάσω τη δική μου;

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

Τι πρέπει να περιλαμβάνει ένας βασικός χάρτης ιστοσελίδας;

Για τις περισσότερες μικρές επιχειρήσεις, ξεκίνα με μια αρχική σελίδα, μια ενότητα υπηρεσιών ή προϊόντων, μια σελίδα «Σχετικά με εμάς» και μια σελίδα επικοινωνίας. Πρόσθεσε blog αν το περιεχόμενο είναι μέρος της στρατηγικής σου, και ξεχωριστές υποσελίδες για μεμονωμένες υπηρεσίες ή κατηγορίες προϊόντων αν η προσφορά είναι σύνθετη. Ο χάρτης δεν χρειάζεται να είναι επίσημο διάγραμμα. Μια απλή λίστα στην εφαρμογή σημειώσεων αρκεί. Σημασία έχει ότι κάθε σελίδα έχει όνομα και είναι οργανωμένη πριν ανοίξεις τον δημιουργό.

Πρέπει το κείμενο να είναι τελειωμένο πριν αρχίσω να χτίζω;

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

Ποιο είναι το πιο συνηθισμένο λάθος σχεδιασμού που κάνουν οι μικρές επιχειρήσεις;

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

Βάλ’ το αμέσως σε εφαρμογή
στη δική σου ιστοσελίδα.

Ξεκίνα δωρεάν με το WEMASY και φτιάξε τη σελίδα σου σε λίγα λεπτά.