Προγραμματιστικά Εργαλεία για το Διαδίκτυο Πολυμεσικά στοιχεία σε μια σελίδα 1 © Βελώνης Γεώργιος – Καθηγητής Πληροφορικής ΠΕ20 Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20

Ήχος στο Παρασκήνιο Θα ξεκινήσουμε με την ετικέτα, η οποία μας επιτρέπει να προσθέσουμε έναν ήχο παρασκηνίου στην ιστοσελίδα μας, τον οποίο θα ακούνε οι χρήστες κατά τη διάρκεια της επίσκεψής τους σε αυτήν. Θα χρειαστεί να τοποθετήσουμε το tag στην περιοχή της ιστοσελίδας, αλλά μπορούμε επίσης να το τοποθετήσουμε και μέσα στην περιοχή. Σύνταξη: Όπου url η διεύθυνση και το όνομα του μουσικού αρχείου το οποίο μπορεί να είναι ένας από τους τύπους.aif,.au,.mid,.mp3,.snd και.wav. Παράδειγμα: 2 Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20

Ήχος στο Παρασκήνιο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 3 Οι παράμετροι που μπορεί να πάρει η είναι οι παρακάτω: 1.Loop: Καθορίζει πόσες φορές θα επαναληφθεί το μουσικό κομμάτι. Μπορεί να πάρει μια ακέραια τιμή, για παράδειγμα η τιμή 4 θα επαναλάβει το μουσικό κομμάτι τέσσερις φορές, ενώ η τιμή 0 μία. Μπορούμε επίσης να χρησιμοποιήσουμε την τιμή infinite η οποία θα παίζει το μουσικό κομμάτι για πάντα ή την αρνητική τιμή -1 η οποία θα παίζει το μουσικό κομμάτι μέχρι οι χρήστες να εγκαταλείψουν τη σελίδα. Παράδειγμα:

Ήχος στο Παρασκήνιο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ Balance: Μπορούμε επίσης να ελέγξουμε το πώς ο ήχος μας χωρίζεται μέσω των ηχείων χρησιμοποιώντας το χαρακτηριστικό balance (ισορροπία). Το χαρακτηριστικό balance μπορεί να έχει οποιαδήποτε ακέραια τιμή μεταξύ αρνητικών και θετικών και Μια αρνητική τιμή θα ενισχύσει το αριστερό ηχείο και μία θετική τιμή του θα ενισχύσει το δεξιό, ενώ μια τιμή 0 η οποία είναι και η προεπιλεγμένη θα προκαλέσει ισορροπία ήχου μεταξύ των δύο ηχείων. Παράδειγμα:

Ήχος στο Παρασκήνιο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ Volume: Η παράμετρος αυτή, η οποία θα είναι το τελευταίο χαρακτηριστικό που θα εξηγήσουμε για την ετικέτα, μας επιτρέπει να ελέγχουμε την ένταση του ήχου των χρηστών της ιστοσελίδας μας σε σχέση με τις ρυθμίσεις της έντασης του υπολογιστή τους. Η τιμή που μπορεί να πάρει η volume είναι ένας οποιοσδήποτε αριθμός μεταξύ 0 και Η τιμή 0 είναι η προεπιλεγμένη τιμή, η οποία είναι η μέγιστη ένταση του ήχου του χρήστη, όπως αυτός την έχει ορίσει στον υπολογιστή του και οποιαδήποτε αρνητική τιμή έως , θα μειώσει την ένταση στους χρήστες στο ελάχιστο. Παράδειγμα:

Δημιουργία Link αναπαραγωγής ήχου ή βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 6 Σύνταξη: Κείμενο ή εικόνα υπερσυνδέσμου Όπου url η διαδρομή και το όνομα του μουσικού ή του βίντεο αρχείου, ενώ η ιδιότητα title μας δίνει μια σύντομη περιγραφή για το link. Παράδειγμα: Metallica Song

Ενσωμάτωση ψηφιακού ήχου ή βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ ος Τρόπος Η HTML μας δίνει τη δυνατότητα να ενσωματώσουμε σε με σελίδα ψηφιακό ήχο ή βίντεο με τη χρήση της ετικέτας η οποίο βρίσκεται στην περιοχή της ιστοσελίδας. Σύνταξη: Παράδειγμα:

Ενσωμάτωση ψηφιακού ήχου ή βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 8 ΠαράμετροςΤιμήΣημασία Autostart και Autoplay “true” ή “false” Καθορίζουν αν ο ήχος ή το βίντεο θα ξεκινά αυτόματα με την παρουσίαση της ιστοσελίδας ή όχι Volume1 έως 100Καθορίζει την ένταση του ήχου (μόνο για Netscape) Hidden“true” ή “false” Καθορίζει αν το αντικείμενο θα είναι ορατό ή όχι Παράμετροι της ετικέτας και η επεξήγησή τους

Ενσωμάτωση ψηφιακού ήχου ή βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 9 ΠαράμετροςΤιμήΣημασία Loop“true” ή “false”Καθορίζει αν ο ήχος ή το βίντεο επαναλαμβάνεται μόλις τελειώσει ή όχι WidthΣε PixelsΚαθορίζει το πλάτος του πλαισίου ελέγχου της αναπαραγωγής του αρχείου HeightΣε PixelsΚαθορίζει το ύψος του πλαισίου ελέγχου της αναπαραγωγής του αρχείου Παράμετροι της ετικέτας και η επεξήγησή τους

Ενσωμάτωση ψηφιακού ήχου ή βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 10 Η ετικέτα ουσιαστικά παρέχει εναλλακτικό περιεχόμενο για τους browsers των χρηστών, όπως κείμενο ή άλλους τύπους ετικετών που θα εμφανίζεται όταν ένα ενσωματωμένο αντικείμενο δεν μπορεί να εμφανιστεί ή όταν το πρόγραμμα περιήγησης δεν αναγνωρίζει την ή ετικέτα. Η ετικέτα χρησιμοποιείται με την ετικέτα. Μπορείτε να τοποθετήσετε την ετικέτα εντός ή μετά την ετικέτα. Η ετικέτα απαιτεί επίσης μια ετικέτα τέλους.

Ενσωμάτωση ψηφιακού ήχου ή βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 11 Παράδειγμα: Download Windows Media Player.

Ενσωμάτωση ψηφιακού ήχου ή βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ ος Τρόπος Σύνταξη: Παράδειγμα: ……… Η χρήση των παραμέτρων μπορεί να γίνει, όπως και με την ετικέτα ή για ορισμένες παραμέτρους με την ετικέτα (δε λειτουργεί σε όλους τους browsers, π.χ. Firefox).

Ενσωμάτωση ψηφιακού ήχου ή βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 13 Τώρα θα πρέπει να προστεθούν τρεις ετικέτες κάθε μια με το όνομα και την τιμή της ιδιότητας. Η ετικέτα στέλνει ουσιαστικά την ιδιότητα και την τιμή που της αποδίδεται στον browser ή διακομιστή, ανάλογα με το τι απαιτείται. Η πρώτη ετικέτα θα πρέπει να έχει το όνομα που αποδίδει τιμή στην ιδιότητα autoplay. Η απόδοση τιμής false θα σταματήσει την αυτόματη αναπαραγωγή του πολυμεσικού αρχείου στο browser του χρήστη, εκτός από σε ορισμένες εκδόσεις του Netscape και Firefox, η οποίες θα αναπαράγουν το αρχείο αυτόματα. Η επόμενη θα πρέπει να έχει το όνομα που αποδίδει τιμή στην ιδιότητα autostart, είναι βασικά η ίδια με την πρώτη ετικέτα και λειτουργεί με τον ίδιο τρόπο.

Ενσωμάτωση ψηφιακού ήχου ή βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 14 Η τελευταία ετικέτα θα πρέπει να έχει το όνομα που αποδίδει τιμή στην ιδιότητα src και η ιδιότητα τιμή (value) θα πρέπει να έχει την τιμή που υποδεικνύει τη θέση του πολυμεσικού αρχείου. Η τιμή της ιδιότητας πρέπει να είναι η ίδια τιμή που ορίστηκε στην ετικέτα. Παράδειγμα:

Ενσωμάτωση ψηφιακού ήχου ή βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 15 Media TypeFile Extensions Audio.wav Audio.mp2.mpeg.mpg.mpa.mpga.mp3 Audio.au.snd Audio.wma Audio.midi Video.avi Video.mov.moov.qt Video.avs Τύποι αρχείων ήχου και βίντεο

Ενσωμάτωση Flash βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 16 Υπάρχουν δύο τρόποι που μπορείτε να ενσωματώσετε Flash βίντεο στην ιστοσελίδα σας, ο ένας με την ετικέτα και ο άλλος με την ετικέτα. Εμείς θα ασχοληθούμε τη μη τυποποιημένη μέθοδο της ετικέτας. Σύνταξη: Παράδειγμα:

Ενσωμάτωση Flash βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 17 ΠαράμετροςΤιμήΣημασία Play“true” ή “false”Η τιμή true που είναι και η προεπιλεγμένη τιμή αναπαράγει το βίντεο αυτόματα ενώ η false το αντίθετο Loop“true” ή “false”Η τιμή true που είναι και η προεπιλεγμένη τιμή επαναλαμβάνει το βίντεο συνεχώς ενώ η false με δική μας επιλογή κάνοντας κλικ στο κουμπί αναπαραγωγής Παράμετροι της ετικέτας και η επεξήγησή τους

Ενσωμάτωση Flash βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 18 ΠαράμετροςΤιμήΣημασία Quality“low”, ”autolow”, “autohigh”, ”high”, ”medium”, “best” Καθορίζει την ποιότητα του βίντεο που θα αναπαραχθεί Pluginspage macromedia.c om/go/getflas hplayer Δίνει τη θέση του Flash Player plugin για να το κατεβάσουμε και να το εγκαταστήσουμε για να παίξει τη Flash ταινία, όταν αυτό δεν έχει εγκατασταθεί Παράμετροι της ετικέτας και η επεξήγησή τους

Ενσωμάτωση Flash βίντεο Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 19 ΠαράμετροςΤιμήΣημασία Typeapplication /x- shockwave -flash Δείχνει τον τύπο των πολυμέσων για το αρχείο Flash, που αναφέρεται στην ιδιότητα src, βάσει της επέκτασης των αρχείων βίντεο. WidthΣε PixelsΚαθορίζει το πλάτος του πλαισίου ελέγχου της αναπαραγωγής του αρχείου HeightΣε PixelsΚαθορίζει το ύψος του πλαισίου ελέγχου της αναπαραγωγής του αρχείου Παράμετροι της ετικέτας και η επεξήγησή τους

Ενσωμάτωση κινούμενης εικόνας τύπου animated gif Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20 20 Οι κινούμενες εικόνες GIF (animated) είναι πολύ διαδεδομένες στο internet. Στην ουσία δεν πρόκειται για μια εικόνα αλλά για πιο πολλές οι οποίες προβάλλονται η μία μετά την άλλη. Αυτές οι εικόνες δεν χρειάζεται καν να είναι τύπου GIF. Για παράδειγμα 2 εικόνες JPG μπορούν να δημιουργήσουν ένα animated GIF. Για τη δημιουργία τους υπάρχουν ειδικά προγράμματα (GIF animators) τα οποία κάνουν αυτή τη δουλειά με αρκετές δυνατότητες και επιλογές αλλά υπάρχει η δυνατότητα να δημιουργήσουμε κινούμενες εικόνες και απευθείας (online) μέσα από σελίδες στο internet με λιγότερες δυνατότητες.

Βιβλιογραφία  Codenique ( nd_video/)  Κ Έρευνα και Μάθηση ( 21 Βελώνης Γεώργιος - Καθηγητής Πληροφορικής ΠΕ20