ΤΕΧΝΟΛΟΓΙΚΟ ΕΚΠΑΙΔΕΥΤΙΚΟ ΙΔΡΥΜΑ ΑΘΗΝΑΣ (ΤΕΙ ΑΘΗΝΑΣ) Αγ. Σπυρίδωνος 28 Μήλου 1, Αιγάλεω, Τ.Κ. 12210 Τηλ.: 210 5385340. Fax: 210 5911442 Site: http://www.na.teiath.gr/pa/ mail: chstef@teiath.gr Τίτλος έργου: ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ ΤΕΙ ΑΘΗΝΑΣ Ενέργεια: 14.4.1 ΙΣΤΟΣΕΛΙ Α ΤΟΥ ΤΜΗΜΑΤΟΣ ΝΑΥΠΗΓΙΚΗΣ - ΥΛΙΚΟ ΣΤΟΝ ΕΙ ΙΚΟ ΙΣΤΟΧΩΡΟ ΓΙΑ ΤΗΝ ΠΑ ΤΕΧΝΙΚΗ ΈΚΘΕΣΗ στο πλαίσιο του έργου «ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ ΤΕΙ ΑΘΗΝΑΣ» που υλοποιείται στο πλαίσιο του Επιχειρησιακού Προγράμματος «Εκπαίδευση και Δια Βίου Μάθηση» και συγχρηματοδοτείται από την Ευρωπαϊκή Ένωση (Ευρωπαϊκό Κοινωνικό Ταμείο) και από Εθνικούς Πόρους Π.Ε.: 14.4 «ΠΡΑΞΕΙΣ ΔΗΜΟΣΙΟΤΗΤΑΣ» Αιγάλεω, Μάρτιος 2011
Εγκρίθηκε από την Επιστημονική Επιτροπή του έργου «Πρακτική Άσκηση ΤΕΙ Αθήνας» με το υπ αριθ. / - -201_ πρακτικό της. Ονοματεπώνυμο Ιδιότητα Υπογραφή Μπρατάκος Μιχαήλ Πρόεδρος Μάνεση Κυριάκη άφνη Μέλος Χατζηαποστόλου Αντώνιος Μέλος Προμπονάς Αντώνιος Μέλος Μελετζής Μενέλαος Μέλος Χούχουλα ήμητρα Μέλος 1
ΙΣΤΟΣΕΛΙΔΑ ΤΟΥ ΤΜΗΜΑΤΟΣ ΝΑΥΠΗΓΙΚΗΣ - ΥΛΙΚΟ ΣΤΟΝ ΕΙΔΙΚΟ ΙΣΤΟΧΩΡΟ ΓΙΑ ΤΗΝ ΠΑ ΤΕΧΝΙΚΗ ΈΚΘΕΣΗ Έργο: ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ ΤΕΙ ΑΘΗΝΑΣ Υπεύθυνος Παραδοτέου: Κωδικός Παραδοτέου: Εκδοση & Ημερομηνία: 31/3/2011 Ιδρυματικός Υπεύθυνος Έργου: Κώστας Κωνσταντίνος Μπρατάκος Μιχάλης Σύντομη Περιγραφή Εγγράφου: Σκοπός της παρούσας έκθεσης είναι η παρουσίαση της σχεδίασης και υλοποίησης της ειδικής ιστοσελίδας (ιστό-χώρου) του Τμήματος Ναυπηγικής που απευθύνεται στην εξυπηρέτηση του προγράμματος Πρακτικής Άσκησης (ΠΑ). Ταυτόχρονα θα παρουσιασθεί το ανηρτημένο υλικό και οι υπηρεσίες που θα προσφέρει ο εν λόγω ιστό-χώρος. Η δομή της παρούσας έκθεσης έχει ως ακολούθως: 1. Αρχικά, παρουσιάζονται οι στόχοι που καλείται να εξυπηρετήσει ο ιστό-χώρος ΠΑ του Τμήματος Ναυπηγικής. 2. Εν συνεχεία, παρουσιάζεται η βασική δομή του ανηρτημένου υλικού και των προσφερόμενων υπηρεσιών. 3. Ακολουθεί μια σύντομη περιγραφή των τεχνολογιών που χρησιμοποιήθηκαν στην υλοποίηση του ιστό-χώρου. 4. Έπειτα, επιχειρείται μια λεπτομερής παρουσίαση της παρούσας ανάπτυξης των ιστοσελίδων που καταρτίζουν των ιστό-χώρο ΠΑ του Τμήματος Ναυπηγικής. Τέλος, γίνεται μία σύνοψη της παρουσίασης και των μελλοντικών δεδομένων και υπηρεσιών που μπορούν να φιλοξενηθούν στον εν λόγω ιστό-χώρο και παρατίθεται ο πηγαίος κώδικας που χρησιμοποιήθηκε για την υλοποίηση των ιστοσελίδων. Συντάκτες: α/α Ονοματεπώνυμο Εργασία Ποσό Υπογραφή 1 Κ.Β. Κώστας Σχεδίαση/υλοποίηση/συντήρηση 3000 ιστοσελίδας, συγγραφή παραδοτέου 2 Χ.Ν. Στεφανάκος Συμβολή στη σχεδίαση της 500 ιστοσελίδας, συλλογή υλικού, ποιοτικός έλεγχος παραδοτέου ΣΥΝΟΛΑ 3500 ΙΣΤΟΡΙΚΟ ΕΓΓΡΑΦΟΥ Έκδοση Ημερομηνία Περιγραφή Συντάκτης 0.1 Αρχική έκδοση 0.2 Πρώτη διόρθωση 0.3 εύτερη διόρθωση 0.4 Τελική διόρθωση Προσοχή : Το ΙΣΤΟΡΙΚΟ ΕΓΓΡΑΦΟΥ δεν είναι απαραίτητο. Θα μπαίνει για μεγάλης διάρκειας Παραδοτέα 2
ΙΣΤΟΣΕΛΙΔΑ ΤΟΥ ΤΜΗΜΑΤΟΣ ΝΑΥΠΗΓΙΚΗΣ - ΥΛΙΚΟ ΣΤΟΝ ΕΙΔΙΚΟ ΙΣΤΟΧΩΡΟ ΓΙΑ ΤΗΝ ΠΑ ΤΕΧΝΙΚΗ ΈΚΘΕΣΗ Παραδοτέο στα πλαίσια του προγράμματος ΠΡΑΚΤΙΚΗΣ ΑΣΚΗΣΗΣ Τμήματος ΝΑΥΠΗΓΙΚΗΣ Δρ. Κ.Β. Κώστας, Καθηγητής Εφαρμογών Δρ. Χ.Ν. Στεφανάκος, Επίκουρος Καθηγητής ΑΙΓΑΛΕΩ, Μάρτιος 2011 3
Περιεχόμενα 1. Γενικά... 5 2. Σχεδιαστικοί στόχοι ιστό-χώρου ΠΠΑ τμ. Ναυπηγικής... 6 3. Δομή και προσφερόμενες υπηρεσίες... 8 4. Χρησιμοποιούμενες τεχνολογίες... 11 5. Ανηρτημένο Υλικό... 14 5.1 Αρχική Σελίδα... 14 5.2 Παρακολούθηση ΠΑ... 15 5.3 Έγγραφα Π.Α.... 16 5.4 Ενημέρωση... 17 5.5 Λοιπές ιστοσελίδες και υπηρεσίες... 18 6 Συμπεράσματα και μελλοντικές εφαρμογές... 24 Αναφορές... 25 Παράρτημα Ι. Πηγαίος κώδικας για την υλοποίηση του ιστό-χώρου... 26 Πίνακας σχημάτων & εικόνων Εικόνα 1: Βασικά στοιχεία κεντρικής ιστοσελίδας ιστό-χώρου ΠΠΑ τμ. Ναυπηγικής... 15 Εικόνα 2: Επιλογή Παρακολούθηση ΠΑ και Έντυπα Εκθέσεων... 16 Εικόνα 3: Επιλογή Έγγραφα Π.Α. και εμφάνιση αίτησης έναρξης και σχετική και νομοθεσία... 17 Εικόνα 4: Επιλογή Ενημέρωση και Φυλλάδιο ΠΠΑ τμ. Ναυπηγικής... 18 Εικόνα 5: Ιστοσελίδα ανακοινώσεων του ΠΠΑ... 22 Εικόνα 6: Ιστοσελίδα παράθεσης στοιχείων επικοινωνίας... 23 4
1. Γενικά Το πρόγραμμα Πρακτικής Άσκησης ξεκίνησε την 1/9/2010 και έχει ως σκοπό τη χρηματοδότηση της Πρακτικής Άσκησης ενός μέρους των σπουδαστών του Τμήματος Ναυπηγικής μέσω του προγράμματος ΕΣΠΑ 2007-2013 για την τριετία 1/9/2010-31/8/2013. Στα πλαίσια του προγράμματος έχει εγκριθεί η χρηματοδότηση 59 συνολικά σπουδαστών, οι οποίοι κατανέμονται ως εξής: 53 στον ιδιωτικό τομέα και 6 στο δημόσιο. Σκοπός της παρούσας έκθεσης είναι η παρουσίαση της σχεδίασης και υλοποίησης της ειδικής ιστοσελίδας (ιστό-χώρου) του Τμήματος Ναυπηγικής που απευθύνεται στην εξυπηρέτηση του προγράμματος Πρακτικής Άσκησης (ΠΑ). Ταυτόχρονα θα παρουσιασθεί το ανηρτημένο υλικό και οι υπηρεσίες που θα προσφέρει ο εν λόγω ιστό-χώρος. Η δομή της παρούσας έκθεσης έχει ως ακολούθως: 1. Αρχικά, παρουσιάζονται οι στόχοι που καλείται να εξυπηρετήσει ο ιστό-χώρος ΠΑ του Τμήματος Ναυπηγικής. 2. Εν συνεχεία, παρουσιάζεται η βασική δομή του ανηρτημένου υλικού και των προσφερόμενων υπηρεσιών. 3. Ακολουθεί μια σύντομη περιγραφή των τεχνολογιών που χρησιμοποιήθηκαν στην υλοποίηση του ιστό-χώρου. 4. Έπειτα, επιχειρείται μια λεπτομερής παρουσίαση της παρούσας ανάπτυξης των ιστοσελίδων που καταρτίζουν των ιστό-χώρο ΠΑ του Τμήματος Ναυπηγικής. Τέλος, γίνεται μία σύνοψη της παρουσίασης και των μελλοντικών δεδομένων και υπηρεσιών που μπορούν να φιλοξενηθούν στον εν λόγω ιστό-χώρο και παρατίθεται ο πηγαίος κώδικας που χρησιμοποιήθηκε για την υλοποίηση των ιστοσελίδων. 5
2. Σχεδιαστικοί στόχοι ιστό-χώρου ΠΠΑ τμ. Ναυπηγικής Οι τέσσερεις βασικοί κατευθυντήριοι άξονες στην δημιουργία του ιστό-χώρου ΠΑ του Τμήματος Ναυπηγικής ήταν: 1. Η κατά το δυνατόν πιο άμεση και καθολική παροχή ενημέρωσης και ενημερωτικού υλικού προς τους σπουδαστές του τμήματος και λοιπούς ενδιαφερόμενους. 2. Η παροχή κατάλληλων εντύπων και υπηρεσιών προς τους σπουδαστές για τη διευκόλυνση της διεκπεραίωσης των διαδικαστικών υποχρεώσεών τους στα πλαίσια του προγράμματος ΠΑ. 3. Η παροχή ανάλογων εντύπων και υπηρεσιών προς τα μέλη Ε.Π. του Τμήματος Ναυπηγικής που εμπλέκονται στο πρόγραμμα ΠΑ, είτε ως επόπτες, είτε ως μέλη της επιτροπής Πρακτικής Άσκησης ή της επιστημονικής ομάδας υλοποίησης του προγράμματος ΠΑ. 4. Η παροχή ανάλογων εντύπων και υπηρεσιών προς τους παραγωγικούς φορείς που εμπλέκονται στο πρόγραμμα ΠΑ ως υποδοχείς σπουδαστών του Τμήματος Ναυπηγικής για Πρακτική Άσκηση. Όπως είναι εύκολα αντιληπτό, η ταχεία υλοποίηση του ιστό-χώρου είναι ιδιαίτερα σημαντική καθώς κατέχει κεντρικό ρόλο στους τομείς της ενημέρωσης και της εξυπηρέτησης των εμπλεκομένων στο πρόγραμμαπα. Για αυτόν το λόγο, η δημιουργία του υποστηρικτικού υλικού (έντυπα, ερωτηματολόγια, ενημερωτικά φυλλάδια, βλέπε [2,3], καθώς και η σχεδίαση και υλοποίηση των ιστοσελίδων του εντάχθηκαν στην πρώτη ομάδα παραδοτέων του προγράμματος ΠΑ, αν και αποτελούν ιδιαίτερα σημαντικό κομμάτι του έργου της επιστημονικής ομάδας (βλέπε και Σχέδιο Δράσης προγράμματος ΠΑ [1]). 6
Ενδεικτικά για την εξυπηρέτηση των 4 κεντρικών στόχων που αναφέρθηκαν στην αρχή της παραγράφου, παραθέτουμε στοιχεία της σχεδίασης και του υλικού που τους εξυπηρετούν: 1. Ανάρτηση όλου του ενημερωτικού υλικού στον ιστό-χώρο (στοιχεία επικοινωνίας της επιστημονικής ομάδας και της γραμματειακής υποστήριξης, ενημερωτικά φυλλάδια σε ηλεκτρονική και εκτυπώσιμη μορφή, περιγραφή των σταδίων της διαδικασίας εκπόνησης ΠΑ, παράθεση της σχετικής νομοθεσίας και ανάρτηση σε ηλ. μορφή των σχετικών Φ.Ε.Κ., παρουσίαση λίστας φορέων εκπόνησης ΠΑ κ.α.) 2. Διάθεση όλων των διαδικαστικών εντύπων (αίτηση έναρξης, συμβάσεις, πρότυπα εκθέσεων κ.ο.κ.) σε ηλεκτρονική και εκτυπώσιμη μορφή. 3. Ενσωμάτωση των ερωτηματολογίων αξιολόγησης του προγράμματος ΠΑ (προς σπουδαστές, φορείς και εκπαιδευτικούς) σε κατάλληλο ηλεκτρονικό σύστημα συμπλήρωσης, αποδελτίωσης και στατιστικής επεξεργασίας που επιτρέπει την έγκαιρη και πλήρη αξιοποίησή τους. 4. Σύνδεση του ιστό-χώρου ΠΑ του Τμήματος Ναυπηγικής με το κεντρικό ιστό-χώρο του Τμήματος Ναυπηγικής και με τον ιδρυματικό ιστό-χώρο του Γραφείου Πρακτικής Άσκησης του ΤΕΙ-Αθήνας. 5. Ανάρτηση χρήσιμων ανακοινώσεων και νέων τόσο στον ειδικό ιστό-χώρο ΠΑ όσο και στον ιστό-χώρο του Τμήματος Ναυπηγικής 6. Διάθεση όλων των τεχνικών εκθέσεων και παραδοτέων του προγράμματος ΠΑ από τη σχετική ιστοσελίδα του ειδικού ιστόχώρου ΠΑ. 7
3. Δομή και προσφερόμενες υπηρεσίες Η οργάνωση του υλικού και των προσφερόμενων υπηρεσιών στον ιστό-χώρο ΠΑ του Τμήματος Ναυπηγικής ακολουθεί τη δομή δένδρου που ακολουθεί: Αρχική Σελίδα Παρουσιάζονται βασικές πληροφορίες για την ΠΑ και το πρόγραμμα ΠΑ (ΕΣΠΑ) και προσφέρεται σύνδεσμος προς τον ιδρυματικό ιστό-χώρο του Γραφείου Πρακτικής Άσκησης του ΤΕΙ-Αθήνας. Παρακολούθηση ΠΑ Επιτροπή ΠΑ Παρουσίαση της επιτροπής ΠΑ του τμήματος Επιστημονική ομάδα προγράμματος ΠΑ Παρουσίαση της επιστημονικής ομάδας του προγράμματος ΠΑ του τμήματος Επόπτες Λίστα των εποπτών του ΠΠΑ Ερωτηματολόγια Σπουδαστών Σύνδεσμοι προς τις υπηρεσίες του αυτόματου συστήματος διαχείρισης ερωτηματολογίων του τμήματος και του αντίστοιχου συστήματος του κεντρικού ιστό-χώρου του Γραφείου Πρακτικής Άσκησης του ΤΕΙ-Αθήνας. Ερωτηματολόγια Φορέων 8
Σύνδεσμοι αντίστοιχοι της κατηγορίας Ερωτηματολόγια Σπουδαστών που απευθύνονται στους φορείς υποδοχείς για ΠΑ Ερωτηματολόγια Εποπτών Σύνδεσμοι αντίστοιχοι της κατηγορίας Ερωτηματολόγια Σπουδαστών που απευθύνονται στους συμμετέχοντες εκπαιδευτικούς του τμήματος. Έντυπα Εκθέσεων [Περιλαμβάνει πρότυπα έντυπα εκθέσεων προς χρήση από όλους τους εμπλεκόμενους στο πρόγραμμα ΠΑ] ΦΟΡΕΑ ΣΠΟΥΔΑΣΤΩΝ ΕΠΟΠΤΩΝ Έγγραφα ΠΑ [Περιλαμβάνει όλα τα έντυπα διεκπεραίωσης των διαδικαστικών σταδίων του ΠΠΑ και την σχετική νομοθεσία] Συμβάσεις Έντυπα 1 (φορέας) &2 (σπουδαστής) Αίτηση έναρξης (διαθέσιμη σε μορφή για ηλεκτρονική και χειρόγραφη συμπλήρωση) Σχετική Νομοθεσία Σχετικά ΦΕΚ Ενημέρωση Ενημερωτικά Φυλλάδια ΠΑ τμ. Ναυπηγικής και ΤΕΙ-Αθήνας Παρουσίαση του ενημερωτικού φυλλαδίου του τμήματος σε ηλεκτρονική και εκτυπώσιμη μορφή και παράθεση και του αντίστοιχου ιδρυματικού φυλλαδίου Παρουσίαση των διαδικαστικών σταδίων έναρξης της ΠΑ 9
Αναλυτική περιγραφή των σταδίων και των διαδικαστικών απαιτήσεων για την έναρξη της ΠΑ από τον σπουδαστή. Στοιχεία για τη χρηματοδότηση και την ασφάλιση μέσω του προγράμματος ΠΑ Ενημερωτικές πληροφορίες για την προσφερόμενη χρηματοδότηση και την ασφάλιση των σπουδαστών Συλλεγόμενα στατιστικά στοιχεία από την εκπόνηση ΠΑ των σπουδαστών του τμήματος Λίστα συμμετεχόντων σπουδαστών Συμμετέχοντες σπουδαστές στο πρόγραμμα ΠΑ Λίστα φορέων Λίστα με τους φορείς στους οποίους εκπονούν (ή έχουν εκπονήσει) ΠΑ σπουδαστές του τμήματος Ανακοινώσεις Δημοσιεύσεις Περιλαμβάνει Τεχνικές Εκθέσεις και παραδοτέα του προγράμματος ΠΑ (Σχέδια δράσης, αποτίμηση υπάρχουσας κατάστασης κ.ο.κ.) καθώς και οποιαδήποτε άλλη δημοσίευση σχετική με την ΠΑ και το πρόγραμμα ΠΑ Επικοινωνία Στοιχεία επικοινωνίας του επιστημονικού υπευθύνου καθώς και της γραμματειακής υποστήριξης σε επίπεδο σχολής και τμήματος. Αναλυτικότερα στοιχεία για το υλικό που περιλαμβάνεται στις προαναφερθείσες κατηγορίες δίνονται στο Εδάφιο 5. 10
4. Χρησιμοποιούμενες τεχνολογίες Ο ιστό-χώρος είναι υλοποιημένος σύμφωνα με τις τρέχουσες προδιαγραφές του w3c [4] για την σχεδίαση ιστοσελίδων. Κατά κύριο λόγο η παρουσίαση των δεδομένων και η παρουσίαση των ιστοσελίδων έχουν υλοποιηθεί στην γλώσσα html 1 σε συνδυασμό με τις μορφοποιήσεις που επιτρέπει η τεχνολογία CSS 2. Η δομή του ιστό-χώρου και το δένδρο πλοήγησης (navigatin tree) που απεικονίζεται στην Εικόνα 1 ως στοιχείο έχει υλοποιηθεί χρησιμοποιώντας την γλώσσα προγραμματισμού JavaScript [5] που επιτρέπει την δημιουργία δυναμικών και αλληλεπιδραστικών στοιχείων σε ιστοσελίδες. Στο 1 HTML: HyperText Markup Language. Περισσότερες πληροφορίες θα βρείτε στην διεύθυνση: http://www.w3.rg/standards/techs/html#w3c_all 2 CSS: Cascading Style Sheets. Περισσότερες πληροφορίες θα βρείτε στην διεύθυνση: http://www.w3.rg/standards/techs/css#w3c_all 11
Παράρτημα Ι παρουσιάζεται ενδεικτικά και το βασικό προγραμματικό μέρος της υλοποίησης του δένδρου πλοήγησης του ιστό-χώρου. Πέραν των προαναφερθέντων, στο υλικό των ιστοσελίδων εμπεριέχονται αντικείμενα σχεδιασμένα σε Adbe Flash 3. Το έγγραφο που παρουσιάζεται συνολικά με χρήση της τεχνολογίας Flash είναι η ηλεκτρονική έκδοση του ενημερωτικού φυλλαδίου του προγράμματος ΠΑ του Τμήματος Ναυπηγικής το οποίο είναι προσβάσιμο από την κατηγορία Ενημέρωση του ιστό-χώρου (βλέπε Εικόνα 4 και για λεπτομερέστερη παρουσίαση του εντύπου βλέπε την τεχνική έκθεση [3]. Τέλος, ο ιστό-χώρος φιλοξενεί ένα αυτόματο σύστημα ηλεκτρονικής συμπλήρωσης, αποθήκευσης, αποδελτίωσης και στατιστικής επεξεργασίας που εξυπηρετεί τις υπηρεσίες που αφορούν τα ερωτηματολόγια σπουδαστών, φορέων και εποπτών του προγράμματος ΠΑ του Τμήματος Ναυπηγικής. Για την υλοποίηση του εν λόγω συστήματος υιοθετήθηκε ένα υπάρχον λογισμικό ανοικτού κώδικα (pen surce cde) το οποίο καλείται limesurvey 4. Το λογισμικό αυτό παρέχει μια πλειάδα χρήσιμων χαρακτηριστικών και απαιτεί και την εγκατάσταση ενός συστήματος διαχείρισης βάσεων δεδομένων (DBMS-DataBase Management System) το οποίο θα πρέπει να είναι εγκαταστημένο στον εξυπηρετητή του ιστό-χώρου ή σε έναν συνεργαζόμενο εξυπηρετητή. Για την εξυπηρέτηση της βάσης δεδομένων η ομάδα σχεδίασης και υλοποίησης του Τμήματος Ναυπηγικής εγκατέστησε το σύστημα διαχείρισης βάσεων δεδομένων ΜySQL 5 το οποίο είναι και αυτό ένα λογισμικό ανοικτού κώδικα. 3 Adbe Flash: http://www.adbe.cm/prducts/flashplayer/ 4 Περισσότερες πληροφορίες στην ιστοσελίδα : http://www.limesurvey.rg/ 5 http://www.mysql.cm 12
Περισσότερες πληροφορίες για τα εν λόγω λογισμικά, το σύστημα διαχείρισης των ερωτηματολογίων μπορείτε να βρείτε στην τεχνική έκθεση [2]. 13
5. Ανηρτημένο Υλικό 5.1 Αρχική Σελίδα Η κεντρική ιστοσελίδα του ιστό-χώρου του ΠΠΑ του τμ. Ναυπηγικής απεικονίζεται στην Εικόνα 1 και περιλαμβάνει 3 βασικά μέρη: 1. Τον χώρο του τίτλου (banner) που περιλαμβάνει τα λογότυπα του ΕΣΠΑ και του ΥΠΕΠΘ και παραμένει ορατός για όλες τις ιστοσελίδες του ιστό-χώρου (βλέπε στοιχείο στην Εικόνα 1) 2. Το δένδρο πλοήγησης (εμφανίζεται στην Εικόνα 1 με τον αριθμό ) το οποίο επιτρέπει την επιλογή κατηγοριών και ιστοσελίδων και είναι σχεδιασμένο ώστε να αλληλεπιδρά στις επιλογές του χρήστη και να προσαρμόζει τα περιεχόμενα του με βάση την τρέχουσα δραστηριότητα του χρήση (βλ. ενδεικτικά τις εικόνες 1-4) 3. Τον κύριο χώρο ( ), όπου παρουσιάζονται οι ιστοσελίδες, τα έγγραφα και οι λοιπές προσφερόμενες υπηρεσίες του ιστό-χώρου. Το περιεχόμενο του καθορίζεται από τις επιλογές του χρήστη στο δένδρο πλοήγησης. 14
Εικόνα 1: Βασικά στοιχεία κεντρικής ιστοσελίδας ιστό-χώρου ΠΠΑ τμ. Ναυπηγικής 5.2 Παρακολούθηση ΠΑ Η κατηγορία της Παρακολούθησης ΠΑ περιλαμβάνει τα στοιχεία των επιτροπών ΠΑ του τμήματος καθώς και των εποπτών εκπαιδευτικών. Επιπλέον προσφέρονται σύνδεσμοι προς τα συστήματα ηλεκτρονικής συμπλήρωσης και επεξεργασίας ερωτηματολογίων του ΤΕΙ-Αθήνας και του τμήματος Ναυπηγικής. Το πρώτο ερωτηματολόγιο περιλαμβάνει μια σειρά βασικών γενικών ερωτήσεων στατιστικού περιεχομένου ενώ το δεύτερο εστιάζει σε ερωτήματα που αποσκοπούν στην αξιολόγηση του προγράμματος ΠΑ και τη διερεύνηση των συσχετίσεων μεταξύ της Πρακτικής Άσκησης, της τελικής επαγγελματικής αποκατάστασης και των πτυχιούχων του Τμήματος Ναυπηγικής. Εκτενής αναφορά στους στόχους και τα περιεχόμενα των ερωτηματολογίων γίνεται στην τεχνική έκθεση [2]. 15
Επίσης στην ίδια κατηγορία έχουν συμπεριληφθεί και τα πρότυπα έντυπα εκθέσεων που πρέπει να συμπληρωθούν από σπουδαστές, φορείς και επόπτες του προγράμματος ΠΑ. Τμήμα της εν λόγω ιστοσελίδας απεικονίζεται στην Εικόνα 2, όπου εμφανίζονται σύνδεσμοι προς τα ηλεκτρονικά έντυπα εκθέσεων για τους φορείς και τους σπουδαστές συνοδευόμενοι από σχετικά αναγνωριστικά εικονίδια (thumbnails). Εικόνα 2: Επιλογή Παρακολούθηση ΠΑ και Έντυπα Εκθέσεων 5.3 Έγγραφα Π.Α. Στην κατηγορία αυτή έχουν συμπεριληφθεί σε ηλεκτρονική μορφή όλα τα έντυπα που πρέπει να συμπληρωθούν κατά την έναρξη της ΠΑ από σπουδαστές και φορείς. Επιπλέον για κάποια από αυτά δίνεται η δυνατότητα ηλ. συμπλήρωσης μέσω κατάλληλα διαμορφωμένης φόρμας. Ένα τέτοιο παράδειγμα είναι η αίτησης έναρξης, ο σύνδεσμος προς την οποία απεικονίζεται και στην Εικόνα 3. 16
Τμήμα της ίδια κατηγορίας είναι και η παροχή ηλεκτρονικών αντιγράφων των σχετικών με την ΠΑ νομοθετημάτων. Τρεις σύνδεσμοι προς ΦΕΚ συνοδευόμενοι από αντίστοιχα αναγνωριστικά εικονίδια (thumbnails) εμφανίζονται και στην Εικόνα 3 που ακολουθεί. Εικόνα 3: Επιλογή Έγγραφα Π.Α. και εμφάνιση αίτησης έναρξης και σχετική και νομοθεσία 5.4 Ενημέρωση Η κατηγορία της ενημέρωσης πέραν της εξυπηρέτησης των ενημερωτικών φυλλαδίων του τμήματος (βλέπε Εικόνα 4 καθώς και τεχνική έκθεση [3]) και του ΤΕΙ-Αθήνας προσφέρει πληροφορίες που αφορούν τα απαιτούμενα βήματα έναρξης ΠΑ, την προβλεπόμενη χρηματοδότηση και ασφάλιση προς τους συμμετέχοντες σπουδαστές καθώς και πρόσβαση στην συλλογή στατιστικών στοιχείων της επιστημονικής ομάδας του προγράμματος ΠΑ τα οποία αφορούν παρελθόντα και τρέχοντα έτη και θα ανανεώνονται σε όλη την διάρκεια του προγράμματος ΠΑ. 17
Το ενημερωτικό φυλλάδιο του προγράμματος ΠΑ του Τμήματος Ναυπηγικής διατίθεται σε flash και pdf μορφή και περιλαμβάνει σε συμπυκνωμένη μορφή ένα πολύ μεγάλο μέρος του ενημερωτικού υλικού του περιγραφόμενου ιστόχώρου. Εικόνα 4: Επιλογή Ενημέρωση και Φυλλάδιο ΠΠΑ τμ. Ναυπηγικής 5.5 Λοιπές ιστοσελίδες και υπηρεσίες Οι λοιπές κατηγορίες και ιστοσελίδες του ιστό-χώρου περιλαμβάνουν την λίστα των σπουδαστών και των φορέων εκπόνησης ΠΑ, το σύστημα ανακοινώσεων, τον κατάλογο δημοσιεύσεων και την σελίδα επικοινωνίας. Αναλυτικότερα: Λίστα Φορέων: Η ενδεικτική λίστα των συνεργαζόμενων φορέων που έχει αναρτηθεί στην σχετική ιστοσελίδα είναι η ακόλουθη: 18
Τεχνικά Γραφεία ΤΕΝΜΕ-Marine Technical Bureau Τάσος Χρυσοχοϊδης Prhull Ltd Aegean Engineers Ltd Glafks Marine Ltd A.R.S. C. Naftsl S.A. CAS Marine Surveyrs-Cnsultants & Naval Architects Μarutec C. Cstas Carabelas Technical Office Shiptech Engineering Ltd. Delta Technical Bureau Benemar C. Ath.Kpukis SA Naval Architecture Prgress Χ.Σ. & Συνεργάτες ΕΠΕ ADD Ltd BUREA Ultrasnic Marine Technical Services Ltd ELKCO marine Cnsultants Αν.Π. ΚΗΠΟΥΡΟΠΟΥΛΟΣ Τεχνική Ναυπηγική ΜΕΠΕ Effepi Mn. Ltd. Ν.Μ. Πετυχάκης Delta Technical Bureau Εταιρείες Υπηρεσιών Triiris Nrth Pint Maritime Crp. Piraeus Marine Services S.A. Malliarudakis Human Factr Πληροφοριακά Συστήματα ΕΛ-ΚΑ-ΣΩ Ναυτιλιακή Α.Ε. 19
Hellintec S.A. Thessalia Marine Service Οργανισμός Λιμένος Πειραιώς Α.Ε. Maersk Brker Hellas Ltd. GAINS Inc. Νηογνώμονες Cyprus Bureau f Shipping (CBS) Ελληνικός Νηογνώμονας Ιταλικός Νηογνώμονας Αγγλικός Νηογνώμονας INSB Ναυτιλιακές εταιρείες NEL LINES AE Halkidn Shipping Crp. Chartwrld Shipping Crp. Evalend Shipping Cmpany Newprt Shipmanagement Ltd. Newprt SA Varship Shipping C. ARK Shipping SA AM Nmiks Rxana Shipping S.A. Maran Tankers Management Inc. Centrfin Management Inc. Te Shipping Crp. CERES LNG SERVICES LTD Ναυπηγεία Ναυπηγεία Ελευσίνας Ελληνικά Ναυπηγεία Νεώριο 20
Planatech Z Marine FOST Εταιρείες μηχανολογικού ενδιαφέροντος Διυλιστήρια Κορίνθου A.E. (ΜΟΤΟΡ ΟΙΛ ΕΛΛΑΣ) Latern Cnstructin C. ΝΑΒΑΜΑΡ ΕΠΕ ΗΡΑΚΛΗΣ ΑΓΕΤ Λίστα Σπουδαστών : Η λίστα σπουδαστών θα περιλαμβάνει το σύνολο των σπουδαστών που εκπόνησαν/εκπονούν την ΠΑ με το πρόγραμμα ΠΑ του Τμήματος Ναυπηγικής. Κατά τον χρόνο σύνταξης της παρούσας έκθεσης έχει εγκριθεί και ξεκινήσει η χρηματοδότηση τεσσάρων (4) σπουδαστών/τριών στον Κλάδο Επιθεώρησης Εμπορικών Πλοίων / Διεύθυνση Επιθεωρήσεων Πλοίων του Υπουργείου Θαλασσίων Υποθέσεων, Νήσων και Αλιείας ως εξής: α/α Ονοματεπώνυμο Σπουδαστή Συνεργαζόμενος Φορέας Διάρκεια 1 Θεοδωρίδης Κυριάκος Τμήμα ΝΑΥΤΙΛΙΑΚΟΥ 1/10/2010-1/4/2011 2 Πέτρου Γενοβέφα Τμήμα ΝΗOΓΝΩΜΟΝΩΝ 12/10/2010-12/4/2011 3 Ραμούνδου Αναστασία Τμήμα ΝΑΥΠΗΓΙΚΟΥ 1/10/2010-1/4/2011 4 Χαραλάμπους Ελένη Τμήμα ΜΗΧΑΝΟΛΟΓΙKOY 1/10/2010-1/4/2011 Επίσης, εκτιμάται ότι μέσα στο 2011 πρόκειται να χρηματοδοτηθούν τριάντα (30) σπουδαστές περίπου σε φορείς του ιδιωτικού τομέα. Ανακοινώσεις: Η ιστοσελίδα ανακοινώσεων υποστηρίζεται από κατάλληλη φόρμα ανάρτησης και συνδέεται με τις ανακοινώσεις του ιστό-χώρου του Τμήματος Ναυπηγικής. Τμήμα της εν λόγω ιστοσελίδας εμφανίζεται στην ακόλουθη Εικόνα 5 21
Εικόνα 5: Ιστοσελίδα ανακοινώσεων του ΠΠΑ Δημοσιεύσεις: Ο κατάλογος δημοσιεύσεων συμπεριλαμβάνει όπως έχουμε ήδη αναφέρει τα παραδοτέα του προγράμματος ΠΑ (Σχέδια δράσης, αποτίμηση προϋπάρχουσας κατάστασης κ.ο.κ.) καθώς και οποιαδήποτε άλλη σχετική δημοσίευση με την ΠΑ και το πρόγραμμα ΠΑ. Επικοινωνία: Η ιστοσελίδα επικοινωνίας απεικονίζεται στην ακόλουθη Εικόνα 6. 22
Εικόνα 6: Ιστοσελίδα παράθεσης στοιχείων επικοινωνίας 23
6 Συμπεράσματα και μελλοντικές εφαρμογές Η επιστημονική ομάδα του προγράμματος ΠΑ του Τμήματος Ναυπηγικής εκτιμά πως η παρούσα ανάπτυξη του ιστό-χώρου υποστήριξης καλύπτει σε μεγάλο βαθμό τους σχεδιαστικούς στόχους που τέθηκαν και περιγράφονται στο Εδάφιο 2 και εν τάχει είναι: 1. Η κατά το δυνατόν πιο άμεση και καθολική παροχή ενημέρωσης 2. Η παροχή κατάλληλων εντύπων και υπηρεσιών προς τους σπουδαστές 3. Η παροχή ανάλογων εντύπων και υπηρεσιών προς τα μέλη Ε.Π. και Φορείς που συμμετέχουν στο πρόγραμμα ΠΑ. Επίσης, πολλές ιστοσελίδες και υπηρεσίες του ιστό-χώρου έχουν σχεδιαστεί με τρόπο που επιτρέπει την εύκολη επέκταση τους αλλά και την αλληλεπιδραστική χρήση τους, πράγμα που καθιστά και τον εν λόγω ιστόχώρο δυναμικό και μεταβαλλόμενο ανάλογα με τις τρέχουσες και μελλοντικές απαιτήσεις σπουδαστών και λοιπών συμμετεχόντων. Η εν λόγω ιδιότητα είναι σημαντική αλλά αποκτά ακόμη πιο ιδιαίτερη βαρύτητα καθώς επιτυγχάνεται στην αρχή του προγράμματος ΠΑ. Φυσικά, κάποιες κατηγορίες στην παρούσα φάση ανάπτυξης δεν ανταποκρίνονται πλήρως σε ότι αφορά το περιεχόμενο τους αλλά θεωρούμε πως με την σταδιακή παραγωγή και παγίωση των λοιπών παραδοτέων του προγράμματος θα μπορέσουμε να επιτύχουμε μια ισοβαρή και ολοκληρωμένη ανάπτυξη του συνόλου του παρεχομένου διαδικτυακού περιεχομένου. 24
Αναφορές 1. Χ.Ν. Στεφανάκος, Φεβρουάριος 2011, ΕΤΗΣΙΟ ΣΧΕΔΙΟ ΔΡΑΣΗΣ 2011 Προγράμματος ΠΡΑΚΤΙΚΗΣ ΑΣΚΗΣΗΣ Τμήματος ΝΑΥΠΗΓΙΚΗΣ 1/9/2010-31/8/2013, ΣΤΕφ, ΤΕΙ-Αθήνας, ΕΣΠΑ 2007-2013. 2. Κ.Β. Κώστας, Μάρτιος 2011, Π14.3.1) ΣΥΛΛΟΓΗ ΕΡΩΤΗΜΑΤΟΛΟΓΙΩΝ ΣΠΟΥΔΑΣΤΩΝ / ΦΟΡΕΩΝ / ΕΠΟΠΤΩΝ (σχεδίαση). Πρόγραμμα Πρακτικής Άσκησης τμ. Ναυπηγικής 1/9/2010-31/8/2013, ΣΤΕφ, ΤΕΙ-Αθήνας, ΕΣΠΑ 2007-2013. 3. Κ.Β. Κώστας, Χ.Ν. Στεφανάκος, Μάρτιος 2011, Π14.4.2) ΕΝΗΜΕΡΩΤΙΚΟ ΥΛΙΚΟ ΓΙΑ ΤΗΝ ΠΡΑΚΤΙΚΗ ΆΣΚΗΣΗ - ΈΚΔΟΣΗ ΠΡΟΩΘΗΤΙΚΟΥ / ΔΙΑΦΗΜΙΣΤΙΚΟΥ ΥΛΙΚΟΥ. Πρόγραμμα Πρακτικής Άσκησης τμ. Ναυπηγικής 1/9/2010-31/8/2013, ΣΤΕφ, ΤΕΙ-Αθήνας, ΕΣΠΑ 2007-2013. 4. W3C (WWW Cnsrtium), WEB Design & Applicatins, 2010 URL http://www.w3.rg/standards/webdesign/htmlcss 5. JavaScript στην Wikipedia, URL http://en.wikipedia.rg/wiki/javascript 25
Παράρτημα Ι. Πηγαίος κώδικας για την υλοποίηση του ιστό-χώρου var persisteduls=new Object() var ddtreemenu=new Object() ddtreemenu.clseflder="images/clsed.gif" //set image path t "clsed" flder image ddtreemenu.penflder="images/pen.gif" //set image path t "pen" flder image ddtreemenu.createtree=functin(treeid, enablepersist, persistdays){ var ultags=dcument.getelementbyid(treeid).getelementsbytagname("ul") if (typef persisteduls[treeid]=="undefined") persisteduls[treeid]=(enablepersist==true && ddtreemenu.getckie(treeid)!="")? ddtreemenu.getckie(treeid).split(",") : "" fr (var i=0; i<ultags.length; i++) ddtreemenu.buildsubtree(treeid, ultags[i], i) if (enablepersist==true){ //if enable persist feature var duratindays=(typef persistdays=="undefined")? 1 : parseint(persistdays) ddtreemenu.dtask(windw, functin(){ddtreemenu.rememberstate(treeid, duratindays), "unlad") //save pened UL indexes n bdy unlad ddtreemenu.buildsubtree=functin(treeid, ulelement, index){ ulelement.parentnde.classname="submenu" if (typef persisteduls[treeid]=="bject"){ //if ckie exists (persisteduls[treeid] is an array versus "" string) if (ddtreemenu.searcharray(persisteduls[treeid], index)){ ulelement.setattribute("rel", "pen") ulelement.style.display="blck" ulelement.parentnde.style.backgrundimage="url("+ddtreemenu.penflder+")" else ulelement.setattribute("rel", "clsed") //end ckie persist cde else if (ulelement.getattribute("rel")==null ulelement.getattribute("rel")==false) //if n ckie and UL has NO rel attribute explicted added by user ulelement.setattribute("rel", "clsed") else if (ulelement.getattribute("rel")=="pen") //else if n ckie and this UL has an explicit rel value f "pen" ddtreemenu.expandsubtree(treeid, ulelement) //expand this UL plus all parent ULs (s the mst inner UL is revealed!) ulelement.parentnde.nclick=functin(e){ var submenu=this.getelementsbytagname("ul")[0] if (submenu.getattribute("rel")=="clsed"){ submenu.style.display="blck" submenu.setattribute("rel", "pen") ulelement.parentnde.style.backgrundimage="url("+ddtreemenu.penflder+")" else if (submenu.getattribute("rel")=="pen"){ submenu.style.display="nne" submenu.setattribute("rel", "clsed") ulelement.parentnde.style.backgrundimage="url("+ddtreemenu.clseflder+")" ddtreemenu.preventprpagate(e) ulelement.nclick=functin(e){ ddtreemenu.preventprpagate(e) ddtreemenu.expandsubtree=functin(treeid, ulelement){ //expand a UL element and any f its parent ULs var rtnde=dcument.getelementbyid(treeid) 26
var currentnde=ulelement currentnde.style.display="blck" currentnde.parentnde.style.backgrundimage="url("+ddtreemenu.penflder+")" while (currentnde!=rtnde){ if (currentnde.tagname=="ul"){ //if parent nde is a UL, expand it t currentnde.style.display="blck" currentnde.setattribute("rel", "pen") //indicate it's pen currentnde.parentnde.style.backgrundimage="url("+ddtreemenu.penflder+")" currentnde=currentnde.parentnde ddtreemenu.flatten=functin(treeid, actin){ //expand r cntract all UL elements var ultags=dcument.getelementbyid(treeid).getelementsbytagname("ul") fr (var i=0; i<ultags.length; i++){ ultags[i].style.display=(actin=="expand")? "blck" : "nne" var relvalue=(actin=="expand")? "pen" : "clsed" ultags[i].setattribute("rel", relvalue) ultags[i].parentnde.style.backgrundimage=(actin=="expand")? "url("+ddtreemenu.penflder+")" : "url("+ddtreemenu.clseflder+")" ddtreemenu.rememberstate=functin(treeid, duratindays){ //stre index f pened ULs relative t ther ULs in Tree int ckie var ultags=dcument.getelementbyid(treeid).getelementsbytagname("ul") var penuls=new Array() fr (var i=0; i<ultags.length; i++){ if (ultags[i].getattribute("rel")=="pen") penuls[penuls.length]=i //save the index f the pened UL (relative t the entire list f ULs) as an array element if (penuls.length==0) //if there are n pened ULs t save/persist penuls[0]="nne pen" //set array value t string t simply indicate all ULs shuld persist with state being clsed ddtreemenu.setckie(treeid, penuls.jin(","), duratindays) //ppulate ckie with value treeid=1,2,3 etc (where 1,2... are the indexes f the pened ULs) ddtreemenu.getckie=functin(name){ //get ckie value var re=new RegExp(Name+"=[^;]+", "i"); //cnstruct RE t search fr target name/value pair if (dcument.ckie.match(re)) //if ckie fund return dcument.ckie.match(re)[0].split("=")[1] //return its value return "" ddtreemenu.setckie=functin(name, value, days){ //set ckei value var expiredate = new Date() //set "expstring" t either future r past date, t set r delete ckie, respectively var expstring=expiredate.setdate(expiredate.getdate()+parseint(days)) dcument.ckie = name+"="+value+"; expires="+expiredate.tgmtstring()+"; path=/"; ddtreemenu.searcharray=functin(thearray, value){ //searches an array fr the entered value. If fund, delete value frm array var isfund=false fr (var i=0; i<thearray.length; i++){ if (thearray[i]==value){ isfund=true thearray.shift() //delete this element frm array fr efficiency sake break return isfund ddtreemenu.preventprpagate=functin(e){ //prevent actin frm bubbling upwards if (typef e!="undefined") 27
e.stpprpagatin() else event.cancelbubble=true ddtreemenu.dtask=functin(target, functinref, tasktype){ //assign a functin t execute t an event handler (ie: nunlad) var tasktype=(windw.addeventlistener)? tasktype : "n"+tasktype if (target.addeventlistener) target.addeventlistener(tasktype, functinref, false) else if (target.attachevent) target.attachevent(tasktype, functinref) 28