Page 1

Σχεδιασμός και αναπτυξη ιστοσελίδων Ι ΔΙΑΛΕΞΗ 1


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


Προσδιορισμός του κοινού 

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


Προσδιορισμός του κοινού Επιπλέον η σελίδα σας πρέπει να:

Κάνει μια καλή πρώτη εντύπωση

Θεσπίσει ειλικρίνεια και αξιοπιστία

Έχει περιεχόμενό (πληροφορίες) σαφή και συνοπτικό

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


Συλλογή πληροφοριών και υλικού Με την κατανόηση και τον προσδιορισμού του κοινού Μελετάμε και κάνουμε έρευνα σε παρομοιες με την δικιά μας σελίδα. Δεν μπορούμε να αντιγράψουμε, αλλά να πάρουμε ιδέες για το πως λειτουργούν αντίστοιχες σελίδες αναλύοντας την αρχιτεκτονική της πληροφορίας (ΙΑ). Δηλαδή: 

Τι προσφέρουν

Διάταξη του περιεχομένου (wireframe)

Δομή site (πλοήγηση των σελίδων - sitemap)

Τρόπους που κρατάνε το κοινό τους


Αρχιτεκτονική της πληροφορίας (Information Architecture) 

Με τον όρο ΙΑ περιγράφουμε τη βασική δομή σύμφωνα με την οποία δημιουγείται και λειτουργεί ένα οποιοδήποτε website (τον τρόπο με τον οποίο ομαδοποιείται η πληροφορία μέσα σε αυτό, τις μεθόδους πλοήγησης που χρησιμοποιούμε, την ιεράρχηση πληροφορίας κλπ) Η IA ενός website είναι αποτελεσματική όταν βοηθάει τους επισκέπτες ενός site να νοιώσουν ότι μπορούν εύκολα να βρουν αυτό που ψάχνουν και συνήθως γίνεται αντιληπτή η έλλειψη και όχι η ύπαρξή της.


Σχεδιασμός website Ο σχεδιασμός και η παραγωγή ενός website ξεκινάει με την συλλογή του απαραίτητου περιεχόμενου. 

Φωτογραφίες

Κείμενα

Video

Ήχος κ.α. Και συνεχίζει με τον σχεδιασμό του sitemap και του wireframe


Sitemap (χάρτης ιστοχώρου) 

Τι είναι το Sitemap


Sitemap (χάρτης ιστοχώρου) Sitemap: 

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


Sitemap (χάρτης ιστοχώρου) Ένα καλοσχεδιασμένο sitemap πρέπει να είναι:

Πρακτικό

Ουσιαστικό

Εύκολο στην κατανόηση

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


Sitemap (χάρτης ιστοχώρου) Εργαλεία σχεδιασμού sitemap:

Γραφιστικά προγράμματα (corel, illustrator κ.α.)

Microsoft office

Slickplan


Website wireframe 

Website wireframe είναι ένας βασικός οπτικός οδηγός που προτείνει τη σχέση μεταξύ των σελίδων μιας ιστοσελίδας και την σχέση μεταξύ του περιεχόμενου (αναλογίες, ποσότητες, αντιθέσεις, συνδέσεις, αναφορές). Τυπικά τα website wireframes σχεδιάζονται πρίν από κάθε γραφιστικό σχεδιασμό.


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

Συλλογή υλικού

Σχεδιασμός του sitemap

Δημιουργία γραφιστικής αναπαράστασης (wireframe)

Σχεδιασμός και αναπτυξη ιστοσελίδων Ι - Διάλεξη 1  

Σχεδιασμός και αναπτυξη ιστοσελίδων Ι - Διάλεξη 1