Όλοι γνωρίζουμε διαισθητικά τι κάνει την εμφάνιση ενός ιστότοπου άσχημα: υπερβολικά χρησιμοποιημένα εφέ εφέ, clip clip art, υπερπλήρεις διατάξεις. Αυτές οι ενοχλήσεις διορθώνονται εύκολα, αναπτύσσοντας με γνώμονα το σχεδιασμό - τις ίδιες αρχές που χρησιμοποιούνται από επαγγελματίες σχεδιαστές και καλλιτέχνες.
Μεγάλες ιστοσελίδες φέρνουν μαζί μορφή και λειτουργία. Στην πραγματικότητα, οι καλά σχεδιασμένες ιστοσελίδες θεωρούνται πιο αξιόπιστες, σύμφωνα με ένα Στάνφορντ μελέτη και είναι στην πραγματικότητα ευκολότερη στη χρήση τους (όπως έχει μελετηθεί από τον ερευνητή Ντον Νορμαν ). Έτσι, εδώ είναι πέντε βασικές αρχές που θα σας βοηθήσουν να διατηρήσετε τον ποιοτικό σχεδιασμό στην πρώτη γραμμή της πρακτικής σας.
Στο σχολείο σχεδιασμού, θα σας δώσουν μια λίστα αρχών που θα συμμορφωθούν με εκείνους που εκχωρούν κανόνες στα στοιχεία ομορφιάς όπως η διάταξη, η τάξη και η συμμετρία. Αλλά καθώς προχωράτε, τότε σας λένε να παραβιάσετε τους κανόνες λίγο για να δημιουργήσετε θέσεις για να βλέπουν τα μάτια ενός θεατή χρησιμοποιώντας στοιχεία όπως η ποικιλία, η ένταση ή η αντίθεση.
Εδώ είναι ένα παράδειγμα μιας σελίδας Το έκανα στο Edge Reflow CC. Μπορείτε να εντοπίσετε τα διαφορετικά στοιχεία σχεδίασης που χρησιμοποιούνται και στη συνέχεια να παίξετε;
Υπάρχουν κάποιες καθολικές εικόνες που οι άνθρωποι εκπαιδεύονται να απαντήσουν. Ο μεγεθυντικός φακός (αναζήτηση), ο οίκος (αρχική σελίδα) και η δισκέτα (αποθήκευση) έχουν ήδη ενσωματωθεί στους χρήστες σας. Επωφεληθείτε από αυτά οπτικές συντομεύσεις . όλα αυτά τα οδικά σήματα θα πρέπει να αναγνωρίζονται άμεσα σε εσάς.
Το χρώμα κάνει όλη τη διαφορά, ειδικά καθώς οι οθόνες μας βελτιώνονται στα τηλέφωνα και τα tablet μας. Είναι μια πτυχή του σχεδιασμού που μπορεί να είναι ένα πολύ σημαντικό κομμάτι της ιστορίας που θέλει να πει ο ιστοχώρος σας. Απλά χρησιμοποιήστε το χρώμα για να υποστηρίξετε το περιεχόμενο, χωρίς να διακοσμήσετε μια σελίδα. Και συχνά, αν χρησιμοποιείτε μια φωτογραφία, τα χρώματα στο σχέδιο θα πρέπει να δειγματοληφθούν από τις φωτογραφίες που χρησιμοποιούνται, έτσι ώστε το σχέδιό σας έχει μια ωραία ενοποιημένη αίσθηση.
Μου αρέσει πολύ το τράβηγμα παραδειγμάτων χρώματος με δείγματα χρώματος - και το Adobe Kuler Η εφαρμογή Web είναι ένας πολύ καλός τρόπος για να παίξετε με διαφορετικά θέματα και στη συνέχεια να τα εισαγάγετε στα εργαλεία σχεδίασης. Ένας από τους καλύτερους κανόνες που πρέπει να ακολουθήσετε είναι να χρησιμοποιήσετε δωρεάν χρώματα. Το οποίο βασικά χρησιμοποιεί ζεστά χρώματα και δροσερά χρώματα μαζί για να προσφέρει ισορροπία.
Υπάρχουν κυριολεκτικά χιλιάδες γραμματοσειρές από τις οποίες μπορείτε να επιλέξετε.
Εξαρτάται από εσάς να αναμειγνύετε και να ταιριάζετε - αλλά να θυμάστε ότι είναι η καλύτερη πρακτική να χρησιμοποιείτε μόνο τρεις γραμματοσειρές κάθε φορά - μια ωραία γραμματοσειρά γραμματοσειράς, μία για το κύριο σώμα κειμένου, τότε μία για κάθε είδους κλήση χρειάζομαι. Συχνά, αυτό σημαίνει ότι χρησιμοποιείτε μια sans-serif για το σώμα αντίγραφο, και για τίτλους μπορείτε να πάρετε πιο ενδιαφέρον με είτε serif ή sans-serif.
Εντάξει, έχετε τα βασικά σας στοιχεία σχεδίασης, με όμορφα εικονίδια και εικόνες, με ένα ηχητικό χρωματικό σχέδιο και διασκεδαστικές γραμματοσειρές. Τι έπεται?
Βοήθεια από άλλους, βέβαια! Και όχι μόνο τυχαία άτομα στο δρόμο, αλλά εποικοδομητική κριτική από ανθρώπους που ξέρουν πραγματικά τα πράγματα τους, όπως και άλλοι σχεδιαστές / προγραμματιστές. Αυτό μπορεί να είναι χρήσιμο για να μεταβείτε από έναν ιστότοπο OK σε έναν που πραγματικά ξεκινάει. Εάν δεν έχετε χρησιμοποιήσει ποτέ την Behance για να δημοσιεύσετε μια εργασία σε εξέλιξη, σας προτείνω να δοκιμάσετε. Η ενεργός κοινότητα θα κάνει περισσότερα από ό, τι απλά σας λέει "να κάνει το λογότυπο μεγαλύτερο" - αλλά σας δίνει συμβουλές που μπορούν να κάνουν τη διαφορά ανάμεσα σε μια καλή ιστοσελίδα και μια μεγάλη.
Για να εμβαθύνετε βαθύτερα στο πώς να εφαρμόζετε στοιχεία σχεδιασμού στην ανάπτυξη ιστού, ελέγξτε την παρουσίασή μου από το SXSW: