Saltar al contenido

Τρόπος αντίθεσης χρωμάτων φόντου και προσκηνίου στο σχεδιασμό ιστοσελίδων

28 de abril de 2021

Τι πρέπει να γνωρίζετε

  • Χρησιμοποιήστε το γράφημα σε αυτό το άρθρο για να προσδιορίσετε τους καλύτερους συνδυασμούς χρωμάτων φόντου και προσκηνίου για τη σχεδίαση ιστοσελίδων.
  • Χρησιμοποιήστε ένα διαδικτυακό εργαλείο όπως το CheckMyColors.com για να δοκιμάσετε τα χρώματα του ιστότοπού σας και να αναφέρετε την αναλογία αντίθεσης μεταξύ των στοιχείων στη σελίδα.
  • Χρησιμοποιήστε ένα εργαλείο όπως το ContrastChecker.com για να δοκιμάσετε τις επιλογές σας έναντι των Οδηγιών προσβασιμότητας περιεχομένου Web.

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

Πώς να δημιουργήσετε ισχυρή αντίθεση

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

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

Χρησιμοποιήστε τα Διαδικτυακά εργαλεία ελέγχου αντίθεσης

Εκτός από τη δική σας αίσθηση σχεδιασμού, δοκιμάστε μερικά διαδικτυακά εργαλεία για να δοκιμάσετε την επιλογή χρώματος του ιστότοπού σας. Το CheckMyColors.com θα δοκιμάσει όλα τα χρώματα του ιστότοπού σας και θα αναφέρει την αναλογία αντίθεσης μεταξύ των στοιχείων στη σελίδα. Επιπλέον, όταν σκεφτόμαστε επιλογές χρωμάτων, πρέπει επίσης να λάβετε υπόψη την προσβασιμότητα στον ιστότοπο και τα άτομα που έχουν μορφές τύφλωσης χρώματος. Το WebAIM.org μπορεί να βοηθήσει με αυτό, όπως και το ContrastChecker.com, το οποίο θα δοκιμάσει τις επιλογές σας έναντι των Οδηγιών προσβασιμότητας περιεχομένου Ιστού.

Γιατί είναι σημαντική η αντίθεση;

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

Πρότυπα επωνυμίας και χρωματικές επιλογές αντίθεσης

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