Σάββατο 4 Ιουνίου 2011

Ε.ΨΗ.ΜΕ. // Ανακοίνωση άσκησης Α07 // "Μορφή & Περιεχόμενο: Εισαγωγή στην HTML"




Λαμβάνετε την ανακοίνωση της έβδομης άσκησης (γνωστής και ως "όχι άλλο κάρβουνο!..") καθώς και πόρους σχετικούς με τη θεματολογία του μαθήματος με το οποίο σχετίζεται η άσκηση. Αν και η άσκηση θα παραδοθεί ατομικά, προτείνεται η από κοινού μελέτη και συνεργασία κατά την υλοποίηση. Η παράδοση θα γίνει εντός της εβδομάδας 13/6-17/6 μέσω ηλεκτρονικής υποβολής των ψηφιακών αρχείων.

Σκοπός της άσκησης είναι α) να αντιληφθείτε το διαχωρισμό μεταξύ μορφής και περιεχομένου στην αναπαράσταση των μέσων, και β) να κατανοήσετε τις βασικές αρχές λειτουργίας των γλωσσών περιγραφής γενικά, και της γλώσσας HTML ειδικά. Συγκεκριμένα, καλείστε να παραδώσετε δύο ιστοσελίδες, με βασικά στοιχεία μορφοποίησης. Η πρώτη σελίδα θα φέρει τον τίτλο της άσκησης και τα στοιχεία σας, και η δεύτερη σελίδα την ανάπτυξη του θέματος. Το θέμα σας είναι "Εγώ!" όπου είστε ελεύθεροι να γράψετε ότι θέλετε, παρουσιάζοντας τον εαυτό σας και τη φωτογραφία σας την οποία είχατε πάρει στην τάξη. Θα αξιολογηθείτε ως προς την επιτυχή η μη εφαρμογή απλών κανόνων συγγραφής σελίδων για τον παγκόσμιο ιστό.


Ο εκτιμώμενος χρόνος απασχόλησης για αυτή την εργασία είναι:
Μελέτη, πειραματισμός και εξοικείωση με τους κανόνες σύνταξης κώδικα 2-4 ώρες,
Συγγραφή κώδικα, έλεγχος ορθής λειτουργίας και ηλεκτρονική υποβολή των ψηφιακών αρχείων 1-2 ώρες.
Ως συνήθως, πρώτα παραθέτω σχετιζόμενους πόρους, με την επισήμανση πως αυτή τη φορά το σύνολο των πόρων παρατίθενται ως εγκυκλοπαιδική αναφορά.



W3Schools Online Web Tutorials
20 Things I Learned About Browsers and the Web

Dive Into HTML5

HTML5 Rocks - A resource for open web HTML5 developers

W3C HTML5 Logo

Safari Technology Demos - Safari Dev Center - Apple Developer

HTML5 Gallery | About

HTML 5: Is There Any Truth To The Hype? - Forrester Research
(ελεγχόμενη πρόσβαση διαμέσου ΕΔΕΤ, διαβάστε την Πολιτική αποδεκτής χρήσης της υπηρεσίας προηγουμένως)

Ακολούθως παραθέτω την προτεινόμενη μεθοδολογία εργασίας, για την υλοποίηση της άσκησης.
Πρώτα θα χρειαστείτε τη φωτογραφία σας, η οποία είναι διαθέσιμη μέσω της υπηρεσίας Pithos από Οther's Shared/ekokkoris@teiath.gr/ΨΗΦΙΑΚΑ ΜΕΣΑ/ Εξασκείστε την εμπειρία σας από προηγούμενη άσκηση και εάν κρίνετε αναγκαίο, τότε χρησιμοποιήστε την εντολή File>Save for Web & Devices για να προσαρμόσετε το μέγεθος που θα εμφανίζεται η φωτογραφία στη σελίδα. Επιπλέον, για την αποφυγή προβλημάτων, είναι καλή πρακτική να αλλάξετε την ονομασία του αρχείου, ώστε να μην περιλαμβάνονται κενά ή ελληνικοί χαρακτήρες, π.χ. ΑΡ. ΜΗΤΡΩΟΥ-myphoto.jpg


Γραψτε κάπου πρόχειρα λίγα λόγια για το εαυτό σας, και φυλάξτε το κείμενο για αργότερα.

Τώρα θα δημιουργήσετε τις σελίδες και τον απαραίτητο κώδικα. Για να ασχοληθείτε με τη συγγραφή κώδικα αποτελεσματικά, πρώτα χρειάζεστε ένα αξιόπιστο πρόγραμμα συγγραφής απλού κειμένου, όπως είναι το TextPad (Windows) ή το TextWrangler(Mac OS X). Θα ξεκινήσετε δημιουργώντας δύο κενά αρχεία απλού κειμένου .txt τα οποία θα μετονομάσετε σε ΑΡ. ΜΗΤΡΩΟΥ-index.html και ΑΡ. ΜΗΤΡΩΟΥ-aboutme.html και ακολούθως θα επεξεργαστείτε τα αρχεία αυτά, προσθέτοντας το κείμενο και τα απαραίτητα tags. Καθώς θα εργάζεστε, είναι καλή πρακτική να έχετε ανοιχτό το αρχείο που επεξεργάζεστε ταυτόχρονα στον editor και στον browser. Έτσι θα μπορείτε εύκολα να επιθεωρείτε τις αλλαγές (κάνοντας συχνά Save στον editor και αμέσως μετά Ρefresh στον browser)

Ως προς τη σελίδα τίτλου, φροντίστε να αναγράφονται τα εξής:

ΤΜΗΜΑ ΦΩΤΟΓΡΑΦΙΑΣ & ΟΠΤΙΚΟΑΚΟΥΣΤΙΚΩΝ ΤΕΧΝΩΝ
Α07-ΜΟΡΦΗ & ΠΕΡΙΕΧΟΜΕΝΟ: ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML
μια εργασία του/της
ΟΝΟΜΑ ΕΠΩΝΥΜΟ-ΑΡ. ΜΗΤΡΩΟΥ
για το εργαστηριακό μέρος του μαθήματος ΕΙΣΑΓΩΓΗ ΣΤΑ ΨΗΦΙΑΚΑ ΜΕΣΑ
Εαρινό Εξάμηνο 2010-2011
Διαβάστε περισσότερα...

Εκτός των βασικά απαραίτητων tags <html> <title> <body> κ.λπ. θα χρησιμοποιήσετε tags όπως <br> <h1> και <a> για να προσδώσετε στη σελίδα σας εμφάνιση αντίστοιχη με τις σελίδες τίτλου που έχετε ετοιμάσει για άλλες ασκήσεις, καθώς και για να δημιουργήσετε έναν σύνδεσμο προς τη δεύτερη σελίδα. Στη δεύτερη σελίδα, είστε ελεύθεροι να εφαρμόσετε οποιαδήποτε μορφοποίηση κρίνετε κατάλληλη, αξιοποιώντας την HTML Tag List και την εμπειρία σας από τους πειραματισμούς που κάνατε στην τάξη. Μην ξεχάσετε να ενσωματώσετε τη φωτογραφία σας, όπως και να δημιουργήσετε ένα σύνδεσμο επιστροφής στην πρώτη σελίδα. Έχοντας πλέον τελειώσει, θα υποβάλετε την άσκηση ηλεκτρονικά, μέσω της υπηρεσίας Pithos σε προκαθορισμένο μοιραζόμενο φάκελλο προσβάσιμο από Οther's Shared/ekokkoris@teiath.gr/ΨΗΦΙΑΚΑ ΜΕΣΑ/Α07

Μια πρόκληση που αφήνω σε εσάς να επιλύσετε, αποτελεί η σωστή επιλογή μεταξύ των HTML Character Sets ώστε να εμφανίζονται σωστά οι Ελληνικοί χαρακτήρες. Μια επιπλέον πρόκληση που έχετε να αντιμετωπίσετε, αποτελεί η αποτελεσματική χρήση των tags <a> και <img> (αναζητήστε πληροφορίες σχετικά με absolute και relative paths).

Καλή Επιτυχία!
Κατηγορίες: ,

Δεν υπάρχουν σχόλια:

Δημοσίευση σχολίου

Γράψτε τις εντυπώσεις σας, ή κάνετε επισημάνσεις και προτάσεις για τη βελτίωση του άρθρου.

Εγγραφή σε: Σχόλια ανάρτησης (Atom)