Ένας σύγχρονος σχεδιασμός για μια ιστοσελίδα σημαίνει καλύτερη αλληλεπίδραση με το κοινό σας και περισσότερες μετατροπές (conversions). Αν ακολουθείτε τα δημοφιλή brands, θα δείτε ότι βελτιώνουν συνεχώς τους ιστοτόπους τους. Εάν έχετε σταματήσει να ανανεώνετε την ιστοσελίδα σας, αφήνετε την επιχείρηση σας να μένει πίσω.
Την περασμένη χρονιά, η ομάδα Visual Composer έκανε την πρώτη της έρευνα σχετικά με τις τάσεις σχεδιασμού ιστοσελίδων. Εταιρείες όπως το HubSpot έχουν δει μεγάλη αξία στα UX animations. Η Asana έχει ανακατασκευάσει πλήρως την διεπαφή(interface) της με gradient overlays. Η Wix ξεκίνησε μια νέα ιστοσελίδα με σχεδιασμό πρωτίστως για κινητά και εξαιρετικά μεγάλα στοιχεία περιεχομένου.
Καθώς προχωράμε στο 2019, είναι καιρός να δούμε τι τάσεις μας περιμένουν εκεί.
Η αγορά σχεδιασμού ιστοσελίδων είναι υπερκορεσμένη με νέες τεχνολογίες και εργαλεία σχεδιασμού. Όπως ποτέ άλλοτε, είμαστε σε θέση να αναπτύξουμε σύνθετα layouts και να εφαρμόσουμε διάφορα εφέ. Ακόμα κι έτσι, τα εργαλεία δεν αρκούν – όλα καταλήγουν στην επιχείρηση.
Οι επιχειρήσεις θέλουν να αναπτύξουν γρήγορες ιστοσελίδες, εύκολες και φιλικές προς τον χρήστη(UX). Όλοι ψάχνουν τρόπους να αυξήσουν τις μετατροπές (conversions). Αυτά είναι τα κύρια σημεία που θα καθορίσουν τις τάσεις σχεδιασμού ιστοσελίδων του 2019.
Micro Animations (and Interactions)
Τα πολύπλοκα animations (κινούμενες εικόνες) ανήκουν στο παρελθόν. Είναι χρονοβόρα και δύσκολο να τεθούν σε εφαρμογή. Οι μικρές επιχειρήσεις δεν μπορούν να το αντέξουν οικονομικά, οι μεγάλες εταιρείες δεν έχουν χρόνο για αυτό.
Υποδεχθείτε τα micro-animations και τις αλληλεπιδράσεις. Μικρά σημεία αλληλεπίδρασης με τους επισκέπτες της ιστοσελίδας σας (όλοι οι UX σχεδιαστές μιλάνε για αυτό). Τα μικρά animations προσελκύουν την προσοχή και αυξάνουν τις μετατροπές.
Προσοχή στις λεπτομέρειες! Οι λεπτομέρειες είναι αυτές που κάνουν έναν ιστότοπο να διαφέρει από έναν άλλον συνηθισμένο. Τα μικρά animations σας βοηθούν να λάβετε feedback, βοηθούν στην επικοινωνία με τους πελάτες και την πλοήγηση τους στην ιστοσελίδα σας.
Οι μικρο-αλληλεπιδράσεις είναι εύκολο να δημιουργηθούν και δεν θα αλλάξουν την ιστοσελίδα σας τόσο πολύ. Έξυπνα τοποθετημένα θα δώσουν μια καλή ώθηση στις μετατροπές (conversions). Γνωρίζουμε ότι ακόμα και μια απλή CSS κίνηση του κουμπιού “Αγοράστε τώρα” μπορεί μερικές φορές να κάνει τη διαφορά.
Ταχύτητα και απόδοση
Η απόδοση έχει γίνει τελικά μια τάση. Όλες οι δημοφιλείς ιστοσελίδες ανταγωνίζονται για τις καλύτερες επιδόσεις. Καλύτερη απόδοση σημαίνει καλύτερη κατάταξη SEO και μείωση της δυσαρέσκειας των χρηστών.
Το να ακούσουμε για μειωμένη απόδοση, λειτουργεί αποτρεπτικά στην επιλογή ενός θέματος ή ενός εργαλείου. Αυτός είναι ο λόγος για τον οποίο κάθε καλό θέμα του WordPress είναι βελτιστοποιημένο για απόδοση.
Αν ψάχνετε για ένα εργαλείο για να σχεδιάσετε μία ιστοσελίδα, εξετάστε αυτά που δημιουργούν καθαρή HTML. Η καθαρή HTML θα διασφαλίσει ότι η ιστοσελίδα σας θα φορτωθεί πολύ πιο γρήγορα.
Προσπαθήστε να αποφύγετε την υπερφόρτωση της ιστοσελίδας σας με τόνους περιεχομένου – η απόδοσή σας μπορεί να μειωθεί δραματικά.
Διαχωρισμός περιεχομένου
Υπάρχουν πολλές βραβευμένες ιστοσελίδες που χωρίζουν τη διάταξη της ιστοσελίδας κάθετα. Σε περίπτωση αμφιβολίας, ανατρέξτε στην ιστοσελίδα Awwwards.
Ο διαχωρισμός λειτουργεί σαν δύο ανεξάρτητα μέρη που επικεντρώνονται σε διαφορετικούς στόχους. Ένα κείμενο που παρέχει πληροφορίες για την εταιρεία ή τις υπηρεσίες σας. Και ένα μέρος, που αποτελείται από εικόνες και γραφικά που χτίζουν έναν συναισθηματικό δεσμό με τους επισκέπτες.
Ο διαχωρισμός περιεχομένου θα σας βοηθήσει να δώσετε και στους δύο τύπους χρηστών αυτό που θέλουν. Εκείνοι που αναζητούν περισσότερες πληροφορίες θα είναι εύκολο να το διαβάσουν. Ενώ άλλου τύπου ακροατήριο θα είναι σε θέση να επικεντρωθεί στο γραφικό μέρος.
Μοναδικά στοιχεία
Κάθε επιχείρηση θέλει τον ιστότοπό της να ξεχωρίζει από το πλήθος. Έχουμε μόνο λίγα δευτερόλεπτα για να κάνουμε εντύπωση.
Τα στοιχεία του brand σας, σας βοηθούν να διαφοροποιηθείτε από τους ανταγωνιστές σας και να δημιουργήσετε έναν δεσμό με το κοινό. Φανταστείτε ένα κουμπί που ταιριάζει απόλυτα με το λογότυπό σας. Η μια παρουσίαση διαφανειών που χρησιμοποιεί bullets από τα γραφικά του brand σας. Με την χρήση αυτών των στοιχείων, η ιστοσελίδα σας θα είναι πλήρης και θα δείχνει ακόμα πιο επαγγελματική.
Το μειονέκτημα αυτής της τάσης είναι ότι θα πρέπει να κάνετε προσαρμοσμένη ανάπτυξη (και ίσως μάλιστα να πρέπει να προσλάβετε έναν web developer).Αυτή η επένδυση όμως αποδίδει έχοντας δημιουργήσει μια μοναδική ιστοσελίδα.
Εάν εργάζεστε με τα εργαλεία σχεδιασμού ιστοσελίδων και builders, αναζητήστε ένα εργαλείο επεκτάσιμο. Ένα επεκτάσιμο εργαλείο σας δίνει την δυνατότητα να δημιουργήσετε το δικό σας σύνολο στοιχείων τα οποία ταιριάζουν στο εμπορικό σήμα σας.
One-Page Layouts
Ζούμε σε ένα δυναμικό περιβάλλον. Οι άνθρωποι δεν έχουν πολύ χρόνο να ξοδέψουν σε μια ιστοσελίδα. Το δικό σας website δεν αποτελεί εξαίρεση.
Οι σχεδιασμοί μιας σελίδας (one-page layout) είναι δημοφιλείς για τη δημιουργία σελίδων προορισμού με υψηλό ποσοστό μετατροπών. Το 2019, περισσότερες ιστοσελίδες θα κοιτάξουν προς αυτή την κατεύθυνση και ίσως θα μετατρέψουν τις κανονικές ιστοσελίδες τους σε σελίδες προορισμού (landing pages).
Μια σελίδα προορισμού (landing pages) σας επιτρέπει να εστιάζετε σε ένα πρόβλημα τη φορά και να ελέγχετε τις πωλήσεις. Είναι επίσης πολύ πιο εύκολο και πιο γρήγορο να ξεκινήσετε έναν ιστότοπο μιας σελίδας(one-page) και να το επεκτείνετε αργότερα.
Σχήματα και Εικόνες
Δεν αρκεί πλέον να έχετε ωραίες εικόνες στον ιστότοπο σας. Οι άνθρωποι θέλουν να δημιουργήσουν έναν συναισθηματικό δεσμό με το brand σας. Κάθε brand έχει τα δικά του μοναδικά σχήματα (τουλάχιστον θα έπρεπε).
Εταιρείες όπως η Asana και η Slack χρησιμοποιούν το πλεονέκτημα των σχημάτων και των εικόνων. Τους βοηθά να δημιουργήσουν ένα δεσμό και να τονίσουν τα πιο σημαντικά μέρη των εργαλείων τους.
Για να ενσωματώσετε αυτήν την τάση, υπάρχουν δύο τρόποι που μπορείτε να εφαρμόσετε. Ο πρώτος τρόπος είναι να εμπλουτίσετε τις εικόνες σας με τα σχήματα που σχετίζονται με το Brand σας. Ο δεύτερος είναι να χρησιμοποιήσετε τα σχήματα ως όρια για τις εικόνες σας. Εισάγετε μάσκες για την εικόνα σας με διάφορες μορφές.
Και οι δύο τρόποι είναι πολύ αποτελεσματικοί, ώστε εξαρτάται από εσάς να επιλέξετε ποιο τρόπο θέλετε να ακολουθήσετε.
“Αταξία” στοιχείων
Ξεχάστε τις αυστηρές δομές. Οι μη δομημένοι σχεδιασμοί είναι ήδη διαδεδομένοι στον ιστό και θα επεκταθούν το 2019.
Η αταξία δεν σημαίνει χάος. Στην πραγματικότητα, είναι ένα καλά δομημένο περιεχόμενο με εντυπωσιακά στοιχεία που τραβούν την προσοχή. Συνήθως εφαρμόζεται στους τίτλους του ιστότοπου και δίνει ένα μήνυμα που οι επισκέπτες σας δεν μπορούν να χάσουν.
Η αταξία των στοιχείων είναι ένας από τους ευκολότερους τρόπους αναβάθμισης του ιστότοπού σας για το 2019. Το μόνο που έχετε να κάνετε είναι να χρησιμοποιήσετε τις επιλογές σχεδίασης για να προσαρμόσετε τα περιθώρια (margins) των τίτλων σας και των εικόνων φόντου.
Μια τέτοια απλή τεχνική μπορεί να αυξήσει την επίγνωση για τα προϊόντα και τις υπηρεσίες σας. Είναι επίσης εύκολο στη χρήση σε δοκιμές A / B testing.
Σημαντικές ειδοποιήσεις
Είστε fan του GDPR; Δυστυχώς οι περισσότερες ανακοινώσεις και οι πολιτικές cookies είναι κάπως εκνευριστικές.
Τα κακά νέα είναι ότι θα δούμε πολλές ειδοποιήσεις το 2019. Οι επιχειρήσεις έχουν δει μια μεγάλη αξία στα pop-ups παράθυρα και στις γραμμές ειδοποιήσεων. Κατά μέσο όρο, τα αναδυόμενα παράθυρα μπορούν να αυξήσουν το ποσοστό μετατροπής σας κατά 20%.
Έτσι, παρά το γεγονός ότι όλοι μισούν τα pop-ups παράθυρα, τείνουμε να κάνουμε περισσότερες μετατροπές λόγω των pop-ups.
Παρόλο λοιπόν που τα pop-ups παράθυρα θεωρούνται ενοχλητικά, θα συνιστούσαμε να το δοκιμάσετε και να δείτε τι μπορούν να αποφέρουν στην επιχείρησή σας.
Εάν χρησιμοποιείτε το WordPress, υπάρχουν πολλά plugins που μπορείτε να χρησιμοποιήσετε για να δημιουργήσετε ειδοποιήσεις και αναδυόμενα παράθυρα (pop-ups). Σας συστήνουμε να εξετάσετε αυτά τα οποία δίνουν την δυνατότητα να δημιουργήσετε ειδοποιήσεις και αναδυόμενα παράθυρα προσαρμοσμένα στο δικό σας website.
Πώς να εφαρμόσουμε τις τάσεις του Web Design
Πρέπει να εξετάσουμε τον σχεδιασμό ιστοσελίδων από την επιχειρηματική σκοπιά. Θέλουμε να λανσάρουμε ιστοσελίδες ταχύτερα, να μαθαίνουμε και να βελτιώνουμε.
Μπορούμε να ξεκινήσουμε με μια αλλαγή και να δούμε πώς επηρεάζει την επιχείρησή μας. Δεν χρειάζεται να ενσωματώσουμε όλες τις τάσεις.
Σκεφτείτε την αναλογία χρόνου και αξίας. Τι θα κάνει την ιστοσελίδα σας πιο επιτυχημένη; Κατασκευάστε το γρήγορα και εύκολα.