Πώς να σχεδιάσετε μια ιστοσελίδα

01 από 10

Ερευνα

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

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

Όλα ξεκινούν με την έρευνα

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

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

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

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

02 από 10

καταιγισμός ιδεών

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

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

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

03 από 10

Αποφασίστε σχετικά με τις τεχνικές απαιτήσεις

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

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

Οι επιλογές σας περιλαμβάνουν:

04 από 10

Γράψτε ένα περίγραμμα

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

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

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

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

05 από 10

Δημιουργία πλαισίων συρμάτων

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

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

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

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

06 από 10

Σχεδιάστε την ιστοσελίδα

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

Το Adobe Photoshop είναι το πιο κοινό εργαλείο για τη δημιουργία των αρχικών σχεδίων. Η εστίαση του σχεδιασμού του site θα πρέπει να είναι η παρουσίαση του περιεχομένου και θα χρησιμοποιηθεί για τη δημιουργία των πραγματικών ιστοσελίδων.

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

07 από 10

Δημιουργία ιστοσελίδων

Όταν το σχέδιό σας εγκριθεί, οι σελίδες πρέπει να μετατραπούν από mockups σε πραγματικές ιστοσελίδες γραμμένες σε HTML και CSS.

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

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

Λογισμικό όπως το Adobe Dreamweaver μπορεί να βοηθήσει έναν σχεδιαστή να μετατρέψει ένα mockup σε μια ιστοσελίδα που λειτουργεί, με χαρακτηριστικά drag-and-drop, προ-κατασκευασμένες λειτουργίες και κουμπιά για την προσθήκη συνδέσμων και εικόνων.

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

08 από 10

Αναπτύξτε τον ιστότοπο

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

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

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

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

09 από 10

Προωθήστε τον ιστότοπο

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

Οδήγηση της κυκλοφορίας σε έναν ιστότοπο μπορεί να περιλαμβάνει:

10 από 10

Κρατήστε το φρέσκο

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

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

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