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

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

iv Περιεχόμενα Κεφάλαιο 4: Σχεδιασμός ιστοσελίδων και τοποθεσιών Ιστού... 69 Το κοινό πάνω απ' όλα... 70 Σκιαγράφηση της τοποθεσίας σας... 72 Κανόνες σχεδιασμού ιστοσελίδων που δε θα σας προδώσουν... 74 Κανόνες σχεδιασμού τοποθεσιών Ιστού που πρέπει να ακολουθείτε... 93 Στην πράξη... 95 Βασικά σημεία... 96 Κεφάλαιο 5: Συγκέντρωση των απαραίτητων εφοδίων... 99 Σύνδεση στο Internet και χώρος σε διακομιστές... 99 Εργαλεία δημιουργίας ιστοσελίδων... 105 Λίγα λόγια για τους φυλλομετρητές... 115 Βασικά σημεία... 118 Κεφάλαιο 6: Καταστρώστε την επίθεσή σας... 119 Καθορισμός των στόχων σας... 121 Γνωριμία με το κοινό σας... 121 Δημιουργία του προσχέδιου της τοποθεσίας σας... 124 Θεμελίωση της αρχικής σας σελίδας... 130 Συλλογή των εφοδίων και προετοιμασία για την κατασκευή... 133 Βασικά σημεία... 134 Μέρος ΙΙ: Η πράξη: Δημιουργία ιστοσελίδων... 135 Στο δεύτερο μέρος υπάρχουν τέσσερα κεφάλαια ενός έργου, τα οποία σας προσφέρουν ολοκληρωμένη και πρακτική εξάσκηση καθώς θα ακολουθείτε τη διαδικασία δημιουργίας της τοποθεσίας Ιστού. Όπως πιθανότατα γνωρίζετε, η αξία της πρακτικής εξάσκησης δεν πρέπει ποτέ να παραβλέπεται! Τα κεφάλαια αυτού του μέρους βρίσκονται σε προοδευτική σειρά, από το πιο εύκολο στο πιο δύσκολο, για να μπορείτε να εξοικειωθείτε με τις πιο σύνθετες εργασίες της δημιουργίας ιστοσελίδων. Κεφάλαιο 7: Δημοσίευση ιστοσελίδας μέσα σε (περίπου) μία ώρα... 137 Εισαγωγή στις ηλεκτρονικές ομάδες και κοινότητες... 138 Γνωριμία με τις Ομάδες MSN... 139 Προετοιμασία μιας τοποθεσίας MSN Groups... 141 Εγγραφή στο MSN με Διαβατήριο.NET... 143 Δημιουργία τοποθεσίας Ιστού MSN Groups... 145 Πρόσθετοι πόροι... 146 Βασικά σημεία... 146

Περιεχόμενα v Κεφάλαιο 8: Απομυθοποίηση της βασικής HTML... 147 Συγκέντρωση των εφοδίων της εργασίας...147 Γιατί HTML;...149 Τα βασικά της HTML...151 Προετοιμασία της τοποθεσίας HTML...159 Τοποθέτηση των φακέλων και των γραφικών σας στη σωστή θέση...161 Προετοιμασία του αρχείου της αρχικής σας σελίδας...163 Καθορισμός του φόντου και των χρωμάτων των συνδέσμων...165 Δημιουργία πίνακα...167 Εισαγωγή και σύνδεση του λογότυπου...170 Εισαγωγή του γραφικού για τον τίτλο της αρχικής σελίδας...173 Προσθήκη συνδέσμων πλοήγησης...174 Εισαγωγή πληροφοριών υποσέλιδου...177 Αντιγραφή του πλαισίου εργασίας της αρχικής σελίδας στις υποσελίδες...181 Προσθήκη σώματος κειμένου στην αρχική σελίδα...186 Εισαγωγή και σύνδεση εικόνας...194 Ολοκλήρωση της αρχικής σελίδας...196 Χρήση της δομής της μουσικής τοποθεσίας ως προτύπου...196 Πρόσθετοι πόροι...199 Βασικά σημεία...199 Κεφάλαιο 9: Δημιουργία ιστοσελίδων με το Microsoft Word... 201 Συγκέντρωση των εφοδίων της εργασίας...202 Γνωριμία με τις δυνατότητες του Word 2002 για τον Ιστό...203 Προετοιμασία της ιστοσελίδας σας στο Word 2002...213 Μορφοποίηση εγγράφου κειμένου...215 Κάτω από τις διαταγές του Οδηγού...219 Αλλαγή χρωμάτων φόντου...224 Ρύθμιση της γραμμής πλοήγησης...225 Αποθήκευση, κλείσιμο, και νέο άνοιγμα της τοποθεσίας σας...227 Δημιουργία και εισαγωγή καλλιτεχνικού κειμένου...228 Εργασία με κείμενο και προσθήκη πληροφοριών πνευματικών δικαιωμάτων...231 Εισαγωγή εικόνων...235 Εργασία με υπερσυνδέσμους...241 Προεπισκόπηση της δημιουργημένης με το Word ιστοσελίδας σας...252 Πρόσθετοι πόροι...254 Βασικά σημεία...254

vi Περιεχόμενα Κεφάλαιο 10: Δημιουργία ιστοσελίδων με το FrontPage... 255 Εισαγωγή στο FrontPage: ένας πλήρης διορθωτής HTML... 257 Προετοιμασία τοποθεσίας Ιστού στο FrontPage... 262 Δημιουργία νέου ιστού... 265 Δημιουργία της διάταξης των υποσελίδων... 266 Χρήση του προτύπου υποσελίδων για την κατασκευή ιστοσελίδων... 283 Δημιουργία αρχικής σελίδας στο FrontPage... 300 Πρόσθετοι πόροι... 307 Βασικά σημεία... 307 Μέρος ΙΙΙ: Η συνέχεια: Ενημέρωση και συντήρηση ιστοσελίδων... 309 Μετά τη δημοσίευση της τοποθεσίας Ιστού σας, θα πρέπει να αφιερώνετε λίγο χρόνο στην παρακολούθησή της. Φυσικά, μπορείτε να "ανεβάσετε" μια ιστοσελίδα στον Ιστό και να την αφήσετε εκεί χωρίς να την παρακολουθείτε, όμως τότε, η τοποθεσία σας θα ξεφτίσει με τον καιρό και οι χρήστες δε θα την επισκέπτονται αρκετά συχνά. Για να έχετε μια πραγματικά επιτυχημένη τοποθεσία, πρέπει να την περιποιείστε πότε-πότε. Σκοπός των κεφαλαίων του τρίτου μέρους είναι να σας δείξουν πώς να βγείτε στον αέρα (να δημοσιεύσετε τις σελίδες σας) και πώς να παραμείνετε επίκαιροι. Κεφάλαιο 11: Αποστολή των ιστοσελίδων σας στον πραγματικό κόσμο 311 Μεταφορά των αρχείων σας στο Internet... 312 Επισκόπηση της δουλειάς σας... 327 Εγγραφή σε μηχανές και καταλόγους αναζήτησης... 328 Βασικά σημεία... 332 Κεφάλαιο 12: Ενημέρωση, αρχειοθέτηση, και συνέχεια... 333 Ενημέρωση των ιστοσελίδων σας... 333 Αρχειοθέτηση στοιχείων ιστοσελίδων... 337 Πέρα από τις βασικές ιστοσελίδες... 338 Βασικά σημεία... 342 Ευρετήριο... 343

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

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

Κεφάλαιο 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 το δευτερόλεπτο.

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

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

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

Κεφάλαιο 4: Σχεδιασμός ιστοσελίδων και τοποθεσιών Ιστού 75 υπολογίσετε την ποσότητα του ορατού περιεχομένου στο παράθυρο του χρήστη που διαθέτει το φυλλομετρητή με τις πιο περιορισμένες δυνατότητες. Για τους σκοπούς του σχεδιασμού ιστοσελίδων, η μικρότερη ανάλυση οθόνης που χρησιμοποιείται εμφανίζει 640 480 πίξελ. Επιπλέον, διάφοροι φυλλομετρητές τείνουν να εμφανίζουν ακόμη μικρότερη περιοχή από αυτή εξαιτίας της διευθέτησής τους (στην οποία μπορεί να περιλαμβάνονται οι γραμμές εργαλείων, οι ράβδοι κύλισης, οι γραμμές κατάστασης, τα παράθυρα Αγαπημένων και Σελιδοδεικτών, κ.ο.κ.). Για παράδειγμα, δείτε την Εικόνα 4-3. Οι δύο οθόνες παρουσιάζουν τον Microsoft Internet Explorer στις πλατφόρμες Windows XP και Aplle Macintosh OS X, με τη μέγιστη διαθέσιμη περιοχή προβολής στις προεπιλεγμένες διευθετήσεις του φυλλομετρητή. Όπως μπορείτε να δείτε στην εικόνα, ο Internet Explorer στα Windows παρέχει προβολή μεγέθους 609 354 πίξελ, ενώ ο Internet Explorer του OS X παρέχει προβολή 602 327 πίξελ. Ακόμη, οι χρήστες που χρησιμοποιούν το Netscape Navigator έχουν μια μέγιστη περιοχή προβολής 630 347 πίξελ στα συστήματα Windows και 612 321 πίξελ σε Macintosh. Εικόνα 4-3 Η μέγιστη ορατή περιοχή του Internet Explorer σε συστήματα Windows με ρύθμιση ανάλυσης 640 480 είναι 609 354. Η μέγιστη ορατή περιοχή του Internet Explorer σε ένα σύστημα Macintosh με ρύθμιση ανάλυσης 640 480 είναι 602 327. Συνεπώς, αν συνδυάσετε τις μικρότερες τιμές των διαθέσιμων περιοχών προβολής σε Internet Explorer και Netscape, βλέπετε ότι το μέγεθος 600 320 (μας αρέσει να δουλεύουμε με στρογγυλούς αριθμούς) είναι η μικρότερη περιοχή που προκύπτει από το συνδυασμό φυλλομετρητή/συστήματος η περιοχή αυτή ονομάζεται ασφαλής. Όταν σχεδιάζετε ιστοσελίδες (ειδικά την αρχική σας σελίδα), πρέπει να λαμβάνετε υπόψη τις μετρήσεις της ασφαλούς περιοχής και, όπως περιγράφουμε στη συνέχεια, να εξασφαλίζετε ότι οι πιο σημαντικές πληροφορίες της ιστοσελίδας σας εμφανίζονται μέσα στα όρια αυτά. Αφού τελειώσαμε με τα μαθηματικά της ασφαλούς περιοχής, μπορούμε πλέον να αναφέρουμε ότι παρόλο που πρέπει να σχεδιάζετε τις σελίδες σας λαμβάνοντας υπόψη την ασφαλή περιοχή και να τοποθετείτε τις πιο σημαντικές σας πληροφορίες όσο πιο κοντά σε αυτή γίνεται, οι περισσότεροι βλέπουν τον Ιστό στις οθόνες τους με ανάλυση 800 600 πίξελ. Για την ακρίβεια, σύμφωνα με την τοποθεσία www.statmarket.com (17 Φεβρουαρίου 2001), ένα δείγμα από 50.465.595 τοποθεσίες

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

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

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

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

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

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