ΣΧΕΔΙΑΣΜΟΣ ΙΣΤΟΣΕΛΙΔΩΝ
WEB DESIGN
Ο σχεδιασμός στο διαδίκτυο αφορά την ικανότητα δημιουργίας παρουσιάσεων περιεχομένου (συνήθως κειμένου ή πολυμέσων) οι οποίες φτάνουν στον τελικό-χρήστη μέσω του Παγκόσμιου Ιστού, με τη χρήση λογισμικού όπως ένας φυλλομετρητής (web browser) ή άλλου λογισμικού σχεδιασμένου για το διαδίκτυο όπως η τηλεόραση μέσω διαδικτύου, κινητών τηλεφώνων κλπ..
Η ιστοσελίδα είναι ένα ηλεκτρονικό αρχείο ή ένα σύνολο από ηλεκτρονικά αρχεία που υπάρχουν σε έναν ή και περισσότερους εξυπηρετητές (server/servers) και παρουσιάζει κείμενα και εφαρμογές πολυμέσων στον τελικό-χρήστη. Τέτοια στοιχεία όπως κείμενο, εικόνες (BMPs, GIFs, JPEGs, PNGs) και φόρμες μπορούν να τοποθετηθούν στη σελίδα με τη χρήση χρήση γλωσσών σήμανσης υπερκειμένου όπως HTML/XHTML/XML. Η αναπαραγωγή πιο σύνθετων πολυμέσων (ανυσματικών γραφικών, βίντεο, ήχων, γραφικών με ενσωματομένο ήχο και εικόνα) απαιτεί πρόσθετα (plug-ins) όπως Flash, QuickTime, Java run-time environment, κα). Τα πρόσθετα μπορούν επίσης να ενσωματωθούν σε μια ιστοσελίδα με γλώσσες σήμανσης υπερκειμένου HTML/XHTML/XML.
Οι καινούριες εκδόσεις των προγράμματων περιήγησης (internet explores 7, 8 , firefox 3.5, safari, croniwm κλπ) που ακολουθούν τα W3C πρότυπα οδήγησαν σε μια ευρεία αποδοχή και χρήση των XHTML/XML σε συνδιασμό με τα CSS (Cascading Style Sheets) για την τοποθέτηση και διαχείρηση των στοιχείων και αντικειμένων της ιστοσελίδας. Τα τελευταία πρότυπα στοχεύουν στο να αποκτήσουν τα προγράμματα περιήγησης την δυνατότητα να προσφέρουν μια ευρεία γκάμα επιλογής πολυμέσων και πρόσβασης στους πελάτες χωρίς τη χρήση των πρoσθέτων (plug-ins).
Γενικότερα οι ιστοσελίδες διαχωρίζονται σε στατικές και δυναμικές:
· Οι στατικές δεν αλλάζουν περιεχόμενο και στοιχειοθεσία (layout) με οποιοδήποτε αίτημα εκτός και αν ο προγραμματιστής αναβαθμίσει (update) τη σελίδα. Μια απλή HTML σελίδα είναι παράδειγμα στατικού περιεχομένου.
· Οι δυναμικές προσαρμόζουν το περιεχόμενο και/ή την εμφάνισή τους σύμφωνα με την καταχώρηση/αλληλεπίδραση ή τις αλλαγές του τελικού χρήστη στο περιβάλλον προγραμματισμού (χρήστης, ώρα, τροποποιήσης στη βάση δεδομένων, κτλ) Το περιεχόμενο μπορεί να αλλάζει στον υπολογιστή του τελικού-χρήστη με τη χρήση των γλωσσών προγραμματισμού που εκτελούνται στον υπολογιστή του χρήστη (JavaScript, VBScript, Actionscript, etc.). Το περιεχόμενο στις δυναμικες σελίδες συχνά μεταφράζεται στον εξυπηρετητή (server) μέσω γλωσσών προτραμματισμου που εκτελούνται στον server (Perl, PHP, ASP, JSP, ColdFusion, .NET κτλ).
Με την συνεχόμενη ειδίκευση στην τεχνολογίας της Πληροφορικής δημιουργείται η ανάγκη διαχωρισμού της Σχεδιασμού Ιστοσελίδων από την Προγραμματιστή Ιστοσελίδων.
Για τη διαδικασία σχεδιασμού μιας ιστοσελίδας, μιας εφαρμογής ή ενός πολυμέσου για το διαδίκτυο μπορεί να συνδιάζονται πολλοι κλάδοι όπως animation, συγγραφή, επικοινωνιακός σχεδιασμός, εταιρική ταυτότητα, σχεδιασμός γραφικών, διάδραση ανθρώπου-υπολογιστή, αρχιτεκτονική υπολογιστών, σχεδιασμός διάδρασης, marketing, φωτογραφία, βελτιστοποίηση μηχανών αναζήτησης και τυπογραφία.
· Markup languages (such as HTML, XHTML and XML)
· Style sheet languages (such as CSS and XSL)
· Client-side scripting (such as JavaScript)
· Server-side scripting (such as PHP and ASP)
· Database technologies (such as MySQL and PostgreSQL)
· Multimedia technologies (such as Flash and Silverlight)
Οι ιστοσελίδες μπορούν να είναι στατικές σελίδες, ή δυναμικές σελίδες που αναπροσαρμόζουν αυτόματα το περιεχόμενό τους ή την εμφάνισή τους βασιζόμενες σε μια ποικιλία παραγόντων, όπως μια καταχώρηση από τον τελικό-χρήστη, μια καταχώρηση ή αλλαγή στο περιβάλλον προγραμματισμού από τον χειριστή της ιστοσελίδας ( όπως εν παραδείγματι μια μορφοποίηση της βάσης δεδομένων).
Εξαιτίας της συνεχούς εξειδίκευσης στους τομείς του επικοινωνιακού Πληροφορικής, δημιουργείται μια σαφής τάση διαχωρισμού του σχεδιασμού στο Διαδίκτυο από την ανάπτυξη του διαδικτύου ως μέσου ροής της πληροφορίας και των αγαθών προς όλες τις διαδικτυακές υπηρεσίες
Προσβασιμότητα Ιστοσελίδων
Για να είναι προσβάσιμη μια ιστοσελίδα θα πρέπει να ακολουθεί κάποιες αρχές προσβασιμότητας. Αυτές οι αρχές είναι γνωστές ως WCAG όταν μιλάμε για το περιεχόμενο και μπορούν να ομαδοποιηθούν στις ακόλουθες κατηγορίες.
· Χρήση semantic markup το οποίο προσφέρει μια ενιαία δομή στο αρχείο.
· Το semantic markup επίσης αναφέρεται στην οργάνωση της δομής της ιστοσελίδας αλλά και στην ανακοίνωση/έκδοση/δημιουργία ορισμών των διαδικτυακών υπηρεσιών με τρόπο ώστε να είναι αναγνωρίσιμες από άλλες διαδικτυακές υπηρεσίες σε διαφορετικές ιστοσελίδες. Τα πρότυπα για το semantic web θέτονται βάσει IEEE.
· Χρήση έγγυρων markup γλωσσών που ανταποκρίνονται σε ένα δημοσιευμένο DTD ή Schema.
· Να παρέχει το ισοδύναμο της πληροφορίας σε κείμενο για κάθε πληροφορία που παρέχεται με γραφικά ή πολυμέσα.
· Να χρησιμοποιεί συνδέσμους ενσωματομένους στο κείμενο
· Να μη χρησιμοποιεί πλαίσια
· Χρήση CSS αντί για HTML για την κατασκευή πινάκων
· Συγγραφή της σελίδας με τρόπο τέτοιο ώστε όταν ο κώδικας διαβαστεί γραμμή προς γραμμή από user agents (όπως είναι τα screen readers) να παραμένει ευανάγνωστος.
Παρόλα αυτά η W3C επιτρέπει ως εξαίρεση στους πινάκες που προορίζονται για εμφάνιση στην ιστοσελίδα να παραμένουν κατανοητοί όταν γραμμικοποιούνται ή σε περίπτωση που κάτι αντίστοιχο μπορεί να εφαρμοστεί.
Η προσβασιμότητα των ιστοσελίδων αλλάζει επίσης εξαιτίας των Content Management Systems που επιτρέπουν να γίνονται αλλαγές στις ιστοσελίδες χωρίς να απαιτείται ιδιαίτερη γνώση από προγραμματισμό.
H Ανάπτυξή ιστοσελίδων απαιτεί τη συνεργασία πολλών διαφορετικών στοιχείων ώστε το διαδίκτυο να είναι προσβάσιμο σε ανθρώπους με αναπηρίες. Αυτά τα στοιχεία περιλαμβάνουν:
· Περιεχόμενο – η πληφορία που υπάρχει σε μια ιστοσελίδα ή σε κάποια εφαρμοφή του διαδικτύου περιλαμβάνει:
o Τη φυσική πληροφορία όπως κείμενο, εικόνες και ήχους
o Κώδικα ή επισήμανση που διευκρινίζει τη δομή, παρουσίασει κλπ.
· Προγράμματα πλοήγησης, προγράμματα αναπαραγωγής πολυμέσων κλπ.
· Υποβοηθητική τεχνολογία, για ορισμένες περιπτώσεις – screen readers, εναλλακτικό πληκτρολόγιο, διακόπτες, προγράμματα σάρωσης κλπ.
· Γνώση του επιπέδου των χρηστών, των εμπειριών τους και σε ορισμένες περιπτώσεις προσαρμοσμένες στρατηγικές με χρήση του διαδικτύου
· Προγραμματιστές-Σχεδιαστές, συγγραφείς κτλ, συμπεριλαμβανομένου Προγραμματιστών με αναπηρίες και χρηστών που συνεισφέρουν στη διαμόρφωση του περιεχομένου
· Συντακτικών εργαλείων – προγραμμάτων που κατασκευάζουν ιστοσελίδες
· Εργαλεία Αξιολόγησης – Εργαλείων αξιολόγησης της Διαδικτυακή Προσβασιμότητας, HTML εγγυητών (HTML validators), CSS εγγυητών (CSS validators), κλπ.
Ιστορικά Στοιχεία
Ο Tim Berners-Lee δημοσίευσε αυτό που σήμερα θεωρούμε ότι ήταν η πρώτη ιστοσελίδα των Αύγουστο του 1991. Ο Berners-Lee ήταν ο πρώτος που συνδίασε τη διαδικτυακή επικοινωνία (μέσω της οποίας μετέφερε την ηλεκτρονική αλληλογραφία και το Usenet επί δεκαετίες) με υπερκείμενο (Hypertext) (το οποίο επίσης υπήρχε για δεκαετίες με περιορισμένες δυνατότητες στην αναζήτηση πληροφοριών οι οποίες ήταν αποθηκευμένες σε έναν μόνο υπολογιστή). Οι ιστοσελίδες γράφονται σε γλώσσες σήμανσης κειμένου (markup languages) που ονομάζονται HTML. Οι προγενέστερες εκδόσεις της HTML ήταν περιορισμένων δυνατοτήτων, μόνο για να δίνουν στην ιστοσελίδα τη βασική της δομή (Επικεφαλίδες και παραγράφους), και τη δυνατότητα να χρησιμοποιούν υπερκείμενο. Αυτή ήταν μια νέα μορφή επικοινωνίας διαφορετική από τις ήδη υπάρχουσες-οι χρήστες μπορούν να οδηγηθούν σε αλλες σελίδες με συνεχόμενα συνδέσμων (hyperlinks).
Σχεδιασμός Ιστοσελίδων
Ο σκοπός του σχεδιασμού στο διαδίκτο είναι πολυσύνθετος αλλά βασικός κατά την εφαρμογή του. Πριν τη δημιουργία και το «ανέβασμα» μιας ιστοσελίδας είναι σημαντικό να σχεδιαστεί ακριβώς ότι είναι αναγκαίο για την ιστοσελίδα. Είναι πολύ σημαντικό να αποφασιστούν, το κοινό στο οποίο θα απευθύνεται, ο σκοπός της δημιουργίας της και το περιεχόμενο της.
Περιεχόμενο
Ο σχεδιασμός που αφορά το διαδίκτυο είναι κατά μία έννοια παρόμοιος με την κλασσική τυπογραφία. Κάθε ιστοσελίδα είναι ένα σύνολο αναπαραγώμενων πληροφοριών, όπως ένα βιβλίο και κάθε σελίδα της ιστοσελίδας είναι το αντίστοιχο της σελίδας ενός βιβλίου. Ωστόσο στο web design χρησιμοποιείται ένα πλαίσιο εργασίας (framework) βασισμένο σε ένα ψηφιακό κώδικα και σε μια τεχνολογία απεικονίσεων για να δημιουργήσει και να διατηρήσει ένα περιβάλλον που θα διανέμει την πληροφορία σε πολλαπλές μορφές αρχείων (formats) όπως pdf, html, doc, κλπ. Οι δυνατότητες του web design το καθιστούν αδιαμφισβήτητα ως τον πλέον κομψό και σύνθετα αναπτυσσόμενο τρόπο επικοινωνίας στο σημερινό κόσμο.