Ευχαριστίες...vii Εισαγωγή... ix. Μέρος Ι: Η θεωρία: Τα βασικά για τις ιστοσελίδες... 1

Transcript

1

2

3 Περιεχόμενα Ευχαριστίες...vii Εισαγωγή... ix Μέρος Ι: Η θεωρία: Τα βασικά για τις ιστοσελίδες... 1 Στο πρώτο μέρος του βιβλίου, θα μάθετε σχετικά με τη δημιουργία και τη σχεδίαση ιστοσελίδων, θα διώξετε κάθε επιφυλακτικότητα (ναι μπορείτε να δημιουργήσετε ιστοσελίδες), και θα μάθετε όλα όσα χρειάζονται για να προχωρήσετε με αυτοπεποίθηση. Στα πρώτα αυτά κεφάλαια, θα βρείτε διάφορες συμβουλές, κόλπα, και θεωρητικές επεξηγήσεις μαζί με πολλούς ηλεκτρονικούς συνδέσμους σε πόρους και παραδείγματα. Όταν ολοκληρώσετε την ανάγνωση του πρώτου μέρους, θα είστε σε θέση να δημιουργήσετε τις τέσσερις τοποθεσίες Ιστού που περιγράφονται στο δεύτερο μέρος. Κεφάλαιο 1: Απομυθοποίηση της (μελλοντικής) αρχικής σελίδας σας... 3 Το Internet: ένα "σωρό" συσκευές υλικού...4 Ο Ιστός: το λογισμικό του υλικού...4 Ιστοσελίδες: μερικά αρχεία στο δίκτυο...6 Από το κεφάλι σας στον Ιστό (και πάλι πίσω)...13 Πρόοδος με σταθερό ρυθμό...15 Βασικά σημεία...16 Κεφάλαιο 2: Δημιουργία και σχηματισμός κειμένου για τον Ιστό Τρόπος προσέγγισης των ιστοσελίδων από τους αναγνώστες...18 Στοιχεία κειμένου μιας ιστοσελίδας...21 Συγγραφή για τον Ιστό...25 Βασικά σημεία...36 Κεφάλαιο 3: Δημιουργία και χρήση καλλιτεχνικών στοιχείων για τον Ιστό Λειτουργία των γραφικών Ιστού...38 H τέχνη της χρήσης γραφικών Ιστού...53 Εύρεση καλλιτεχνικών στοιχείων...59 Βασικά σημεία...68 iii

4 iv Περιεχόμενα Κεφάλαιο 4: Σχεδιασμός ιστοσελίδων και τοποθεσιών Ιστού Το κοινό πάνω απ' όλα Σκιαγράφηση της τοποθεσίας σας Κανόνες σχεδιασμού ιστοσελίδων που δε θα σας προδώσουν Κανόνες σχεδιασμού τοποθεσιών Ιστού που πρέπει να ακολουθείτε Στην πράξη Βασικά σημεία Κεφάλαιο 5: Συγκέντρωση των απαραίτητων εφοδίων Σύνδεση στο Internet και χώρος σε διακομιστές Εργαλεία δημιουργίας ιστοσελίδων Λίγα λόγια για τους φυλλομετρητές Βασικά σημεία Κεφάλαιο 6: Καταστρώστε την επίθεσή σας Καθορισμός των στόχων σας Γνωριμία με το κοινό σας Δημιουργία του προσχέδιου της τοποθεσίας σας Θεμελίωση της αρχικής σας σελίδας Συλλογή των εφοδίων και προετοιμασία για την κατασκευή Βασικά σημεία Μέρος ΙΙ: Η πράξη: Δημιουργία ιστοσελίδων Στο δεύτερο μέρος υπάρχουν τέσσερα κεφάλαια ενός έργου, τα οποία σας προσφέρουν ολοκληρωμένη και πρακτική εξάσκηση καθώς θα ακολουθείτε τη διαδικασία δημιουργίας της τοποθεσίας Ιστού. Όπως πιθανότατα γνωρίζετε, η αξία της πρακτικής εξάσκησης δεν πρέπει ποτέ να παραβλέπεται! Τα κεφάλαια αυτού του μέρους βρίσκονται σε προοδευτική σειρά, από το πιο εύκολο στο πιο δύσκολο, για να μπορείτε να εξοικειωθείτε με τις πιο σύνθετες εργασίες της δημιουργίας ιστοσελίδων. Κεφάλαιο 7: Δημοσίευση ιστοσελίδας μέσα σε (περίπου) μία ώρα Εισαγωγή στις ηλεκτρονικές ομάδες και κοινότητες Γνωριμία με τις Ομάδες MSN Προετοιμασία μιας τοποθεσίας MSN Groups Εγγραφή στο MSN με Διαβατήριο.NET Δημιουργία τοποθεσίας Ιστού MSN Groups Πρόσθετοι πόροι Βασικά σημεία

5 Περιεχόμενα v Κεφάλαιο 8: Απομυθοποίηση της βασικής HTML Συγκέντρωση των εφοδίων της εργασίας Γιατί HTML; Τα βασικά της HTML Προετοιμασία της τοποθεσίας HTML Τοποθέτηση των φακέλων και των γραφικών σας στη σωστή θέση Προετοιμασία του αρχείου της αρχικής σας σελίδας Καθορισμός του φόντου και των χρωμάτων των συνδέσμων Δημιουργία πίνακα Εισαγωγή και σύνδεση του λογότυπου Εισαγωγή του γραφικού για τον τίτλο της αρχικής σελίδας Προσθήκη συνδέσμων πλοήγησης Εισαγωγή πληροφοριών υποσέλιδου Αντιγραφή του πλαισίου εργασίας της αρχικής σελίδας στις υποσελίδες Προσθήκη σώματος κειμένου στην αρχική σελίδα Εισαγωγή και σύνδεση εικόνας Ολοκλήρωση της αρχικής σελίδας Χρήση της δομής της μουσικής τοποθεσίας ως προτύπου Πρόσθετοι πόροι Βασικά σημεία Κεφάλαιο 9: Δημιουργία ιστοσελίδων με το Microsoft Word Συγκέντρωση των εφοδίων της εργασίας Γνωριμία με τις δυνατότητες του Word 2002 για τον Ιστό Προετοιμασία της ιστοσελίδας σας στο Word Μορφοποίηση εγγράφου κειμένου Κάτω από τις διαταγές του Οδηγού Αλλαγή χρωμάτων φόντου Ρύθμιση της γραμμής πλοήγησης Αποθήκευση, κλείσιμο, και νέο άνοιγμα της τοποθεσίας σας Δημιουργία και εισαγωγή καλλιτεχνικού κειμένου Εργασία με κείμενο και προσθήκη πληροφοριών πνευματικών δικαιωμάτων Εισαγωγή εικόνων Εργασία με υπερσυνδέσμους Προεπισκόπηση της δημιουργημένης με το Word ιστοσελίδας σας Πρόσθετοι πόροι Βασικά σημεία...254

6 vi Περιεχόμενα Κεφάλαιο 10: Δημιουργία ιστοσελίδων με το FrontPage Εισαγωγή στο FrontPage: ένας πλήρης διορθωτής HTML Προετοιμασία τοποθεσίας Ιστού στο FrontPage Δημιουργία νέου ιστού Δημιουργία της διάταξης των υποσελίδων Χρήση του προτύπου υποσελίδων για την κατασκευή ιστοσελίδων Δημιουργία αρχικής σελίδας στο FrontPage Πρόσθετοι πόροι Βασικά σημεία Μέρος ΙΙΙ: Η συνέχεια: Ενημέρωση και συντήρηση ιστοσελίδων Μετά τη δημοσίευση της τοποθεσίας Ιστού σας, θα πρέπει να αφιερώνετε λίγο χρόνο στην παρακολούθησή της. Φυσικά, μπορείτε να "ανεβάσετε" μια ιστοσελίδα στον Ιστό και να την αφήσετε εκεί χωρίς να την παρακολουθείτε, όμως τότε, η τοποθεσία σας θα ξεφτίσει με τον καιρό και οι χρήστες δε θα την επισκέπτονται αρκετά συχνά. Για να έχετε μια πραγματικά επιτυχημένη τοποθεσία, πρέπει να την περιποιείστε πότε-πότε. Σκοπός των κεφαλαίων του τρίτου μέρους είναι να σας δείξουν πώς να βγείτε στον αέρα (να δημοσιεύσετε τις σελίδες σας) και πώς να παραμείνετε επίκαιροι. Κεφάλαιο 11: Αποστολή των ιστοσελίδων σας στον πραγματικό κόσμο 311 Μεταφορά των αρχείων σας στο Internet Επισκόπηση της δουλειάς σας Εγγραφή σε μηχανές και καταλόγους αναζήτησης Βασικά σημεία Κεφάλαιο 12: Ενημέρωση, αρχειοθέτηση, και συνέχεια Ενημέρωση των ιστοσελίδων σας Αρχειοθέτηση στοιχείων ιστοσελίδων Πέρα από τις βασικές ιστοσελίδες Βασικά σημεία Ευρετήριο

7 Κεφάλαιο 4 Σχεδιασμός ιστοσελίδων και τοποθεσιών Ιστού Στο Κεφάλαιο 2 διαβάσατε σχετικά με το κείμενο Ιστού, και στο Κεφάλαιο 3 ρίξατε μια ματιά στα γραφικά Ιστού. Τώρα είστε έτοιμοι για λίγη θεωρία σχεδιασμού ιστοσελίδων και τοποθεσιών Ιστού. Αυτό είναι και το θέμα του παρόντος κεφαλαίου η επιτυχημένη ανάμιξη κειμένου και γραφικών Ιστού για τη δημιουργία ελκυστικών και χρηστικών ιστοσελίδων και τοποθεσιών Ιστού. Πριν όμως δούμε από κοντά τους μηχανισμούς σχεδίασης ιστοσελίδων και τοποθεσιών, θα πρέπει να αναφέρουμε κάποια θέματα προετοιμασίας. (Δείτε αυτή την ενότητα ως εισαγωγή για το Κεφάλαιο 6, το οποίο περιγράφει την προετοιμασία ιστοσελίδων και τοποθεσιών με λεπτομέρειες.) Ερμηνεία Ιστοσελίδα (Web page) είναι μία μόνο σελίδα που εμφανίζεται στο φυλλομετρητή σας. τοποθεσία Ιστού (Web site) είναι μια συλλογή από σχετικές μεταξύ τους ιστοσελίδες. και αρχική σελίδα (home page) είναι η κύρια σελίδα (που συνήθως έχει το ρόλο πίνακα περιεχομένων ή πληροφοριακής σελίδας) μιας τοποθεσίας. Όπως είναι λογικό, η προετοιμασία επηρεάζει το σχεδιασμό με διάφορους σημαντικούς τρόπους. Συγκεκριμένα, προτού σχεδιάσετε μια σελίδα για τον Ιστό θα πρέπει να λάβετε υπόψη το ακροατήριό σας και να οργανώσετε τη διάταξη της αρχικής σελίδας και τη δομή της τοποθεσίας σας (αν σχεδιάζετε να αναπτύξετε την αρχική σας σελίδα σε μια πλήρη τοποθεσία Ιστού). 69

8 70 Μέρος Ι: Η θεωρία: Τα βασικά για τις ιστοσελίδες Το κοινό πάνω απ' όλα Κατά πάσα πιθανότητα δημιουργείτε μια ιστοσελίδα επειδή έχετε να μεταδώσετε κάποια γνώση, να περάσετε ένα μήνυμα, να παράσχετε μια υπηρεσία, να οργανώσετε μια ομάδα, ή να προσφέρετε διασκέδαση. Αλλά πριν προχωρήσετε στην υλοποίηση δημιουργώντας μια ιστοσελίδα ή μια τοποθεσία Ιστού, θα πρέπει να απαντήσετε τουλάχιστον σε τέσσερα ερωτήματα που αφορούν το ακροατήριό σας: Ποιος είναι ο σκοπός της σελίδας μου; Καθορίστε με σαφήνεια το σκοπό της ιστοσελίδας ή της τοποθεσίας στον εαυτό σας. Για παράδειγμα, προσδιορίστε αν η τοποθεσία σας ενημερώνει, ψυχαγωγεί, χρησιμεύει ως πύλη Ιστού (όπως μια τοποθεσία αναζήτησης ή ένας κατάλογος συνδέσεων), απευθύνεται σε κάποια συγκεκριμένη κοινότητα (όπως είναι οι χομπίστες, οι ακτιβιστές, οι υπάλληλοι, οι πελάτες κ.ο.κ.), παρουσιάζει μια καλλιτεχνική έκφραση, παρέχει προφίλ προσωπικότητας (όπως μια προσωπική σελίδα ή σύνοψη), ή εξυπηρετεί κάποιον άλλο συγκεκριμένο σκοπό. Αφού ορίσετε το γενικό σκοπό της τοποθεσίας σας, δουλέψτε με το θέμα της. Για παράδειγμα, ας υποθέσουμε ότι αποφασίζετε να δημιουργήσετε μια ενημερωτική τοποθεσία για κατοικίδια ζώα. Διαλέξατε μια ενημερωτική μορφή είναι μια αρχή, αλλά τα κατοικίδια αποτελούν μεγάλο θέμα. Θα μπορούσατε να προσδιορίσετε περισσότερο το σκοπό σας αποφασίζοντας να παρέχετε πληροφορίες σχετικά με τη φροντίδα, ας πούμε, των γατών, ή πιο συγκεκριμένα, των περσικών γατών. Ποιο είναι το κοινό μου; Αναλύστε το ποιοι θα βλέπουν τις σελίδες σας πελάτες επιχειρήσεων, παιδιά, καλλιτέχνες, "αθλητές της πολυθρόνας", η οικογένειά σας, κ.ο.κ. Γίνετε όσο πιο συγκεκριμένοι μπορείτε. Κατόπιν σκεφθείτε ένα συγκεκριμένο άτομο ένα πραγματικό άτομο που αναπαριστά ένα τυπικό μέλος του κοινού σας και το οποίο θα έχετε στο μυαλό σας κατά το σχεδιασμό. Για παράδειγμα, ας υποθέσουμε ότι δημιουργείτε μια τοποθεσία για μια ομάδα μπάσκετ. Όταν σχεδιάζετε αυτή την τοποθεσία, θα πρέπει να έχετε στο μυαλό σας το φίλο, συγγενή, γείτονα, συνεργάτη, ή γνωστό που είναι ο περήφανος κάτοχος της πλήρους συλλογής από φανέλες της ομάδας, αρνείται να χάσει έστω και έναν αγώνα, και συχνά ξεφωνίζει μπροστά στην τηλεόρασή του κατά τη διάρκεια της αγωνιστικής περιόδου. Αν δεν έχετε κάποιον τέτοιον τύπο κοντά σας (σίγουρα αποτελείτε φαινόμενο!), ως ιδανικό μέλος του κοινού σας θα μπορούσατε να χρησιμοποιήσετε κάποιο γνωστό αθλητικό συντάκτη (για παράδειγμα, τον Βασίλη Σκουντή), ένα χαρακτήρα από τηλεοπτικό σήριαλ, ή ακόμα και ένα χαρακτήρα από κάποιο βιβλίο ή ταινία. Με άλλα λόγια, για να δημιουργήσετε μια δυναμική, καλά εστιασμένη τοποθεσία, θα πρέπει να τη σχεδιάσετε έχοντας στο μυαλό μια ξεκάθαρη εικόνα ενός συγκεκριμένου φιλάθλου δεν πρέπει να κάνετε το σχεδιασμό με την αόριστη ιδέα ότι δημιουργείτε μια τοποθεσία για οποιονδήποτε παρακολούθησε κάποια στιγμή έναν αγώνα μπάσκετ. Παρεμπιπτόντως, μην ανησυχείτε δε χρειάζεται να πείτε στο άτομο που παίζει το ρόλο του "ιδανικού μέλους κοινού" ότι τον (ή την) χρησιμοποιείτε ως εργαλείο σχεδιασμού! Γενικά, ο σχεδιασμός για ένα πραγματικό άτομο είναι πολύ πιο αποτελεσματικός και ευχάριστος από το σχεδιασμό για ένα γενικό προφίλ κοινού.

9 Κεφάλαιο 4: Σχεδιασμός ιστοσελίδων και τοποθεσιών Ιστού 71 Ποιος είμαι; Προσδιορίστε το πώς θέλετε να παρουσιάσετε τον εαυτό σας στο κοινό. Θα πρέπει να επιλέξετε συνειδητά τη μορφή επικοινωνίας με το κοινό σας ανεπίσημη, τυπική, επαγγελματική, κωμική, δημιουργική, σοβαρή, κ.ο.κ. Η δημιουργία μιας άποψης (ή προσωπικότητας) για τον εαυτό σας μπορεί να σας βοηθήσει να αποφύγετε κάποιες λανθασμένες αποφάσεις κατά το σχεδιασμό, όπως το να συμπεριλάβετε στη σελίδα του προϋπολογισμού της εταιρείας σας μια χαριτωμένη φωτογραφία του ανιψιού σας στο πάρτυ των πρώτων γενεθλίων του. Πώς θα βλέπει το κοινό μου τη σελίδα μου; Λάβετε υπόψη τις τεχνικές δυνατότητες του κοινού σας. Βασικά, πρέπει να σκεφθείτε πώς θα προσπελάζει την τοποθεσία σας ένα τυπικό μέλος του ακροατηρίου σας. Αν η τοποθεσία προορίζεται για χρήση από πανεπιστήμια, πιθανότατα δε χρειάζεται να ανησυχείτε σχετικά με το εύρος ζώνης, αφού τα περισσότερα πανεπιστήμια διαθέτουν δίκτυα μεγάλου εύρους ζώνης. Από την άλλη πλευρά, αν σχεδιάζετε σελίδες για τους φίλους σας που μετά την αποφοίτησή τους έχουν διασκορπιστεί σε ολόκληρη τη χώρα (ή τον κόσμο), πρέπει να δημιουργήσετε σελίδες που κατεβαίνουν σχετικά γρήγορα ώστε να διευκολύνετε τη λήψη μέσω των τηλεφωνικών γραμμών. Συμβουλή Ο σχεδιασμός που δεν εστιάζεται σε ένα συγκεκριμένο κοινό οδηγεί σε άσκοπες αποφάσεις. Αντίθετα, ο σαφής προσδιορισμός του κοινού σας παρέχει αναγνωρίσιμα όρια και επιτρέπει έξυπνες επιλογές σχεδιασμού. Όπως αναφέραμε νωρίτερα, το Κεφάλαιο 6 καλύπτει σε μεγαλύτερο βάθος τα θέματα της δομής τοποθεσιών, της προετοιμασίας, και της ανάλυσης κοινού, αλλά οι απαντήσεις σας στις προηγούμενες ερωτήσεις θα πρέπει να σας δώσουν μια αίσθηση σχετικά με το κοινό σας. Και, όπως θα δείτε σύντομα, το να γνωρίζετε το κοινό σας έχει σημασία όταν πρέπει να πάρετε κάποιες αποφάσεις κατά το σχεδιασμό. Για παράδειγμα, ως σπουδή για το κεφάλαιο αυτό επανασχεδιάσαμε την τοποθεσία New Frontiers for Learning in Retirement (NFLR Νέα σύνορα στη μάθηση κατά τη συνταξιοδότηση). Το βασικό κοινό της τοποθεσίας είναι η κοινότητα των συνταξιούχων, το οποίο γενικά προσπελάζει το Internet με τυπικές ταχύτητες τηλεφωνικών μόντεμ (από 28,8 Kbps ανά δευτερόλεπτο μέχρι 56 Kbps ανά δευτερόλεπτο), και όχι με καλωδιακά μόντεμ υψηλών ταχυτήτων, γραμμές DSL (Digital Subscriber Lines), ή γραμμές T1. Για το λόγο αυτόν, όταν επανασχεδιάσαμε τη σελίδα NFLR είχαμε στο μυαλό μας την κοινότητα των συνταξιούχων και τις συνδέσεις των απλών τηλεφωνικών γραμμών που χρησιμοποιούν. Ερμηνεία Οι γραμμές Τ1 είναι γραμμές επικοινωνίας υψηλής ταχύτητας που μπορούν να παράσχουν πρόσβαση στο Internet με ρυθμό 1,544 megabit το δευτερόλεπτο.

10 72 Μέρος Ι: Η θεωρία: Τα βασικά για τις ιστοσελίδες Σκιαγράφηση της τοποθεσίας σας Αφού προσδιορίσετε το κοινό σας, και πριν ξεκινήσετε να δημιουργείτε τις ιστοσελίδες σας, πρέπει να σχεδιάσετε τη διάταξη της αρχικής σας σελίδας καθώς και τις τυχόν σχέσεις μεταξύ των υπόλοιπων σελίδων αυτή η οπτική απεικόνιση ονομάζεται σκιαγράφηση. Δε χρειάζεται να είστε καλλιτέχνες για να δημιουργήσετε σκιαγραφήσεις για τις ιστοσελίδες και τις τοποθεσίες Ιστού σας. Για την ακρίβεια, ένας από τους αγαπημένους μας τρόπους για να κάνουμε αυτή τη δουλειά είναι πάνω στις χαρτοπετσέτες ενός κοντινού Ιταλικού εστιατορίου. Όπως και με την προηγούμενη κουβέντα μας σχετικά με το ακροατήριο, το θέμα της σκιαγράφησης ιστοσελίδων και τοποθεσιών Ιστού καλύπτεται με περισσότερες λεπτομέρειες στο Κεφάλαιο 6. Προς το παρόν, απλώς αναφέρουμε τη σκιαγράφηση των σελίδων και της τοποθεσίας σας (αν δημιουργείτε τοποθεσία) ως ένα βήμα κατά το σχεδιασμό. Κατά την εργασία σας με το κείμενο στο Κεφάλαιο 2, ίσως καταλήξατε σε κάποιες ιδέες για την οργάνωση της τοποθεσίας που βασίζονταν στα αποτελέσματα του brainstorming. Η σκιαγράφηση αφορά τη δημιουργία ενός πρόχειρου σχεδιαγράμματος με τις οργανωτικές σας ιδέες, στο οποίο θα φαίνονται οι σχέσεις μεταξύ των στοιχείων κάθε σελίδας καθώς και οι σχέσεις μεταξύ των σελίδων της τοποθεσίας. Τώρα επικεντρώνεστε στη δομή της τοποθεσίας σας, και όχι στο να βελτιώσετε το περιεχόμενό σας. Οι Εικόνες 4-1 και 4-2 παρουσιάζουν την έννοια της σκιαγράφησης. Η Εικόνα 4-1 δείχνει το σκαρίφημα της επανασχεδιασμένης έκδοσης της αρχικής σελίδας για την τοποθεσία New Frontiers for Learning in Retirement (NFLR2), ενώ η Εικόνα 4-2 παρουσιάζει το πώς νομίζαμε ότι πρέπει να α- ναδιοργανωθεί η τοποθεσία NFLR. Αργότερα σε αυτό το κεφάλαιο θα μπορέσετε να δείτε μερικές από τις σκιαγραφημένες σελίδες της αναδιοργανωμένης τοποθεσίας να παίρνουν σχήμα. Τώρα που πήρατε έστω και μια μικρή ιδέα σχετικά με τις έννοιες του ακροατηρίου και της προετοιμασίας ιστοσελίδων και τοποθεσιών, ας προχωρήσουμε στην περιγραφή του πώς μπορείτε να συνδυάσετε καλύτερα κείμενο και γραφικά Ιστού ώστε να δημιουργήσετε καλοσχεδιασμένες ιστοσελίδες και τοποθεσίες Ιστού. Πρώτα θα ασχοληθούμε με θέματα σχεδιασμού ιστοσελίδων. Αργότερα σε αυτό το κεφάλαιο θα αναφερθούμε και στο σχεδιασμό τοποθεσιών Ιστού.

11 Κεφάλαιο 4: Σχεδιασμός ιστοσελίδων και τοποθεσιών Ιστού 73 Εικόνα 4-1 Το σκαρίφημά μας για την επανασχεδιασμένη αρχική σελίδα της τοποθεσίας NFLR δείχνει τη βασική δομή που χρησιμοποιήθηκε για όλες τις σελίδες της τοποθεσίας. Εικόνα 4-2 Το σχεδιάγραμμα της αναδιοργανωμένης τοποθεσίας NFLT παρουσιάζει τη γενική δομή της τοποθεσίας και τις σχέσεις μεταξύ των σελίδων.

12 74 Μέρος Ι: Η θεωρία: Τα βασικά για τις ιστοσελίδες Κανόνες σχεδιασμού ιστοσελίδων που δε θα σας προδώσουν Για να μπορέσετε να δημιουργήσετε μια τοποθεσία Ιστού, πρέπει πρώτα να δημιουργήσετε μια ι- στοσελίδα άλλωστε, ίσως να σχεδιάζετε να κατασκευάσετε μόνο μια αρχική σελίδα, αντί για μια πλήρη τοποθεσία. Σε κάθε περίπτωση, μπορείτε να εκμεταλλευτείτε μερικά δοκιμασμένα κόλπα σχετικά με το σχεδιασμό Ιστού. Στην ενότητα αυτή θα ασχοληθούμε με βασικά θέματα και αποδεδειγμένες τακτικές σχεδιασμού ιστοσελίδων. Θα κρατήσουμε όμως και μια μικρή επιφύλαξη, επειδή ο σχεδιασμός ιστοσελίδων και τοποθεσιών Ιστού αποτελεί πρώτα απ' όλα μια δημιουργική ενασχόληση. Δε θα θέλαμε να αφαιρέσουμε το ελάχιστο από τη δημιουργικότητά σας αντίθετα, σκοπός μας είναι να κεντρίσουμε τη φαντασία σας. Θα πρέπει να καταλάβετε ότι οι παράμετροι που αναφέρουμε σε αυτό το κεφάλαιο (καθώς και σε όλο το βιβλίο) είναι απλώς γενικές οδηγίες. Ελπίζουμε να πειραματιστείτε με τις ιστοσελίδες σας με τρόπους που δεν αναφέρονται στο κείμενο. Σας συνιστούμε θερμά να το κάνετε. Οι πληροφορίες αυτού του κεφαλαίου θα σας δώσουν μια ισχυρή βάση για τις δικές σας προσπάθειες. Αν ακολουθήσετε τις συμβουλές του βιβλίου, θα μπορείτε να δημιουργείτε σαφείς, ελκυστικές, και εύκολες στην πλοήγηση ιστοσελίδες. Κατόπιν μπορείτε να περάσετε από τα βασικά σε νέα δημιουργικά ύψη (και να μας στείλετε ένα όταν το κάνετε, επειδή θα χαιρόμασταν να δημοσιεύσουμε ένα σύνδεσμο προς την ιστοσελίδα σας στη διεύθυνση Συμβουλή Να θυμάστε ότι οι περισσότερες θεωρίες σχετικά με τον καλό σχεδιασμό σελίδων ισχύουν και για τον καλό σχεδιασμό τοποθεσιών. Για τις ανάγκες της περιγραφής, χωρίσαμε τις βασικές αρχές σχεδιασμού ιστοσελίδων στις ακόλουθες ενότητες: Διαστάσεις ιστοσελίδων Θέματα διάταξης ("στησίματος") σελίδων Χρώμα Εργαλεία πλοήγησης και υπερσύνδεσμοι Κείμενο Γραφικά Τυπικά στοιχεία αξιοπιστίας Διαστάσεις ιστοσελίδων Θεωρητικά, οι ιστοσελίδες έχουν άπειρο ύψος και πλάτος επειδή δεν περιορίζονται στο μέγεθος του φυσικού χαρτιού. Βέβαια, ο σχεδιασμός της σελίδας σας με μετρήσεις τύπου "άπειρο επί άπειρο" δεν πρόκειται να βοηθήσει ούτε εσάς ούτε τους επισκέπτες σας. Γι' αυτό, ας δούμε έναν πιο λογικό τρόπο για την επιλογή των ορίων των σελίδων σας. Ο καλύτερος τρόπος για να περιορίσετε τις παραμέτρους της ιστοσελίδας σας είναι να λάβετε υπόψη την έκταση που θα έχει το παράθυρο του φυλλομετρητή στο μηχάνημα με τον χαμηλότερο κοινό παρονομαστή. Με άλλα λόγια, πρέπει να

13 Κεφάλαιο 4: Σχεδιασμός ιστοσελίδων και τοποθεσιών Ιστού 75 υπολογίσετε την ποσότητα του ορατού περιεχομένου στο παράθυρο του χρήστη που διαθέτει το φυλλομετρητή με τις πιο περιορισμένες δυνατότητες. Για τους σκοπούς του σχεδιασμού ιστοσελίδων, η μικρότερη ανάλυση οθόνης που χρησιμοποιείται εμφανίζει πίξελ. Επιπλέον, διάφοροι φυλλομετρητές τείνουν να εμφανίζουν ακόμη μικρότερη περιοχή από αυτή εξαιτίας της διευθέτησής τους (στην οποία μπορεί να περιλαμβάνονται οι γραμμές εργαλείων, οι ράβδοι κύλισης, οι γραμμές κατάστασης, τα παράθυρα Αγαπημένων και Σελιδοδεικτών, κ.ο.κ.). Για παράδειγμα, δείτε την Εικόνα 4-3. Οι δύο οθόνες παρουσιάζουν τον Microsoft Internet Explorer στις πλατφόρμες Windows XP και Aplle Macintosh OS X, με τη μέγιστη διαθέσιμη περιοχή προβολής στις προεπιλεγμένες διευθετήσεις του φυλλομετρητή. Όπως μπορείτε να δείτε στην εικόνα, ο Internet Explorer στα Windows παρέχει προβολή μεγέθους πίξελ, ενώ ο Internet Explorer του OS X παρέχει προβολή πίξελ. Ακόμη, οι χρήστες που χρησιμοποιούν το Netscape Navigator έχουν μια μέγιστη περιοχή προβολής πίξελ στα συστήματα Windows και πίξελ σε Macintosh. Εικόνα 4-3 Η μέγιστη ορατή περιοχή του Internet Explorer σε συστήματα Windows με ρύθμιση ανάλυσης είναι Η μέγιστη ορατή περιοχή του Internet Explorer σε ένα σύστημα Macintosh με ρύθμιση ανάλυσης είναι Συνεπώς, αν συνδυάσετε τις μικρότερες τιμές των διαθέσιμων περιοχών προβολής σε Internet Explorer και Netscape, βλέπετε ότι το μέγεθος (μας αρέσει να δουλεύουμε με στρογγυλούς αριθμούς) είναι η μικρότερη περιοχή που προκύπτει από το συνδυασμό φυλλομετρητή/συστήματος η περιοχή αυτή ονομάζεται ασφαλής. Όταν σχεδιάζετε ιστοσελίδες (ειδικά την αρχική σας σελίδα), πρέπει να λαμβάνετε υπόψη τις μετρήσεις της ασφαλούς περιοχής και, όπως περιγράφουμε στη συνέχεια, να εξασφαλίζετε ότι οι πιο σημαντικές πληροφορίες της ιστοσελίδας σας εμφανίζονται μέσα στα όρια αυτά. Αφού τελειώσαμε με τα μαθηματικά της ασφαλούς περιοχής, μπορούμε πλέον να αναφέρουμε ότι παρόλο που πρέπει να σχεδιάζετε τις σελίδες σας λαμβάνοντας υπόψη την ασφαλή περιοχή και να τοποθετείτε τις πιο σημαντικές σας πληροφορίες όσο πιο κοντά σε αυτή γίνεται, οι περισσότεροι βλέπουν τον Ιστό στις οθόνες τους με ανάλυση πίξελ. Για την ακρίβεια, σύμφωνα με την τοποθεσία (17 Φεβρουαρίου 2001), ένα δείγμα από τοποθεσίες

14 76 Μέρος Ι: Η θεωρία: Τα βασικά για τις ιστοσελίδες Ιστού έδειξε τα ακόλουθα ποσοστά (στρογγυλεμένα στο κοντινότερο 0,5 %) χρήσης των διαθέσιμων αναλύσεων οθόνης: : 7% : 53% : 31% : 2,5% : 2,5% Άλλη: 4% Ουσιαστικά, οι προηγούμενοι αριθμοί σημαίνουν ότι μπορείτε να κατευθύνετε το σχεδιασμό σας ώστε να λειτουργεί καλύτερα με τη ρύθμιση ανάλυσης , λαμβάνοντας παράλληλα υπόψη και τις υπόλοιπες αναλύσεις (δηλαδή, πρέπει να δείτε τις σελίδες σας σε όλες τις αναλύσεις για να βεβαιωθείτε ότι δεν υπάρχει κάποιο σοβαρό πρόβλημα). Αλλά ακόμα και αφού υπολογίσετε τις μετρήσεις της ασφαλούς περιοχής και τα στατιστικά των τοποθεσιών Ιστού, υπάρχει ακόμα ένα θέμα που πρέπει να προσέξετε σχετικά με τις διαστάσεις των ιστοσελίδων έχετε υπόψη ότι οι χρήστες δε μεγιστοποιούν πάντοτε τα παράθυρα των φυλλομετρητών τους, ιδιαίτερα αν χρησιμοποιούν μεγάλες οθόνες. Συνεπώς, ακόμα και αν σχεδιάζετε για ανάλυση , δεν είστε σε θέση να ελέγξετε με ακρίβεια τον τρόπο και το μέγεθος με το οποίο θα βλέπει ο κόσμος τις σελίδες σας. Ως αντιστάθμισμα στην αδυναμία πρόβλεψης του τρόπου παρουσίασης των σελίδων σας, στις εργασίες του Δεύτερου Μέρους θα σας δείξουμε πώς να δημιουργείτε ρευστές σελίδες. Οι ρευστές σελίδες αλλάζουν αυτόματα όσο περισσότερο γίνεται το μέγεθός τους σύμφωνα με το παράθυρο του φυλλομετρητή, χωρίς να χαθεί η γενική δομή τους. Με δεδομένους, λοιπόν, τους "άγνωστους παράγοντες" που σχετίζονται με τις διαστάσεις των ιστοσελίδων, ίσως να αναρωτιέστε αν υπάρχει περίπτωση να σχεδιάσετε με επιτυχία μια σελίδα που να μπορεί να εμφανιστεί σωστά στις οθόνες των περισσότερων επισκεπτών. Φυσικά και υπάρχει. στο κάτω-κάτω, θα πρέπει να έχετε δει και οι ίδιοι αρκετές καλοσχεδιασμένες σελίδες στον Ιστό. Βασικά, όσον αφορά τις διαστάσεις ιστοσελίδων, ο στόχος σας ως σχεδιαστές Ιστού είναι να εξασφαλίσετε ότι οι σημαντικές σας πληροφορίες παρουσιάζονται στην ζώνη της ελάχιστης ασφαλούς περιοχής, και να δημιουργείτε ρευστές σελίδες όπου είναι δυνατόν. Με αυτές τις δύο μεθόδους θα είστε σε θέση να παρουσιάζετε τις πληροφορίες σας με τον καλύτερο δυνατό τρόπο στους περισσότερους χρήστες του Ιστού.

15 Κεφάλαιο 4: Σχεδιασμός ιστοσελίδων και τοποθεσιών Ιστού 77 Δοκιμάστε κι αυτό! Αν έχετε ένα σχετικά σύγχρονο υπολογιστικό σύστημα (Windows 98 ή μεταγενέστερα), μπορείτε να δείτε το αποτέλεσμα της προβολής ιστοσελίδων σε διάφορα μεγέθη οθονών. Ακολουθήστε τα επόμενα βήματα: 1 Πατήστε με το δεξιό πλήκτρο του ποντικιού σε ένα κενό σημείο της επιφάνειας εργασίας σας, και επιλέξτε τη διαταγή Properties (Ιδιότητες). 2 Στο πλαίσιο διαλόγου Display Properties (Ιδιότητες οθόνης), πατήστε στην καρτέλα Settings (Ρυθμίσεις). 3 Αν χρησιμοποιείτε Windows 98, Windows Me, ή Windows 2000, σύρετε το ροοστάτη της ενότητας Screen Area (Περιοχή οθόνης) ώστε να αλλάξετε την ανάλυση της οθόνης σε , πατήστε στο κουμπί Apply (Εφαρμογή), πατήστε στο ΟΚ (κατά την αλλαγή της ανάλυσης η οθόνη σας μπορεί να "μαυρίσει" για λίγο), πατήστε στο Yes, και τέλος πατήστε στο ΟΚ. Αν χρησιμοποιείτε Windows XP, η καρτέλα Settings του πλαισίου διαλόγου Display Properties δεν εμφανίζει εξ ορισμού την επιλογή Γι' αυτό, προκειμένου να χρησιμοποιήσετε αυτή την ανάλυση σε ένα μηχάνημα με XP πατήστε στο κουμπί Advanced (Για προχωρημένους) της καρτέλας Settings, ανοίξτε την καρτέλα Adapter (Προσαρμογέας), και πατήστε στο κουμπί List All Modes (Εμφάνιση όλων των καταστάσεων). Στο ομώνυμο πλαίσιο διαλόγου επιλέξτε τη ρύθμιση 640 by 480, και πατήστε στο ΟΚ. 4 Εμφανίστε τη σελίδα στο φυλλομετρητή σας, και κατόπιν ελαχιστοποιήστε το παράθυρο του φυλλομετρητή. 5 Επαναλάβετε τα βήματα 1 έως 3, αλλάζοντας τη ρύθμιση σε (αν χρησιμοποιείτε Windows XP, δε χρειάζεται να επισκεφθείτε ξανά την καρτέλα Advanced μπορείτε απλώς να σύρετε το ροοστάτη της ενότητας Screen Area). 6 Εμφανίστε τη σελίδα με τη νέα ρύθμιση, και μετά ελαχιστοποιήστε το παράθυρο του φυλλομετρητή σας. 7 Επαναλάβετε τα βήματα 1 έως 3 χρησιμοποιώντας τη ρύθμιση (την πιο δημοφιλή ρύθμιση ανάλυσης οθόνης), εμφανίστε τη σελίδα και μετά κλείστε το παράθυρο του φυλλομετρητή σας. Καθώς πραγματοποιείτε την προηγούμενη διαδικασία, η προβολή της ιστοσελίδας NFLR2 θα πρέπει να μεταμορφώνεται σύμφωνα με τις αλλαγές που φαίνονται στις επόμενες εικόνες

16 78 Μέρος Ι: Η θεωρία: Τα βασικά για τις ιστοσελίδες Συμβουλή Όταν σχεδιάζετε ιστοσελίδες, πρέπει να ελέγχετε τις σελίδες σας κάτω από διάφορες ρυθμίσεις οθόνης και χρώματος και με διάφορους φυλλομετρητές, ώστε να εξασφαλίζετε ότι εμφανίζονται σωστά στην πλειονότητα των επισκεπτών. Για παράδειγμα, θα μπορούσατε να εκτελέσετε τα βήματα της άσκησης "Δοκιμάστε κι αυτό!" που είδαμε προηγουμένως ώστε να ελέγξετε τις ιστοσελίδες σας σε διάφορα μεγέθη. Κατόπιν, πειραματιστείτε με διάφορα μεγέθη σε άλλους φυλλομετρητές και με άλλες ρυθμίσεις χρωμάτων. Θέματα διάταξης σελίδων Τώρα που καταλήξαμε σε ένα μέγεθος σελίδας, ας ασχοληθούμε με τις διατάξεις (το "στήσιμο") των σελίδων. Για την ιστορία, θα θέλαμε να αναφέρουμε ότι αν και ο Ιστός παρέχει σχεδόν απόλυτη ε- λευθέρια στον τρόπο δημοσίευσης, αυτό δε σημαίνει ότι μπορείτε να "ανεβάσετε" το κείμενο και τα γραφικά σας όπως-όπως και να ξεμπερδέψετε εκτός και αν δε σας ενδιαφέρει το αν οι επισκέπτες θα μένουν στη σελίδα σας για να διαβάσουν ή έστω και να ρίξουν μια βιαστική ματιά στο περιεχόμενό της. Μια πιο επιτυχημένη προσέγγιση την οποία και συνιστούμε θερμά είναι να ακολουθήσετε μερικούς βασικούς κανόνες για τη διάταξη των σελίδων σας. Ο πρώτος κανόνας διάταξης είναι να εφαρμόζετε βασικές αρχές προτύπων. Πρότυπο (όπως ίσως γνωρίζετε από το σχεδιασμό έντυπων σελίδων) είναι ένα πλέγμα το οποίο μπορείτε να χρησιμοποιήσετε ως οδηγό για τη διάταξη των στοιχείων της σελίδας σας. Παρόλο που ειδικοί περιορισμοί σάς εμποδίζουν να τηρήσετε κάποιους αυστηρούς κανόνες και οδηγίες για τη διάταξη των ιστοσελίδων με τη συνέπεια που θα το κάνατε σε έντυπο κείμενο, πολλές ιστοσελίδες ακολουθούν κάποια χαλαρά πρότυπα για να βοηθήσουν τη ροή των πληροφοριών. Για παράδειγμα, η Εικόνα 4-4 παρουσιάζει το βασικό πρότυπο που χρησιμοποιήσαμε για την τοποθεσία NFLR2. Αν επισκεφθείτε αυτή την τοποθεσία ( και πατήσετε σε μερικούς συνδέσμους, θα δείτε ότι κάθε σελίδα τηρεί το απλό και σαφές πρότυπο που βλέπετε στην Εικόνα 4-4. Η χρήση ενός προτύπου σάς επιτρέπει να στοιχίζετε στοιχεία και να δημιουργείτε εσωτερικές και εξωτερικές αποστάσεις μεταξύ τους και γύρω τους. Όταν δημιουργείτε πρότυπα, πρέπει να έχετε στο μυαλό σας ότι γενικά οι άνθρωποι σαρώνουν τις ιστοσελίδες από τα αριστερά προς τα δεξιά και από πάνω προς τα κάτω. γι' αυτό, σχεδιάστε ανάλογα. Η βασική περιοχή σχεδίασης είναι μεταξύ του αριστερού άκρου και του επάνω ορίου της πρώτης σελίδας που βλέπει ο χρήστης, κάτι που μας ξαναγυρίζει με πολύ ωραίο τρόπο στη συζήτησή μας για την "ασφαλή περιοχή". Όπως αναφέραμε νωρίτερα, ως ασφαλή περιοχή μπορείτε να θεωρήσετε ένα τμήμα πίξελ σε όποιο φυλλομετρητή και να φορτωθεί η σελίδα σας, ενώ η πιο συνηθισμένη ανάλυση οθόνης είναι η (η οποία διαθέτει μια ασφαλή περιοχή γύρω στα που ισχύει για όλους τους φυλλομετρητές και σε όλες τις πλατφόρμες). Ως επί το πλείστον, οι χρήστες κυλάνε τα περιεχόμενα του παραθύρου προς τα κάτω, αλλά όχι και κατά μήκος. Γι' αυτό, όταν δημιουργείτε μια ιστοσελίδα φροντίστε να τηρείτε τον περιορισμό του μήκους όσο το δυνατόν περισσότερο, αλλά μη φοβηθείτε αν η σελίδα σας ξεπεράσει τον περιορισμό ύψους της ασφαλούς περιοχής.

17 Κεφάλαιο 4: Σχεδιασμός ιστοσελίδων και τοποθεσιών Ιστού 79 Λογότυπο Γραφικό διαστήματος Περιοχή τίτλου Κουμπιά πλοήγησης Εικόνα 4-4 Περιοχή σώματος Η τοποθεσία NFLR2 ακολουθεί ένα απλό γεωμετρικό πρότυπο. Και τώρα ακολουθεί μια ακόμη πιο σημαντική συμβουλή: Το προτιμότερο σημείο απ' όλα στην α- σφαλή περιοχή είναι η επάνω αριστερή γωνία. Γιατί; Επειδή, ανεξάρτητα από το μέγεθος που θα δώσει ο χρήστης στο παράθυρο του φυλλομετρητή του, η επάνω αριστερή γωνία θα παραμείνει ορατή (ή, στη χειρότερη περίπτωση, είναι η περιοχή που θα φαίνεται μέχρι την τελευταία στιγμή αν η αλλαγή μεγέθους του παραθύρου είναι οριακή). Έτσι, η επάνω αριστερή γωνία είναι ιδιαίτερα πολύτιμη αποτελεί το ιδανικό μέρος για να τοποθετήσετε το λογότυπο της εταιρείας σας ή άλλες σημαντικές πληροφορίες. Μετά την επάνω αριστερή γωνία, η επόμενη καλύτερη περιοχή μιας ιστοσελίδας είναι αυτή που οι δημοσιογράφοι αναφέρουν ως "πάνω από το δίπλωμα". Στις εφημερίδες, τα πιο σημαντικά άρθρα βρίσκονται πάνω από το σημείο όπου διπλώνει το χαρτί, ώστε όταν η εφημερίδα αναρτηθεί στα περίπτερα οι περαστικοί να βλέπουν τους κύριους τίτλους και να μπαίνουν στον πειρασμό να την αγοράσουν. Προφανώς, οι χρήστες δεν μπορούν να διπλώνουν τις οθόνες τους (όχι ακόμα, τουλάχιστον), έτσι το σημείο "δίπλωματός" σας πρέπει να συμπίπτει με το κάτω άκρο της ασφαλούς περιοχής. Όταν ετοιμάζετε τη διάταξη των πληροφοριών της σελίδας σας, βεβαιωθείτε ότι το πρώτο πράγμα που θα βλέπει ο χρήστης είναι οι πιο σημαντικές και αξιοπρόσεκτες πληροφορίες. Επίσης, σε περίπτωση που η σελίδα σας ξεπερνάει το σημείο "διπλώματος", εξασφαλίστε με το σχεδιασμό σας ότι αυτό γίνεται σαφές στους επισκέπτες όταν βλέπουν την πρώτη οθόνη. (Αλλιώς, οι χρήστες μπορεί να μην κυλήσουν καθόλου τα περιεχόμενα του παραθύρου.) Για να δείξετε ότι η σελίδα συνεχίζεται, μπορείτε να αποφύγετε εμφανείς διακοπές (όπως απόσταση μεταξύ παραγράφων) στο κάτω όριο της ασφαλούς περιοχής.

18 80 Μέρος Ι: Η θεωρία: Τα βασικά για τις ιστοσελίδες Τέλος, οι βασικοί σύνδεσμοι πλοήγησης της τοποθεσίας σας (όπως η γραμμή πλοήγησης, η γραμμή μενού, ή τα κουμπιά) πρέπει να τοποθετούνται μέσα στην ασφαλή περιοχή των σελίδων κατά προτίμηση κατά μήκος της αριστερής ή της επάνω πλευράς. Η τοποθεσία NFLR2 χρησιμοποιεί την πολύ συνηθισμένη διευθέτηση με τη γραμμή πλοήγησης στο αριστερό άκρο. Οι βασικοί σύνδεσμοι πλοήγησης της αρχικής σελίδας του MSN ( βρίσκονται κατά μήκος της κορυφής της. Οι δευτερεύοντες σύνδεσμοι βρίσκονται στο αριστερό άκρο της σελίδας. Εκτός από τη χρήση προτύπων και τη σχεδίαση μέσα στην ασφαλή περιοχή, κάτι άλλο που πρέπει να κάνετε είναι να ενσωματώνετε στις ιστοσελίδες σας βασικά στοιχεία, όπως αυτά που φαίνονται στην Εικόνα 4-5. Οι περισσότερες σελίδες περιέχουν μια περιοχή τίτλου, ένα λογότυπο, συνδέσμους πλοήγησης, το σώμα, και κείμενο υποσέλιδου. Θα βρείτε πολλούς συνδυασμούς και τρόπους τοποθέτησης αυτών των στοιχείων, αλλά γενικά τα πιο βασικά στοιχεία εμφανίζονται στις περισσότερες αρχικές σελίδες με την ίδια λογική. Λογότυπο Περιοχή τίτλου Σύνδεσμοι πλοήγησης Σώμα Υποσέλιδο Εικόνα 4-5 Οι περισσότερες αρχικές σελίδες περιέχουν κάποια βασικά στοιχεία.

19 Κεφάλαιο 4: Σχεδιασμός ιστοσελίδων και τοποθεσιών Ιστού 81 Οι υπόλοιπες συμβουλές σχετικά με τη διάταξη σελίδων που σας συνιστούμε να υιοθετήσετε περιλαμβάνουν γενικές πρακτικές "καλού σχεδιασμού". Ακολουθούν μερικές κοινές αρχές σχεδιασμού που πρέπει να θυμάστε και να χρησιμοποιείτε: Κείμενο που αναβοσβήνει και περιττό "animation" Αποφύγετε το κείμενο που αναβοσβήνει και το περιττό animation. πολλοί βρίσκουν αυτά τα εφέ ενοχλητικά και άχρηστα. Από την άλλη πλευρά, ένα όμορφο αλλά απλό εφέ εναλλαγής (rollover) σε κουμπιά θα εκτιμηθεί από πολλούς. Ανταγωνισμός Ψάξτε σε παρόμοιες τοποθεσίες για να δείτε τι υπάρχει, και μετά κάντε την τοποθεσία σας μοναδική. Βλέποντας παρόμοιες ή σχετικές τοποθεσίες, μπορείτε επίσης να πάρετε ιδέες για θέματα που χρειάζονται καλύτερη κάλυψη, ή που έχετε ξεχάσει να αναφέρετε στη σελίδα σας. Περιεχόμενο Κρατήστε το περιεχόμενό σας ενημερωμένο, απλό, και έξυπνο. Επίσης, προσπαθήστε να χρησιμοποιήσετε τουλάχιστον το 80% της σελίδας σας για την παρουσίαση του περιεχομένου (ειδικά αν σκοπεύετε να διαφημίζετε άλλους σε αυτή), και περιορίστε τα στοιχεία πλοήγησης στο 20% ή λιγότερο. Τελευταία τεχνολογία Αποφύγετε τη χρήση πολλών λειτουργιών τελευταίας τεχνολογίας, αλλιώς θα χάσετε τους περισσότερους επισκέπτες σας. Οι περισσότεροι δε θέλουν να κατεβάζουν πρόσθετα (plug-ins μικρές βοηθητικές εφαρμογές που συνεργάζονται με το φυλλομετρητή για την εκτέλεση ενός συγκεκριμένου τύπου αρχείων) μόνο και μόνο για να δουν μια ιστοσελίδα. Ταχύτητα μεταφοράς Βεβαιωθείτε ότι η σελίδα σας "κατεβαίνει" όσο το δυνατόν γρηγορότερα. έχετε περίπου 10 δευτερόλεπτα πριν οι επισκέπτες αρχίσουν να αδημονούν. Πλαίσια Χρησιμοποιείτε τα πλαίσια με φειδώ. είναι αρκετά δύσκολο να υλοποιηθούν σωστά και μερικές φορές δυσχεραίνουν την πλοήγηση των χρηστών. Βασικά, τα πλαίσια χρησιμοποιούνται για τη διαίρεση του παραθύρου του φυλλομετρητή με τέτοιον τρόπο ώστε οι χρήστες να μπορούν να δουν πολλές σελίδες ταυτόχρονα, όπως περιγράφουμε στο Δεύτερο Μέρος, στην εργασία του Κεφαλαίου 9. Λειτουργικός σχεδιασμός Προτιμήστε τη λειτουργικότητα από την εμφάνιση κάθε στοιχείο πρέπει να εξυπηρετεί κάποιο σκοπό. Αν δεν είστε βέβαιοι ότι κάποιο στοιχείο σχεδιασμού είναι λειτουργικό, αφαιρέστε το προσωρινά από τη σελίδα σας και αναλύστε τη χωρίς αυτό. Αν η σελίδα σας λειτουργεί το ίδιο (ή καλύτερα) χωρίς αυτό, το στοιχείο είναι περισσότερο καλλωπιστικό παρά λειτουργικό και θα πρέπει να αφαιρεθεί. Σημαντικά στοιχεία Δώστε στα στοιχεία σας μέγεθος ανάλογο με τη σπουδαιότητά τους. Μεγαλύτερο μέγεθος σημαίνει μεγαλύτερη σπουδαιότητα και τραβάει την προσοχή περισσότερο, ενώ μικρότερο μέγεθος ισοδυναμεί με μικρότερη σπουδαιότητα.

20