Καςάλξγξι ρε γλώρρα HTML Χοιρςίμα Χαοαλάμπξσπ xaralampous@yahoo.gr Πεοίληψη Στην παρούσα εργασία κατατίθεται μία πρόταση Διδακτικού Σεναρίου, για συγκεκριμένη ενότητα του μαθήματος Προγραμματιστικά εργαλεία για το διαδίκτυο, της Β τάξης του ΕΠΑ.Λ. του Τομέα Πληροφορικής. Το εκπαιδευτικό σενάριο έχει διάρκεια δύο διδακτικών ωρών και ο γενικός σκοπός του είναι να παρουσιαστούν οι βασικές ετικέτες της HTML και ο τρόπος σύνταξής τους, ώστε να οργανωθεί το κείμενο μιας ιστοσελίδας σε μορφή καταλόγων. Οι μαθητές αφού παρακολουθήσουν μια σύντομη παρουσίαση των βασικών δομών ετικετών για τη δημιουργία καταλόγων στην HTML, καλούνται να εκπονήσουν τις δραστηριότητες δύο φύλλων εργασίας και να απαντήσουν σε ερωτήσεις αξιολόγησης. Τα φύλλα εργασίας περιέχουν αναλυτική περιγραφή των ετικετών που χρησιμοποιούνται σε κάθε δραστηριότητα, ποικιλομορφία, δυνατότητα αποκαλυπτικής & διερευνητικής μάθησης με τη δυνατότητα της μετατροπής από τη μια μορφή καταλόγου σε άλλη. Περιλαμβάνονται δε έτοιμοι απλοί κώδικες που εκτελούν οι μαθητές και παρατηρούν το οπτικό αποτέλεσμα σημειώνοντας τις παρατηρήσεις τους και ένα πρόβλημα σύνθεσης κώδικα για τη δημιουργία μιας ιστοσελίδας. Λένειπ κλειδιά: HTML, ιστοσελίδα, Notepad, κατάλογοι. Ειραγωγή Αξίζει να σημειωθεί ότι η html είναι η πρώτη και πιο διαδεδομένη γλώσσα περιγραφής της δομής μιας ιστοσελίδας. Προκειμένου να γράψουμε στον κώδικα html δεν χρειαζόμαστε κάποιο ειδικό πρόγραμμα. Ένας απλός επεξεργαστής κειμένου (text editor) όπως το Σημειωματάριο (Notepad) των Windows είναι αρκετός για να φτιάξουμε τις ιστοσελίδες μας. Στο παρόν διδακτικό σενάριο οι μαθητές καλούνται να χρησιμοποιήσουν και εργαλεία που κάνουν τη μάθηση πιο γρήγορη και ελκυστική. Η εργασία σε ομάδες καλλιεργεί δεξιότητες συνεργασίας και επικοινωνίας και συμβάλει στην πληρέστερη επεξεργασία του εξεταζόμενου θέματος.
Σεμάοιξ: Κατάλογοι σε γλώσσα HTML 1. Τίςλξπ διδακςικξύ ρεμαοίξσ: Κατάλογοι σε γλώσσα HTML - Αριθμητικοί και μη αριθμητικοί κατάλογοι 2. Εκςιμώμεμη διάοκεια διδακςικξύ ρεμαοίξσ Προβλέπεται να διαρκέσει συνολικά 2 διδακτικές ώρες. 3. Έμςανη ςξσ διδακςικξύ ρεμαοίξσ ρςξ ποόγοαμμα ρπξσδώμ/ποξαπαιςξύμεμεπ γμώρειπ Το παρόν σενάριο εντάσσεται στο μάθημα Προγραμματιστικά εργαλεία για το διαδίκτυο που υπάρχει στο ωρολόγιο πρόγραμμα της Β Επαγγελματικού Λυκείου του Τομέα Πληροφορικής και στο 2ο Μέρος «Η HTML ως βασικό δομικό στοιχείο των εφαρμογών στο περιβάλλον του παγκόσμιου ιστού» κεφάλαιο 4: «Η γλώσσα HTML». Το σενάριο απευθύνεται σε μαθητές που ήδη γνωρίζουν και κατανοούν την έννοια της ιστοσελίδας και τις αρχές σχεδιασμού και οργάνωσης ιστοσελίδων. Απευθύνεται σε μαθητές που έχουν ήδη διδαχθεί: o τη μορφή και τον τρόπο εκτέλεσης των αρχείων της HTML. o πού και με ποιο τρόπο μπορούν να «γράψουν» κώδικα HTML. o τη λειτουργία της γλώσσας μέσα από τη χρήση ετικετών. o τους κανόνες σύνταξης των βασικών ετικετών για την παρουσίαση και μορφοποίηση κειμένου, το υπόβαθρο, της γραμματοσειράς και του χρώματος κειμένου. 4. Σκξπξί και ρςόυξι ςξσ διδακςικξύ ρεμαοίξσ Σκοπός Ο γενικός σκοπός του μαθήματος είναι να παρουσιαστούν οι βασικές ετικέτες της HTML και ο τρόπος σύνταξής τους, ώστε να οργανωθεί το κείμενο μιας ιστοσελίδας σε μορφή καταλόγων. Διδακτικοί στόχοι Οι μαθητές Να κατανοήσουν οι μαθητές και να είναι ικανοί να δημιουργήσουν καταλόγους στοιχείων ώστε το κείμενο να είναι πιο κατανοητό και η όλη παρουσίαση πιο ξεκάθαρη. Να μπορούν να διακρίνουν και να σχηματίζουν διαφορετικούς τύπους καταλόγων στοιχείων. Να εφαρμόσουν συνδυαστικά τις ετικέτες που διδάχθηκαν σε προηγούμενη ομάδα μαθημάτων ώστε στη δημιουργία λιστών να χρησιμοποιήσουν ετικέτες διαμόρφωσης κειμένου (μέγεθος στυλ και χρώμα χαρακτήρων), παραγραφοποίησης κειμένου ( στοίχιση, χρώμα υπόβαθρου) Να αξιοποιήσουν τις δυνατότητες της HTML για ανάπτυξη σωστών αισθητικά και λειτουργικά εφαρμογών στο περιβάλλον του παγκόσμιου ιστού. Γενικότεροι μαθησιακοί στόχοι Οι μαθητές να είναι σε θέση να παρατηρούν έτοιμες ιστοσελίδες και να διακρίνουν πότε πρέπει να χρησιμοποιήσουν μια λίστα και ποια είναι η καταλληλότερη για την παρουσίαση του περιεχομένου μιας δικής τους ιστοσελίδας. Γενικότεροι εκπαιδευτικοί στόχοι Οι μαθητές να αντιληφθούν την σημασία της συνεργασίας και της ανταλλαγής απόψεων στο σχεδιασμό ενός έργου, όπως η κατασκευή μιας σελίδας, και να αξιοποιήσουν δημιουργικά τη φαντασία και την κριτική τους σκέψη. Στόχοι ως προς την αξιοποίηση της τεχνολογίας Το συγκεκριμένο διδακτικό σενάριο απαιτεί αξιοποίηση του λογισμικού του εργαστηρίου πληροφορικής για τη δημιουργία του κώδικα καθώς και του διαδικτύου για την παρουσίαση βασικών εννοιών.
5. Πεοιγοατή ςξσ διδακςικξύ ρεμαοίξσ Η διδακτική παρέμβαση πραγματοποιήθηκε στο 1 ο Επαγγελματικό Λύκειο Ιωαννίνων, στην Β Τάξη του Τομέα Πληροφορικής και στα πλαίσια του μαθήματος Προγραμματιστικά εργαλεία για το διαδίκτυο. Υλοποιήθηκε σε εργαστήριο πληροφορικής το οποίο διαθέτει 12 υπολογιστές, βιντεοπροβολέα και σύνδεση στο διαδίκτυο. Το σενάριο εστιάζει στο 2ο μέρος του μαθήματος του τομέα πληροφορικής των ΕΠΑΛ «Προγραμματιστικά εργαλεία για το διαδίκτυο» που αναφέρεται στη γλώσσα HTML. Ειδικότερα, οι μαθητές θα εξοικειωθούν με τη δημιουργία αριθμητικών και μη αριθμητικών καταλόγων με τη χρήση της HTML και θα αξιολογήσουν τις δραστηριότητές τους. Αρχικά ο εκπαιδευτικός συζητά με τους μαθητές τη χρήση των καταλόγων ώστε το κείμενο μιας ιστοσελίδας να είναι πιο κατανοητό και ελκυστικό και παρουσιάζει με τη βοήθεια του συνδέσμου http://1sek-ioann.ioa.sch.gr/joomla/book/htm5.htm παραδείγματα χρήσης αριθμητικών και μη αριθμητικών καταλόγων ( παραδείγματα που ο μαθητής μπορεί να δει και στο σχολικό εγχειρίδιο ). Στη συνέχεια αναλύει τις βασικές δομές ετικετών για τη δημιουργία των δυο ειδών λιστών και παρουσιάζει και εξηγεί τον κώδικα με τον οποίο δημιουργήθηκαν τα πιο πάνω παραδείγματα. Στη συνέχεια οι μαθητές χωρισμένοι σε ομάδες καλούνται να εκπονήσουν δύο φύλλα εργασίας με συγκεκριμένες δραστηριότητες. Στο πρώτο φύλλο εργασίας στους μαθητές δίνονται έτοιμα τμήματα κώδικα html και με τη βοήθεια online editor στη σελίδα www.wlearn.gr/doityourself/doityourself.php εφαρμόζουν τις γνώσεις που έμαθαν στην θεωρία με εύκολο και ευχάριστο τρόπο Πειραματίζονται αλλάζοντας τον κώδικα στο πεδίο κειμένου (αριστερά) και βλέπουν κάθε φορά το αποτέλεσμα που προκύπτει στο δεξιό πλαίσιο.. Οι δραστηριότητες περιλαμβάνουν όλο το φάσμα των ετικετών σε γλώσσα html για τη δημιουργία αριθμητικών και μη αριθμητικών καταλόγων ενώ το φύλλο εργασίας περιέχει αναλυτική περιγραφή των ετικετών αυτών. Στο δεύτερο φύλλο εργασίας οι μαθητές καλούνται να κατασκευάσουν μια ιστοσελίδα εφαρμόζοντας συγκεκριμένες οδηγίες. Στο τέλος καλούνται να απαντήσουν σε μια σειρά ερωτήσεων πολλαπλής επιλογής και μ αυτό τον τρόπο να αξιολογήσουν τις γνώσεις τους. 6. Επιρςημξλξγική ποξρέγγιρη και εμμξιξλξγική αμάλσρη θέμαςα θεχοίαπ ςξσ διδακςικξύ ρεμαοίξσ Για την καλύτερη παρουσίαση του κείμενου μίας ιστοσελίδας χρειάζεται πολλές φορές να οργανώσουμε το κείμενο σε μορφή καταλόγων, η οποία βοηθά ώστε το κείμενο να είναι πιο κατανοητό και η όλη παρουσίαση πιο ξεκάθαρη. Βασικοί κατάλογοι που μπορούμε να δημιουργήσουμε με τη χρήση της HTML: o Οι αριθμητικοί κατάλογοι. o Οι μη ταξινομημένοι ή μη αριθμητικοί κατάλογοι. Αριθμητικοί κατάλογοι είναι αυτοί που παρουσιάζουν τα στοιχεία του καταλόγου κατά αύξουσα αριθμητική σειρά όπως στον κατάλογο του προηγούμενου παραδείγματος μας. Για τη δημιουργία ενός αριθμητικού καταλόγου με την HTML, χρησιμοποιούμε την παρακάτω δομή ετικετών: Στην ετικέτα έναρξης του αριθμητικού καταλόγου μπορούμε να χρησιμοποιήσουμε δύο παραμέτρους, την παράμετρο type = τιμή, και την παράμετρο start = τιμή ως εξής: <OL Type = τιμή Start = τιμή> Η παράμετρος type δηλώνει το είδος της αριθμητικής λίστας και η παράμετρος start δηλώνει την τιμή έναρξης αρίθμησης. Type Δυνατές τιμές παραμέτρων Start 1 Κάποια αριθμητική τιμή
Α a i Τιμές από A έως Z Τιμές από a έως z Κάποια αριθμητική τιμή σε λατινικούς χαρακτήρες Σε περίπτωση που δεν ορισθεί κάποια παράμετρος, τότε οι προκαθορισμένες τιμές για τις παραμέτρους type και start, εννοούνται οι type =1 και start=1. Για τη δημιουργία ενός μη αριθμητικού καταλόγου με την HTML, χρησιμοποιούμε την παρακάτω δομή ετικετών: Στην ετικέτα έναρξης του μη αριθμητικού καταλόγου ή στην ετικέτα στοιχείου καταλόγου μπορούμε να χρησιμοποιήσουμε επίσης μία παράμετρο την TYPE = τιμή, ως εξής: <UL Type = τιμή> ή <LI Type = τιμή> Η παράμετρος type δηλώνει το είδος του συμβόλου που θα τοποθετηθεί μπροστά από τα στοιχεία της λίστας και οι δυνατές τιμές του είναι οι εξής: Type Δυνατές τιμές παραμέτρων Είδος συμβόλου Disk Circle Square Μαύρος δίσκος (bullet) Κύκλος Τετράγωνο Σε περίπτωση που δεν ορισθεί κάποια παράμετρος, τότε η προκαθορισμένη τιμή για την παράμετρο type είναι η disk. 7. Χοήρη Η.Υ. και γεμικά φητιακώμ μέρχμ για ςξ διδακςικό ρεμάοιξ Η δραστηριότητα θα υλοποιηθεί στο σε εργαστήριο Η/Υ εξοπλισμένο με βιντεοπροβολέα και σύνδεση στο διαδίκτυο. Θα χρησιμοποιηθούν τα παρακάτω λογισμικά που διατίθενται ελεύθερα στο διαδίκτυο: 1. Το λογισμικό notepad++ για τη σύνταξη του κώδικα της ιστοσελίδας. 2. Ένας φυλλομετρητής για να έχουμε το οπτικό αποτέλεσμα εκτέλεσης κώδικα, καλώντας το αρχείο ----.html που δημιουργήσαμε στο notepad++ 3. Ο σύνδεσμος www.wlearn.gr/doityourself/doityourself.php για να έχουμε στο ίδιο παράθυρο τον editor και το αποτέλεσμα του κώδικα. 8. Αμαπαοαρςάρειπ ςχμ μαθηςώμ/ποόβλεφη δσρκξλιώμ ρςξ διδακςικό ρεμάοιξ Η γλώσσα HTML θεωρείται από τους μαθητές «εύκολη» και ενδιαφέρουσα γλώσσα. Μερικές δυσκολίες συναντούν όταν οι λίστες περιέχουν πολλά στοιχεία επειδή επαναλαμβάνουν πολλές φορές την ετικέτα <LI> και όταν δημιουργούν συνεχόμενες λίστες επειδή παραλείπουν την ετικέτα </OL> ή </UL> για το κλείσιμο της λίστας. Ο συνδυασμός επίσης των ετικετών μορφοποίησης και καταλόγων μερικές φορές προκαλούν διαφορετικό αποτέλεσμα από το αναμενόμενο. Τα λάθη όμως είναι αρκετά εύκολο να εντοπιστούν και να διορθωθούν. 9. Διδακςικό ρσμβόλαιξ Διδακςική μεςαςόπιρη θεχοηςικά θέμαςα - Διδακςικόπ θόοσβξπ Ο εκπαιδευτικός καθοδηγεί τη διαδικασία ώστε να αναδεικνύονται οι προϋπάρχουσες αντιλήψεις των μαθητών, προκαλεί την αποτελεσματική συζήτηση και παροτρύνει τους μαθητές που συναντούν δυσκολίες. Κατά την εκτέλεση του σεναρίου δεν εκτιμάται ότι θα υπάρξουν δυσλειτουργίες που θα επηρεάσουν το
μάθημα (διδακτικός θόρυβος). Επίσης το διδακτικό συμβόλαιο δεν προβλέπεται να ανατραπεί διότι τα φύλλα εργασίας είναι απλά, ρεαλιστικά και καθοδηγούν το μαθητή βήμα βήμα. 10. Υπξκείμεμη θεχοία μάθηρηπ Το διδακτικό σενάριο στηρίζεται στη εποικοδομητική θεωρία.. Στους μαθητές δίνεται έτοιμος κώδικας και με τη χρήση κατάλληλου λογισμικού εκτελούν, αλληλεπιδρούν οπτικά και αποτυπώνουν κανόνες και συμπεράσματα για τις βασικές εντολές της HTML. Έτσι ανακαλύπτουν αρχές και αναπτύσσουν δεξιότητες μέσω πειραματισμού και πρακτικής. Δίνεται έμφαση στη μαθησιακή διαδικασία και στην αλληλεπίδραση των εμπλεκόμενων μερών. Ο ρόλος του εκπαιδευτικού είναι κυρίως καθοδηγητικός βοηθώντας σημαντικά τα παιδιά να πραγματώσουν εφικτές δραστηριότητες. Εν μέρει εφαρμόζονται συμπεριφοριστικές διδακτικές στρατηγικές κατά την παρουσίαση όλης της θεωρίας που είναι απαραίτητη για την κατανόηση των εννοιών προς μάθηση. 11. Οογάμχρη ςηπ ςάνηπ ετικςόςηςα ρυεδίαρηπ Το μάθημα θα πραγματοποιηθεί στο σχολικό εργαστήριο πληροφορικής. Οι μαθητές θα εργαστούν σε ομάδες των δύο ατόμων ανά ηλεκτρονικό υπολογιστή και όπου υπάρχει η δυνατότητα ο κάθε μαθητής θα εργάζεται στο δικό του Η/Υ. Το εργαστήριο διαθέτει ικανό αριθμό υπολογιστών και γρήγορη σύνδεση στο διαδίκτυο. 12. Ανιξλόγηρη Για να γίνει η αξιολόγηση των μαθητών θα ληφθούν υπόψη κατά πόσο αναπτύχθηκαν οι δραστηριότητες που δόθηκαν στους μαθητές στα φύλλα εργασίας, ο τρόπος συνεργασίας μεταξύ των μαθητών και ο βαθμός συμμετοχής του καθενός, η λήψη πρωτοβουλιών και η προθυμία τους καθώς και το κατά πόσο απάντησαν σωστά στις ερωτήσεις πολλαπλής επιλογής που τους δόθηκαν. 13. Τξ επιμξοτχςικό ρεμάοιξ Θα δοθούν φύλλα εργασίας τα οποία παρατίθενται παρακάτω 14. Ποξςάρειπ για πεοαιςέοχ δοαρςηοιόςηςεπ ποξςειμόμεμεπ εογαρίεπ Προτάθηκε να δημιουργήσουν ανάλογες σελίδες με θέματα που τους ενδιαφέρουν στην καθημερινότητά τους. 15. Χοήρη ενχςεοικώμ πηγώμ Προγραμματιστικά Εργαλεία για το Διαδίκτυο, Βιβλίο Μαθητή, Χ. Δουληγέρης, Α. Βακάλη, Σ. Γκρίζαλης, Χ. Πάτσα, Γ. Σούλτης, Έκδοση Ο.Ε.Δ.Β. Βικιβιβλία, συλλογή βιβλίων ανοιχτού περιεχομένου, εγχεριδίων, καθώς και άλλων κειμένων που είναι βασισμένα σε βιβλία που έχουν συγγραφεί συλλογικά. www.pi-schools.gr (Πρόγραμμα Σπουδών) http://www.it.uom.gr/project/html2/lessons.html, εγχειρίδιο «Γράφοντας HTML», Τμήμα Εφ. Πληροφορικής του Πανεπιστημίου Μακεδονίας ) http://www.w3schools.com/, Online HTML Tutorial http://www.wlearn.gr/, Σειρές Μαθημάτων για την HTML http://www.eeei.gr/odhgos/htmlfaq.htm, Μαθήματα Κατασκευής Web Σελίδων με τη Γλώσσα HTML, Γιώργος Επιτήδειος Συγγραφέας του Οδηγού Κατασκευής Web Σελίδων 2005 και την Ελληνική Ένωση Επαγγελματιών Internet http://el.wikipedia.org/wiki/html,το Υπερκείμενο και η γλώσσα HTML στη Βικιπαίδεια https://developer.mozilla.org/el/learn, Μάθετε πως να φτιάχνετε ιστότοπους από το Mozilla Developer Network http://www.webdesignerhelp.co.uk
16. Φύλλα Εογαρίαπ Φύλλξ εογαρίαπ 1 Για τη εκτέλεση της συγκεκριμένης άσκησης μπορείτε να μεταβείτε στη σελίδα www.wlearn.gr/doityourself/doityourself.php Στον editor γράψτε τις βασικές ετικέτες για τη δημιουργία της ιστοσελίδας σας. Ο τίτλος της ιστοσελίδας σας να είναι «ΛΙΣΤΕΣ» <TITLE> ΛΙΣΤΕΣ </TITLE> Δραστηριότητα 1 Προσθέστε στην ιστοσελίδα σας τον παρακάτω κώδικα: Αυτή είναι μια αριθμημένη λίστα <OL> </OL> <LI> στοιχείο 1 <LI> στοιχείο 2 <LI> στοιχείο 3 Δοκιμάστε το αποτέλεσμα σας. Τι εμφανίζεται;.. Η ετικέτα <OL> (ordered LIst) δηλώνει την έναρξη μιας αριθμημένης λίστας. Συνδυάζεται με την ετικέτα <LI> η οποία δηλώνει το κάθε στοιχείο της λίστας. Η λίστα τελειώνει με την ετικέτα τέλους </OL>. Αν έχω μια λίστα με 5 στοιχεία, πόσες ετικέτες <LI> πρέπει να βάλω μέσα στην <OL>; Δραστηριότητα 2 Μέσα στην ετικέτα έναρξης της λίστας <OL> προσθέστε την ιδιότητα start ως εξής: <OL start=4> Τι παρατηρείτε; Τι αλλάζει στη λίστα; Τώρα προσθέστε στην ετικέτα <OL> την ιδιότητα type ως εξής: <OL type=a> Τι παρατηρείτε; Τι αλλάζει στη λίστα; Παρατηρήστε τις αλλαγές αν χρησιμοποιήσετε και τις δύο ιδιότητες μαζί <OL type=i start=5> Η ιδιότητα type δηλώνει τη μορφή της αρίθμησης και μπορεί να πάρει μια από τις τιμές 1, a, A, i, I Ενώ η start δηλώνει την τιμή έναρξης της αρίθμησης και παίρνει πάντα μια αριθμητική τιμή
Δραστηριότητα 3 Προσθέστε τώρα στη σελίδα σας τον παρακάτω κώδικα: Αυτή είναι μια ΜΗ αριθμημένη λίστα <UL> </UL> <LI> στοιχείο 1 <LI> στοιχείο 2 <LI> στοιχείο 3 Δείτε το αποτέλεσμα. Ποια είναι η διαφορά με την προηγούμενη λίστα; Η ετικέτα <UL> (unordered LIst) δηλώνει την έναρξη μιας MH αριθμημένης λίστας. Συνδυάζεται με την ετικέτα <LI> η οποία δηλώνει το κάθε στοιχείο της λίστας. Η λίστα τελειώνει με την ετικέτα τέλους </UL>. Δραστηριότητα 4 Μέσα στην ετικέτα έναρξης της λίστας <UL> προσθέστε την ιδιότητα type ως εξής: <UL type=circle> Τι παρατηρείτε; Τι αλλάζει στη λίστα; Η ιδιότητα type δηλώνει τη μορφή των κουκίδων στη λίστα. Οι τιμές που μπορεί να πάρει είναι: disc, circle, square. Η ιδιότητα type μπορεί να χρησιμοποιηθεί και μέσα στην ετικέτα <LI> οπότε αλλάζει η μορφή της κουκίδας μόνο για το συγκεκριμένο στοιχείο της λίστας. Δοκιμάστε <LI type = square> στοιχείο 2 Τι παρατηρείτε; Φύλλξ εογαρίαπ 2 Υλοποιήστε την παρακάτω ιστοσελίδα σύμφωνα με τις οδηγίες: Χρώμα Φόντου Ιστοσελίδας: #DAA520 Χρώμα Γραμμάτων όλης της σελίδας: DarkBlue Γραμματοσειρά :Monotype Corsiva Μέγεθος Επικεφαλίδων: H1 και H2 1 η ταξινομημένη (αριθμητική) λίστα: Μέγεθος γραμμάτων 5px, Χρώμα γραμμάτων: #2E1F0F, Μορφοποίηση: Υπογραμμισμένα γράμματα
Μη ταξινομημένη (μη αριθμητική) λίστα: Μέγεθος γραμμάτων 5px, Χρώμα: #003300 2 η ταξινομημένη (αριθμητική) λίστα: Μέγεθος γραμμάτων 5px, Χρώμα: #800000, Μορφοποίηση: Πλάγια γράμματα Ερωτήσεις πολλαπλής επιλογής Ερώτηση 1. Επέλεξε τη λάθος εντολή <body bgcolor="red"> <body bgcolor="black"> <body bgcolor="blue"> <body bgcolor=green"> Ερώτηση 2. Τι χαρακτήρας χρησιμοποιείται για να υποδείξει μια ετικέτα τέλους; < > / - > / > Ερώτηση 3. Ποια ετικέτα εισάγει ένα στοιχείο λίστας; <ol> <list> <lst> <li> Ερώτηση 4. Αν θέλετε να ξεκινήσετε μια νέα γραμμή σε ένα συγκεκριμένο μέρος μέσα σε μια παράγραφο, θα πρέπει να χρησιμοποιήσετε:
<B> <BR> </p> </BR> Ερώτηση 5. Μεταξύ τποιων ετικετών πρέπει το μεγαλύτερο μέρος του περιεχομένου της ιστοσελίδας σας να τοποθετηθεί; <text></text> <body></body> <title></title> <head></head> Ερώτηση 6. Ποια σύνολο ετικετών "κατασκευάζει" το παρακάτω κείμενο Dogs Cats Birds <ul></ul> <u></u> <ol></ol> <dl></dl> Ερώτηση 7.. Ποια είναι η σωστή ετικέτα για τη μικρότερη επικεφαλίδα; <h6> <h7> <small> <h1> Ερώτηση 8. Τι σημαίνει HTML; Hypertext Markup Language Hypertext Markup List Happytext Markup Language Hypertext Mark Language Ερώτηση 9. Ποια ετικέτα χρησιμοποιείται για να δημιουργήσει μια μη διατεταγμένη λίστα; <ul> <ol> <li> <ulist> Ερώτηση 10. Ποια ετικέτα χρησιμοποιείται για να δημιουργήσει ένα στοιχείο λίστας; <litem> <item> <li> <list> Ερώτηση 11.. Ποιο από τα παρακάτω είναι η σωστή χρήση της <title> ετικέτας; <title="web Designer Help"></title> <title=web Designer Help/>
<title="web Designer Help"/title> <title>web Designer Help</title> Ερώτηση 12. Ποια είναι η σωστή ετικέτα για τη μεγαλύτερη επικεφαλίδα; <h6> <large> <bigh> <h1> Σσμπεοάρμαςα Το σενάριο ήταν προσαρμοσμένο στις δυνατότητες των μαθητών οι οποίοι δεν συνάντησαν ιδιαίτερες δυσκολίες και υλοποιήθηκε χωρίς παρεκκλίσεις η λάθη. Το πρώτο φύλλο εργασίας εκπονήθηκε σχετικά γρήγορα ενώ μερικοί μαθητές θα χρειαζόταν περισσότερο χρόνο για την διεκπεραίωση του δεύτερου φύλλου εργασίας και αρκετοί διατύπωσαν τις δικές τους αισθητικές παρεμβάσεις. Το σενάριο υλοποιήθηκε σύμφωνα με το σχεδιασμό και τους στόχους του. Οι μαθητές παρουσίασαν ιδιαίτερο ενδιαφέρον και ενεργοποιήθηκαν θετικά. Χρησιμοποιήθηκαν οι προηγούμενες γνώσεις σε συνδυασμό με τις νέες για την οικοδόμηση ενός έργου. Στο εξής με μια απλή εξερεύνηση στο διαδίκτυο σε ιστοσελίδες διαφόρων γνωστικών περιοχών μπορούν οι μαθητές να δουν παραδείγματα χρήσης καταλόγων και με την επιλογή προβολή «προβολή κώδικα» να αναγνωρίσουν τις ετικέτες της HTML που χρησιμοποιήθηκαν και βέβαια να μπορούν να κάνουν το κείμενο μιας ιστοσελίδας πιο κατανοητό.