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

Παρουσίαση με θέμα: "Αλληλεπίδραση (interface) ανθρώπου με τον Παγκόσμιο Ιστό. Αρχές, πρότυπα, μοντέλα. Παράδειγμα συγκριτικής αξιολόγησης γνωστών σελίδων."— Μεταγράφημα παρουσίασης:

1 Αλληλεπίδραση (interface) ανθρώπου με τον Παγκόσμιο Ιστό. Αρχές, πρότυπα, μοντέλα. Παράδειγμα συγκριτικής αξιολόγησης γνωστών σελίδων.

2 ΕΙΣΑΓΩΓΗ ΣΤΙΣ ΒΑΣΙΚΕΣ ΕΝΝΟΙΕΣ •Internet usability “Η χρηστικότητα του INTERNET είναι η γενικότερη αρχή της εφαρμογής βασικών επιστημονικών παρατηρήσεων, σχεδιαστικών αρχών και μετρήσεων με σκοπό τη δημιουργία και τη διατήρηση ιστοτόπων, οι οποίοι να είναι όσο το δυνατόν πιο εύκολο να πλοηγηθούν κ να παρέχουν χρήσιμες πληροφορίες στους επισκέπτες τους ”

3 INTERFACE-Ο ΑΝΘΡΩΠΙΝΟΣ ΠΑΡΑΓΟΝΤΑΣ •Η αλληλεπίδραση μεταξύ του χρήστη και του παγκόσμιου ιστού έχει τις βάσεις της στην επιστήμη της Ψυχολογίας. •Η έννοια της “εμπλοκής” ή της “παρέμβασης” - “interference” •HCI-Human Computer Interaction Λειτουργικότητα συσκευών εισόδου κ εξόδου και διαχείριση αυτών από τους χρήστες. Ο χρήστης αντιλαμβάνεται τις συσκευές αυτές ως προέκταση του εαυτού του.

4 Internet usability-μια ανθρωποκεντρική θεώρηση •Επιλογή του επιθυμητού “target group” Πρέπει να επικεντρώνουμε στον χρήστη και στις αναζητήσεις του •Οι “τάσεις” της εποχής •Το πολιτιστικό υπόβαθρο-μια πολύ-πολιτιστική αναπαράσταση, απορρέουσα από την “υπερ- μεσικότητα” του μέσου, που ξεπερνά χωροταξικά όρια και πολιτιστικά στερεότυπα

5 Βασικές προϋποθέσεις 1 Τεχνικοί περιορισμοί που θέτει ο χρήστης •Bandwidth •Hardware •Plug-ins •Web accessibility •Τύπος σύνδεσης (DSL, ISDN, 56K MODEM etc)

6 Βασικές προϋποθέσεις 2 Φυσικοί περιορισμοί •Αναπηρίες Απουσία Όρασης Μερική απώλεια Όρασης Αχρωματοψία-Δαλτονισμός Κώφωση

7 Στρουκτουραλιστική-κατασκευαστική προσέγγιση •Guidelines Οδηγίες για την κατασκευή μιας εύχρηστης και λειτουργικής ιστοσελίδας. •Τοποθέτηση της επωνυμίας της εταιρείας ή της θεματικής του ιστοτόπου μας σε ευδιάκριτο σημείο. •Προσοχή στο μέγεθος του “logo” •Μέσα στο λογότυπο ή κάτω από αυτό πρέπει να εισάγουμε ένα “tag” που να συνοψίζει το λόγο ύπαρξης του ιστοτόπου μας. •Τοποθέτηση του “menu” στα αριστερά •Ιεράρχηση των θεματικών ή των υπηρεσιών με βάση τη σημαντικότητά τους, το βαθμό αρχαιότητάς τους κτλ •Προτεινόμενη διάταξη, από πάνω προς τα κάτω-κάθετη διάταξη •Η οριζόντια διάταξη στο βασικό menu είναι επιθυμητή αλλά όχι τόσο λειτουργική

8

9 Η γλώσσα του ιστοτόπου 1 •Δώστε χώρο στο κείμενο. Η ανάγνωση γίνεται κουραστική αν το κείμενο είναι στριμωγμένο ανάμεσα από πολλές εικόνες ή διαχωριστικές γραμμές •Διαλέξτε ένα είδος γραμματοσειράς κι αποφύγετε τα πλάγια γράμματα, τους μαύρους χαρακτήρες και τα κεφαλαία γράμματα. Χρησιμοποιείστε τα italics για να εισάγετε λόγια άλλων, τα bold για να τονίσετε τη σημαντικότητα, τα CAPITAL στην αρχή των προτάσεων ή για να “τραβήξετε” την προσοχή •Έχετε στο νου σας πως η κατάχρηση των παραπάνω στυλ κουράζει κατά την ανάγνωση καθώς παύουν να αποτελούν “δείκτες” έμφασης.

10 Internet 1 Internet 2

11 Η γλώσσα του ιστοτόπου 2 •Προσοχή στην επιλογή των χρωμάτων των τίτλων και υπότιτλων, η συχνή αλλαγή ή ο συνδυασμός διαφορετικών χρωμάτων ζαλίζει κι εκνευρίζει •Ενδείκνυται η χρήση απλής γλώσσας και καλό είναι να αποφεύγεται η εκτεταμένη χρήση ορολογίας που μπερδεύει και προκαλεί δυσπιστία στον επισκέπτη •Ενδείκνυται η χρήση της Προστακτικής για να καθοδηγήσετε την πλοήγηση του επισκέπτη. Καλό είναι επίσης να αποφεύγονται προτάσεις τύπου-”GO THERE” “TRY THIS” και στη θέση τους να εμφανίζονται και πιο διαφωτιστικές πληροφορίες. Π.χ “Go there to find out the BINGO results” •Αποκαλύψτε το περιεχόμενο του ιστοτόπου σας με παραδείγματα “Συστήματα ποδοσφαίρου για σίγουρα κέρδη”-Τα 5 επικρατέστερα γι αυτή την εβδομάδα

12 •Οι σύνδεσμοι παίζουν πρωταρχικό ρόλο στην αξιολόγηση και στον προσδιορισμό της ποιότητας ενός site. Όσο περισσότεροι, τόσο το καλύτερο. •Φροντίστε οι παραπομπές που κάνετε σε άλλα υπερκείμενα να είναι ακριβείς και να “μεταφέρουν” απευθείας στην επιθυμητή ακριβώς τοποθεσία τον πλοηγητή •Σημαντικό είναι επίσης τα links που έχουν ήδη χρησιμοποιηθεί από τον χρήστη να αλλάζουν χρώμα, προκειμένου να του επενθυμίζουν ότι έχει επισκεφτεί το συγκεκριμένο τόπο. •Αποφύγετε τη χρήση της εντολής “Click here” γιατί συχνά ο “πλοηγητής” εκνευρίζεται, το αναγνωρίζει συνήθως ως προϊόν διαφήμισης. Προτιμήστε το “Click here for extra information” •Είναι πολύ πιο όμορφο να ενσωματώνετε το link στο κείμενο ή στην ιστοσελίδα σας με τον κλασικό τρόπο http://www.paulfrank.com/ κι όχι τοποθετώντας τη λέξη link http://www.paulfrank.com/ LINKS

13 ΠΛΟΗΓΗΣΗ •Επικεντρώστε την πλοήγηση σε μια περιοχή εύκολα εντοπίσιμη από το μάτι •Διατήρηση κλασικών κατηγοριοποιήσεων •Χρησιμοποιείστε εικονίδια για να βοηθήσετε τον χρήστη να ανακαλύψει τα καλύτερα στοιχεία του site όπως “sale items”, “bonus tracks” κτλ •Χρησιμοποιείστε ειδικά εργαλεία που υπογραμμίζουν με χρώμα τη λέξη της αναζήτησής σας

14 ΑΝΑΖΗΤΗΣΗ •Η αναζήτηση είναι μια σύνθετη διαδικασία και καθορίζει σε μεγάλο βαθμό τη δημοτικότητα ενός site •Τοποθέτηση ενός “input box” •Χωρητικότητα, τουλάχιστο μέχρι 30 χαρακτήρες •Η αναζήτηση πρέπει να καλύπτει ολοκληρωτικά το περιεχόμενο του site •Δώστε κατευθυντήριες γραμμές και εμπλουτίστε τη γραμμή αναζήτησης με λέξεις κλειδιά •Μην ξεχνάτε να βάζετε πάντα τίτλους στα διάφορα περιγράμματα καθώς και bullets και αρίθμηση

15 ΣΧΕΔΙΑΣΤΙΚΟΙ ΠΕΡΙΟΡΙΣΜΟΙ •Αποφύγετε τις έντονες αντιθέσεις στα χρώματα μεταξύ του κυρίως κειμένου και του backround •Αποφύγετε το οριζόντιο scrolling στα 800x600 •Χρησιμοποιείστε ένα ευπροσάρμοστο σε όλες τις οθόνες σχέδιο, ανάλογα με την ανάλυσή τους.

16 ΔΙΑΦΗΜΙΣΕΙΣ Οι διαφημίσεις στο Διαδίκτυο ενοχλούν τους χρήστες •Pop-Up windows •Banners •Staging pages •Τοποθετείστε τις διαφημίσεις όσο πιο μακριά από το κυρίως σώμα της σελίδας σας •Κάντε την παρουσία τους όσο πιο διακριτική γίνεται, με περιορισμό του μεγέθους τους. •Αν είναι απαραίτητη η παρουσία τους αφιερώστε τους έναν ειδικό χώρο ή ένα section κι ονομάστε το ads section

17 MULTIMEDIA •Μην το παρακάνετε με τις εικόνες. Τρώνε χώρο και χρόνο •Μουσική. Σίγουρα κάνει τον ιστότοπο πιο θελκτικό και αυξάνει το ενδιαφέρον του πλοηγητή •Animations. Ανάλογα με το σχεδιασμό τους, άλλοτε δημιουργούν προβλήματα κι άλλοτε όχι. Ειδικα σε ό,τι αφορά άτομα με μαθησιακές δυσκολίες ή προβλήματα όρασης, εικόνες που αναβοσβήνουν ή strobe light effect ή να αχνοτρέμει η σελίδα (40-60Hz/sec) •Το κείμενο πρέπει να περνάει αργά μπροστά από την οθόνη για να μπορεί να διαβαστεί

18 EXTRA TIPS •Ένα καλό site πρέπει να περιέχει πίνακες με στατιστικά στοιχεία, εφόσον αυτά είναι αληθή και δεν εισάγονται απλώς για να ξοδεύουν χώρο •Απαραίτητο είναι ένα link για την αποστολή e-mail •Οφείλει να περιέχει βιογραφικά στοιχεία για τον κατασκευαστή-δημιουργό ή συγγραφέα και να έχει τις απαραίτητες παραπομπές σε άλλα άρθρα του ίδιου ή και σε πηγές-copyright- βιβλιογραφία

19 Internet buzzwords •Communities •Chat-Forum •Free e-mail •Auctions •Offers •Sitemaps

20 SOS •Επενδύστε σε έναν γρήγορο server γιατί ο χρόνος στο internet είναι το παν •Μην ξεχνάτε να παρέχετε τα απαραίτητα προγράμματα για να μπορέσει ο χρήστης να “τρέξει” το site •Μην ξεχνάτε να ελέγχετε τα προγράμματα αυτά και να παρακολουθείτε τις επανεκδόσεις τους

21

22 WEBSITES NAVIGATION •http://www.abnormalbehaviorchild.com/http://www.abnormalbehaviorchild.com/ •http://www.pitchforkmedia.com/http://www.pitchforkmedia.com/ •http://www.lexus.com/http://www.lexus.com/