ΙΣΤΟΣΕΛΙΔΑ ΚΠΕ...

ΙΣΤΟΣΕΛΙΔΑ ΚΠΕ ΦΙΛΙΠΠΩΝ

ΠΤΥΧΙΑΚΗ ΕΡΓΑΣΙΑ ΤΜΗΜΑ ΒΙΟΜΗΧΑΝΙΚΗΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΤΕΙ ΚΑΒΑΛΑΣ

ΙΣΤΟΣΕΛΙΔΑ ΤΟΥ ΚΕΝΤΡΟΥ ΠΕΡΙΒΑΛΛΟΝΤΙΚΗΣ ΕΚΠΑΙΔΕΥΣΗΣ ΦΙΛΙΠΠΩΝ

ΕΠΙΒΛΕΠΩΝ ΚΑΘΗΓΗΤΗΣ : Δρ Ελευθέριος Μωυσιάδης

ΣΠΟΥΔΑΣΤΡΙΕΣ : Τσιώρη Ελένη Χατζηαθανασίου Στυλιανή

ΚΑΒΑΛΑ 2012


ΤΜΗΜΑ ΒΙΟΜΗΧΑΝΙΚΗΣ ΠΛΗΡΟΦΟΡΙΚΗΣ Σελίδα 2

ΕΥΧΑΡΙΣΤΙΕΣ

Θα θέλαμε να ευχαριστήσουμε τον καθηγητή μας Δρ Ελευθέριο Μωυσιάδη για την βοήθεια του και την καθοδήγηση καθώς και για την ευκαιρία που μας έδωσε να ασχοληθούμε με τη δημιουργία της ιστοσελίδας του Κέντρου Περιβαλλοντικής Εκπαίδευσης Φιλίππων.



ΠΡΟΛΟΓΟΣ

Αντικείμενο της παρούσας πτυχιακής εργασίας είναι η κατασκευή (σχεδίαση & υλοποίηση) της ιστοσελίδας του Κέντρου Περιβαλλοντικής Εκπαίδευσης(ΚΠΕ) Φιλίππων. Η ιστοσελίδα πραγματοποιήθηκε με τη χρήση του εργαλείου ανάπτυξης ιστοσελίδων WordPress. Το WordPress είναι ένα ελεύθερο και ανοικτού κώδικα λογισμικό, το οποίο προσφέρει εύκολο και γρήγορο περιβάλλον διαχείρισης ιστοσελίδας. Παράλληλα με το εργαλείο WordPress χρησιμοποιήθηκε και το πρόγραμμα Xampp, ένα επίσης χρήσιμο βοήθημα που δίνει τη δυνατότητα σε αυτούς που το χρησιμοποιούν να κάνουν τον υπολογιστή τους ένα web server. Η κατασκευή της ιστοσελίδας έγινε σύμφωνα με τις ανάγκες και τις λειτουργίες του ΚΠΕ Φιλίππων που ασχολείται με εκπαιδευτικά προγράμματα και σεμινάρια. Παρακάτω θα παρουσιάσουμε την σελίδα για τους χρήστες καθώς και τη διαχείριση της. Θα γίνει αναφορά των εργαλείων που χρησιμοποιήθηκαν και των απαιτήσεων για τη δημιουργία της . Τέλος, αναφέρονται τα συμπεράσματα που προκύπτουν από την εργασία και οι μελλοντικές προτάσεις που συστήνονται για τη βελτίωση της ιστοσελίδας .

Η πτυχιακή συνοδεύεται από ένα cd και τα περιεχόμενα του έχουν ως εξής:

• Αρχείο pdf με την παρουσίαση της ιστοσελίδας • Κώδικας της ιστοσελίδας • Οδηγίες εγκατάστασης



Πίνακας περιεχομένων ΕΝΟΤΗΤΑ 1 : ΕΙΣΑΓΩΓΗ.............................................................................................................. 6

1.1 ΠΕΡΙΒΑΛΛΟΝΤΙΚΗ ΕΚΠΑΙΔΕΥΣΗ ...................................................................................... 6

1.2 TO ΚΕΝΤΡΟ ΠΕΡΙΒΑΛΛΟΝΤΙΚΗΣ ΕΚΠΑΙΔΕΥΣΗΣ ΦΙΛΙΠΠΩΝ ............................................. 6

1.3 ΙΣΤΟΣΕΛΙΔΑ ΚΠΕ ΦΙΛΙΠΠΩΝ ............................................................................................ 7

1.4 ΠΕΡΙΓΡΑΦΗ ΕΡΓΑΣΙΑΣ ..................................................................................................... 7

ΕΝΟΤΗΤΑ 2 : ΥΦΙΣΤΑΜΕΝΟ ΣΥΣΤΗΜΑ .................................................................................... 8

ΕΝΟΤΗΤΑ 3 : ΑΠΑΙΤΗΣΕΙΣ ....................................................................................................... 13

3.1 ΔΡΑΣΗ ΤΟΥ ΚΠΕ ΦΙΛΙΠΠΩΝ .......................................................................................... 13

3.2 ΧΡΗΣΤΕΣ ΤΗΣ ΣΕΛΙΔΑΣ ................................................................................................... 14

3.3 ΑΝΑΛΥΣΗ ΑΠΑΙΤΗΣΕΩΝ ................................................................................................. 14

ΕΝΟΤΗΤΑ 4 : ΤΕΧΝΟΛΟΓΙΕΣ ΚΑΙ ΕΡΓΑΛΕΙΑ ΑΝΑΠΤΥΞΗΣ ....................................................... 16

4.1 ΣΥΣΤΗΜΑ ΔΙΑΧΕΙΡΙΣΗΣ ΠΕΡΙΕΧΟΜΕΝΟΥ (CMS) ............................................................. 16

4.1.1 ΤΙ ΠΡΟΣΦΕΡΕΙ ΤΟ ΣΥΣΤΗΜΑ ΔΙΑΧΕΙΡΙΣΗΣ ΠΕΡΙΕΧΟΜΕΝΟΥ .................................. 16

4.1.2 CMS ΑΝΟΙΧΤΟΥ ΚΩΔΙΚΑ ......................................................................................... 16

4.1.3 ΕΠΕΚΤΑΣΗ ΔΥΝΑΤΟΤΗΤΩΝ CMS ............................................................................ 16

4.2 WORDPRESS ................................................................................................................... 17

4.3 PLUGINS ......................................................................................................................... 20

4.3.1 WP-FILEBASE .......................................................................................................... 20

4.3.2 LAZYEST GALLERY ................................................................................................... 20

4.3.3 QUFORM ................................................................................................................ 21

4.4 XAMPP ........................................................................................................................... 22

4.5 APACHE .......................................................................................................................... 23

4.6 PHP ................................................................................................................................. 23

4.7 MySQL ............................................................................................................................ 24

4.8 phpMyAdmin ................................................................................................................. 25

4.9 CSS .................................................................................................................................. 26

4.10 HTML 5 ......................................................................................................................... 26

4.11 JAVASCRIPT .................................................................................................................. 27

4.12 AJAX ............................................................................................................................. 27

4.13 JQUERY ......................................................................................................................... 28

4.14 PHOTOSHOP ................................................................................................................. 28

ΕΝΟΤΗΤΑ 5 : ΠΕΡΙΓΡΑΦΗ ΙΣΤΟΣΕΛΙΔΑΣ ................................................................................ 29

5.1 ΠΑΡΟΥΣΙΑΣΗ ΠΡΩΤΟΥ ΜΕΝΟΥ ...................................................................................... 29

5.1.1 ΑΡΧΙΚΗ .............................................................................................................. 29

5.1.2 ΚΠΕ ΦΙΛΙΠΠΩΝ .................................................................................................. 33

5.1.3 Η ΠΕΡΙΟΧΗ ΜΑΣ ................................................................................................. 36

5.1.4 ΑΝΑΚΟΙΝΩΣΕΙΣ................................................................................................... 36



5.1.5 ΕΠΙΚΟΙΝΩΝΙΑ ..................................................................................................... 37

5.2 ΠΑΡΟΥΣΙΑΣΗ ΒΑΣΙΚΟΥ ΜΕΝΟΥ ...................................................................................... 38

5.2.1 ΠΡΟΓΡΑΜΜΑΤΑ ΓΙΑ ΣΧΟΛΕΙΑ ............................................................................ 39

5.2.2 ΣΕΜΙΝΑΡΙΑ ........................................................................................................ 43

5.2.3 ΕΘΝΙΚΟ ΘΕΜΑΤΙΚΟ ΔΙΚΤΥΟ ............................................................................... 46

5.2.4 ΓΙΑ ΕΝΗΛΙΚΕΣ ΕΚΠΑΙΔΕΥΟΜΕΝΟΥΣ .................................................................. 48

5.3 ΔΙΑΧΕΙΡΙΣΗ ΚΑΙΝΟΤΟΜΩΝ ΔΡΑΣΕΩΝ ............................................................................ 49

5.4 ΔΙΑΧΕΙΡΙΣΗ ΣΕΛΙΔΑΣ....................................................................................................... 51

5.4.1 ΠΡΩΤΟ ΜΕΝΟΥ ................................................................................................. 51

5.4.2 ΒΑΣΙΚΟ ΜΕΝΟΥ ................................................................................................ 52

5.4.3 ΑΝΕΒΑΣΜΑ ΑΡΧΕΙΩΝ ΜΕ ΤΟ WP-FILEBASE ...................................................... 53

5.4.4 ΑΝΕΒΑΣΜΑ ΦΩΤΟΓΡΑΦΙΚΩΝ ΑΛΜΠΟΥΜ ΜΕ ΤΗΝ LAZYEST GALLERY ........... 55

5.4.5 ΔΗΜΙΟΥΡΓΙΑ ΑΡΘΡΩΝ ..................................................................................... 56

5.4.6 ΔΗΜΙΟΥΡΓΙΑ ΣΕΛΙΔΑΣ ...................................................................................... 58

5.4.7 ΕΛΕΓΧΟΣ ΣΧΟΛΙΩΝ ........................................................................................... 59

5.4.8 ΔΗΜΙΟΥΡΓΙΑ ΦΟΡΜΑΣ ..................................................................................... 60

5.4.9 ΔΙΑΧΕΙΡΙΣΗ ΜΕΛΩΝ ........................................................................................... 62

5.4.10 ΑΝΕΒΑΣΜΑ ΒΙΝΤΕΟ ΑΠΟ YOUTUBE .............................................................. 63

ΕΝΟΤΗΤΑ 6 : ΕΦΑΡΜΟΓΗ ..................................................................................................... 64

ΕΝΟΤΗΤΑ 7 : ΣΥΜΠΕΡΑΣΜΑΤΑ ΚΑΙ ΕΠΕΚΤΑΣΕΙΣ ................................................................... 65

ΕΝΟΤΗΤΑ 8 : ΒΙΒΛΙΟΓΡΑΦΙΑ ................................................................................................... 66

ΠΑΡΑΡΤΗΜΑ ......................................................................................................................... 67

ΕΓΚΑΤΑΣΤΑΣΗ ΠΡΟΓΡΑΜΜΑΤΩΝ ....................................................................................... 67



ΕΝΟΤΗΤΑ 1 : ΕΙΣΑΓΩΓΗ Στην πρώτη ενότητα θα κάνουμε μια εισαγωγή στην περιβαλλοντική εκπαίδευση και θα γνωρίσουμε το ΚΠΕ Φιλίππων και τη δράση του. Θα γίνει αναφορά στην υπάρχουσα ιστοσελίδα του ΚΠΕ και στην ανάγκη για νέα ιστοσελίδα.

1.1 ΠΕΡΙΒΑΛΛΟΝΤΙΚΗ ΕΚΠΑΙΔΕΥΣΗ H Περιβαλλοντική Εκπαίδευση (Π.Ε) είναι η εκπαίδευση για το περιβάλλον, η εκπαίδευση μέσα από το περιβάλλον και η εκπαίδευση για την προστασία του περιβάλλοντος. Περιβάλλον βέβαια για την Π.Ε δεν είναι μόνο το φυσικό (χλωρίδα, πανίδα, βιότοποι, οικοσυστήματα κ.λ.π.). Είναι το τεχνικό ιστορικό περιβάλλον (αρχιτεκτονική χωρών, οικισμοί, τεχνικά έργα κ.λ.π.) και το ιστορικό περιβάλλον (ιστορία τόπων, δραστηριοτήτων κ.λ.π.) και το κοινωνικό περιβάλλον (χωροταξική οργάνωση, οικονομία κ.λ.π.) Συγκεκριμένα, οι στόχοι της Π.Ε. είναι:

• Ενημέρωση: τα άτομα και οι κοινωνικές ομάδες να ενημερωθούν για το περιβάλλον και τα προβλήματά του και να ευαισθητοποιηθούν.

• Γνώση: να κατανοήσουν μέσα από εμπειρίες τα προβλήματα του περιβάλλοντος και την αλληλεπίδραση ανθρώπου - περιβάλλοντος.

• Στάσεις: να διαμορφώσουν αξίες και να αναπτύξουν το ενδιαφέρον για το περιβάλλον και διάθεση για ενεργό συμμετοχή στη βελτίωση και προστασία του.

• Δεξιότητες: να αποκτήσουν τις απαραίτητες ικανότητες για τον προσδιορισμό και την επίλυση των περιβαλλοντικών προβλημάτων.

• Συμμετοχή: να δώσει ευκαιρίες για δράση και ενεργό συμμετοχή για την επίλυση περιβαλλοντικών προβλημάτων.

Σε αυτό το πλαίσιο λειτουργεί και το ΚΠΕ Φιλίππων μέσω των εκπαιδευτικών προγραμμάτων και σεμιναρίων που δραστηριοποιούνται στην περιοχή των Φιλίππων.

1.2 ΤΟ ΚΕΝΤΡΟ ΠΕΡΙΒΑΛΛΟΝΤΙΚΗΣ ΕΚΠΑΙΔΕΥΣΗΣ ΦΙΛΙΠΠΩΝ Το ΚΠΕ Φιλίππων είναι μία εκπαιδευτική μονάδα που στοχεύει στο να αποκτήσουν οι εκπαιδευόμενοι και οι εκπαιδευόμενες νέες γνώσεις, δεξιότητες και συμπεριφορές, καθώς και να ευαισθητοποιηθούν σε θέματα που αφορούν στην προστασία του περιβάλλοντος και την αειφορική ανάπτυξη. Αυτό επιτυγχάνεται με την υλοποίηση μονοήμερων και πολυήμερων προγραμμάτων για σχολεία Πρωτοβάθμιας και Δευτεροβάθμιας Εκπαίδευσης, καθώς και με σεμινάρια εκπαιδευτικών. Το ΚΠΕ βρίσκεται στο Δημοτικό Διαμέρισμα Φιλίππων, όπου υπάρχουν το κτίριο διοίκησης και οι αίθουσες διδασκαλίας. Ακόμη, ο Δήμος Φιλίππων έχει παραχωρήσει στο ΚΠΕ αίθουσες για τις διάφορες δραστηριότητες, στους οικισμούς Αμυγδαλεώνα, Παλιάς Καβάλας και Κρηνίδων.

Κάθε χρόνο το ΚΠΕ Φιλίππων οργανώνει σεμινάρια και εκπαιδευτικά προγράμματα στα οποία παίρνουν μέρος σχολεία και ενήλικες. Για την ενημέρωση και τη σωστή λειτουργία του κέντρου, χρειάζεται μια ιστοσελίδα που θα καλύπτει τις ανάγκες αυτές. Οι ανάγκες αυτές εκτείνονται και στη συνεργασία του κέντρου με άλλα δίκτυα καθώς η υπάρχουσα ιστοσελίδα δεν ανταποκρίνεται σε αυτές.



1.3 ΙΣΤΟΣΕΛΙΔΑ ΚΠΕ ΦΙΛΙΠΠΩΝ Το ΚΠΕ Φιλίππων λειτουργεί μέχρι σήμερα με την υπάρχουσα ιστοσελίδα η οποία όμως, όπως θα δούμε και παρακάτω δεν επαρκεί. Οι ανάγκες του κέντρου διαμορφώνονται από τα εκπαιδευτικά προγράμματα, τα σεμινάρια και τη συνεργασία με τα άλλα δίκτυα. Απαραίτητη για τη διευκόλυνση της λειτουργίας του ΚΠΕ είναι η δυνατότητα on line αιτήσεων για σεμινάρια και για συμμετοχή στο εθνικό δίκτυο, κάτι που στην υπάρχουσα σελίδα δεν συμβαίνει. Επίσης σημαντική έλλειψη είναι και η απουσία χώρου στη σελίδα για επικοινωνία με την δευτεροβάθμια εκπαίδευση που είναι απαραίτητη για τα εκπαιδευτικά προγράμματα. Για την άμεση επικοινωνία των υποψήφιων εκπαιδευόμενων με το ΚΠΕ απαραίτητη είναι και η αποστολή μηνύματος μέσω της σελίδας, κάτι που επίσης λείπει από την υπάρχουσα σελίδα. Αυτές τις ελλείψεις θα καλύψουμε με τη δημιουργία της νέας ιστοσελίδας του ΚΠΕ Φιλίππων. Στη νέα σελίδα θα γίνεται άμεση ενημέρωση για τα νέα σεμινάρια, on line αιτήσεις, πρόσβαση στη σελίδα από τη δευτεροβάθμια για πιο εύκολη συνεργασία και δυνατότητα επικοινωνίας των χρηστών και των υπαλλήλων μέσω σχολίων.

1.4 ΠΕΡΙΓΡΑΦΗ ΕΡΓΑΣΙΑΣ ‘Όπως είπαμε στη νέα ιστοσελίδα του ΚΠΕ θα καλύπτονται όλες οι ανάγκες για τη σωστή λειτουργία του κέντρου. Οι ενήλικες εκπαιδευόμενοι θα μπορούν να ενημερώνονται για τα νέα σεμινάρια και να κάνουν αίτηση για αυτά , το ίδιο και οι εκπαιδευτικοί. Τα σχολεία θα μπορούν να ενημερώνονται για προγράμματα και να κάνουν αίτηση για τη συμμετοχή τους στο εθνικό δίκτυο. Για την συνεργασία του ΚΠΕ με τη δευτεροβάθμια θα υπάρχει ειδικός χώρος μέσα στη σελίδα που μόνο η δευτεροβάθμια θα έχει πρόσβαση. Με τη δομή της σελίδας γίνεται διαχωρισμός των δράσεων του ΚΠΕ και οι χρήστες θα μπορούν να δουν βίντεο και φωτογραφίες για συγκεκριμένα σεμινάρια και προγράμματα που έχουν πραγματοποιηθεί. Θα μπορούν επίσης να μοιραστούν τις εμπειρίες τους μέσω των σχολίων σχετικά με τα άρθρα και να κατεβάσουν βιβλία από τη βιβλιοθήκη της σελίδας ή να ενημερωθούν για τα βιβλία του ΚΠΕ που είναι διαθέσιμα για δανεισμό. Σκοπός της πτυχιακής είναι η ανάπτυξη της νέας και ανανεωμένης ιστοσελίδας του ΚΠΕ Φιλίππων που θα ανταποκρίνεται στις ανάγκες του κέντρου με βάση τα εκπαιδευτικά προγράμματα, τα σεμινάρια και το Εθνικό Δίκτυο των κέντρων περιβαλλοντικής εκπαίδευσης. Στόχος δεν είναι μόνο η σωστή λειτουργία της σελίδας για τον επισκέπτη αλλά και η εύχρηστη διαχείριση της.



ΕΝΟΤΗΤΑ 2 : ΥΦΙΣΤΑΜΕΝΟ ΣΥΣΤΗΜΑ Σε αυτή την ενότητα θα δούμε την υπάρχουσα μέχρι πρότινος ιστοσελίδα του ΚΠΕ που εξυπηρετούσε τις ανάγκες του κέντρου με πολλές ελλείψεις όμως. Σε αυτή τη σελίδα υπάρχει ένα μενού το οποίο διαμορφώνεται ως εξής:

• Αρχική

Εικόνα 1 : αρχική σελίδα υπάρχουσας ιστοσελίδας ΚΠΕ

Όπως φαίνεται στην εικόνα 1, στην αρχική σελίδα της υπάρχουσας ιστοσελίδας, στο βασικό μέρος της σελίδας υπάρχουν κάποιες ανακοινώσεις σχετικά με διάφορες δράσεις του κέντρου χωρίς να συνδέονται μεταξύ τους. Οι δράσεις αυτές χωρίζονται χωρίς ιδιαίτερη λεπτομέρεια στην αριστερή μπάρα όπου είναι και το μενού της σελίδας. Στη δεξιά μπάρα υπάρχει μία φόρμα εγγραφής στη σελίδα η οποία όμως δεν προσφέρει κάποιο ιδιαίτερο προνόμιο στον εγγεγραμμένο χρήστη.



• Εκπαιδευτικά βίντεο

Εικόνα 2 : σελίδα προβολής βίντεο υπάρχουσας ιστοσελίδας ΚΠΕ

Συνεχίζοντας, όπως βλέπουμε στη εικόνα 2, στη σελίδα που προβάλλονται τα βίντεο βρίσκονται τυχαία βίντεο από οποιαδήποτε δραστηριότητα του ΚΠΕ χωρίς να υπάρχει κάποιος διαχωρισμός.

• Εργασίες σχολείων

εικόνα 3 : εργασίες σχολείων από την υπάρχουσα σελίδα

Στις εργασίες σχολείων υπάρχουν εργασίες από διάφορες δραστηριότητες του ΚΠΕ, ανακοινώσεις και φωτογραφίες από παλαιότερες εργασίες , όπως βλέπουμε στην εικόνα 3.



• Ανακοινώσεις για εκπαιδευτικούς

Εικόνα 4 : ανακοινώσεις για εκπαιδευτικούς από υπάρχουσα σελίδα ΚΠΕ

Όπως βλέπουμε και στην εικόνα 4 οι ανακοινώσεις που υπάρχουν στη σελίδα είναι μόνο ανακοινώσεις για εκπαιδευτικούς και δεν υπάρχουν άλλες ανακοινώσεις. Αυτό δυσκολεύει τη λειτουργία του ΚΠΕ και θα πρέπει να υπάρχει ένας χώρος ανακοινώσεων στη σελίδα και όχι μόνο για εκπαιδευτικούς.

• Περιοχή Δήμου Φιλίππων

Εικόνα 5: παρουσίαση περιοχής Φιλίππων από υπάρχουσα ιστοσελίδα ΚΠΕ

Με την επιλογή ‘Η περιοχή των Φιλίππων’ παρουσιάζεται ένας γεωγραφικός χάρτης, σύμφωνα με την εικόνα 5, με τον οποίο ο χρήστης δεν ενημερώνεται με λεπτομέρεια για την περιοχή παρά μόνο για την ευρύτερη περιοχή των Φιλίππων.



• Προγράμματα του ΚΠΕ

Εικόνα 6 : προγράμματα ΚΠΕ από υπάρχουσα σελίδα

Όπως βλέπουμε στην εικόνα 6 υπάρχει μόνο μια επιλογή για τα προγράμματα του ΚΠΕ χωρίς να γίνεται κανένας διαχωρισμός, αυτό δεν διευκολύνει καθόλου τους χρήστες.

• Νέα για τους μικρούς μας φίλους

Εικόνα 7: ‘νέα για τους μικρούς μας φίλους’ από υπάρχουσα σελίδα ΚΠΕ

Για τους μαθητές υπάρχει μόνο μια σελίδα όπου από εκεί μόνο μπορούν να δουν και να παίξουν παιχνίδια, όπως βλέπουμε και στην εικόνα 7.



• Δίκτυα και συνεργασίες

Εικόνα 8 : Δίκτυα και συνεργασίες από υπάρχουσα σελίδα ΚΠΕ

Η συνεργασία του ΚΠΕ Φιλίππων με άλλα δίκτυα είναι ένα πολύ σημαντικό κομμάτι των δραστηριοτήτων του ΚΠΕ, στην υπάρχουσα σελίδα, όπως βλέπουμε και στην εικόνα 8, υπάρχουν διάχυτες πληροφορίες για τα δίκτυα που δεν προσφέρουν επαρκή ενημέρωση και σε κάποιες περιπτώσεις ίσως κουράζουν. Όπως λοιπόν είδαμε στην ενότητα 2 η ιστοσελίδα που εξυπηρετούσε μέχρι πρότινος το ΚΠΕ Φιλίππων δεν μπορεί πια να ανταπεξέλθει στις ανάγκες του ΚΠΕ. Οι δράσεις του κέντρου έχουν αναπτυχθεί και η επικοινωνία των εκπαιδευόμενων και των υπαλλήλων μέσω του internet είναι απαραίτητη.



ΕΝΟΤΗΤΑ 3 : ΑΠΑΙΤΗΣΕΙΣ Σε αυτή την ενότητα θα γίνει μια πιο λεπτομερής περιγραφή του ΚΠΕ Φιλίππων και των δράσεων του από όπου θα προκύψουν και οι απαιτήσεις. Θα γίνει ανάλυση των απαιτήσεων με βάση τους χρήστες της σελίδας.

3.1 ΔΡΑΣΗ ΤΟΥ ΚΠΕ ΦΙΛΙΠΠΩΝ Όπως είπαμε και στην ενότητα 1.2 το ΚΠΕ Φιλίππων είναι μια εκπαιδευτική μονάδα που διοργανώνει σεμινάρια και συμμετέχει σε εκπαιδευτικά προγράμματα της δευτεροβάθμιας αλλά τώρα πια και της πρωτοβάθμια εκπαίδευσης. Υπάρχει άμεση επικοινωνία του ΚΠΕ με τη δευτεροβάθμια για την οργάνωση των εκπαιδευτικών προγραμμάτων και επικοινωνία με τους εκπαιδευόμενους για την υλοποίηση των σεμιναρίων. Το ΚΠΕ Φιλίππων από την έναρξη της λειτουργίας του συνεργάζεται με φορείς τόσο σε τοπικό, όσο και σε εθνικό και ευρωπαϊκό επίπεδο. Το ΚΠΕ έχει στενή συνεργασία με την τοπική αυτοδιοίκηση και τοπικούς πολιτιστικούς συλλόγους που δραστηριοποιούνται σε οικισμούς της περιοχής των Φιλίππων για την κάλυψη των εκπαιδευτικών αναγκών των κατοίκων. Για πιο εξειδικευμένες ανάγκες επιμόρφωσης συγκεκριμένων ομάδων πληθυσμού του ΚΠΕ συνεργάζεται επίσης με άλλα ΚΠΕ σε όλη την Ελλάδα και με εθνικούς φορείς όπως περιβαλλοντικές μη κυβερνητικές οργανώσεις. Επίσης το ΚΠΕ Φιλίππων έχει συνεργαστεί με φορείς του εξωτερικού για την υλοποίηση επιμορφωτικών προγραμμάτων που αφορούν την υπαίθρια περιβαλλοντική εκπαίδευση, τη διαπολιτισμική εκπαίδευση και την εκπαίδευση ενηλίκων. Για τα σχολικά έτη 2009-2012 αποφάσισε το Υπουργείο Παιδείας δια βίου μάθησης και θρησκευμάτων την ίδρυση και λειτουργία του εθνικού θεματικού δικτύου «μαθαίνω για το περιβάλλον παίζοντας». Οι σκοποί του εθνικού δικτύου είναι :

• Η γνωριμία και επαφή των εκπαιδευτικών με το παιχνίδι και τους τρόπους που αυτό μπορεί να εφαρμοστεί στην περιβαλλοντική εκπαίδευση, στον ρόλο και τους σκοπούς της

• Η ανάπτυξη της συνεργατικότητας και του ομαδικού πνεύματος μέσα από το παιχνίδι.

• Κατανόηση της έννοιας «ολιστική θεώρηση» (το περιβάλλον ως όλον – που εκτός των άλλων περιλαμβάνει το πολιτιστικό και αισθητικό), καθώς και της αναγκαιότητας ένταξής της στην περιβαλλοντική εκπαίδευση μέσω του παιχνιδιού.

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

• Η ανάπτυξη της επικοινωνίας μεταξύ των σχολικών μονάδων • Η καλλιέργεια αξιών στους νέους, που θα συμβάλει στην ανάπτυξη θετικών

στάσεων και συμμετοχικών συμπεριφορών και τη διαμόρφωση μελλοντικής υπεύθυνης στάσης ενεργού πολίτη για την προστασία της οικολογικής ισορροπίας.

Η συνεργασία του ΚΠΕ Φιλίππων με εξωτερικούς φορείς και η συμμετοχή του στο Εθνικό Θεματικό Δίκτυο πρέπει να υποστηρίζονται από την ιστοσελίδα.



3.2 ΟΙ ΧΡΗΣΤΕΣ ΤΗΣ ΣΕΛΙΔΑΣ Οι χρήστες της σελίδας θα είναι τρεις:

1. Επισκέπτης Ο επισκέπτης είναι οποιοσδήποτε χρήστης του διαδικτύου που θα επισκεφθεί τη σελίδα και θα έχει δικαιώματα απλού χρήστη χωρίς να χρειάζεται να εγγραφεί στη σελίδα. Θα μπορεί να κάνει σχόλια στα άρθρα και να κατεβάσει υλικό από τη σελίδα. 2. Υπεύθυνος καινοτόμων δράσεων Ο υπεύθυνος καινοτόμων δράσεων είναι ένας υπάλληλος από την δευτεροβάθμια εκπαίδευση ο οποίος θα μπορεί να συμπληρώνει μια φόρμα για το κάθε σχολείο που έχει εγκριθεί να επισκεφθεί το ΚΠΕ Φιλίππων . Για να συμπληρώσει αυτή τη φόρμα θα κάνει εισαγωγή σε ένα τμήμα της σελίδας που έχει δημιουργηθεί για αυτό το σκοπό. Παράλληλα μπορεί να λειτουργεί και ως απλός χρήστης. 3. Διαχειριστής Ο διαχειριστής θα είναι ο μόνος που θα μπορεί να κάνει εισαγωγή στο σύστημα διαχείρισης της σελίδας και να ανανεώσει τη σελίδα πλήρως καθώς και να κάνει έλεγχο των σχολίων και να τα διαχειριστεί.

3.3 ΑΝΑΛΥΣΗ ΑΠΑΙΤΗΣΕΩΝ Μελετώντας τη λειτουργία και τις ανάγκες του ΚΠΕ Φιλίππων, σε συνεργασία με τους υπαλλήλους προέκυψαν οι απαιτήσεις για τη σωστή λειτουργία της σελίδας. 1.ΕΠΙΣΚΕΠΤΗΣ Ø Ενημερώνεται για τα εκπαιδευτικά προγράμματα: Ο επισκέπτης μπορεί να ενημερωθεί για τα προγράμματα που θα ξεκινήσουν και για αυτά που έχουν ήδη πραγματοποιηθεί μέσω άρθρων, βίντεο και άλμπουμ φωτογραφιών. Ø Ενημερώνεται για τα σεμινάρια :

Αντίστοιχα με τα προγράμματα ενημερώνονται και οι εκπαιδευόμενοι για τα σεμινάρια. Ø Βλέπει το εκπαιδευτικό υλικό:

Μπορεί να δει το εκπαιδευτικό υλικό όπως φωτογραφίες, βίντεο και άλλα αρχεία από σεμινάρια η προγράμματα, όπως pdf,word.

Ø Κατεβάζει εκπαιδευτικό υλικό: Το υλικό που μπορεί να κατεβάσει από τη σελίδα είναι τα βιβλία της βιβλιοθήκης του εθνικού δικτύου άλλα και επιλεγμένα αρχεία από σεμινάρια η προγραμματα.

Ø Σχολιάζει άρθρα: Μπορεί να σχολιάσει τα άρθρα που εμφανίζονται στη σελίδα και να δει τα σχόλια άλλων επισκεπτών καθώς και του διαχειριστή.

Ø Κάνει αίτηση για συμμετοχή σε σεμινάριο: Ο ενδιαφερόμενος εκπαιδευόμενος αφού ενημερωθεί για τα σεμινάρια να κάνει αίτηση για παρακολούθηση μέσω της φόρμας ‘αίτηση οn line’.

Ø Βλέπει τα αποτελέσματα των αιτήσεων για τα σεμινάρια : Για τα αποτελέσματα των αιτήσεων ενημερώνεται από τη σελίδα ‘αποτελέσματα’ μέσω του menu item ‘Για ενήλικες εκπαιδευόμενους’.

Ø Στέλνει μήνυμα μέσω της φόρμας επικοινωνίας: Για να επικοινωνήσει με το ΚΠΕ Φιλίππων μπορεί να στείλει μήνυμα από τη φόρμα επικοινωνίας , το μήνυμα θα σταλεί στον διαχειριστή.



2.ΥΠΕΥΘΥΝΟΣ ΚΑΙΝΟΤΟΜΩΝ ΔΡΑΣΕΩΝ

Ø Κάνει εισαγωγή (login): Στο menu item ‘ΓΙΑ ΥΠΕΥΘΥΝΟΥΣ ΚΑΙΝΟΤΟΜΩΝ ΔΡΑΣΕΩΝ’ → ’ΦΟΡΜΑ’ κάνει login ο χρήστης καινοτόμων δράσεων. Ο χρήστης αυτός είναι κάποιος υπάλληλος της δευτεροβάθμιας που θα αναλάβει να ενημερώνει το ΚΠΕ για τα σχολεία που εγκρίθηκαν για συμμετοχή σε κάποιο από τα εκπαιδευτικά προγράμματα.

Ø Συμπληρώνει τη φόρμα: Για την ενημέρωση του ΚΠΕ ο χρήστης χρησιμοποιεί τη φόρμα από το μενού ‘ για υπευθύνους καινοτόμων δράσεων’ με τα σχολεία που έχουν εγκριθεί για συμμετοχή στα προγράμματα το ΚΠΕ.

3.ΔΙΑΧΕΙΡΙΣΤΗΣ

Ø Κάνει εισαγωγή (login) στο σύστημα διαχείρισης: Ο διαχειριστής είναι ο μόνος που μπορεί να κάνει login στο σύστημα διαχείρισης.

Ø Ανεβάζει νέα άρθρα και διαγράφει τα παλαιά: Ανανεώνει τη σελίδα ανεβάζοντας νέα άρθρα και διαγράφοντας τα παλιά. Τα άρθρα αυτά τα ανεβάζει σε όποια σελίδα θέλει και ελέγχει ποια θέλει να εμφανίζονται στη και στην αρχική σελίδα.

Ø Δημιουργεί νέες σελίδες: Μπορεί να δημιουργήσει νέες σελίδες και να τις ανεβάσει και να τις συνδέσει στο μενού.

Ø Ελέγχει τα σχόλια και σχολιάζει στα άρθρα: Βασικός ρόλος του διαχειριστή είναι ο έλεγχος των άρθρων. Για να εμφανιστεί ένα άρθρο στη σελίδα πρέπει πρώτα να το ελέγξει ο διαχειριστής και αν θέλει να απαντήσει σε αυτό.

Ø Δημιουργεί νέες φόρμες και ελέγχει τα νέα μηνύματα: Μπορεί να δημιουργήσει νέες φόρμες για νέα σεμινάρια η και γενικότερα και να τις συνδέσει σε κάποιο άρθρο ή σελίδα. Τα αποτελέσματα τους μπορεί να ελέγχει μέσω της διαχείρισης.

Ø Προσθέτει και διαγράφει μέλη: Εάν το θεωρήσει απαραίτητο ο διαχειριστής μπορεί να προσθέσει μέλη στη σελίδα , κυρίως συνδρομητές με λίγες δυνατότητες. Μπορεί ακόμα να προσθέσει και διαχειριστή κάτι το οποίο δεν συστήνεται.

Ø Ανανεώνει το μενού: Μπορεί να διαγράψει αντικείμενα από το μενού και να προσθέσει νέα.

Ø Ανεβάζει υλικό: Είναι ο μόνος που μπορεί να ανεβάσει υλικό στη σελίδα. Το υλικό αποτελείται από φωτογραφίες, βίντεο και άλλα αρχεία (pdf , word).



ΕΝΟΤΗΤΑ 4 : ΤΕΧΝΟΛΟΓΙΕΣ ΚΑΙ ΕΡΓΑΛΕΙΑ ΑΝΑΠΤΥΞΗΣ Σε αυτή την ενότητα θα δούμε τα εργαλεία που χρησιμοποιήσαμε για τη δημιουργία της ιστοσελίδας και τις τεχνολογίες που ήταν απαραίτητες για την ολοκλήρωση της (βλ. βιβλιογραφία [9].

4.1 ΣΥΣΤΗΜΑ ΔΙΑΧΕΙΡΙΣΗΣ ΠΕΡΙΕΧΟΜΕΝΟΥ (CMS) Το Content Management System (CMS) είναι μία μορφή λογισμικού για ηλεκτρονικούς υπολογιστές, που αυτοματοποιεί τις διαδικασίες δημιουργίας, οργάνωσης, ελέγχου και δημοσίευσης περιεχομένου σε μία πληθώρα μορφών. Τα περισσότερα CMS έχουν την δυνατότητα να διαχειριστούν περιεχόμενο στις εξής μορφές: κείμενα, εικόνες, βίντεο, java animation, πρότυπα σχεδίασης, βάσεις δεδομένων κ.α.

4.1.1 Τί προσφέρει το Σύστημα Διαχείρισης Περιεχομένου

To Σύστημα Διαχείρισης Περιεχομένου προσφέρει γραφικό περιβάλλον το οποίο δίνει άμεση πρόσβαση στο περιεχόμενο της ιστοσελίδας. Επιπρόσθετα, η τροποποίηση ή προσθήκη του περιεχομένου (κειμένου και φωτογραφιών) μπορεί να γίνει με έναν γραφικό editor όμοιο με αυτόν που χρησιμοποιείται στους επεξεργαστές κειμένου. Η πληροφορία οργανώνεται αποδοτικά σε κατηγορίες και υποκατηγορίες και παρουσιάζεται με τρόπο φιλικό στο χρήστη αλλά και στο διαχειριστή.

4.1.2 CMS ανοικτού κώδικα

Στα προϊόντα ανοικτού κώδικα επιτρέπεται η πρόσβαση και η αλλαγή του πηγαίου κώδικα. Η εφαρμογή στις περισσότερες περιπτώσεις βρίσκεται ολόκληρη στο διαδίκτυο και ο ενδιαφερόμενος μπορεί να την αποκτήσει εύκολα, γρήγορα και κυρίως με μηδενικό κόστος. Ακόμα έχει την δυνατότητα να την δοκιμάσει πριν την αποκτήσει. Μερικές δημοφιλής εφαρμογές ανοικτού κώδικα είναι οι εξής: Wordpress, Joomla, Drupal.

4.1.3 Επέκταση των δυνατότητων του Συστήµατος ∆ιαχείρισης Περιεχοµένου

Το Σύστηµα ∆ιαχείρισης Περιεχοµένου αξιοποιεί τις αρχές του αντικειµενοστραφούς προγραµµατισµού και προσφέρει µια σειρά από αρθρώµατα (modules) και συνοδευτικά λογισµικά (plugins) τα οποία παρέχουν µια τεράστια ποικιλία λειτουργικότητας. Παράλληλα, η κοινότητα που ασχολείται µε αυτό προσφέρει συνεχώς καινούργιες λύσεις που καλύπτουν σηµαντικό µέρος των αναγκών που υπάρχουν.



4.2 WORDPRESS

Για τη δημιουργία του ιστοχώρου χρησιμοποιήθηκε το σύστημα διαχείρισης περιεχομένου wordpress. Το WordPress είναι ελεύθερο και ανοιχτού κώδικα λογισμικό ιστολογίου και πλατφόρμα δημοσιεύσεων, γραμμένο σε PHP και MYSQL. Έχει πολλές δυνατότητες, συμπεριλαμβανομένων μιας αρχιτεκτονικής για πρόσθετες λειτουργίες, και ενός συστήματος προτύπων. Το WordPress χρησιμοποιείται σε περισσότερα από το 14% των 1.000.000 μεγαλύτερων ιστότοπων. Κυκλοφόρησε για πρώτη φορά στις 27 Μαΐου 2003, από τον Matt Mullenweg ως παραλλαγή του b2/cafelog. Από τον Φεβρουάριο του 2011, η έκδοση 3.0 έχει ληφθεί περισσότερες από 32,5 εκατομμύρια φορές. Το WordPress έχει ένα σύστημα προτύπων ιστού το οποίο χρησιμοποιεί έναν επεξεργαστή προτύπων. Οι χρήστες του μπορούν να αλλάζουν τη θέση διαφόρων στοιχείων του γραφικού περιβάλλοντος χωρίς να χρειάζεται να επεξεργάζονται κώδικα PHP ή HTML. Μπορούν επίσης να εγκαθιστούν και να αλλάζουν μεταξύ διαφόρων οπτικών θεμάτων. Μπορούν ακόμα να επεξεργαστούν τον κώδικα PHP και HTML στα οπτικά θέματα, προκειμένου να επιτύχουν προχωρημένες τροποποιήσεις.

http://el.wikipedia.org/wiki/%CE%93%CF%81%CE%B1%CF%86%CE%B9%CE%BA%CF%8C_%CE%A0%CE%B5%CF%81%CE%B9%CE%B2%CE%AC%CE%BB%CE%BB%CE%BF%CE%BD_%CE%A7%CF%81%CE%AE%CF%83%CF%84%CE%B7

http://el.wikipedia.org/wiki/PHP

http://el.wikipedia.org/wiki/HTML



Εικόνα 8: wordpress hieracly



Το WordPress έχει επίσης δυνατότητα ενσωματωμένης διαχείρισης συνδέσμων, μόνιμους συνδέσμους οι οποίοι είναι φιλικοί προς τις μηχανές αναζήτησης, δυνατότητα ανάθεσης πολλαπλών κατηγοριών και υποκατηγοριών στα άρθρα, και υποστήριξη για ετικέτες στα άρθρα και τις σελίδες. Συμπεριλαμβάνονται επίσης αυτόματα φίλτρα, τα οποία παρέχουν προτυποποιημένη μορφοποίηση του κειμένου (για παράδειγμα μετατροπή των διπλών εισαγωγικών σε «έξυπνα» εισαγωγικά (δηλαδή " " σε “ ”). Το WordPress υποστηρίζει επίσης τα πρότυπα Trackback και Pingback για προβολή συνδέσμων προς άλλους ιστότοπους, οι οποίοι με τη σειρά τους έχουν συνδέσμους προς μια δημοσίευση ή άρθρο. Τέλος, το WordPress έχει μια πλούσια αρχιτεκτονική πρόσθετων λειτουργιών, η οποία επιτρέπει στους χρήστες καιστους προγραμματιστές να επεκτείνουν τη λειτουργικότητά του πέρα από τις δυνατότητες οι οποίες αποτελούν μέρος της βασικής εγκατάστασης. Σε κάθε ιστοσελίδα που δημιουργείται υπάρχει το αποτέλεσμα που παράγεται και αποτελεί αυτό που μπορεί ο καθένας να δει γράφοντας τη διεύθυνση του site, και ένας «χώρος» για τον διαχειριστή της ιστοσελίδας, όπου μπορεί να ασχοληθεί με την εμφάνιση της σελίδας, να γράψει άρθρα, να δημιουργήσει κατηγορίες και συνδέσμους και γενικά να καθορίσει (προσθέσει, αφαιρέσει, τροποποιήσει) το υλικό του ανάλογα με τον τρόπο που τον βολεύει. Αυτός ο δικτυακός «χώρος» φυσικά προστατεύεται με κάποιον κώδικο που τον γνωρίζει μονάχα ο διαχειριστής της ιστοσελίδας, κάτι απόλυτα λογικό για την ασφάλεια της ιστοσελίδας. Η εγκατάσταση του WordPress είναι μια πολύ εύκολη διαδικασία. Αφού κατεβάσουμε τα απαραίτητα αρχεία από την ιστοσελίδα ακολουθούμε τις οδηγίες και είτε το ανεβάζουμε στο διαδίκτυο μέσω ftp στον απομακρυσμένο server είτε το τοποθετούμε τοπικά στον υπολογιστή μας (αν θέλουμε να δουλέψουμε κάποια πράγματα πριν τα ανεβάσουμε στο internet) χρησιμοποιώντας κάποιο κατάλληλο πρόγραμμα που συνδυάζει Php, MySql και Apache HTTP Server (όπως το δημοφιλές Xampp). Στο τέλος του κειμένου αυτού υπάρχει ένα τμήμα με χρήσιμους συνδέσμους για περισσότερες πληροφορίες.



4.3 PLUGINS Τα plugins είναι έτοιμα κομμάτια κώδικα που ενσωματώνονται στη σελίδα μας και προσφέρουν κάποιες έτοιμες λειτουργίες. Συνοδεύονται με κάποια περιγραφή για να ξέρουμε τι ακριβώς κάνουν και ενεργοποιούνται με το activate. Μπορεί κανείς να κατεβάσει free plugins από το διαδίκτυο. Στη δική μας σελίδα χρησιμοποιήθηκαν ως plugins το wp-filebase για τη μεταφορά αρχείων, η Lazyest gallery για συλλογή φωτογραφιών και η Quform για τη δημιουργία φόρμας.

4.3.1 WP-FILEBASE Το wp-filebase είναι ένα σύστημα διαχείρισης αρχείων για το wordpress. Τακτοποιεί και κρατά τα αρχεία σε φακέλους , δημιουργείται λίστα αρχείων και χωρίζονται σε κατηγορίες. Δίνει τη δυνατότητα στο χρήστη να κατεβάσει τα αρχεία. Με το wp-filebase μπορούμε § Να δημιουργήσουμε δυναμικές λίστες αρχείων § Να δημιουργήσουμε gallery φωτογραφιών § Να προσθέσουμε flash video § Να ανεβάσουμε mp3 και άλλα αρχεία ήχου 4.3.2 LAZYEST GALLERY

Εικόνα 9: laziest Gallery

Με την lazyest gallery, όπως βλέπουμε και στην εικόνα 9,μπορούμε να δημιουργήσουμε γκαλερί με φακέλους, υποφακέλους, σελίδες ,μικρογραφίες και παρουσιάσεις. Μπορούμε να ταξινομήσουμε τις φωτογραφίες σε φακέλους και να προσθέσουμε λεζάντες, σχόλια και περιγραφές.



4.3.3 QUFORM Με την quform μπορούμε να δημιουργήσουμε πολλαπλές φόρμες με όποια στοιχεία θέλουμε. Είναι εύκολη στη διαχείριση και ο διαχειριστής μπορεί να επιλέξει , ανάλογα με τη φόρμα , τα αποτελέσματα να στέλνονται είτε στο email του είτε στις εισαγωγές(entries).

Εικόνα 10: δημιουργία φόρμας με quform

Σύμφωνα με την εικόνα 10 , με drag and drop κάνουμε εισαγωγή των αντικειμένων στη φόρμα και μετά τα διαχειριζόμαστε. Αφού δημιουργηθεί η φόρμα την αποθηκεύουμε και η εισαγωγή της στη σελίδα γίνεται κατά τη δημιουργία σελίδας ή άρθρου.



4.4 XAMPP

Το XAMPP δρα σαν ένας ελεύθερος web server ικανός να εξυπηρετήσει δυναμικές ιστοσελίδες. Είναι διαθέσιμο για Microsoft Windows, Linux, Solaris και Mac OS X,και χρησιμοποιείται κυρίως για web development projects. To λογισμικό αυτό είναι χρήσιμο όταν δημιουργούμε δυναμικές ιστοσελίδες με jsp και servlet. Μπορούμε να το βρούμε σε μορφή zip tar ή exe για να το κατεβάσουμε και να το εγκαταστήσουμε. Αναβαθμίζεται συχνά για να υποστηρίξει τις τελευταίες εκδόσεις των Apache/MySQL/PHP και Perl. Η εγκατάσταση του ΧΑΜPP παίρνει λιγότερο χρόνο από ότι θα έπαιρνε αν εγκαταστήσουμε κάθε ένα από τα πακέτα ξεχωριστά. Είναι ανεξάρτητο και μπορεί να λειτουργήσουν πολλές εγκαταστάσεις του στον ίδιο υπολογιστή. Αρχικά οι δημιουργοί του ΧΑΜPP το σχεδίασαν σαν εργαλειο ανάπτυξης για web designers και προγραμματιστές να ελέγξουν τη δουλειά τους στο δικό τους Pc χωρίς να χρειάζεται να έχουν πρόσβαση στο internet. Παρακάτω στην εικόνα 11 βλέπουμε τον πίνακα ελέγχου του xampp με τον οποίο κάνουμε εκκίνηση των apache και MySql.

Εικόνα 11: control panel xampp



4.5 APACHE Ο Apache HTTP server, συχνά αναφερόμενος απλά σαν Apache, είναι ένας web server o οποίος διαδραμάτισε καίριο ρόλο στην αρχική ανάπτυξη του παγκόσμιου ιστού. Ο Apache αναπτύσσεται και συντηρείται από μια ανοικτή κοινότητα προγραμματιστών υπό την αιγίδα του Apache Software Foundation. Η εφαρμογή είναι διαθέσιμη για μια μεγάλη ποικιλία λειτουργικών συστημάτων στα οποία περιλαμβάνονται τα Unix, GNU, FreeBSD, Linux, Solaris, Novell NetWare, Mac OS X, Microsoft Windows, OS/2, TPF και eComStation. Ο Apache χαρακτηρίζεται ως ένα λογισμικό ανοικτού κώδικα. Από τον Απρίλιο του 1996 και μετά, ο Apache είναι ο πιο δημοφιλής HTTP server του διαδικτύου. Επίσης μετά από μέτρηση που πραγματοποιήθηκε τον Αύγουστο του 2009, ο Apache εξυπηρετεί το 54,32% όλων των σελίδων του διαδικτύου και το 66% από τις 1.000.000 πιο δημοφιλείς.

4.6 PHP Η PHP είναι μια γλώσσα προγραμματισμού που σχεδιάστηκε για τη δημιουργία δυναμικών σελίδων στο διαδίκτυο και είναι επισήμως γνωστή ως: HyperText preprocessor. Είναι μια server-side (εκτελείται στον διακομιστή) scripting γλώσσα που γράφεται συνήθως πλαισιωμένη από HTML, για μορφοποίηση των αποτελεσμάτων. Αντίθετα από μια συνηθισμένη HTML σελίδα η σελίδα PHP δεν στέλνεται άμεσα σε έναν πελάτη (client), άντ’ αυτού πρώτα αναλύεται και μετά αποστέλλεται το παραγόμενο αποτέλεσμα, όπως φαίνεται και στην εικόνα 12.Τα στοιχεία HTML στον πηγαίο κώδικα μένουν ως έχουν, αλλά ο PHP κώδικας ερμηνεύεται και εκτελείται. Ο κώδικας PHP μπορεί να θέσει ερωτήματα σε βάσεις δεδομένων, να δημιουργήσει εικόνες, να διαβάσει και να γράψει αρχεία, να συνδεθεί με απομακρυσμένους υπολογιστές , κ.ο.κ. Σε γενικές γραμμές οι δυνατότητες που μας δίνει είναι απεριόριστες.

Εικόνα 12: σχεδιασμός λειτουργίας PHP



Η PHP χρησιμοποιεί μια μίξη από διερμήνευση (interpretation) και μεταγλώττιση (compilation) έτσι ώστε να μπορέσει να δώσει στους προγραμματιστές τον καλύτερο δυνατό συνδυασμό απόδοσης και ευελιξίας. Στο παρασκήνιο, η PHP μεταγλωττίζει το script σε μια σειρά από εντολές (instructions), που είναι γνωστές με τον όρο opcodes, οι οποίες εντολές εκτελούνται μία-μία μέχρι να τελειώσει το script. Αυτό είναι κάτι διαφορετικό από τις παραδοσιακές γλώσσες που μεταγλωττίζονται, όπως είναι η C++, όπου ο κώδικας μεταγλωττίζεται σε εκτελέσιμο κώδικα μηχανής, ενώ η PHP μεταγλωττίζει εκ νέου το script κάθε φορά που αυτό απαιτείται. Αυτή η συνεχής μεταγλώττιση μπορεί να φαίνεται ως απώλεια χρόνου, αλλά δεν είναι καθόλου κακή καθώς δεν χρειάζεται να κάνουμε συνέχεια εμείς τη μεταγλώττιση των scripts όταν γίνονται κάποιες αλλαγές σ’ αυτά.

4.7 MySQL

Η MySQL είναι ένα σύστημα διαχείρισης σχεσιακών βάσεων δεδομένων (RDBMS) το οποίο μετρά περισσότερες από 11 εκατομμύρια εγκαταστάσεις. Το πρόγραμμα τρέχει έναν εξυπηρετητή (server) παρέχοντας πρόσβαση πολλών χρηστών σε ένα σύνολο βάσεων δεδομένων. Η βάση δεδομένων MySQL έχει γίνει η πιο δημοφιλής βάση δεδομένων ανοιχτού λογισμικού εξαιτίας της σταθερά υψηλής απόδοσής της, της αξιοπιστίας της και της ευκολίας της χρήσης της. Χρησιμοποιείται παγκοσμίως τόσο από μεμονωμένους δημιουργούς διαδικτυακών χώρων όσο και από πολλούς από τους μεγαλύτερους και τους πιο ραγδαία αναπτυσσόμενους οργανισμούς για την εξοικονόμηση χρόνου και χρήματος. Επίσης, χρησιμοποιείται για τη δημιουργία διαδικτυακών χώρων με μεγάλο όγκο δεδομένων, κρίσιμων συστημάτων για τη λειτουργία εταιρικών εφαρμογών και πακέτων λογισμικού μεγάλων εταιρειών. Η MySQL δεν είναι μόνο η πιο δημοφιλής βάση δεδομένων ανοιχτού λογισμικού, αλλά συγχρόνως έχει γίνει και η επιλεγμένη βάση δεδομένων για τη νέα γενιά εφαρμογών που βασίζεται στο LAMP (Linux, Apache, MySQL, PHP/Perl/Python). Η MySQL τρέχει σε περισσότερες από 20 πλατφόρμες συμπεριλαμβανομένων του Linux, τωνWindows, του OS/X, του HP-UX, του AIX και του Netware, παρέχοντας στο χρήστη όλη την απαιτούμενη ευελιξία. Η MySQL είναι γραμμένη σε C και C++. Με τη βοήθεια της PHP μπορούμε να συνδεθούμε σε έναν οποιοδήποτε MySQL Server στον οποίο έχουμε λογαριασμό, να πάρουμε δεδομένα από ήδη υπάρχουσες βάσεις, να εισάγουμε δεδομένα σε πίνακες βάσεων, να ανανεώσουμε κάποια υπάρχοντα δεδομένα, να φτιάξουμε νέες βάσεις και νέους πίνακες και γενικά να κάνουμε οτιδήποτε γίνεται με μια MySQL βάση δεδομένων.



4.8 phpMyAdmin

Το phpMyAdmin είναι ένα σύνολο από php scripts με το οποίο διαχειριζόμαστε τις βάσεις δεδομένων που έχουμε μέσο web. Το phpMyAdmin μπορεί να διαχειριστεί ένα ολόκληρο mysql server ή ακόμα και απλές βάσεις δεδομένων όπου ο κάθε χρήστης έχει ένα λογαριασμό και μπορεί να δημιουργήσει και να διαχειριστεί τις δικές του βάσεις δεδομένων. Υποστηρίζει 47 γλώσσες μεταξύ των οποίων και τα Ελληνικά και είναι λογισμικό ανοιχτού κώδικα. Οι δυνατότητες του PhpMyAdmin είναι οι εξής:

• Δημιουργεί και να διαγράφει βάσεις δεδομένων. • Δημιουργεί, τροποποιεί, διαγράφει, αντιγράφει και μετονομάζει πίνακες. • Κάνει συντήρηση της βάσης. • Προσθέτει, διαγράφει και τροποποιεί πεδία πινάκων. • Εκτελεί Sql ερωτήματα, ακόμα και ομαδικά (batch). • Διαχειρίζεται κλειδιά σε πεδία. • Φορτώνει αρχεία κειμένου σε πίνακες. • Δημιουργεί και διαβάζει πίνακες (που προέρχονται από dump βάσης) • Διαχειρίζεται πολλούς διακομιστές. • Διαχειρίζεται τους χρήστες MySQL και τα δικαιώματά τους. • Ελέγχει την αναφορική ακεραιότητα των δεδομένων των MyISAM πινάκων. • Δημιουργεί PDF γραφικών του layout της βάσης δεδομένων. • Εκτελεί αναζητήσεις σε όλη τη βάση ή μέρος αυτής. • Υποστηρίζει πίνακες InnoDB και ξένα κλειδιά. • Υποστηρίζει MySQLi, μια βελτιωμένη επέκταση της MySQL.



4.9 CSS Τα CSS (Cascading Style Sheets), στην κατασκευή ιστοσελίδων, είναι ηλεκτρονικά έγγραφα με ένα σύνολο κανόνων για την μορφοποίηση μιας ιστοσελίδας. Ενδεικτικά, μπορεί να χρησιμοποιηθεί για να διαμορφώσει:

• Τα χρώματα και το μέγεθος διαφόρων στοιχείων της ιστοσελίδας . • Την συμπεριφορά τους σε διάφορες ενέργειες .

Παλιότερα, συνηθίζονταν να διαμορφώνεται κάθε στοιχείο της ιστοσελίδας ξεχωριστά, σε κάθε μία ξεχωριστή σελίδα. Η μεγάλη ευκολία που προσφέρει η χρήση ενός CSS, είναι ότι οι ενδεχόμενες αλλαγές, γίνονται μόνο σε ένα έγγραφο και αυτόματα εφαρμόζονται σε όλες τις σελίδες που το χρησιμοποιούν. Έτσι μία ιστοσελίδα που χρησιμοποιεί CSS, μπορεί πολύ ευκολότερα να αλλάξει όψη.

4.10 HTML5 Η HTML 5 είναι μια υπό ανάπτυξη γλώσσα σήμανσης για τον Παγκόσμιο Ιστό που όταν ετοιμαστεί θα είναι η επόμενη μεγάλη έκδοση της HTML (Γλώσσα Υπερκειμένου, HyperText Markup Language). Η ομάδαWeb Hypertext Application Technology Working Group (WHATWG) άρχισε δουλειά σε αυτή την έκδοση τον Ιούνιο του 2004 με το όνομαWeb Applications 1.0. Το Φεβρουάριο του 2010 το πρότυπο ήταν ακόμη σε κατάσταση "Last Call" στο WHATWG. Η HTML 5 προορίζεται για αντικατάσταση της HTML 4.01, της XHTML 1.0, και της DOM Level 2 HTML. Ο σκοπός είναι η μείωση της ανάγκης για ιδιόκτητα plug-in και πλούσιες διαδικτυακές εφαρμογές (RIA) όπως το Adobe Flash, το Microsoft Silverlight, το Apache Pivot, και η Sun JavaFX. H HTML 5 προσθέτει πολλά νέα συντακτικά χαρακτηριστικά. Αυτά περιλαμβάνουν τις ετικέτες <video>, <audio>, <header> και <canvas>, καθώς και την ενσωμάτωση του SVG περιεχομένου. Τα χαρακτηριστικά αυτά είναι σχεδιασμένα έτσι ώστε να είναι εύκολο να συμπεριλάβει και να χειριστεί περιεχόμενο πολυμέσων και γραφικών στο διαδίκτυο χωρίς να χρειάζεται να καταφύγουν σε ιδιόκτητα plugins και APIs. Άλλες νέες ετικέτες όπως <section>, <article>, <header>, και <nav> χρησιμοποιούνται με σκοπό να εμπλουτίσει το σημασιολογικό περιεχόμενο των εγγράφων. Οι νέες ιδιότητες έχουν εισαχθεί για τον ίδιο σκοπό, ενώ ορισμένα στοιχεία και χαρακτηριστικά έχουν αφαιρεθεί. Ορισμένες ετικέτες όπως <a>, <cite> και <menu> έχουν αλλάξει ή επαναπροσδιοριστεί. Τα APIs και DOM δεν είναι πλέον δευτερεύουσας σημασίας, αλλά είναι θεμελιώδη μέρη της . Η HTML 5 καθορίζει επίσης με αρκετή λεπτομέρεια την απαιτούμενη επεξεργασία για τυχών άκυρων εγγράφων, έτσι ώστε τα σφάλματα σύνταξης να πρέπει να αντιμετωπίζονται ομοιόμορφα από όλους τους browsers.



4.11 JAVASCRIPT Η JavaScript είναι γλώσσα προγραμματισμού η οποία έχει σαν σκοπό την παραγωγή δυναμικού περιεχομένου και την εκτέλεση κώδικα στην πλευρά του πελάτη (client-side) σε ιστοσελίδες. To πρότυπο της γλώσσας κατά τον οργανισμό τυποποίησης ECMA ονομάζεται ECMAscript. Όπως και η PHP, η Javascript έχει βασιστεί όσον αφορά τον τρόπο σύνταξης του κώδικά της στη είναι γλώσσα προγραμματισμού C, με την οποία παρουσιάζει πολλές ομοιότητες. Όμως ενώ η PHP είναι μια server side γλώσσα προγραμματισμού, η Javascript είναι client side.

4.12 AJAX

AJAX, ονομάζουμε ένα group αλληλο-εξαρτώμενων τεχνικών ανάπτυξης εφαρμογών web. Το κύριο χαρακτηριστικό της τεχνολογίας αυτής είναι ότι ανταποκρίνεται γρήγορα στο χρήστη και οι διεργασίες που εκτελούνται στο server γίνονται στο «παρασκήνιο» , έτσι ώστε οι σελίδες να μη χρειάζεται να ξαναφορτωθούν για να φέρουν τα καινούργια data από τον server. Έτσι ενισχύεται η διαδραστικότητα του χρήστη με την ιστοσελίδα , η ταχύτητα διεκπεραίωσης και σίγουρα η ευχρηστία της εφαρμογής. To Ajax είναι ασύγχρονο με την έννοια ,ότι τα “extra data” που ζητάμε από τον Server φορτώνονται στο background χωρίς να επηρεάζουν αυτά που βλέπει ο χρήστης . Οι κλήσεις Ajax γίνονται με Javascript και τα δεδομένα ανακτώνται με τη χρήση του XMLHttpRequest object , που είναι διαθέσιμο από τους σύγχρονους browsers.



4.13 JQUERY H jQuery είναι μια βιβλιοθήκη JavaScript η οποία χρησιμοποιείτε με σκοπό την απλούστευση των client-side scripting της HTML.Η jQuery πρωτοεμφανίστηκε τον Ιανουάριο του 2006 στο BarCamp από τον John Resig. Πρόκειται για μια βιβλιοθήκη (framework) Javascript ανοιχτού κώδικα, υπό τις άδειες MIT License και την GNU (General Public License) .Μία συλλογή δηλαδή από έτοιμες ρουτίνες γραμμένες σε Javascript, τις οποίες μπορούμε να χρησιμοποιήσουμε για να εκτελέσουμε συγκεκριμένες λειτουργίες. Με την jQuery μπορούμε:

• Να έχουμε άμεση πρόσβαση σε οποιοδήποτε στοιχείο της ιστοσελίδας • Να αλλάξουμε την εμφάνιση μιας ιστοσελίδας χωρίς να ανησυχούμε για τις

ασυμβατότητες των διαφόρων browsers • Να αλλάξουμε δυναμικά το περιεχόμενο της ιστοσελίδας ή ακόμα και ολόκληρη την

δομή της • Να εφαρμόσουμε διάφορα οπτικά εφέ όπως κίνηση, σκίαση κ.α. • Να χρησιμοποιούμε λειτουργία “Drag and Drop” με διάφορα αντικείμενα της

Σελίδας

Η ενσωμάτωση jQuery λειτουργιών γίνεται εύκολα, ακόμα και από χρήστες με λίγες γνώσεις Javascript, διότι έχει σχεδιαστεί με βάση την δομή και την φιλοσοφία των HTML και CSS. Ο κώδικας jQuery μιας σελίδας περικλείεται από τις ετικέτες της HTML <script type="text/javascript" src="jquery.js"></script> Οι πιο δημοφιλείς και βασικός τρόπος για να εισαγάγει μια jQuery λειτουργία είναι να χρησιμοποιήσετε την .ready() συνάρτηση. Η σύνταξη τις είναι η εξής: $(document).ready(function() { // jquery goes here });

4.14 PHOTOSHOP Το Adobe Photoshop είναι το πιο δημοφιλές πρόγραμμα για τη δημιουργία και τη μετατροπή εικόνων στο web. Αυτό είναι πραγματικότητα, όχι μόνο γιατί το Photoshop είναι πολύ δημοφιλές και χρησιμοποιείται από πολλά λειτουργικά συστήματα, όπως το Mac, τα Windows, το UNIX, αλλά επειδή, έπειτα από 4 είδη ανάπτυξης το Adobe Photoshop έχει το πιο διαισθητικό περιβάλλον χρήστη, το πληρέστερο σετ από εργαλεία και πολλά βοηθητικά βιβλία.



ΕΝΟΤΗΤΑ 5: ΠΕΡΙΓΡΑΦΗ ΙΣΤΟΣΕΛΙΔΑΣ Στην ενότητα 5 θα γίνει λεπτομερής περιγραφή της ιστοσελίδας για τον επισκέπτη , παρουσίαση της διαχείρισης για τον υπεύθυνο καινοτόμων δράσεων και τον διαχειριστή.

5.1 ΠΑΡΟΥΣΙΑΣΗ ΠΡΩΤΟΥ ΜΕΝΟΥ Όπως βλέπουμε και στην εικόνα 13 το πρώτο μενού αποτελείτε από πέντε επιλογές:

• ΑΡΧΙΚΗ • ΚΠΕ ΦΙΛΙΠΠΩΝ • Η ΠΕΡΙΟΧΗ ΜΑΣ • ΑΝΑΚΟΙΝΩΣΕΙΣ • ΕΠΙΚΟΙΝΩΝΙΑ

5.1.1 ΑΡΧΙΚΗ

Εικόνα 13 : αρχική σελίδα

Στην αρχική σελίδα ο επισκέπτης μπορεί να δει τα πιο σημαντικά άρθρα και τα πιο πρόσφατα. Μέσω του sidebar ενημερώνεται για τα τελευταία άρθρα που ανέβηκαν στη σελίδα και το πιο πρόσφατο φωτογραφικό υλικό (βλ. εικόνα 13). Επίσης μπορεί να κάνει αναζήτηση μιας σελίδας ή ενός άρθρου .Σε όλα τα άρθρα που θα διαβάσει ο επισκέπτης μπορεί να κάνει σχολιασμό.



Εικόνα 14 : εμφάνιση footer στην αρχική σελίδα

Στο μενού fouter μπορεί να επιλέξει ανάμεσα σε τρείς υπερσυνδέσμους και να μεταφερθεί σε άλλες σελίδες σχετικές με το ΚΠΕ Φιλίππων (βλ. εικόνες 15,16,17)



ΣΕΛΙΔΕΣ FOOTER Μονοπάτι παλιάς Καβάλας

Εικόνα 15 : ιστοσελίδα ‘περιβαλλοντικό μονοπάτι παλιάς καβάλας ‘

Προιστορικός οικισμός Ντικιλί τας

Εικόνα 16 : ιστοσελίδα ‘ Προιστορικός οικισμός Ντικιλί τας’



Let’s learn by playing

Εικόνα 17 : Blog ‘let’s learn by playing’



5.1.2 ΚΠΕ ΦΙΛΙΠΠΩΝ

Εικόνα 18 : επιλογή μενού ‘ΚΠΕ Φιλίππων’

Όπως βλέπουμε και στην εικόνα 18 το menu item ΚΠΕ ΦΙΛΙΠΠΩΝ περιέχει τέσσερις επιλογές:

• ΠΡΟΣΩΠΙΚΟ • ΣΥΝΕΡΓΑΣΙΑ ΜΕ ΦΟΡΕΙΣ • ΣΥΜΜΕΤΟΧΗ ΣΕ ΔΙΚΤΥΑ • Η ΒΙΒΛΙΟΘΗΚΗ ΜΑΣ



Εικόνα 19 : Επιλογή μενού ‘Προσωπικό’

Στην πρώτη επιλογή ο επισκέπτης ενημερώνεται για το προσωπικό του ΚΠΕ με λίγα λόγια για τον καθένα καθώς και για παλαιότερους υπαλλήλους (βλ. εικόνα 19).

Εικόνα 20 : Επιλογή μενού ‘Συνεργασία με φορείς’

Πιο κάτω , στην επιλογή ΣΥΝΕΡΓΑΣΙΑ ΜΕ ΦΟΡΕΙΣ, ενημερώνεται για τη συνεργασία του ΚΠΕ με άλλους φορείς. Παράλληλα έχει συνεχή ενημέρωση για τα τελευταία νέα σε όλες τις σελίδες(βλ. εικόνα 20).



Εικόνα 21 : Επιλογή μενού ‘ Συμμετοχή σε δίκτυα’

Συνεχίζοντας στο πρώτο μενού ενημερώνεται για τη συνεργασία του ΚΠΕ Φιλίππων με άλλα αντίστοιχα ΚΠΕ στα οποία μπορεί ο επισκέπτης να έχει πρόσβαση από τη σελίδα μέσω υπερσυνδέσμου.

Εικόνα 22: Επιλογή μενού ‘Η ΒΙΒΛΙΟΘΗΚΗ ΜΑΣ’

Στη βιβλιοθήκη του ΚΠΕ υπάρχουν βιβλία τα οποία μπορεί να δανειστεί οποιοσδήποτε επισκέπτης και μέσα από τη σελίδα μπορεί να ενημερωθεί ποια βιβλία υπάρχουν. Αυτό συμβαίνει με την επιλογή Η ΒΙΒΛΙΟΘΗΚΗ ΜΑΣ στο πρώτο μενού. Εδώ ο επισκέπτης ενημερώνεται για τα βιβλία που υπάρχουν στη βιβλιοθήκη του ΚΠΕ , η οποία είναι διαθέσιμη σε όλους , όπως βλέπουμε και στην εικόνα 22.



5.1.3 Η ΠΕΡΙΟΧΗ ΜΑΣ

Εικόνα 23 : Επιλογή μενού ‘Η ΠΕΡΙΟΧΗ ΜΑΣ’

Συνεχίζοντας στο πρώτο μενού ο επισκέπτης μπορεί να ενημερώνεται με λίγα λόγια και φωτογραφίες για την περιοχή των Φιλίππων από το ΚΠΕ (βλ. εικόνα 23). 5.1.4 ΑΝΑΚΟΙΝΩΣΕΙΣ

Εικόνα 24 : Επιλογή μενού ‘ΑΝΑΚΟΙΝΩΣΕΙΣ’

Στην επιλογή ΑΝΑΚΟΙΝΩΣΕΙΣ θα εμφανίζονται οι ανακοινώσεις από το ΚΠΕ σχετικά με τα νέα προγράμματα και τα σεμινάρια , αυτή τη στιγμή δεν έχουν κάποια ανακοίνωση και το σύστημα βγάζει στον επισκέπτη το μήνυμα ‘Δεν βρέθηκε’, όπως βλέπουμε στην εικόνα 24.



5.1.5 ΕΠΙΚΟΙΝΩΝΙΑ

Εικόνα 25 : Φόρμα επικοινωνίας

Στη σελίδα επικοινωνία υπάρχουν τα στοιχεία επικοινωνίας με το ΚΠΕ καθώς και μια φόρμα επικοινωνίας που μπορεί να συμπληρώσει ο επισκέπτης για να επικοινωνήσει άμεσα με το ΚΠΕ. Το μήνυμα της φόρμας θα σταλεί στο email του ΚΠΕ Φιλίππων (βλ. εικόνα 25).



5.2 ΠΑΡΟΥΣΙΑΣΗ ΒΑΣΙΚΟΥ ΜΕΝΟΥ Εδώ θα δούμε το βασικό μενού όπως μπορεί να το χρησιμοποιήσει ο απλός χρήστης. Το βασικό μενού περιέχει πέντε επιλογές με υποεπιλογές .

• ΠΡΟΓΡΑΜΜΑΤΑ ΓΙΑ ΣΧΟΛΕΙΑ Ø ΕΚΠΑΙΔΕΥΤΙΚΑ ΠΡΟΓΡΑΜΜΑΤΑ Ø ΕΚΠΑΙΔΕΥΤΙΚΟ ΥΛΙΚΟ Ø ΧΡΗΣΙΜΕΣ ΠΛΗΡΟΦΟΡΙΕΣ Ø ΦΩΤΟΓΡΑΦΙΕΣ Ø ΒΙΝΤΕΟ

• ΣΕΜΙΝΑΡΙΑ Ø ΕΝΗΛΙΚΩΝ

2010-2011 2011-2012

Ø ΕΚΠΑΙΔΕΥΤΙΚΩΝ 2008-2009 2010-2011 2011-2012

Ø ΕΚΠΑΙΔΕΥΤΙΚΟ ΥΛΙΚΟ ΕΝΗΛΙΚΩΝ ΕΚΠΑΙΔΕΥΤΙΚΩΝ

Ø ΧΡΗΣΙΜΕΣ ΠΛΗΡΟΦΟΡΙΕΣ Ø ΦΩΤΟΓΡΑΦΙΕΣ Ø ΒΙΝΤΕΟ

• ΕΘΝΙΚΟ ΘΕΜΑΤΙΚΟ ΔΙΚΤΥΟ Ø ΣΤΟΧΟΙ ΤΟΥ ΕΘΝΙΚΟΥ ΔΙΚΤΥΟΥ Ø ΣΕΜΙΝΑΡΙΑ – ΗΜΕΡΙΔΕΣ ΕΘΝΙΚΟΥ ΔΙΚΤΥΟΥ Ø ΕΚΠΑΙΔΕΥΤΙΚΟ ΥΛΙΚΟ ΣΕΜΙΝΑΡΙΩΝ Ø Η ΒΙΒΛΙΟΘΗΚΗ ΤΟΥ ΕΘΝΙΚΟΥ ΔΙΚΤΥΟΥ Ø ΔΡΑΣΕΙΣ ΣΧΟΛΕΙΩΝ ΕΘΝΙΚΟΥ ΔΙΚΤΥΟΥ Ø ΑΙΤΗΣΗ ΣΥΜΜΕΤΟΧΗΣ ΣΤΟ ΕΘΝΙΚΟ ΔΙΚΤΥΟ Ø ΠΡΩΤΟΚΟΛΛΟ ΣΥΜΜΕΤΟΧΗΣ ΜΕ ΤΟ ΕΘΝΙΚΟ ΔΙΚΤΥΟ

• ΓΙΑ ΕΝΗΛΙΚΟΥΣ ΕΚΠΑΙΔΕΥΟΜΕΝΟΥΣ Ø ΑΙΤΗΣΗ ON LINE Ø ΠΡΟΚΥΡΗΞΗ ΓΙΑ ΕΝΗΛΙΚΕΣ Ø ΑΠΟΤΕΛΕΣΜΑΤΑ



5.2.1 ΠΡΟΓΡΑΜΜΑΤΑ ΓΙΑ ΣΧΟΛΕΙΑ

Εικόνα 26 : Επιλογή μενού ‘ΠΡΟΓΡΑΜΜΑΤΑ ΓΙΑ ΣΧΟΛΕΙΑ’

Ξεκινώντας στο βασικό μενού ο επισκέπτης μπορεί να ενημερωθεί για τα προγράμματα για σχολεία. Σε αυτή την κατηγορία ο επισκέπτης μπορεί να επιλέξει τις υποκατηγορίες από το menu item ‘ΠΡΟΓΡΑΜΜΑΤΑ ΓΙΑ ΣΧΟΛΕΙΑ’(βλ. εικόνα 26).

Εικόνα 27 : Επιλογή μενού ‘ΕΚΠΑΙΔΕΥΤΙΚΑ ΠΡΟΓΡΑΜΜΑΤΑ’

Στην πρώτη επιλογή από τα προγράμματα για σχολεία ενημερώνεται για να παλιά εκπαιδευτικά προγράμματα πατώντας στο πρόγραμμα που τον ενδιαφέρει για να διαβάσει ολόκληρο το άρθρο. Θα προσθέτονται και νέα προγράμματα όταν προκύψουν.



Εικόνα 28 : Επιλογή μενού ‘ΕΚΠΑΙΔΕΥΤΙΚΟ ΥΛΙΚΟ’

Στην εικόνα 28 βλέπουμε την επιλογή ΕΚΠΑΙΔΕΥΤΙΚΟ ΥΛΙΚΟ .Εδώ υπάρχει το εκπαιδευτικό υλικό για τα προγράμματα για σχολεία , ο επισκέπτης επιλέγει το άρθρο που τον ενδιαφέρει και μπορεί να αποτελείτε από κείμενο ή και video.

Εικόνα 29 : Επιλογή μενού ‘ΧΡΗΣΙΜΕΣ ΠΛΗΡΟΦΟΡΙΕΣ’

Συνεχίζοντας στις ΧΡΗΣΙΜΕΣ ΠΛΗΡΟΦΟΡΙΕΣ μπορεί να ενημερωθεί για την τοποθεσια του ΚΠΕ(βλ. εικόνα 29). Σε αυτό το σημείο βρίσκονται πληροφορίες σχετικά με την τοποθεσία του ΚΠΕ και μέσω ενός υπερσυνδέσμου μεταφέρεται στην σελίδα του google maps όπου μπορεί να δει το σημείο που βρίσκονται οι εγκαταστάσεις του ΚΠΕ Φιλίππων. Σε αυτό το menu item ο επισκέπτης μπορεί μεταβεί και από το menu ΣΕΜΙΝΑΡΙΑ → ΧΡΗΣΙΜΕΣ ΠΛΗΡΟΦΟΡΙΕΣ.



Εικόνα 30 : Επιλογή μενού ‘ΦΩΤΟΓΡΑΦΙΕΣ’

Για τα προγράμματα για σχολεία μπορεί να δει σχετικό φωτογραφικό υλικό από την επιλογή ΦΩΤΟΓΡΑΦΙΕΣ.Ο επισκέπτης πατώντας το menu item Φωτογραφίες μεταφέρεται στο άλμπουμ φωτογραφιών της σελίδας όπου μπορεί να δει φωτογραφίες από τα προγράμματα για σχολεία και από τα σεμινάρια.

Εικόνα 31 : Εμφάνιση φωτογραφίας στο φυσικό της μέγεθος

Στην εικόνα 31 βλέπουμε πως ο επισκέπτης πατώντας το άλμπουμ που τον ενδιαφέρει μπορεί να δει την κάθε φωτογραφία στο φυσικό της μέγεθος . Σε αυτή τη σελίδα μπορεί να μεταβεί και από το menu item ΣΕΜΙΝΑΡΙΑ → ΦΩΤΟΓΡΑΦΙΕΣ. Για να επιλέξει τις φωτογραφίες που τον ενδιαφέρουν επιλέγει τον ανάλογο φάκελο.



Εικόνα 32 : Επιλογή μενού ‘ΒΙΝΤΕΟ’

Για βίντεο σχετικά με τα εκπαιδευτικά προγράμματα υπάρχει σχετική επιλογή από το μενού προγράμματα για σχολεία. Σε αυτό το menu item ο επισκέπτης μπορεί να δει video σχετικά με τα εκπαιδευτικά προγράμματα. Μπορεί να επιλέξει να δει το video στη σελίδα του ΚΠΕ ή να μεταφερθεί στη σελίδα youtube. Στην εικόνα 32 βλέπουμε πως φαίνεται στον επισκέπτη το βίντεο.



5.2.2 ΣΕΜΙΝΑΡΙΑ

Εικόνα 33 : Επιλογή μενού ‘ ΣΕΜΙΝΑΡΙΑ’

Όπως είδαμε και νωρίτερα στο μενού υπάρχει χώρος ειδικά για τα σεμινάρια .Σε αυτή την κατηγορία ο επισκέπτης μπορεί να επιλέξει τις υποκατηγορίες από το menu item ‘ΣΕΜΙΝΑΡΙΑ’(βλ. εικόνα 33).

Εικόνα 34 : Επιλογή μενού ‘ΕΝΗΛΙΚΩΝ’

Για τα σεμινάρια ενηλίκων μπορεί να ενημερωθεί από την επιλογή ΕΝΗΛΙΚΩΝ. Εδώ ο επισκέπτης μπορεί να επιλέξει ανάλογα την ιδιότητα του ποια σεμινάρια τον ενδιαφέρουν και να ενημερωθεί για παλαιότερα σεμινάρια, όπως φαίνεται και στην εικόνα 34.



Εικόνα 35 : Επιλογή μενού ‘ΕΚΠΑΙΔΕΥΤΙΚΩΝ’

Για τα σεμινάρια εκπαιδευτικών υπάρχει η επιλογή εκπαιδευτικών. Μπορεί ο επισκέπτης να δει το υλικό από παλαιά σεμινάρια όπου είναι χωρισμένα σε κατηγορίες ανάλογα με τη χρονολογία. Οι πληροφορίες για τα παλαιότερα σεμινάρια εμφανίζονται σε αρχείο pdf ή word και μπορεί να τα κατεβάσει από τη σελίδα(βλ. εικόνα 35).

Εικόνα 36 : Επιλογή μενού ‘ΕΚΠΑΙΔΕΥΤΙΚΟ ΥΛΙΚΟ’

Συγκεκριμένα για το εκπαιδευτικό υλικό των σεμιναρίων υπάρχει διαχωρισμός των εκπαιδευτικών και των ενηλίκων , ανάλογα με την ιδιότητα του ο κάθε επισκέπτης , εκπαιδευτικός ή άλλος ενήλικας ,μπορεί να περιηγηθεί στα σεμινάρια και να κατεβάσει το υλικό τους . Αυτό φαίνεται στην εικόνα 36.



Εικόνα 37 : Προβολή βίντεο για σεμινάρια ενηλίκων

Αντίστοιχα με τα σεμινάρια εκπαιδευτικών , για τα σεμινάρια ενηλίκων υπάρχουν σχετικά βίντεο τα οποία μπορεί να δεί από την επιλογή ΒΙΝΤΕΟ. Σε αυτό το menu item ο επισκέπτης μπορεί να δει video σχετικά με τα σεμινάρια ή μπορεί να επιλέξει να δει το video στη σελίδα του ΚΠΕ ή να μεταφερθεί στη σελίδα youtube (βλ. εικόνα 37).



5.2.3 ΕΘΝΙΚΟ ΘΕΜΑΤΙΚΟ ΔΙΚΤΥΟ

Εικόνα 38 : Επιλογή μενού ‘ΕΘΝΙΚΟ ΘΕΜΑΤΙΚΟ ΔΙΚΤΥΟ’

Από το menu για το εθνικό δίκτυο μπορεί να ενημερωθεί για τους στόχους του δικτύου και για σεμινάρια και ημερίδες που έχουν πραγματοποιηθεί(βλ. εικόνα 38).

Εικόνα 39 : Επιλογή μενού ‘ΕΚΠΑΙΔΕΥΤΙΚΟ ΥΛΙΚΟ ΣΕΜΙΝΑΡΙΩΝ’

Μπορεί επίσης να κατεβάσει το εκπαιδευτικό υλικό των σεμιναρίων μέσα από τη σελίδα , όπως φαίνεται στην εικόνα 39.



Εικόνα 40 : Επιλογή μενού ‘Η ΒΙΒΛΙΟΘΗΚΗ ΤΟΥ ΔΙΚΤΥΟΥ’

Σημαντικό κομμάτι του εθνικού δικτύου είναι η βιβλιοθήκη. Στη σελίδα μας ο επισκέπτης μπορεί να έχει πρόσβαση σε αυτή ,όπως βλέπουμε στην εικόνα 40. Η βιβλιοθήκη του δικτύου περιέχει βιβλία σε μορφή pdf και word που μπορεί ο ενδιαφερόμενος να τα κατεβάσει για να τα μελετήσει.

Εικόνα 41 : ΑΙΤΗΣΗ ΣΥΜΜΕΤΟΧΗΣ ΣΤΟ ΕΘΝΙΚΟ ΔΙΚΤΥΟ

Μέσω της σελίδας μας μπορούν οι ενδιαφερόμενοι καθηγητές να κάνουν αίτηση για συμμετοχή στο εθνικό δίκτυο. Η αίτηση φαίνεται στην εικόνα 41.



5.2.4 ΓΙΑ ΕΝΗΛΙΚΕΣ ΕΚΠΑΙΔΕΥΟΜΕΝΟΥΣ

Εικόνα 42 : Επιλογή μενού ‘ΓΙΑ ΕΝΗΛΙΚΕΣ ΕΚΠΑΙΔΕΥΟΜΕΝΟΥΣ’

Σε αυτό το menu item μπορεί ο ενήλικας εκπαιδευόμενος να δει τις προκηρύξεις για τα σεμινάρια ενηλίκων και αργότερα τα αποτελέσματα τους (βλ. εικόνα 42).

Εικόνα 43: ΑΙΤΗΣΗ ON LINE

Για να συμμετέχει σε κάποιο από τα σεμινάρια θα πρέπει να συμπληρώσει την αίτηση on line για το σεμινάριο που ενδιαφέρεται. Η αίτηση φαίνεται στην εικόνα 43. Την αίτηση ελέγχει ο διαχειριστής της σελίδας και εμφανίζει τα αποτελέσματα στο menu item ‘ΑΠΟΤΕΛΕΣΜΑΤΑ’.



5.3 ΔΙΑΧΕΙΡΙΣΗ ΚΑΙΝΟΤΟΜΩΝ ΔΡΑΣΕΩΝ Ο υπεύθυνος καινοτόμων δράσεων είναι ένας υπάλληλος από την δευτεροβάθμια εκπαίδευση με την οποία συνεργάζονται τα ΚΠΕ όπως και το ΚΠΕ Φιλίππων.

Εικόνα 44 : Επιλογή μενού ‘ΓΙΑ ΥΠΕΥΘΥΝΟΥΣ ΚΑΙΝΟΤΟΜΩΝ ΔΡΑΣΕΩΝ’

Ο χρήστης καινοτόμων δράσεων μπορεί να λειτουργήσει και ως απλός επισκέπτης αλλά είναι ο μόνος από τους χρήστες που θα κάνει εισαγωγή με κωδικό σε ένα τμήμα της σελίδας το οποίο βρίσκεται στο menu item ‘ΓΙΑ ΥΠΕΥΘΥΝΟΥΣ ΚΑΙΝΟΤΟΜΩΝ ΔΡΑΣΕΩΝ’→’ΦΟΡΜΑ’, όπως φαίνεται στην εικόνα 44.



Εικόνα 45 : LOGIN ΥΠΕΥΘΥΝΟΥ ΚΑΙΝΟΤΟΜΩΝ ΔΡΑΣΕΩΝ

Με την επιλογή ΦΟΡΜΑ από το menu item ΓΙΑ ΥΠΕΥΘΥΝΟΥΣ ΚΑΙΝΟΤΟΜΩΝ ΔΡΑΣΕΩΝ , ο υπεύθυνος καινοτόμων δράσεων κάνει εισαγωγή (login) με κωδικό ο οποίος του έχει δοθεί από τον διαχειριστή του ΚΠΕ(βλ. εικόνα 45).

Εικόνα 46 : ΦΟΡΜΑ ΓΙΑ ΥΠΕΥΘΥΝΟΥΣ ΚΑΙΝΟΤΟΜΩΝ ΔΡΑΣΕΩΝ

Αφού ο υπεύθυνος καινοτόμων δράσεων κάνει login μπορεί να συμπληρώσει αυτή τη φόρμα, που φαίνεται στην εικόνα 46, για τα σχολεία που έχουν εγκριθεί από τη δευτεροβάθμια να συμμετάσχουν στα προγράμματα του ΚΠΕ.



5.4 ΔΙΑΧΕΙΡΙΣΗ ΣΕΛΙΔΑΣ Η διαχείριση της σελίδας όπως έχουμε πει γίνεται από τον διαχειριστή ο οποίος είναι υπάλληλος του ΚΠΕ Φιλίππων . 5.4.1 ΠΡΩΤΟ ΜΕΝΟΥ

Εικόνα 47 : ΔΙΑΧΕΙΡΙΣΗ ΠΡΩΤΟΥ ΜΕΝΟΥ

Στην εικόνα 47 βλέπουμε το πρώτο μενού το οποίο χειρίζεται ο διαχειριστής από την επιλογή menu manager pages αριστερά στη μπάρα διαχείρισης. Για να προσθέσει νέο αντικείμενο στο μενού χρησιμοποιεί την επιλογή ‘Add new menu item’ . Το νέο αυτό αντικείμενο πρέπει να το συνδέσει με μία σελίδα ή μια κατηγορία ή τέλος με ένα link ώστε να πηγαίνει σε μια άλλη ιστοσελίδα. Αφού δημιουργήσει το νέο αντικείμενο προχωρά στην επιλογή ‘Save changes’ για να αποθηκευτεί.



5.4.2 ΒΑΣΙΚΟ ΜΕΝΟΥ

Εικόνα 48 : ΕΠΕΞΕΡΓΑΣΙΑ ΒΑΣΙΚΟΥ ΜΕΝΟΥ

Το βασικό μενού, όπως βλέπουμε στην εικόνα 48, χειρίζεται ο διαχειριστής από την επιλογή menu manager categories αριστερά στη μπάρα διαχείρισης. Για να προσθέσει νέο αντικείμενο στο μενού χρησιμοποιεί την επιλογή ‘Add new menu item’ . Το νέο αυτό αντικείμενο πρέπει να το συνδέσει με μία σελίδα ή μια κατηγορία ή τέλος με ένα link ώστε να πηγαίνει σε μια άλλη ιστοσελίδα. Αφού δημιουργήσει το νέο αντικείμενο προχωρά στην επιλογή ‘Save changes’ για να αποθηκευτεί.



5.4.3 ΑΝΕΒΑΣΜΑ ΑΡΧΕΙΩΝ ΜΕ ΤΟ WP-FILEBASE

Εικόνα 49 : ΔΙΑΧΕΙΡΙΣΗ ΑΡΧΕΙΩΝ ΜΕ ΤΟ WP-FILEBASE

Ο διαχειριστής για να ανεβάσει αρχεία σε κάποιο μέρος της σελίδας θα χρειαστεί το ‘wp-filebase’ το οποίο βρίσκεται αριστερά στη μπάρα διαχείρισης. Με την επιλογή του, όπως βλέπουμε στην εικόνα 49, εμφανίζονται οι κατηγορίες αρχείων που έχουν ανέβει ως τώρα.

Εικόνα 50 : ΠΡΟΣΘΗΚΗ ΚΑΤΗΓΟΡΙΑΣ ΑΡΧΕΙΩΝ

Πρώτα θα πρέπει να δημιουργήσει μια κατηγορία αρχείων μέσω της επιλογής ‘Κατηγορίες’ την οποία θα ανεβάσει μετά σε μια σελίδα ή ένα άρθρο. Για την δημιουργία κατηγορίας χρησιμοποιεί την επιλογή ‘add new’(βλ. εικόνα 50).



Εικόνα 51: ΠΡΟΣΘΗΚΗ ΑΡΧΕΙΩΝ

Στη συνέχεια προχωράει στην επιλογή ‘add new’ (βλ. εικόνα 51) όπου θα ανεβάσει το αρχείο ή τα αρχεία και θα επιλέξει την κατηγορία στην οποία αντιστοιχεί. Η κατηγορία θα ανέβει σε μια σελίδα ή ένα άρθρο που θα δημιουργήσει ο διαχειριστής στη συνέχεια. Έτσι ολοκληρώνεται η προσθήκη αρχείων.



5.4.4 ΑΝΕΒΑΣΜΑ ΦΩΤΟΓΡΑΦΙΚΩΝ ΑΛΜΠΟΥΜ ΜΕ ΤΗ LAZYEST GALLERY

Εικόνα 52 : ΠΡΟΣΘΗΚΗ ΦΑΚΕΛΟΥ ΜΕ ΤΗΝ LAZYEST GALLERY

Για την εισαγωγή φωτογραφιών στη σελίδα ο διαχειριστής χρησιμοποιεί την επιλογή Lazyest gallery στην μπάρα διαχείρισης αριστερά (βλ. εικόνα 52). Ο διαχειριστής πρέπει να δημιουργήσει άλμπουμ και στην συνέχεια να το γεμίσει με φωτογραφίες. Η δημιουργία άλμπουμ γίνεται με την επιλογή ‘add new folder’ και επιλέγει αν θα είναι νέο άλμπουμ ή φάκελος ενός ήδη υπάρχοντος άλμπουμ.

Εικόνα 53 : ΦΟΡΤΩΣΗ ΦΩΤΟΓΡΑΦΙΩΝ

Στην εικόνα 53 βλέπουμε πως γίνεται η φόρτωση φωτογραφιών. Εδώ ο διαχειριστής προσθέτει τις φωτογραφίες με την επιλογή ‘upload images’. Για να γίνει η εισαγωγή φωτογραφιών πρέπει να έχει δημιουργηθεί άλμπουμ ή φάκελος. Τέλος, οι φωτογραφίες ενημερώνονται αυτόματα στο menu item ΦΩΤΟΓΡΑΦΙΕΣ.



5.4.5 ΔΗΜΙΟΥΡΓΙΑ ΑΡΘΡΩΝ

Εικόνα 54 : ΔΙΑΧΕΙΡΙΣΗ ΑΡΘΡΩΝ

Από την επιλογή άρθρα ο διαχειριστής μπορεί να δημιουργήσει νέα άρθρα , να διαγράψει τα παλιά και να διορθώσει τα ήδη υπάρχοντα(βλ. εικόνα 54).


ΤΜΗΜΑ ΒΙΟΜΗΧΑΝΙΚΗΣ ΠΛΗΡΟΦΟΡΙΚΗΣ

Η δημιουργία νέου άρθρου γίνεται με την επιλογή ‘Νέο άρθρο’. Ένα νέο άρθρο μπορεί να είναι κείμενο , φωτογραφίες , βίντεο , υπερσυνδέσεις ή κατηγορία αρχείων από το filebase. Η εισαγωγή αυτή γίνετανα κάνει εισαγωγή φόρμας που έχει ήδη δημιουργηθεί από την επιλογή builder , για την οποία θα μιλήσουμε αργότερα. Η εισαγωγή φόρμας γίνεται με την επιλογή

(βλ. εικόνα 55). Αφού δημιουργήσει ο διαχειριστής το νέο άρθρο πρέπει να επιλέξει που θέλει να εμφανίζεται , αυτό γίνεται με την επιλογή κατηγορίας στη δεξιά μπάρα ‘κατηγορίες’.Τέλος, μπορεί να επιλέξει αν θα μπορούν οι επισκέπτες να κάνουν σχόλια στο συγκεκριμένο άρθρο.

Όταν δημιουργεί ένα άρθρο ο διαχειριστής πρέπει να επιλέξει σε ποια κατηγορία θέλει να ανέβει , ένα άρθρο δεν ανεβαίνει κατευθείαν στη σελίδα παρά μόνο μέσα από την κατηγορία (βλ. εικόνα 56).



Εικόνα 55 : ΠΡΟΣΘΗΚΗ ΑΡΘΡΟΥ

Η δημιουργία νέου άρθρου γίνεται με την επιλογή ‘Νέο άρθρο’. Ένα νέο άρθρο μπορεί να είναι κείμενο , φωτογραφίες , βίντεο , υπερσυνδέσεις ή κατηγορία αρχείων από το

. Η εισαγωγή αυτή γίνεται με την επιλογή μεταφόρτωση/Εισαγωγή.να κάνει εισαγωγή φόρμας που έχει ήδη δημιουργηθεί από την επιλογή Quform

, για την οποία θα μιλήσουμε αργότερα. Η εισαγωγή φόρμας γίνεται με την επιλογή

δημιουργήσει ο διαχειριστής το νέο άρθρο πρέπει να επιλέξει που θέλει να εμφανίζεται , αυτό γίνεται με την επιλογή κατηγορίας στη δεξιά μπάρα ‘κατηγορίες’.

, μπορεί να επιλέξει αν θα μπορούν οι επισκέπτες να κάνουν σχόλια στο συγκεκριμένο

Εικόνα 56 : ΚΑΤΗΓΟΡΙΕΣ ΑΡΘΡΩΝ

Όταν δημιουργεί ένα άρθρο ο διαχειριστής πρέπει να επιλέξει σε ποια κατηγορία θέλει να ανέβει , ένα άρθρο δεν ανεβαίνει κατευθείαν στη σελίδα παρά μόνο μέσα από την

Σελίδα 57

Η δημιουργία νέου άρθρου γίνεται με την επιλογή ‘Νέο άρθρο’. Ένα νέο άρθρο μπορεί να είναι κείμενο , φωτογραφίες , βίντεο , υπερσυνδέσεις ή κατηγορία αρχείων από το wp-

ι με την επιλογή μεταφόρτωση/Εισαγωγή. Επίσης μπορεί Quform → Form

, για την οποία θα μιλήσουμε αργότερα. Η εισαγωγή φόρμας γίνεται με την επιλογή

δημιουργήσει ο διαχειριστής το νέο άρθρο πρέπει να επιλέξει που θέλει να εμφανίζεται , αυτό γίνεται με την επιλογή κατηγορίας στη δεξιά μπάρα ‘κατηγορίες’.

, μπορεί να επιλέξει αν θα μπορούν οι επισκέπτες να κάνουν σχόλια στο συγκεκριμένο

Όταν δημιουργεί ένα άρθρο ο διαχειριστής πρέπει να επιλέξει σε ποια κατηγορία θέλει να ανέβει , ένα άρθρο δεν ανεβαίνει κατευθείαν στη σελίδα παρά μόνο μέσα από την



5.4.6 ΔΗΜΙΟΥΡΓΙΑ ΣΕΛΙΔΑΣ

Για να διαχειριστεί τις σελίδες ο διαχειριστής χρησιμοποιεί την επιλογή ‘Σελίδες’διαχειριστής μπορεί να διαγράψει , να διορθώσει και δημιουργήσει νέες σελίδες εικόνα 57).

Η δημιουργία μίας σελίδας, όπως βλέπουμε στην εικόνα 58,σελίδα’. Μια νέα σελίδα μπορεί να περιέχει κείμενο , φωτογραφίες , βίντεο , υπερσυνδέσεις ή κατηγορία αρχείων από το επιλογή μεταφόρτωση/Εισαγωγή.δημιουργηθεί από την επιλογή επιλογή .



5.4.6 ΔΗΜΙΟΥΡΓΙΑ ΣΕΛΙΔΑΣ

Εικόνα 57 : ΠΡΟΣΘΗΚΗ ΣΕΛΙΔΑΣ

Για να διαχειριστεί τις σελίδες ο διαχειριστής χρησιμοποιεί την επιλογή ‘Σελίδες’διαχειριστής μπορεί να διαγράψει , να διορθώσει και δημιουργήσει νέες σελίδες

Εικόνα 58 : ΔΗΜΙΟΥΡΓΙΑ ΣΕΛΙΔΑΣ

, όπως βλέπουμε στην εικόνα 58, γίνεται με την επιλογή ‘Νέο σελίδα’. Μια νέα σελίδα μπορεί να περιέχει κείμενο , φωτογραφίες , βίντεο , υπερσυνδέσεις ή κατηγορία αρχείων από το wp-filebase. Η εισαγωγή αυτή γίνεται με την

ταφόρτωση/Εισαγωγή. Επίσης μπορεί να κάνει εισαγωγή φόρμας που έχει ήδη δημιουργηθεί από την επιλογή Quform → Form builder. Η εισαγωγή φόρμας γίνεται με την

Σελίδα 58

Για να διαχειριστεί τις σελίδες ο διαχειριστής χρησιμοποιεί την επιλογή ‘Σελίδες’. Εδώ ο διαχειριστής μπορεί να διαγράψει , να διορθώσει και δημιουργήσει νέες σελίδες (βλ.

γίνεται με την επιλογή ‘Νέο σελίδα’. Μια νέα σελίδα μπορεί να περιέχει κείμενο , φωτογραφίες , βίντεο ,

. Η εισαγωγή αυτή γίνεται με την Επίσης μπορεί να κάνει εισαγωγή φόρμας που έχει ήδη

. Η εισαγωγή φόρμας γίνεται με την



5.4.7 ΕΛΕΓΧΟΣ ΣΧΟΛΙΩΝ

Εικόνα 59 : Επιλογή μενού ΔΙΑΧΕΙΡΙΣΗ ΣΧΟΛΙΩΝ

Εδώ ο διαχειριστής ελέγχει τα σχόλια κάνοντας έγκριση σχολίων για να εμφανιστούν στη σελίδα. Όπως βλέπουμε στην εικόνα 59, μπορεί να διαγράψει ανεπιθύμητα σχόλια και να απαντήσει σε όσα χρειάζεται. Τα σχόλια δεν εμφανίζονται αν δεν τα εγκρίνει ο διαχειριστής.



5.4.8 ΔΗΜΙΟΥΡΓΙΑ ΦΟΡΜΑΣ

Εικόνα 60 : ΔΙΑΧΕΙΡΙΣΗ ΦΟΡΜΑΣ

Για να δημιουργήσει μια φόρμα ή να διορθώσει μια υπάρχουσα χρησιμοποιεί την επιλογή Quform . Εδώ βλέπει όλες τις φόρμες και μπορεί να τις ενεργοποιήσει και να τις απενεργοποιήσει καθώς και να διαγράψει φόρμες(βλ. εικόνα 60).

Εικόνα 61 : ΠΡΟΣΘΗΚΗ ΟΝΟΜΑΤΟΣ ΝΕΑΣ ΦΟΡΜΑΣ

Όταν ο διαχειριστής χρησιμοποιήσει την επιλογή ‘add new’ μεταφέρεται στη σελίδα δημιουργίας της φόρμας και πρώτα χρειάζεται το όνομα της φόρμας (βλ. εικόνα 61). Αφού πληκτρολογήσει ένα όνομα για τη φόρμα είναι έτοιμος να στήσει τη φόρμα που χρειάζεται.



Εικόνα 62 : ΔΗΜΙΟΥΡΓΙΑ ΝΕΑΣ ΦΟΡΜΑΣ

Εδώ μπορεί από τη δεξιά μπάρα να εισάγει αντικείμενα στη φόρμα και να τα διαχειριστεί (βλ. εικόνα 62). Αφού δημιουργήσει τη φόρμα που χρειάζεται την αποθηκεύει με την επιλογή ‘save’.

Εικόνα 63 : ΝΕΑ ΜΗΝΥΜΑΤΑ ΑΠΟ ΦΟΡΜΕΣ

Για να δει τα μηνύματα από τις φόρμες χρησιμοποιεί την επιλογή ‘entries’. Εδώ μπορεί να ενημερωθεί για τις νέες εισαγωγές από τις φόρμες και να τις διαχειριστεί κατάλληλα (βλ. εικόνα 63). Μπορεί επίσης να δέχεται τα αποτελέσματα από τις φόρμες στο email του.



5.4.9 ΔΙΑΧΕΙΡΙΣΗ ΜΕΛΩΝ

Εικόνα 64 : ΔΙΑΧΕΙΡΙΣΗ ΜΕΛΩΝ

Ο διαχειριστής είναι ο μόνος που μπορεί να δημιουργήσει νέα μέλη και να τα διαγράψει , όπως και να τους αλλάξει το ρόλο που έχουν στη σελίδα. Όπως βλέπουμε στην εικόνα 64, με την επιλογή ‘Μέλη’ μπορεί να δει και να διαχειριστεί τα μέλη της σελίδας.

Εικόνα 65 : ΠΡΟΣΘΗΚΗ ΝΕΟΥ ΜΕΛΟΥΣ

Για εισαγωγή νέου μέλους ο διαχειριστής χρησιμοποιεί την επιλογή ‘Προσθήκη’ (βλ. εικόνα 65). Κατά την εισαγωγή νέου μέλους ο διαχειριστής ορίζει και τον ρόλο του νέου μέλους. Τέλος , πατώντας ‘Νέο μέλος’ γίνεται η εισαγωγή του.



5.4.10 ΑΝΕΒΑΣΜΑ ΒΙΝΤΕΟ ΑΠΟ YOUTUBE Για την προβολή βίντεο στη σελίδα χρησιμοποιούμε την υπηρεσία youtube . O διαχειριστής κάνει login στη σελίδα youtube και βρίσκεται στο κανάλι της σελίδας , όπως βλέπουμε παρακάτω στην εικόνα 66.

Εικόνα 66: ΚΑΝΑΛΙ ΚΠΕ ΦΙΛΙΠΠΩΝ ΣΤΟ YOUTUBE

Με απλούς χειρισμούς ανεβάζει τα βίντεο και χρησιμοποιούμε το link από την επιλογή Αποστολή → Ενσωμάτωση .

Εικόνα 67 : ΠΡΟΣΘΗΚΗ ΒΙΝΤΕΟ

Όπως βλέπουμε στην εικόνα 67 ο χρήστης kpefilippwn μπορεί να δει τα βίντεο που έχει ήδη ανεβάσει και με την επιλογή ‘Μεταφόρτωση’ να προσθέσει νέο βίντεο.



ΕΝΟΤΗΤΑ 6 : ΕΦΑΡΜΟΓΗ Μετά τη δημιουργία της ιστοσελίδας σημαντικό κομμάτι είναι η παρακολούθηση της εφαρμογής από τους χρήστες. Η ιστοσελίδα, όπως είπαμε, είναι φιλική για τον χρήστη και προσφέρει παραπάνω δυνατότητες από την προηγούμενη ιστοσελίδα. Ο απλός επισκέπτης ενημερώνεται πιο εύκολα και βρίσκει πιο γρήγορα αυτό που θέλει. Μόλις ανοίγει την αρχική σελίδα βλέπει αμέσως τα νέα στα αρχικά άρθρα χωρίς να χρειάζεται να μεταβεί στις ανακοινώσεις για τα τελευταία νέα(βλ. εικόνα 13). Σε περίπτωση που έχει περισσότερο χρόνο, από το βασικό μενού μπορεί πολύ γρήγορα να μεταφερθεί στη σελίδα που τον ενδιαφέρει και εκεί θα δει τα νέα άρθρα πρώτα. Επιτυγχάνεται η πλήρης ενημέρωση του επισκέπτη καθώς υπάρχει υλικό για προγράμματα και σεμινάρια μέχρι και τρία χρόνια πριν. Με αυτό τον τρόπο αφού έχει ενημερωθεί μπορεί πιο εύκολα να επιλέξει το σεμινάριο που θέλει να παρακολουθήσει και χωρίς καθόλου κόπο να κάνει αμέσως την αίτηση μέσα στη σελίδα. Πολύ σημαντικό κομμάτι της ιστοσελίδας είναι η χρήση της από τον υπεύθυνο καινοτόμων δράσεων. Όπως είπαμε ο χρήστης αυτός είναι ο μόνος, εκτός φυσικά από τον διαχειριστή, ο οποίος κάνει εισαγωγή στη σελίδα με κωδικό. Σκοπός αυτού είναι η άμεση επικοινωνία του ΚΠΕ με τη δευτεροβάθμια εκπαίδευση, κάτι που στην προηγούμενη σελίδα δεν υπάρχει. Επόμενο είναι λοιπόν η νέα ιστοσελίδα να βρίσκει τον χρήστη ικανοποιημένο διευκολύνοντας και την δική του εργασία καθώς το σύστημα του προσφέρει τη δυνατότητα συμπλήρωσης μίας φόρμας με τα σχολεία που έχουν εγκριθεί από τη δευτεροβάθμια για συμμετοχή στο ΚΠΕ. Μεγάλη αλλαγή στην εργασία και του διαχειριστή της ιστοσελίδας. Με την προηγούμενη ιστοσελίδα ο υπεύθυνος για τη διαχείριση δεν μπορούσε να διαχειριστεί στην ουσία τη σελίδα. Με το νέο σύστημα, όπως αναλύσαμε στην ενότητα 5, γίνεται ουσιαστική διαχείριση της σελίδας. Γίνεται πλήρης έλεγχος της λειτουργίας και της εμφάνισης της, υπάρχουν ξεκάθαροι χώροι για τις ανακοινώσεις των προγραμμάτων και σεμιναρίων και διευκολύνεται η εργασία του διαχειριστή. Η σωστή διαχείριση της σελίδας έχει ως αποτέλεσμα τη σωστή λειτουργία της σελίδας. Με λίγα λόγια επιτεύχθηκε αρχικός σκοπός της πτυχιακής εργασίας που ήταν η δημιουργία μίας ιστοσελίδας που θα καλύπτει όλες τις ανάγκες του ΚΠΕ Φιλίππων και για τους επισκέπτες αλλά και για τον διαχειριστή.



ΕΝΟΤΗΤΑ 7 : ΣΥΜΠΕΡΑΣΜΑΤΑ ΚΑΙ ΕΠΕΚΤΑΣΕΙΣ Στη παρούσα πτυχιακή εργασία παρουσιάζεται η υλοποίηση της ιστοσελίδας του ΚΠΕ Φιλίππων. Η εφαρμογή αυτή θα βοηθήσει στη σωστή λειτουργία του ΚΠΕ με παρουσίαση των εκπαιδευτικών προγραμμάτων και των σεμιναρίων στα οποία παίρνουν μέρος κάθε χρόνο σχολεία , εκπαιδευτικοί και ενήλικες. Τα βασικά εργαλεία που χρησιμοποιήθηκαν είναι εργαλεία ανοικτού κώδικα (open source) τα οποία υπάρχουν δωρεάν στο διαδίκτυο και μπορούν να αποτελέσουν ένα πληροφοριακό σύστημα με μηδενικό κόστος. Από την σελίδα Διαχείρισης υπάρχει δυνατότητα ανανέωσης της ιστοσελίδας με δημιουργία νέων σελίδων και ανάρτηση άρθρων σε όλες τις σελίδες. Μπορεί ακόμα και να αλλάξει τη δομή των μενού εάν υπάρχει αυτή η ανάγκη. Σε αντίθεση με την προηγούμενη ιστοσελίδα του ΚΠΕ οι χρήστες μπορούν να επικοινωνούν με το ΚΠΕ αλλά και μεταξύ τους μέσω των σχολίων, τα οποία ελέγχει ο διαχειριστής από τη σελίδα διαχείρισης. Μπορούν επίσης να δουν βίντεο και φωτογραφίες για τα παλιά προγράμματα του ΚΠΕ τα οποία έχουν το δικό τους χώρο μέσα στη σελίδα, δομημένο έτσι ώστε ο χρήστης να βρίσκει αυτό που θέλει. Η ιστοσελίδα είναι επίσης εύκολη στη χρήση της. Όλες οι υπηρεσίες που προσφέρονται είναι σε εμφανή σημεία και πολύ εύκολες στη κατανόηση τους. Μπορεί η ιστοσελίδα που δημιουργήθηκε να πληροί όλες τις βασικές απαιτήσεις και να εξυπηρετεί απόλυτα το ΚΠΕ Φιλίππων, παρόλα αυτά θα μπορούσε να βελτιωθεί περισσότερο και συγκεκριμένα να προωθήσει την εκπαίδευση από απόσταση. Το ΚΠΕ είναι ένα κέντρο εκπαίδευσης και έτσι θα μπορούσε να συνδεθεί και με την ασύγχρονη εκπαίδευση. Οι εκπαιδευόμενοι θα μπορούν να παίρνουν μαθήματα για το περιβάλλον μέσω της σελίδας και να παρακολουθούν βίντεο ειδικά για αυτό το σκοπό. Αυτό βέβαια , κατά ένα μέρος, συμβαίνει και στη σελίδα μας αφού για τα προγράμματα που έχουν ήδη πραγματοποιηθεί υπάρχει εκπαιδευτικό υλικό που μπορεί να κατεβάσει από τη σελίδα και βίντεο που μπορεί να παρακολουθήσει. Βέβαια για να λειτουργήσει σωστά αυτό χρειάζεται σωστή διαχείριση και ειδικός χώρος στη σελίδα. Μία άλλη βελτίωση για τη σελίδα θα είναι οι χρήστες να μπορούν να κάνουν login στη σελίδα με κωδικό και να είναι μέλη της σελίδας. Με αυτή τη δυνατότητα θα μπορούσαν επίσης να ανεβάζουν και δικό τους υλικό στη σελίδα, το οποίο θα έλεγχε πρώτα ο διαχειριστής.



ΕΝΟΤΗΤΑ 8 : ΒΙΒΛΙΟΓΡΑΦΙΑ Για τη δημιουργία της ιστοσελίδας χρησιμοποιήσαμε το διαδίκτυο και παρακάτω θα δούμε τις πηγές που χρησιμοποιήσαμε για την ολοκλήρωση της. [1] http://www.apachefriends.org/en/xampp.html

Από εδώ κατεβάσαμε τον xampp , απαραίτητο εργαλείο για τη δημιουργία ιστοσελίδας σε localhost. Τη διαδικασία εγκατάστασης βλέπουμε στο παράρτημα παρακάτω.

[2] http://wordpress.org/download/ Εδώ μπορούμε να κατεβάσουμε το wordpress και συγκεκριμένα την έκδοση 3.4.2. Την εγκατάσταση του βλέπουμε στο παράρτημα παρακάτω.

[3] http://www.w3schools.com/php/php_functions.asp

Η σελίδα w3schools μας βοήθησε για τη δημιουργία και τη διόρθωση συναρτήσεων της php αλλά και σε jquery, css, html. Είναι ένα χρήσιμο εργαλείο με παραδείγματα και επεξηγήσεις.

[4] http://codex.wordpress.org/The_Loop

Κατά τη δημιουργία της σελίδας χρησιμοποιήθηκε κυρίως το loop του wordpress. Χρησιμοποιήθηκε για τον καθορισμό των θέσεων (post). Σε αυτή τη σελίδα μπορούμε να δούμε τη λειτουργία του loop και πως χρησιμοποιείται.

[5] http://codex.wordpress.org/Class_Reference/WP_Query Χρησιμοποιήθηκε η συνάρτηση wp_guery για να καθορίσουμε ποια posts θα φαίνονται που. Σε αυτή τη σελίδα μπορούμε να δούμε τη συνάρτηση και πώς χρησιμοποιείται.

[6] Γενικά για την κατανόηση και ρύθμιση του wordpress χρησιμοποιήθηκαν τα παρακάτω site : http://wp.tutsplus.com/ http://css-tricks.com/snippets/wordpress/ http://wp.smashingmagazine.com/

[7] Για την κατανόηση της jquery χρησιμοποιήθηκε το παρακάτω site: http://jquery.com/

[8] Για την έρευνα και ανάλυση των αναγκών του ΚΠΕ Φιλίππων πήραμε πληροφορίες από την παλαιότερη ιστοσελίδα. http://www.kpe-philippi.gr/

[9] Για την 4η ενότητα χρησιμοποιήσαμε κυρίως την Wikipedia.


http://www.apachefriends.org/en/xampp.html

http://wordpress.org/download/

http://www.w3schools.com/php/php_functions.asp

http://codex.wordpress.org/The_Loop

http://codex.wordpress.org/Class_Reference/WP_Query

http://wp.tutsplus.com/

http://css-tricks.com/snippets/wordpress/

http://wp.smashingmagazine.com/

http://jquery.com/

http://www.kpe-philippi.gr/




ΠΑΡΑΡΤΗΜΑ Εδώ θα δούμε την εγκατάσταση των εργαλείων που χρησιμοποιήθηκαν για τη δημιουργία της σελίδας, αρχικά του xampp για τη δημιουργία της βάσης και στη συνέχεια του cms wordpress. ΕΓΚΑΤΑΣΤΑΣΗ ΠΡΟΓΡΑΜΜΑΤΩΝ ΕΓΚΑΤΑΣΤΑΣΗ XAMPP Η εγκατάσταση του wordpress προϋποθέτει πως τα στοιχεία της αρχιτεκτονικής που αναλύσαμε στην ενότητα 4 θα πρέπει να έχουν εγκατασταθεί σωστά στον υπολογιστή μας. Αν έστω και ένα από τα συστατικά απουσιάζει δυστυχώς δε μπορούμε να προχωρήσουμε. Έτσι, εγκαθιστούμε μία εφαρμογή όπως Xampp, η οποία στην ουσία είναι ένας τοπικός server που υποστηρίζει όλα τα παραπάνω και διατίθεται δωρεάν στο διαδίκτυο. Η εγκατάσταση αυτής της εφαρμογής είναι μία πολύ απλή διαδικασία και διαρκεί μόνο μερικά λεπτά. Αφού κατεβάσουμε τον server από τη διεύθυνση http://www.apachefriends.org/en/xampp.html (βλ. βιβλιογραφία [1]) τρέχουμε το αρχείο για την εγκατάστασή του. Κατεβάζουμε λοιπόν την τελευταία έκδοση και το εγκαθιστάμε χρησιμοποιώντας τις κανονικές ρυθμίσεις που μας προτείνει και μετά πάμε στις ρυθμίσεις μας. Μόλις τελειώσει η εγκατάσταση μας βγάζει τον πίνακα του XAMPP , όπως βλέπουμε παρακάτω στην εικόνα 68.

Εικόνα 68 : control panel xampp

Εμείς πατάμε τα apache και MySQL Start ( το MySql μπορεί να είναι ήδη ενεργοποιημένο) εκεί που είναι τα βελάκια και ξεκινάμε τις διαδικασίες του Apache και του MySQL. Και τελικά σαν αποτέλεσμα αυτής της ενέργειας εμφανίζεται η παρακάτω εικόνα.

http://www.apachefriends.org/en/xampp.html



Εικόνα 69 : πίνακας ελέγχου xampp μετά την ενεργοποίηση apache και MySql

Το πρώτο βήμα που πρέπει τώρα να πραγματοποιηθεί, είναι η δημιουργία της βάσης δεδομένων που θα συνεργαστεί με τον ιστότοπο που θα δημιουργηθεί. Μόλις τελειώσουν λοιπόν όλα τα στάδια της εγκατάστασης ξεκινάμε τον XAMPP και δημιουργούμε τη βάση με το phpmyadmin δίνοντας http://localhost/phpmyadmin .

Εικόνα 70: δημιουργία βάσης

Στο πεδίο «Δημιουργία βάσης» πληκτρολογούμε το όνομα που επιθυμούμε να έχει η βάση δεδομένων μας και πατάμε «Δημιουργία. Στη συγκεκριμένη εργασία έχει δοθεί το όνομα ‘kpe’ σαν όνομα βάσης, όπως βλέπουμε και στην εικόνα 70. Πριν επιλέξουμε δημιουργία πρέπει να δείξουμε ιδιαίτερη προσοχή έτσι ώστε να είναι επιλεγμένο το σωστό collation, το utf8_general_ci. Τώρα χρειάζεται να προσθέσουμε και έναν χρήστη στην βάση μας. Αυτό το κάνουμε πηγαίνοντας στην καρτέλα Δικαιώματα.



Εικόνα 71 : δημιουργία χρήστη στον xampp

Στην εικόνα 71 βλέπουμε τη φόρμα για τη δημιουργία νέου χρήστη. Σε αυτήν την φόρμα θα προσθέσουμε τα στοιχεία που θέλουμετο, το όνομα χρήστη και τον κωδικό πρόσβασης , και θα επιλέξουμε το επιλογή όλων , ώστε να δώσουμε πλήρη δικαιώματα στην χρήστη. Τέλος πατάμε εκτέλεση.



ΕΓΚΑΤΑΣΤΑΣΗ WORDPRESS Αφού τελειώσουμε με την εγκατάσταση του xampp ,κατεβάζουμε το wordpress από την σελίδα http://wordpress.org/download/ (βλ. βιβλιογραφία [2]) και κάνουμε αποσυμπίεση του αρχείου. Στον υπολογιστή μας θα πάμε στην τοποθεσία που κάναμε εγκατάσταση το XAMPP και θα ανοίξουμε τον φάκελο. Μέσα θα βρούμε έναν φάκελο με το όνομα htdocs. Μέσα σε αυτόν τον φάκελο θα δημιουργήσουμε έναν φάκελο με το όνομα wordpress. Ο φάκελος αυτός είναι ουσιαστικά η τοποθεσία της ιστοσελίδας μας. Θα κάνουμε αντιγραφή των αρχείων που αποσυμπιέσαμε μέσα στον φάκελο wordpress. Έτσι μολις τελειώσει η αντιραφή, αν επισκευτούμε το http://localhost/wordpress/ θα ξεκινήσουμε την διαδικασία εγκατάστασης. Όπως όμως βλέπουμε στην εικόνα 72 μας υποδέχεται με ένα error.

Εικόνα 72: error wordpress

Στο σημείο αυτό απλά πρέπει να πατήσουμε ‘create a configuration file’.

Εικόνα 73: βήμα 2ο εγκατάστασης wordpress

Όπως βλέπουμε στην εικόνα 73 , στο δεύτερο βήμα πατάμε ‘Let’s go!’

http://wordpress.org/download/

http://localhost/wordpress/




Στο τρίτο βήμα , όπως βλέπουμε και στην εικόνα 74, βάζουμε τα στοιχεία της βάσης που δημιουργήσαμε νωρίτερα. Μετά πατάμε submit και τέλος run the install.


Στο 4ο βήμα, όπως βλέπουμε και στην εικόνα 75, δίνουμε τίτλο στη σελίδα μας και βάζουμε το email μας.



Εικόνα 76: username και password σελίδας

Μόλις τελειώσει η εγκατάσταση, το WordPress θα μας επιστρέψει το username και το password μας. Καλό είναι το password να το αποθηκεύσουμε κάπου, αφού θα το χρειαστούμε τουλάχιστον μια φορά για να εισέλθουμε στην σελίδα διαχείρησης. Πατώντας Log In θα βρεθούμε στην σελίδα εισόδου για την περιοχή διαχείρησης του ιστότοπου μας http://localhost/wordpress/wp-login.php (βλ. εικόνα 76).

Εικόνα 77: είσοδος με κωδικό

Τέλος, με τον κωδικό που μας έδωσε το wordpress για τη σελίδα κάνουμε login. Ο κωδικός που μας έδωσε είναι αυτόματος και συστήνεται φυσικά να τον αλλάξουμε. Η εγκατάσταση ολοκληρώθηκε με επιτυχία.

http://localhost/wordpress/wp-login.php%20%28�?

ΙΣΤΟΣΕΛΙΔΑ ΚΠΕ...

Documents

Transcript of ΙΣΤΟΣΕΛΙΔΑ ΚΠΕ...