Mobile-first δεν σημαίνει «να χωράει και σε κινητό». Σημαίνει ότι η μικρή οθόνη είναι η κανονική οθόνη — και ο υπολογιστής είναι η εξαίρεση.
Αυτό αλλάζει τη σειρά των αποφάσεων: τι μπαίνει πρώτο, τι κόβεται, πόσο μεγάλο είναι το κουμπί. Και το κρίσιμο: η Google αξιολογεί το site σου με βάση την έκδοση για κινητό, όχι αυτή που βλέπεις στον υπολογιστή σου.
Θέλεις να δεις πώς φαίνεται το site σου σε κινητό;
Στείλε μας τη διεύθυνσή σου και θα σου γυρίσουμε έλεγχο με τα σημεία που χάνεις αιτήματα.
Τι αλλάζει πραγματικά στη διάταξη
Δεν είναι «τα ίδια πράγματα, πιο μικρά». Είναι διαφορετική ιεράρχηση.
| Στοιχείο | Σε υπολογιστή | Σε κινητό |
|---|---|---|
| Επικοινωνία | Στο πάνω μέρος | Ορατό κουμπί κλήσης, πάντα |
| Μενού | Οριζόντιο, όλα ορατά | 5–7 επιλογές, όχι 15 |
| Στήλες | 2–3 δίπλα-δίπλα | Μία, με σειρά προτεραιότητας |
| Πίνακες | Πλήρεις | Κάθετη μορφή ή κύλιση |
| Εικόνες | Μεγάλες, διακοσμητικές | Λίγες, λειτουργικές |
| Κείμενο | Παράγραφοι 5–6 σειρών | 2–3 προτάσεις |
Η πρώτη γραμμή είναι η πιο κερδοφόρα αλλαγή σε τοπική επιχείρηση. Ένα κουμπί «Κλήση» που δεν φεύγει καθώς σκρολάρεις μετατρέπει περισσότερο από κάθε σχεδιαστική βελτίωση.
Τα μεγέθη που μετράνε
Τρία νούμερα που λύνουν τα μισά προβλήματα:
- Κουμπιά και σύνδεσμοι: τουλάχιστον 44×44 pixels. Μικρότερα και ο χρήστης πατά λάθος πράγμα.
- Απόσταση ανάμεσα σε πατήματα: 8 pixels και πάνω. Δύο σύνδεσμοι κολλητά είναι εγγυημένο λάθος πάτημα.
- Κείμενο: από 16 pixels. Κάτω από αυτό, το κινητό κάνει zoom μόνο του και χαλάει η διάταξη.
Και ένας κανόνας θέσης: ό,τι πατιέται συχνά πάει στο κάτω μισό της οθόνης. Εκεί φτάνει ο αντίχειρας χωρίς να αλλάξει κράτημα.
Οι φόρμες: εκεί χάνονται τα αιτήματα
Μια φόρμα που στον υπολογιστή θέλει 20 δευτερόλεπτα, στο κινητό θέλει δύο λεπτά — αν είναι λάθος στημένη.
Τι διορθώνεις σήμερα:
- Λιγότερα πεδία. Όνομα και τηλέφωνο αρκούν για να ξεκινήσει η συζήτηση.
- Σωστό πληκτρολόγιο ανά πεδίο. Αριθμητικό για τηλέφωνο, email για email. Είναι μία ρύθμιση.
- Αυτόματη συμπλήρωση ενεργή. Ο χρήστης δεν πληκτρολογεί διεύθυνση από την αρχή.
- Έλεγχος λαθών δίπλα στο πεδίο, όχι μήνυμα στην κορυφή μετά την υποβολή.
- Ένα πεδίο ανά γραμμή. Δύο δίπλα-δίπλα δεν λειτουργούν σε στενή οθόνη.
Το δεύτερο είναι το πιο υποτιμημένο: όταν ανοίγει γραμματοσειρά αντί για αριθμητικό πληκτρολόγιο για ένα τηλέφωνο, ένα ποσοστό των χρηστών παραιτείται εκεί.
Η συνολική δομή σελίδας που μετατρέπει είναι στο landing page.
Το μενού και η πλοήγηση
Το κρυφό μενού («χάμπουργκερ») δεν είναι λάθος, αλλά κρύβει επιλογές. Γι’ αυτό:
- Τα 5–7 σημαντικότερα μέσα στο μενού, τίποτα άλλο.
- Οι δύο κρίσιμες ενέργειες έξω από το μενού: κλήση και κύρια υπηρεσία.
- Αναζήτηση ορατή αν έχεις πάνω από 30 σελίδες ή προϊόντα.
- Διαδρομή επιστροφής σε κάθε σελίδα, ώστε να μη χρειάζεται το κουμπί πίσω.
Αν το site σου έχει e-shop, η δομή κατηγοριών αλλάζει τα πάντα σε κινητό — δες τι πρέπει να έχει μια σελίδα στο τι πρέπει να έχει μια ιστοσελίδα.
Τι σημαίνει mobile-first indexing για σένα
Η Google σαρώνει και αξιολογεί κυρίως την έκδοση κινητού. Πρακτικά:
- Ό,τι κρύβεις στο κινητό, μπορεί να μη μετρήσει. Αν έκοψες κείμενο για λόγους χώρου, το έκοψες και από την αξιολόγηση.
- Οι ίδιες πληροφορίες πρέπει να υπάρχουν και στις δύο εκδόσεις: τίτλοι, περιγραφές, δομημένα δεδομένα.
- Οι εικόνες θέλουν εναλλακτικό κείμενο και στη μικρή έκδοση.
Ο συνήθης λόγος πτώσης μετά από ανασχεδιασμό είναι ακριβώς αυτό: το νέο site είναι ωραιότερο και έχει τα μισά κείμενα.
Θέλεις έλεγχο πριν από ανασχεδιασμό;
Πες μας τι σχεδιάζεις και θα σου πούμε τι πρέπει να διατηρηθεί.
Ο έλεγχος των 60 δευτερολέπτων
Κάν’ τον τώρα, από το δικό σου κινητό, με δεδομένα κινητής και όχι wifi.
- Άνοιξε την αρχική. Καταλαβαίνεις τι κάνει η επιχείρηση χωρίς κύλιση;
- Βρες το τηλέφωνο. Σε πόσα πατήματα; Πάνω από ένα, είναι πρόβλημα.
- Πάτα ένα κουμπί με τον αντίχειρα. Πέτυχες με την πρώτη;
- Διάβασε μια παράγραφο. Χρειάστηκε zoom;
- Συμπλήρωσε τη φόρμα. Άνοιξε σωστό πληκτρολόγιο;
- Δες μια σελίδα υπηρεσίας ή προϊόντος. Φαίνεται η τιμή ή το επόμενο βήμα;
Κάθε «όχι» είναι μια συγκεκριμένη διόρθωση, όχι ανασχεδιασμός. Τα υπόλοιπα συνηθισμένα λάθη είναι στα λάθη ιστοσελίδας.
Συχνές ερωτήσεις
Το site μου είναι responsive. Αρκεί;
Responsive σημαίνει ότι προσαρμόζεται. Mobile-first σημαίνει ότι σχεδιάστηκε για εκεί. Τα περισσότερα responsive site είναι σμικρύνσεις της έκδοσης υπολογιστή.
Χρειάζομαι ξεχωριστή έκδοση για κινητό;
Όχι. Οι ξεχωριστές διευθύνσεις για κινητό είναι ξεπερασμένη πρακτική και δημιουργούν προβλήματα.
Πόσο κοστίζει η διόρθωση;
Οι στοχευμένες αλλαγές (κουμπιά, φόρμες, μενού) κινούνται τυπικά στα 300€–1.200€. Πλήρης ανασχεδιασμός είναι άλλη συζήτηση.
Η ταχύτητα είναι το ίδιο θέμα;
Συγγενικό αλλά διαφορετικό. Ένα site μπορεί να φορτώνει γρήγορα και να είναι άχρηστο στο κινητό — δες την ταχύτητα ιστοσελίδας.
Τι κάνω με τα PDF;
Άσχημη εμπειρία σε κινητό. Ό,τι πρέπει να διαβαστεί, γίνεται κανονική σελίδα· το PDF μένει μόνο για λήψη.
Το πρώτο βήμα
Δώσε το κινητό σου σε κάποιον που δεν ξέρει τη δουλειά σου και ζήτησέ του να βρει πώς επικοινωνεί μαζί σου. Μη βοηθήσεις.
Ό,τι τον δυσκόλεψε, δυσκολεύει και κάθε πελάτη σου — απλώς εκείνοι φεύγουν χωρίς να στο πουν.
Επόμενο βήμα
Κλείσε δωρεάν κλήση 30 λεπτών με την ομάδα του The Dev Alley. Θα δούμε το site σου σε κινητό και θα σου δείξουμε τι διορθώνεται γρήγορα.