Τμήμα Μηχανικών Πληροφορικής Τ. Ε

Slides:



Advertisements
Παρόμοιες παρουσιάσεις
Η γλώσσα μορφοποίησης υπερκειμένου HTML
Advertisements

Η γλώσσα XHTML Επιμέλεια: Νικάκη Θεοδώρα Μάθημα: Εισαγωγικά θέματα WWW 2007.
Σχεδιασμός μιας σελίδας HTML
Web Design HTML, Frontpage, DreamWeaver μέρος α ΠΡΥ019 - Πληροφορική Δρ.Βάσος Βασιλείου.
Εισαγωγή στην Επιστήμη των Υπολογιστών και Επικοινωνιών Σχεδιασμός ιστοχώρων Σπύρος Κοκολάκης* ΠΑΝΕΠΙΣΤΗΜΙΟ ΑΙΓΑΙΟΥ ΤΜΗΜΑ ΜΗΧΑΝΙΚΩΝ ΠΛΗΡΟΦΟΡΙΑΚΩΝ.
Τα Διαδοχικά Φύλλα Στυλ CSS
ΕΙΣΑΓΩΓΗ ΣΤΙΣ ΒΑΣΙΚΕΣ ΕΝΝΟΙΕΣ ΤΟΥ ΠΑΓΚΟΣΜΙΟΥ ΙΣΤΟΥ
George Metakides FHW May Web Science. Web science timeline 1992: Tim Berners-Lee presents Web in Geneva (CERN) 1993: World Wide Web Consortium.
ΠΡΙΝ ΞΕΚΙΝΗΣΟΥΜΕ Πράγματα που αξιολογείτε θετικά σε σχέση με το μάθημα του προηγούμενου τετραμήνου Πράγματα που θα μπορούσαν να βελτιωθούν.
Γεώργιος Κουρουπέτρογλου Πανεπιστήμιο Αθηνών, Τμήμα Πληροφορικής και Τηλεπικοινωνιών Ημέρες Ευχρηστίας και Προσβασιμότητας,
Α ’ Λυκείου Κεφάλαιο 2.  Σε κάθε υπολογιστή μαζί με το λειτουργικό σύστημα γίνεται εγκατάσταση εφαρμογών που μας διευκολύνουν.  Αυτές οι εφαρμογές είναι.
Ιστοσελίδες από τον κλάδο της υγείας : γραφικός σχεδιασμός και προσβασιμότητα Ελευθέριος Παπαχρήστος, Χρήστος Κατσάνος, Νικόλαος Αβούρης.
1 Ανάπτυξη νέων υπηρεσιών βιβλιοθήκης Βιβλιοθήκη & Κέντρο Πληροφόρησης.
Διαδίκτυο / Internet (International Network). Οδικό Δίκτυο.
Χάρης Κονδυλάκης 14/5/2013 Τουρισμός Σχεδιασμός Ιστοχώρων 1.
Χάρης Κονδυλάκης Σχεδιασμός Ιστοχώρων 1. Παραδείγματα ιστοχώρων del.icio.us europa.eu lufthansa.aero cnn.tv.
Ενότητα 2: HTML – Hypertext Markup Language. Φώτης Κόκκορας, Καθηγητής Εφαρμογών, Τμήμα Μηχανικών Πληροφορικής Τ.Ε., T.E.I. Θεσσαλίας Προγραμματισμός Εφαρμογών.
Η αγορά εργασίας στον διαδικτυακό τουρισμό Αλέξανδρος Καραβίτης Διευθυντής Λειτουργιών.
Ανάπτυξη Εφαρμογής για τη Διερεύνηση Δυνατοτήτων Προσβασιμότητας στο Λειτουργικό Σύστημα Windows Mobile Πτυχιακή εργασία του Κωνσταντίνου Π. Τόλια Μυτιλήνη,
ΠΑΡΟΥΣΙΑΣΗ ΛΟΓΟΤΕΧΝΙΚΟΥ ΒΙΒΛΙΟΥ: ΣΤΗ ΔΙΑΠΑΣΩΝ
Ο υπολογιστής στην εκπαίδευση. Η αναβάθμιση του μαθησιακού περιβάλλοντος στο σχολείο, με την αξιοποίηση των δυνατοτήτων των υπολογιστών, δεν είναι εύκολη.
Καλώς ήλθατε, μαθητές! Όνομα δασκάλου. Πρόγραμμα τάξης 8:15 - 9:00Το σχολείο ξεκινά, παίρνουμε παρουσίες 9: :00Ανάγνωση και έκθεση 10: :00Ορθογραφία.
Το πλαίσιο Διαλειτουργικότητας της Ηλεκτρονικής Διακυβέρνησης
Βασικά Web εργαλεία και τεχνολογίες
Web Science George Metakides FHW May
Η Πληροφορική στην Εκπαίδευση
Προδιαγραφές Ευχρηστίας Ιστοχώρων Γενικές Αρχές και Σημεία Ελέγχου
Ενότητα 3.1 Το ∆ιαδίκτυο ως πηγή πληροφοριών και εκπαιδευτικών πόρων, ως µέσο επικοινωνίας και ως «χώρος» δημοσίευσης έργων.
Εφαρμογεσ Πληροφορικησ Ταξη Α΄ ΚεφΑλαιο 2
ΒΑΣΙΚΕΣ ΑΡΧΕΣ ΚΟΙΝΩΝΙΚΩΝ ΕΠΙΣΤΗΜΩΝ
WEB 2.
2ο ΓΕ.Λ. ΑΛΙΜΟΥ ΤΑΞΗ :Β΄ ΤΜΗΜΑ:4ο
Κεφαλαιο 11 ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML.
Δημιουργία εφαρμογής διαχείρισης ψηφιακής βιβλιοθήκης
HTML.
H μεγαλη εκρηξη.
Γυμνάσιο Νέας Κυδωνίας
Ο Παγκόσμιος Ιστός Φακίνος Αποστόλης 1.
110 ΓΕΛ ΠΑΤΡΑΣ Σχ. Έτος Τμήμα Α4 ΔΙΑΔΙΚΤΥΟ ΚΑΙ ΤΗΛΕΟΡΑΣΗ ΕΠΙΔΡΑΣΗ ΣΤΑ ΠΑΙΔΙΑ ΣΤΟΥΣ ΕΦΗΒΟΥΣ ΚΑΙ ΣΤΟΥΣ ΝΕΟΥΣ ΣΤΟ ΕΞΩΤΕΡΙΚΟ.
Ιστορική Εξέλιξη του Παγκόσμιου Ιστού
Μαθήτρια: ΑΘΗΝΑ ΚΟΥΡΤΗ Β2 Υπεύθυνη καθ. : ΚΩΝΣΤΑΝΤΙΝΑ ΜΑΛΑΜΟΥ
Εφαρμογές Πληροφορικής Κεφάλαιο 11
Μάνος Σατόπουλος Συντάκτης λευκωμάτων και λάτρης των τεχνών
PROJECT 2B ΥΠΕΥΘΥΝΗ ΚΑΘΗΓΗΤΡΙΑ: ΜΠΑΛΑΣΗ
Εφαρμογές Πληροφορικής Κεφάλαιο 9
HTML - CSS Δίνεται παρακάτω ο κώδικας HTML μιας ιστοσελίδας
Διαδίκτυο Internet Διασύνδεση Δικτύων International Network
Το Εικονογραφημένο Βιβλίο στην Προσχολική Εκπαίδευση
Εισαγωγή στην HTML Κεφάλαιο 11.
Όνομα σχολείου Ημερομηνία
Εφευρέσεις που θα κάνουν την ζωή μας πιο όμορφη…
Η ΤΕΧΝΟΛΟΓΙΑ ΚΑΙ Η ΚΙΝΗΤΗ ΕΠΙΚΟΙΝΩΝΙΑ
ΕΦΑΡΜΟΓΕΣ ιστου (Web Applications)
Διασυνδεδεμένα Δεδομένα για τον Σημασιολογικό Ιστό
ΕΦΑΡΜΟΣΜΕΝΕΣ ΤΕΧΝΕΣ ΔΙΕΥΘΥΝΣΗ ΜΕΣΗΣ ΤΕΧΝΙΚΗΣ ΚΑΙ ΕΠΑΓΓΕΛΜΑΤΙΚΗΣ ΕΚΠΑΙΔΕΥΣΗΣ.
Πλοήγηση στο Διαδίκτυο
Κυκλοφοριακή αγωγή Ένα πρόγραμμα για να μάθουμε να κυκλοφορούμε με ασφάλεια. Β΄ Δημοτικού 12ου Δημοτικού Σχολείου Βόλου Υπεύθυνοι προγράμματος : Θωμάς.
Επιμόρφωση στους Δείκτες Επιτυχίας και Επάρκειας
מעבר אור מתווך שקוף לתווך שקוף
Διαδίκτυο Internet Διασύνδεση Δικτύων International Network
ΕΝΟΤΗΤΑ 4 – Κεφάλαιο 12: Ο Παγκόσμιος Ιστός – Εισαγωγή στην έννοια του Υπερκειμένου Λέξεις Κλειδιά: Διαδίκτυο, Παγκόσμιος Ιστός (World Wide Web), ιστοσελίδα.
ΤΙΤΛΟΣ ΤΗΣ ΕΚΔΗΛΩΣΗΣ ΣΑΣ
Καλώς ήλθατε, μαθητές! Όνομα δασκάλου.
Διαδραστική Μάθηση © 2018.
ΚΤΙΡΙΑ ΓΡΑΦΕΙΩΝ - ΚΑΤΑΣΤΗΜΑΤΑ – ΧΩΡΟΙ ΣΥΝΑΘΡΟΙΣΗ ΚΟΙΝΟΥ - ΡΑΜΠΕΣ
ΛΟΓΙΣΜΙΚΟ ΕΠΕΞΕΡΓΑΣΙΑΣ ΚΕΙΜΕΝΟΥ
Εφαρμογές ιστού και δημιουργία ιστοσελίδων
“Τα εργαλεία του WEB 2.0 στα Φιλολογικά Μαθήματα ”
ΕΝΟΤΗΤΑ 4 – Κεφάλαιο 12: Ο Παγκόσμιος Ιστός – Εισαγωγή στην έννοια του Υπερκειμένου (σελίδες 78-83) Λέξεις Κλειδιά: Διαδίκτυο, Παγκόσμιος Ιστός (World.
Παράδειγμα στόχος Έμπνευση Ενέργειες/εργασίες Πόροι Σκέψεις
Μεταγράφημα παρουσίασης:

Τμήμα Μηχανικών Πληροφορικής Τ. Ε Τμήμα Μηχανικών Πληροφορικής Τ.Ε. Τομέας Υπολογιστικών Τεχνικών & Συστημάτων «Ανάπτυξη λογισμικού για την προσαρμογή του περιεχομένου ιστοσελίδων, σύμφωνα με τις προδιαγραφές του προτύπου προσβασιμότητας Web Content Accessibility Guidelines (WCAG) 2.0, επίπεδο ΑΑ» Καλημέρης Χρήστος

Προσβασιμότητα 10% του πληθυσμού των ανεπτυγμένων χωρών αποτελούν Άτομα με Αναπηρίες (ΑμεΑ) Σε αυτά τα άτομα πρέπει να προσθέσουμε: το αυξανόμενο ποσοστό των ηλικιωμένων άτομα που αντιμετωπίζουν ουσιαστικές δυσκολίες στη χρήση μιας συγκεκριμένης υπηρεσίας ή συσκευής όσους αντιμετωπίζουν δυσκολίες με τις σύγχρονες Τεχνολογίες Πληροφορικής και Τηλεπικοινωνιών (ΤΠΕ)

Ορισμός της Προσβασιμότητας στο Διαδίκτυο "Η πρόσβαση για τον καθένα, ανεξαρτήτως ανικανότητας, αποτελεί θεμελιώδες ζήτημα." Tim Berners-Lee, Διευθυντής του W3C και Εφευρέτης του Παγκόσμιου ιστού (World Wide Web)

Τι είναι η προσβασιμότητα; Προσβασιμότητα σημαίνει δυνατότητα χρήσης μιας υπηρεσίας από τον καθένα, ανεξαρτήτως ιδιαιτερότητας (αναπηρία, ηλικία) Εντάσσεται σε ευρύτερο επιστημονικό πεδίο, της Αλληλεπίδρασης Ανθρώπου‐Υπολογιστή (HCI) και ειδικότερα της Καθολικής Σχεδίασης (Universal Design) ή διαφορετικά Σχεδίασης για όλους (Design for all). “η προσβασιμότητα είναι εξ' ορισμού μια κατηγορία της ευχρηστίας”. Οτιδήποτε δεν είναι προσβάσιμο σε ένα χρήστη δεν είναι και εύχρηστο. [Nielsen, 1993]

Προσβασιμότητα: Τι περιλαμβάνει Ιστότοπους και εφαρμογές που οι άνθρωποι με ανικανότητες είναι σε θέση να διακρίνουν, να εξερευνήσουν και να αλληλεπιδράσουν μαζί τους. Φυλλομετρητές Ιστού (web browsers) και αναπαραγωγείς μέσων (media players) που μπορούν να χρησιμοποιηθούν αποτελεσματικά από ΑμεΑ και τα οποία λειτουργούν σωστά με τις υποστηρικτικές τεχνολογίες που χρησιμοποιούν κάποιοι ΑμεΑ για να προσπελάσουν τον Παγκόσμιο ιστό.

Πρωτοβουλίες αντιμετώπισης της προσβασιμότητας Η κοινοπραξία του Παγκόσμιου ιστού (The World Wide Web Consortium, W3C), είναι η κοινοπραξία που καθορίζει τα πρότυπα, τους στόχους και στρατηγικές εξέλιξης του web. Έχει θέσει ως βασικό της στόχο την καθολική πρόσβαση (universal access) να κάνει διαθέσιμα αυτά τα προνόμια σε όλους τους ανθρώπους, ανεξάρτητα από τον εξοπλισμό και το λογισμικό που διαθέτουν, την δικτυακή τους υποδομή, την εθνική τους γλώσσα, την κουλτούρα, τη γεωγραφική θέση και τις σωματικές ή νοητικές τους ικανότητες.

Web Accessibility Initiative ‐ WAI H WAI (δημιουργήθηκε από το W3C το 1997) προδιέγραψε μια σειρά από οδηγίες που απευθύνονται σε web developers και designers Προδιαγράφουν πως θα κάνουν το web περιεχόμενο προσβάσιμο σε ανθρώπους με αναπηρίες Ο στόχος αυτών των οδηγιών είναι η προσβασιμότητα, αλλά και να καταστήσουν το web περιεχόμενο διαθέσιμο σε περισσότερους browsers (voice browsers, κινητά τηλέφωνα, κλπ) και σε περισσότερους χρήστες που δουλεύουν σε περιβάλλοντα με δύσκολες συνθήκες (hands‐free, δυνατός φωτισμός, σκοτάδι, αδύναμη όραση, υψηλός θόρυβος)

Είναι σημαντικό για το δικό σας Web Site; Φυσικά και είναι! Εκατομμύρια άνθρωποι με αναπηρίες σερφάρουν καθημερινά στο web και πολλά ακόμα εκατομμύρια χρησιμοποιούν φτωχό εξοπλισμό browser ή εργάζονται κάτω από δύσκολες συνθήκες χρήσης Αν το website σας δε διαθέτει χαρακτηριστικά όπως αυξομειούμενα fonts, εικόνες που συνοδεύονται από κατάλληλη περιγραφή και εύκολη πλοήγηση, αυτοί οι άνθρωποι δεν θα έχουν πρόσβαση στην πληροφορία σας Για να είμαστε πιο ακριβείς, το site σας θα παραβιάζει τα δικαιώματα αυτών των ανθρώπων

Άλλοι λόγοι για να κάνετε το site σας προσβάσιμο Θα βελτιώσει τη φήμη, το κύρος και την εικόνα του Θα βελτιώσει την ικανοποίηση των επισκεπτών (πελατών) Θα αυξήσει τον αριθμό των επισκεπτών Θα επιτρέψει στους επισκέπτες να παραμείνουν περισσότερο στο site σας Θα αυξήσει τον αριθμό των επισκεπτών που επιστρέφουν (returning visitors)

Άλλοι λόγοι για να κάνετε το site σας προσβάσιμο Θα σας επιτρέψει να προσελκύσετε μέρος της γρηγορότερα αναπτυσσόμενης πληθυσμιακής ομάδας: τους ηλικιωμένους!

Εισαγωγή στις WCAG 2.0 Ο στόχος των WCAG 2.0 παραμένει η προώθηση της προσβασιμότητας του περιεχομένου στο Web Οι WCAG 2.0 είναι οργανωμένες γύρω από τέσσερις σχεδιαστικές αρχές: 1. Το περιεχόμενο πρέπει να είναι αισθητό 2. Τα στοιχεία της διεπαφής πρέπει να είναι λειτουργικά 3. Το περιεχόμενο και τα στοιχεία ελέγχου πρέπει να είναι κατανοητά 4. Το περιεχόμενο πρέπει να είναι αρκετά εύρωστο ώστε να δουλεύει με τρέχουσες και μελλοντικές τεχνολογίες ιστού

Γραμματοσειρές Το <FONT> tag δε θα υποστηρίζεται μελλοντικά (deprecated) Οι γραμματοσειρές και η μορφοποίησή τους να γίνεται μέσω CSS Μην προσδιορίζετε ακριβή μεγέθη γραμματοσειράς αφού μπορεί να μην υποστηρίζονται από τους browser. Συνίσταται η χρήση σχετικών μεγεθών, ποσοστών, +n/‐n, ή CSS περιγραφέων (big, bigger, x‐large, κλπ) Η γραμματοσειρά πρέπει να είναι καθαρή και αναγνώσιμη Να προσδιορίζετε μια ποικιλία από επιλογές γραμματοσειράς.

Χρώμα Επιβάλεται η μεγάλη αντίθεση (contrast) Πολύ απαλό χρώμα σε πολύ σκούρο υπόβαθρο ή αντίστροφα Αραιή ή καμία χρήση background εικόνων καθώς μειώνουν το contrast του κειμένου Αν οι χρήστες απενεργοποιούν την background εικόνα, το κείμενο θα πρέπει να εξακολουθεί να είναι αναγνώσιμο Το χρώμα δεν πρέπει να είναι το μόνο μέσο για να μεταδώσετε πληροφορία. Συνίσταταται η παράλληλη χρήση συμβόλων ή άλλων διακριτικών.

Images Εικόνες που είναι σημαντικές για την απόδοση πληροφορίας πρέπει να περιλαμβάνουν την ιδιότητα alt για την περιγραφή της (φανταστείτε να περιγράφετε το site μέσω τηλεφώνου) <img src="1.gif" alt=“Λογότυπο Πανεπιστημίου" /> Εικόνες οι οποίες χρησιμοποιούνται αποκλειστικά για λόγους αισθητικής/μορφοποίησης πρέπει να περιλαμβάνουν ένα κενό alt:  <img src="spacer.gif" alt="" />

Αυξομείωση γραμματοσειρών

Αλλαγή αντίθεσης

Εκφώνηση κειμένου

Τέλος