Με τα χρόνια, τα σχέδια και τα σχέδια ιστοσελίδων έχουν αυξηθεί σε πολυπλοκότητα. Ωστόσο, ενώ η δουλειά μας γίνεται όλο και πιο στιλβωμένη και διαδραστική, απομακρύνοντας από τις στατικές κούτσουρες που κυριάρχησαν στη δεκαετία του '90, ο κεντρικός στόχος δεν άλλαξε.

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

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

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

Κορεσμός και Ευαισθητοποίηση

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

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

Διαφήμιση παιχνιδιών βίντεο.

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

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

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

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

Συστήματα διαχείρισης περιεχομένου.

Με τόσα πολλά πλαίσια και μηχανές CMS, είναι ένα θαύμα που πρέπει να οικοδομήσουμε οτιδήποτε.

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

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

Η καλή πλευρά του κορεσμού

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

Συστήματα μενού πλοήγησης.

Τα συστήματα πλοήγησης γίνονται όλο και πιο πολύπλοκα, αλλά μπορούν επίσης να είναι αρκετά κομψά.

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

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

Πλοήγηση με μυστήριο κρέας.

Η πλοήγηση με μυστήριο κρέας δημιουργεί προβλήματα στους χρήστες. Η εξοικείωση πρέπει να προηγείται της αισθητικής.

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

Καθώς το επίπεδο κορεσμού μιας τάσης αυξάνεται, γινόμαστε πιο εξοικειωμένοι με τη λειτουργία του και με τον τρόπο που μας επηρεάζει. Συνεπώς, μπορούμε να το αγνοήσουμε διανοητικά μέχρι να το χρησιμοποιήσουμε. Ο κίνδυνος είναι "περιήγηση στο ζόμπι", το οποίο θα συζητήσουμε αργότερα.

Εστίαση σε έναν ιστότοπο.

Οι χρήστες τείνουν να επικεντρώνονται αποκλειστικά στο περιεχόμενο και μπορεί να χάσουν το μήνυμα του σχεδίου.

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

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

Λόγοι κλήσης προς δράση.

Γνωρίζουμε ότι οι χρήστες αναμένουν να ανακατευθυνθούν πίσω σε μια αρχική σελίδα όταν κάνουν κλικ σε ένα λογότυπο.


Η κακή πλευρά του κορεσμού

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

Για όσους από εσάς μπορείτε να θυμηθείτε την εποχή του σχεδιασμού του Web 2.0, όταν όλα ήταν λαμπερά και λοξά, ο ιστός ήταν γεμάτος με άχρηστα σχέδια, τόσο επαγγελματικά όσο και προσωπικά. Όλοι αντιγράφουν αυτό που θεωρούσαν δημοφιλές και έτσι η τάση έγινε τόσο συνηθισμένη ώστε η αξία της χάθηκε σε μια θάλασσα κλώνων.

Η εποχή του Web 2.0.

Η εποχή του σχεδιασμού του Web 2.0 απομακρύνθηκε από το χέρι και η καινοτομία της διάταξης είχε ως αποτέλεσμα.

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

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

Κουμπιά στον Ιστό.

Οι χρήστες αναμένουν μια ενέργεια κάνοντας κλικ σε ένα κουμπί, οπότε η λειτουργία πρέπει να είναι αντιδραστική.

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

Ένα από τα καθοριστικά χαρακτηριστικά μιας χειροποίητης ιστοσελίδας είναι ότι έχει κατασκευαστεί (ελπίζουμε) με τις απαιτήσεις του επισκέπτη στον πυρήνα. Ενώ οι ιστότοποι μπορούν να ξεφύγουν με μια γενική εμφάνιση, σχέδια που είναι όμορφα δημιουργημένα θα ενισχύσουν την αξία της ιστοσελίδας και θα εμπλουτίσουν ή θα συμπληρώσουν το περιεχόμενο.

Τοποθεσία παιδιού.

Μπορείτε να πείτε καθαρά ότι αυτός ο ιστότοπος δημιουργήθηκε για το κοινό-στόχο του: τα παιδιά.

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

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

Ad Block Plus για τον Firefox.

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


Λύσεις για σχεδιαστές

Η πρώτη λύση, η οποία φαίνεται μάλλον προφανής, είναι να καινοτομούμε αντί να αντιγράψουμε τι υπάρχει.

Σε ορισμένες περιπτώσεις, ωστόσο, η καλύτερη πορεία δράσης θα είναι απλώς να μην ανακαλύψετε τον τροχό. η διαθεσιμότητα των γκαλερί έμπνευσης, τα σενάρια cut-and-paste, οι μηχανές CMS και τα πρότυπα διάταξης έχουν την τάση να προωθούν μια προτίμηση για γρήγορο σχεδιασμό αλλαγής αντί για χειροποίητη, πρωτότυπη κατασκευή.

Ακόμα κι αν χρησιμοποιείτε μια προ-κατασκευασμένη λύση, μπορείτε να βελτιώσετε ή να την προσαρμόσετε για το κοινό σας.

Το WordPress CMS.

Το WordPress μπορεί (και πρέπει να είναι) να είναι ιδιαίτερα προσαρμοσμένο ώστε να ταιριάζει με την ταυτότητα του ατόμου ή της εταιρείας.

Η δεύτερη λύση είναι να καθοριστεί αν ένα γενικό χαρακτηριστικό εξυπηρετεί πράγματι έναν συγκεκριμένο στόχο. Η ιδέα του σχεδιασμού με σκοπό έχει εδώ και πολλά χρόνια και ενώ οι χρήστες συνεχίζουν να απαιτούν αυξημένα επίπεδα αλληλεπίδρασης και ελέγχου σε έναν ιστότοπο (μακριά από την εποχή του στατικού σχεδιασμού), θα πρέπει να συμπεριλάβουμε ένα στοιχείο σε έναν ιστότοπο μόνο εάν το η χρησιμότητα υπερκαλύπτει το κόστος της ύπαρξής του. δεν πρέπει, για παράδειγμα, να κλέβει την προσοχή από άλλο περιεχόμενο. Κάθε αντικείμενο πρέπει να εξυπηρετεί έναν χρήσιμο σκοπό, ακόμα και δευτερεύοντα στοιχεία όπως οι συνδέσεις "Skip", που βοηθούν τους αναγνώστες οθόνης.

Μια καθαρή διασύνδεση.

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

Η απλότητα και ο στόχος της κατεύθυνσης των ματιών του επισκέπτη σε χρήσιμο περιεχόμενο είναι ο πυρήνας του καλού σχεδιασμού. Για να αποφευχθεί ο υπερκορεσμός, πρέπει να είμαστε προσεκτικοί κατά την προσθήκη αντικειμένων στη σελίδα (και ειδικά να μην το κάνουμε επανειλημμένα) και να μην είμαστε πολύ ενθουσιασμένοι με τη "φόρτωση χαρακτηριστικών".

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

Καλά και κακά παραδείγματα

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

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

Παράδειγμα Α.

Η διάταξη αυτού του δεύτερου παραδείγματος είναι ίσως λιγότερο μοναδική από την πρώτη. Και όμως εξακολουθεί να κάνει μια καλή εμπειρία ως αποτέλεσμα της σύντομης καμπύλης μάθησης για την αλληλεπίδραση των χρηστών: το λογότυπο και το μενού πλοήγησης είναι εκεί που περιμένετε να είναι. ο ιστότοπος ακολουθεί τους συμβατικούς όρους για τα στοιχεία του χαρτοφυλακίου (αν και στην περίπτωση αυτή ο χώρος οθόνης είναι μάλλον χαμένος). και τα εντυπωσιακά infographics ωθούν τους χρήστες να μετακινηθούν προς τα κάτω στη σελίδα.

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

Παράδειγμα Β.

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

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

Υπάρχουν πάρα πολλές επιλογές μενού πλοήγησης, που οδηγούν σε σύγχυση. ίσως να ήταν αρκετό ένα αναπτυσσόμενο μενού. Επιπλέον, η διαφήμιση καταλαμβάνει το ένα έκτο της σελίδας, αποτρέποντας έτσι την προσοχή του χρήστη. Επιπλέον, καθώς κατεβαίνουμε προς τα κάτω, η σελίδα είναι διάσπαρτη με slideshows, tabbed μπλοκ περιεχομένου και εκατοντάδες υπερπλήρεις συνδέσμους. Αυτός είναι ο υπερκορεσμός στο καλύτερό του: πάρα πολλά προσφέρονται με ελάχιστη πρωτοτυπία ή σκοπό.

Παράδειγμα Γ.

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

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

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



Αποκλειστικά γράφτηκε για WDD από τον Alexander Dawson. Είναι ανεξάρτητος σχεδιαστής ιστοσελίδων, δημιουργός και αναψυχής προγραμματιστής λογισμικού που ειδικεύεται στα πρότυπα ιστού, την προσβασιμότητα και το σχεδιασμό UX. Εκτός από τη διεξαγωγή μιας επιχείρησης που ονομάζεται HiTechy και γράφει, ξοδεύει χρόνο Κελάδημα , Τα φόρουμ του SitePoint και άλλα μέρη, βοηθώντας όσους έχουν ανάγκη. "]

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