Η χρήση καρτών στον σχεδιασμό ιστοσελίδων έχει αποκτήσει τεράστια ζήτηση τα τελευταία χρόνια. Κλασσικά παραδείγματα αποτελούν το Pinterest, το Facebook, το Google+ και το Twitter αλλά και κάθε ηλεκτρονικό κατάστημα που υπάρχει, καθώς τα προϊόντα παρουσιάζονται με την μορφή καρτών. Τι πρέπει να προσεχθεί για να επικοινωνούν σωστά το μήνυμα τους και τι πρέπει να αποφευχθεί στην κατασκευή μιας ιστοσελίδας;
Ας μην γελιόμαστε. Οι κάρτες, απο την φύση τους, έχουν λάβει το μεγαλύτερο μέρος σε αυτό που ονομάζουμε responsive design, μιας και ουσιαστικά όλοι οι responsive σχεδιασμοί βασίζονται σε παρουσίαση με κάρτες.
Η σημασία τους μεγαλώνει ακόμη περισσότερο αν αναλογιστούμε οτι όλα τα ηλεκτρονικά καταστήματα αναπαριστούν τα προϊόντα τους με την βοήθεια καρτών.
Γι’ αυτό ακριβώς και τα λάθη που παρατηρούνται στην χρήση τους, μπορούν να καταστρέψουν τον σχεδιασμό μιας ιστοσελίδας.
Ας δούμε τα 4 πιο κοινά λάθη που παρατηρούνται σε ιστοσελίδες που χρησιμοποιούν κάρτες και πως μπορούν να διορθωθούν.
01. Μεγάλα κενά προερχόμενα απο διαφορετικό μήκος
Σε ένα τέλειο κόσμο, όλα θα ήταν όμορφα και συμμετρικά. Επειδή όμως δεν ζούμε σε έναν τέλειο κόσμο, αλλά σε μια πραγματικότητα, το περιεχόμενο και τα στοιχεία αυτού του κόσμου δεν προσαρμόζονται αρμονικά.
Έτσι και στις κάρτες.
Οι τίτλοι είναι μεγάλοι ή μικροί, η περιγραφή διαφέρει απο στοιχείο σε στοιχείο, τα ονόματα δεν αποτελούνται απο 4 γράμματα, ακόμα και οι φωτογραφίες που ενδεχομένως υπάρχουν, δεν έχουν το ίδιο μέγεθος.
Όταν λοιπόν οι κάρτες τοποθετούνται σε ένα πλέγμα σε μεγαλύτερες αναλύσεις οθονών (και όχι σε responsive που ούτως ή άλλως είναι σε μια στήλη) τότε συχνά μπορεί να παρατηρηθούν κενά που διακόπτουν την ροή.
Ας μην μπερδευόμαστε. Τα κενά αυτά δεν είναι σχεδιαστικό whitespace, είναι απλά κενό που φήνουν τα διαφορετικά στοιχεία της κάθε κάρτας.
Η λύση είναι η χρήση javascript που είτε θα καλύπτει τα κενά είτε θα «μετράει» κάθε φορά το μέγιστο μήκος και θα προσαρμόζει ανάλογα τα υπόλοιπα .
02. Πολλές εμφανείς κάρτες
Είναι δελεαστικό να θελήσουμε να χρησιμοποιήσουμε όλο τον χώρο μιας ανάλυσης οθόνης, ειδικά στις HD αναλύσεις.
«Όσα περισσότερα προϊόντα δείξουμε με την πρώτη, τόσο το καλύτερο». Όχι δεν είναι έτσι. Πρόκειται ίσως για ένα τραγικό λάθος οπτικής επικοινωνίας που μπορεί να οδηγήσει σε μια υπερφορτωμένη ιστοσελίδα.
Οι πολλές κάρτες σε μια οθόνη, προκαλούν σύγχυση και δεν επιτρέπουν τον επισκέπτη μιας ιστοσελίδας να επικεντρώσει κάπου. Επίσης, οι πολλές κάρτες σε οριζόντια σύνθεση, πρακτικά, δεν αφήνουν τον επισκέπτη να σκανάρει όλη την σειρά. Σκεφτείτε πόσο δύσκολο είναι να πάτε απο την μια πλευρά ως την άλλη, μιας ιστοσελίδας, χωρίς να στρέψετε έστω και λίγο το κεφάλι σας.
03. Πολλά actions σε διάφορα σημεία της κάρτας
Ένα απο τα καλύτερα χαρακτηριστικά των καρτών είναι πόσο καλά αποδίδουν σε μικρό χώρο. Αυτό όμως μπορεί να οδηγήσει σε παρορμητικές αντιδράσεις στον σχεδιασμό, όπου η κάθε κάρτα φορτώνεται με πάρα πολλά actions.
Links, κουμπιά, εικονίδια και κάθε είδους αποπροσανατολισμός οδηγεί στο ακριβώς αντίθετο αποτέλεσμα απο το επιθυμητό.
Σε μια κάρτα προϊόντος, αρκούν οι βασικές πληροφορίες. Φωτογραφία προϊόντος, τίτλος, τιμή και κουμπί προσθήκης στο καλάθι που αποτελεί και το βασικό Call To Action. Κάθε άλλο action υπερφορτώνει τον σχεδιασμό και ίσως αποπροσανατολίσει τον επίδοξο αγοραστή απο το βασικό Call To Action που είναι το κουμπί αγοράς.
04. Υπερφόρτωση πληροφοριών
Σε άμεση συνάφεια με τα παραπάνω, η απόδοση των καρτών σε μικρό χώρο, ουσιαστικά τις κάνουν πολύτιμες σχεδιαστικά γιατί μπορούν να «σπάσουν» μεγάλο όγκο δεδομένων σε «εύπεπτα» κομμάτια.
Είναι εξαιρετική επιλογή στην κατασκευή ενός eshop μιας και προσφέρουν έναν γρήγορο και εύκολο τρόπο αποτύπωσης μιας μικρογραφίας του κάθε προϊόντος του ηλεκτρονικού καταστήματος.
Αυτό όμως μπορεί να οδηγήσει, λανθασμένα, στην υπερφόρτωση πληροφορίας. Ένα ακόμη link, λίγο περισσότερη περιγραφή, άλλη μια φωτογραφία, ένα chart, ένα ακόμη όμορφο γραφικό κ.ο.κ. μπορούν να αφαιρέσουν εντελώς την δυνατότητα focus του επισκέπτη.
Επιλέξτε μια στρατηγική όταν σχεδιάζεται η ιστοσελίδα και κατασκευάστε τις κάρτες έτσι ώστε να περιέχουν τα απολύτως απαραίτητα.
Μην διστάσετε να επικοινωνήσετε μαζί μας στο 2441500500 για να συζητήσουμε για την δική σας κατασκευή ιστοσελίδας με την χρήση καρτών