5 άκρες για να απλοποιήσετε το σχεδιασμό ιστοσελίδων σας

Κανόνες απλότητας! Κάνει έναν ιστότοπο να δείχνει κομψό, να μειώνει τη σύγχυση και να βοηθά στην επίτευξη των επιθυμητών στόχων και αποτελεσμάτων (δηλαδή, περισσότερες εγγραφές, συνδρομητές και πωλήσεις). Αλλά πάρα πολύ συχνά φαίνεται απίθανο να απλοποιήσετε το σχεδιασμό της ιστοσελίδας σας. Ανεξάρτητα από το πόσο σκληρά προσπαθείτε, δεν μπορείτε να κάνετε τη δουλειά σας να μοιάζει με την Apple. Έτσι τι χρειάζεται πραγματικά ένας σχεδιαστής ιστοσελίδων? Μη φοβάστε, γιατί υπάρχουν 5 σημεία εκκίνησης για την απλοποίηση του σχεδιασμού της ιστοσελίδας σας.

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

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

1. Εστίαση μόνο στα βασικά στοιχεία

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

Χρησιμοποιήστε τον κανόνα 80-20

Ποιο είναι το 20% της σελίδας που δίνει το 80% της αξίας και του περιεχομένου που πηγαίνουν εκεί; Θα μπορούσε να είναι το αντίγραφο, κάποια κοινωνική απόδειξη (αποσπάσματα αναθεώρησης, μαρτυρίες, κονκάρδες μέσων) και μια φόρμα εγγραφής ή κουμπί παρότρυνσης για δράση, για παράδειγμα. Αυτό είναι το 20% ακριβώς εκεί. Στην ιστοσελίδα σας, καθώς και σε κάθε μεμονωμένη σελίδα, επικεντρωθείτε στην εμφάνιση μόνο του 20% των στοιχείων τοποθεσίας που παρέχουν το 80% αυτής της χρησιμότητας.

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

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

Ο Chris Pearson, δημιουργός του δημοφιλούς θέματος ThePress WordPress, λέει ότι αυτό ακριβώς συνέβαλε στην αύξηση των πωλήσεων στην ιστοσελίδα του.

2. Ξεφορτωθείτε όλα τα περιττά στοιχεία

Συνεχίζουμε με τον κανόνα 80-20 εδώ.

Τώρα που έχετε εντοπίσει το 20% των στοιχείων ιστοτόπου που θα σας πάρουν το 80% των επιθυμητών αποτελεσμάτων σας, ήρθε η ώρα να να απαλλαγείτε από όλα τα περιττά στοιχεία. Με άλλα λόγια, το 80% των στοιχείων ιστότοπου που θα σας αποφέρουν μόνο το 20% των αποτελεσμάτων. Θα μπορούσε να είναι τα κοινωνικά μέσα μαζικής ενημέρωσης που μοιράζονται widgets, sidebar στοιχεία, λεπτομέρειες μεταγλωττίσεων blog (ημερομηνία, ώρα, συγγραφέας, αριθμός σχολίων κ.λπ.) ή σύνδεσμοι στο υποσέλιδο (αυτό είναι ιδιαίτερα ένας τεράστιος ένοχος πολλές φορές, ο επισκέπτης αναζητά την προαναφερθείσα δικαιολογία για να ξεφύγει από τη σελίδα).

3. Μειώστε τον αριθμό των σελίδων

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

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

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

4. Πάρτε περισσότερο περιεχόμενο πάνω από το πτυσσόμενο

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

Αυτό δεν σημαίνει τίποτα περισσότερο από την αλλαγή της τιμής "ύψος" της κεφαλίδας στο φύλλο στυλ σας (συνήθως style.css ή stylesheet.css). Επίσης, δείτε εάν μια φόρμα εγγραφής ή κουμπί είναι κάτω από την πτυχή. Μετακινήστε αυτό το στοιχείο ψηλότερα στη σελίδα, ώστε να είναι το πρώτο πράγμα που βλέπει ο επισκέπτης. Μετά από όλα, αυτό είναι την επιθυμητή πρόσκληση για δράση του επισκέπτη, μειώστε έτσι το έργο που απαιτείται για να φτάσετε σε αυτό (δηλαδή κύλιση).

5. Περιορίστε το χρώμα σας

Είναι εύκολο να παρασυρθείτε με χρώματα. Γιατί να εγκαταστήσετε 2 ή 3 χρώματα όταν μπορείτε να έχετε 12 ή 13; Αλλά για να απλοποιήσετε οπτικά το σχεδιασμό της ιστοσελίδας σας, πρέπει να περιορίσετε το χρωματικό σας σχέδιο. Σε περίπτωση αμφιβολίας, χρησιμοποιήστε λιγότερα χρώματα. Θα διαφέρει ανάλογα με το σχεδιασμό σας φυσικά, αλλά προσπαθήστε να κολλήσετε με όχι περισσότερα από 2 ή 3 χρώματα για να ξεκινήσετε. Εάν χρειάζεστε περισσότερη λεπτότητα και υφή για τον οπτικό σας σχεδιασμό, χρησιμοποιήστε αποχρώσεις του ίδιου χρώματος - ανοικτό μπλε για το φόντο και πιο σκούρο μπλε για κεφαλίδες και στοιχεία μενού.

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

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

Τελευταίο αλλά εξίσου σημαντικό

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

Για να ανακεφαλαιώσετε, εδώ είναι τα 5 σημεία εκκίνησης για την απλοποίηση του σχεδιασμού του ιστότοπού σας:

1. Τοποθετήστε την εστίαση μόνο στα βασικά στοιχεία
2. Ξεφορτωθείτε όλα τα περιττά στοιχεία
3. Μειώστε τον αριθμό των σελίδων
4. Αποκτήστε περισσότερο περιεχόμενο πάνω από την πτυχή
5. Περιορίστε την παλέτα χρωμάτων σας

Σχετικά Άρθρα

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

Πάνω σε σας: ποια είναι τα αγαπημένα σας συμβουλές σχεδιασμού ιστοσελίδων; Έχετε δει μια αύξηση στα επιθυμητά αποτελέσματα από την απλοποίηση του σχεδιασμού σας?

Σημείωση του συντάκτη:Ã'Â Αυτή η θέση έχει γραφτεί από Oleg Mokhov forÃ'Â Hongkiat.com. Ο Oleg Mokhov είναι ο πιο κινητός ηλεκτρονικός μουσικός στον κόσμο, ένας λάτρεις της διαδικτυακής και οπτικής σχεδίασης και συνιδρυτής του μουσικού καταστήματος premium music store'' Soundtrackster.