Οι άνθρωποι δημιουργούν ιστότοπους για πολλούς λόγους: να προσεγγίσουν ένα ευρύτερο κοινό. να πωλούν, να προωθούν ή να εκφράζουν. για να κατευνάσει την πίεση από τους ομοτίμους. Η καινοτομία σταμάτησε να είναι λόγος γύρω στο 2001. Στη θέση της, φυσικά έχουμε : o Φυσικά, έχω έναν ιστότοπο. Φυσικά πρέπει να έχετε έναν τοίχο Facebook, λογαριασμό Twitter, προφίλ LinkedIn ή πίνακα Pinterest. Φυσικά όλοι έχουμε email.

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

Άλλοι κολλούν με το τι λειτουργεί.

Εκείνοι που ακολουθούν τη συμβατική σοφία χρησιμοποιούν όχι μόνο τη γλώσσα αλλά και τις ίδιες προτάσεις - σε ιστούς, όχι μόνο HTML / CSS, αλλά Arial και Georgia, πλάκες 960-pixel, ή υπογραμμισμένες μπλε ζεύξεις. Η χρήση τέτοιων συμβάσεων δεν είναι λάθος. Αλλά οι σχεδιαστές που δεν επιλέγουν να χρησιμοποιούν τα καθιερωμένα μοτίβα - που ακολουθούν τη συμβατική σοφία χωρίς να ρωτούν γιατί - χάνουν ευκαιρίες.

Η τυποποιημένη δομή

Η τυποποιημένη δομή ενός επιπέδου έχει πρακτικά οφέλη. Είναι απλό και απλό είναι καλό για προθεσμίες. Το πιο σημαντικό, είναι οικείο. Τόσο η δημόσια περιήγηση στο διαδίκτυο όσο και οι σχεδιαστές ιστοσελίδων έχουν μια άγνωστη συμφωνία για τον τρόπο λειτουργίας των ιστότοπων. Μετά το σπίτι / services / about / contact pattern εξυπηρετεί τους σχεδιαστές και το κοινό, καλύπτοντας τις προσδοκίες τους.

Άλλες έννοιες είναι τόσο προφανείς που είναι εύκολο να παραβλέψουμε:

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

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

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

Είναι εύκολο να φανταστεί κανείς το προφανές συμπέρασμα: Διακοπή της σύμβασης και κίνδυνος αποξένωση των ανθρώπων.

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

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

Προσαρμοσμένη σκέψη

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

Από την αρχή του ιστού, οι σχεδιαστές θα μπορούσαν να στηριχθούν Οι οθόνες έχουν πλάτος τουλάχιστον 640 pixel . Πιο πρόσφατα, 1024 εικονοστοιχεία και μεγαλύτερα είναι συνηθισμένα. Ξεκινώντας το 2007 μικροσκοπικόςσυσκευές τοποθετήστε ιστοσελίδες στα χέρια των ανθρώπων. Ξαφνικά σχεδιασμό για 320 pixels ήταν στη μόδα .

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

Roberts

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

Πώς να σπάσει τις συμβάσεις

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

1. Τοποθετήστε έναν σύνδεσμο στο σπίτι με ένα λογότυπο στην επάνω αριστερή γωνία

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

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

Ανταγωνιστική σκέψη:

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

2. Μια λίστα άρθρων θα κάνει τους τίτλους τους, τις εικόνες ή το "read more" clickable

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

Συμβατική σκέψη: οι τίτλοι και οι μικρογραφίες αντιπροσωπεύουν καλύτερα το περιεχόμενο που περιγράφουν. Η συντομότερη διαδρομή για "Θέλω να διαβάσω περισσότερα γι 'αυτό" είναι να γίνει clickable. Επομένως, κάντε τίτλους και μικρογραφίες με δυνατότητα κλικ.

Ανταγωνιστική σκέψη:

  • Κάντε ολόκληρο το teaser - εικόνα, τίτλο και περιγραφή - με δυνατότητα κλικ. Οι συνδέσεις με περισσότερη επιφάνεια είναι καλές για κινητό σχεδιασμό και είναι εύκολο να δημιουργηθούν με CSS
  • Γυρίστε το ανάποδα: οδηγήστε με μία ή δύο συναρπαστικές προτάσεις, στη συνέχεια τοποθετήστε τον τίτλο με δυνατότητα κλικ κάτω από το μικρότερο κείμενο
  • Αντί να "διαβάσετε αυτό το τώρα", επιτρέψτε στους χρήστες να προσθέσουν άρθρα σε μια ουρά για να διαβάσουν στον ελεύθερο χρόνο τους με τη σειρά που επιλέγουν

3. Σχεδιάστε ένα πρότυπο πριν να γράψετε το περιεχόμενο

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

Συμβατική σκέψη: Σχεδιάστε πρώτα την εμφάνιση του ιστότοπου. Αφήστε χώρο για περιεχόμενο.

Ανταγωνιστική σκέψη:

  • Χρησιμοποιήστε την τυπογραφία και το χρώμα για να εμπλουτίσετε το ίδιο το περιεχόμενο με διάθεση, φωνή και χαρακτήρα. Στη συνέχεια, τα στοιχεία σχεδιασμού που ενισχύουν αυτόν τον χαρακτήρα, αν είναι απαραίτητο, όπως οι υφές φόντου και οι πλευρικές κορνίζες.
  • Κάντε το φόντο μέρος του περιεχομένου. Αλλάξτε τα χρώματα ανά σελίδα για να αντικατοπτρίσετε τη διάθεση, το θέμα ή τη λειτουργία.
  • Αποκρύψτε ή μειώστε τις πληροφορίες της πλευρικής εργαλειοθήκης μέχρι ο χρήστης να επιλέξει να τον προσέξει.
Stories at Longboard World

Ιστορίες στο Longboard World όχι μόνο αψηφεί το κανόνα "teasers must be text", αλλά μαθαίνει ένα μάθημα από Νόμος του Fitt κάνοντας ολόκληρη την καρτέλα σημείων με δυνατότητα κλικ.

Κατευθυντήριες γραμμές για τους κανόνες

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

1. Αντικαταστήστε, μην σπάστε, κανόνες

Για να αλλάξουμε τη σύμβαση, πρέπει να σεβαστούμε γιατί λειτούργησαν οι παλιοί κανόνες.

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

2. Τηρήστε τους δικούς σας κανόνες

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

3. Δώστε χρόνο

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

4. Χρησιμοποιήστε τους στόχους

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

  • Η λαϊκή συναίνεση αντιτίθεται σε αυτήν την κοινοβουλευτική περίοδο. Εάν οι χρήστες επισκέπτονται τον ιστότοπο, έχουμε λιγότερο από ένα δευτερόλεπτο για να τα κερδίσουμε. Πώς μπορούμε να αλλάξουμε τα μυαλά τόσο γρήγορα;
  • Θέλουμε να δείξουμε περισσότερες από 200 φωτογραφίες. Πώς μπορούμε να κάνουμε αυτό εύκολο για τους ανθρώπους να πλοηγηθούν;
  • Τα προϊόντα μας είναι ασφαλή, αλλά έχουμε τη φήμη ότι δεν φροντίζουμε για το περιβάλλον. Τα δελτία τύπου δεν σημαίνουν τίποτα. Πώς μπορούμε να δείξουμε γνήσια ανησυχία στο υποκείμενο;
  • Έχουμε μια γεμάτη απογραφή. Κανείς δεν αγοράζει. Πώς μπορούμε να το μετατρέψουμε αυτό προς όφελός μας;
Evolution of the Web

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

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

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

Προτεινόμενη εικόνα / μικρογραφία, αντισυμβατική εικόνα μέσω Shutterstock