Fragmentation and Exclusion: Understanding and Overcoming the Multiple Impacts of the European Crisis (Fragmex)

Μέγεθος: px

Εμφάνιση ξεκινά από τη σελίδα:

Download "Fragmentation and Exclusion: Understanding and Overcoming the Multiple Impacts of the European Crisis (Fragmex)"

Σταματία Αθανασιάδης
8 χρόνια πριν
Προβολές:

1 Fragmentation and Exclusion: Understanding and Overcoming the Multiple Impacts of the European Crisis (Fragmex) Π3.4: Website Έκδοση 0.1 R Νοέμβριος- 2015

2 . 2

3 ΠΙΝΑΚΑΣ ΙΣΤΟΡΙΚΟΥ ΕΚΔΟΣΗ ΗΜΕΡΟΜΗΝΙΑ ΣΥΓΓΡΑΦΕΙΣ ΠΑΡΑΤΗΡΗΣΕΙΣ /05/2014 Ζαφειροπούλου Μαρία Καμέας Αχιλλέας Μαρίνη Ιωάννα Σερεμέτη Λαμπρινή Στεφανής Βασίλης /11/2015 Καμέας Αχιλλέας Στεφανής Βασίλης Μαρίνη Ιωάννα Σερεμέτη Λαμπρινή 3

4 4

5 ΠΕΡΙΛΗΨΗ Στο παρόν παραδοτέο παρουσιάζεται ο σχεδιασμός και η ανάπτυξη του επίσημου ιστοχώρου του έργου Fragmex. Αρχικά δίνονται με συνοπτικό τρόπο κάποιες τεχνικές λεπτομέρειες για την υλοποίηση του ιστοχώρου, όπως οι τεχνολογίες υλοποίησης και πληροφορίες για τη φιλοξενία του. Στη συνέχεια παρουσιάζονται αναλυτικά οι διάφορες ενότητες του ιστοχώρου. 5

6 6

7 ΠΙΝΑΚΑΣ ΠΕΡΙΕΧΟΜΕΝΩΝ Εισαγωγή... 9 Τεχνική περιγραφή... 9 Δομή του ιστοχώρου Αρχική σελίδα Περιγραφή του έργου Εταίροι Νέα Παραδοτέα Επικοινωνία Επίλογος

8 8

9 Σχεδιασμός και ανάπτυξη του επίσημου ιστοχώρου του έργου Fragmex Εισαγωγή Στα πλαίσια του έργου Fragmex σχεδιάστηκε και αναπτύχθηκε ο επίσημος ιστοχώρος του έργου. Ο ιστοχώρος είναι προσβάσιμος στην ηλεκτρονική διεύθυνση (το domain αγοράστηκε στα πλαίσια του έργου) και αποτελεί το σημείο στο οποίο ο κάθε ενδιαφερόμενος μπορεί να αναζητήσει αναλυτικές πληροφορίες για το έργο, να ενημερωθεί για εκδηλώσεις και λοιπά νέα καθώς και να επικοινωνήσει με τους εταίρους που υλοποιούν το έργο. Στις επόμενες ενότητες θα παρουσιαστεί αναλυτικά η δομή του ιστοχώρου και θα δοθούν συνοπτικά τεχνικές λεπτομέρειες για την υλοποίησή του. Τεχνική περιγραφή Ο ιστοχώρος του έργου έχει υλοποιηθεί με χρήση των τεχνολογιών HTML/HTML5, CSS 3, JavaScript καθώς και με χρήση της server side γλώσσας προγραμματισμού PHP, η οποία επιτρέπει τη δυναμική εμφάνιση περιεχομένου. Ο ιστοχώρος είναι συμβατός με τις τελευταίες εκδόσεις όλων των δημοφιλών φυλλομετρητών όπως Internet Explorer, Mozilla Firefox, Google Chrome, Apple Safari και Opera. Επίσης είναι δυνατή και η πλοήγηση μέσω κινητών συσκευών (smartphones, tablets). Τέλος, για την εμφάνιση του ιστοχώρου (presentation layer), αγοράστηκε στα πλαίσια του έργου ένα web template το οποίο παραμετροποιήθηκε από την ομάδα εργασίας του ιστοχώρου σε μεγάλο βαθμό, ώστε να καλύπτει τις προδιαγραφές που είχαν τεθεί. Η φιλοξενία του ιστοχώρου γίνεται σε έναν ανεξάρτητο εικονικό εξυπηρετητή (virtual machine) με λειτουργικό σύστημα Ubuntu Linux 12.04, ο οποίος έχει δημιουργηθεί στην υποδομή εικονικών μηχανών του Ελληνικού Ανοικτού Πανεπιστημίου (ΕΑΠ). Για την υποδομή του εξυπηρετητή έχει εξασφαλιστεί αδιάλειπτη παροχή ρεύματος με χρήση UPS ενώ η σύνδεση στο διαδίκτυο γίνεται μέσω της κεντρικής διαδικτυακής υποδομής του ΕΑΠ (σύνδεση 1 Gbit) και κατ επέκτασης του Εθνικού Δικτύου Έρευνας και Τεχνολογίας (ΕΔΕΤ). 9

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

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

11 Εικόνα 2. Η αρχική σελίδα στη γερμανική γλώσσα Όλες οι σελίδες του ιστοχώρου, νοητά, είναι χωρισμένες σε 3 περιοχές. Η πρώτη και η τρίτη περιοχή είναι κοινές για όλες τις σελίδες του ιστοχώρου. Η πρώτη περιοχή είναι επί της ουσίας το πάνω μέρος της σελίδας (κεφαλίδα), όπου υπάρχει το κύριο μενού πλοήγησης με τις εξής επιλογές: Home Project description Partners News Deliverables Contact us Κάθε φορά, η ενεργή επιλογή στο μενού εμφανίζεται με γαλάζια γράμματα ενώ οι υπόλοιπες με λευκά. Τέλος, ακριβώς από κάτω υπάρχει το επίσημο λογότυπο του έργου και ο πλήρης τίτλος, συνοδευόμενος από ένα γραφικό. 11

12 Η δεύτερη περιοχή, είναι το κύριο μέρος της κάθε σελίδας όπου εμφανίζεται το εκάστοτε περιεχόμενο. Στην αρχική σελίδα, η δεύτερη περιοχή έχει χωριστεί σε δύο στήλες, η μία καταλαμβάνει το 30% του συνολικού πλάτους και η άλλη το 70%. Στην πρώτη στήλη υπάρχει η επιλογή αλλαγής γλώσσας. Ο ιστότοπος του έργου είναι διαθέσιμος στα Αγγλικά και στα Γερμανικά, ενώ υπάρχει αρκετό υλικό και στην Ελληνική γλώσσα, κυρίως στις ενότητες News και Deliverables. Πέρα από τη δυνατότητα αλλαγής γλώσσας στην αρχική σελίδα, έχει ενσωματωθεί η δυνατότητα αλλαγής γλώσσας και σε όλες τις υπόλοιπες σελίδες, όπως φαίνεται ενδεικτικά στην παρακάτω εικόνα. Εικόνα 3. Αλλαγή γλώσσας ανά σελίδα Πέρα από τη δυνατότητα αλλαγής γλώσσας με επιλογή της αντίστοιχης σημαίας, ακριβώς από κάτω υπάρχει ένα γραφικό το οποίο αποτελεί σύνδεσμο προς την πλατφόρμα κοινωνικής δικτύωσης που υλοποιήθηκε στα πλαίσια του έργου. Κατόπιν, υπάρχει σύνδεσμος προς τη σελίδα με όλες τις πληροφορίες για το τελικό συνέδριο του έργου που πραγματοποιήθηκε στις 25/11/2015 στην Αθήνα. Ο ίδιος σύνδεσμος είναι διαθέσιμος και στη σελίδα των νέων (ενότητα News ). Στη συνέχεια, υπάρχει σύνδεσμος προς την επίσημη παρουσία του έργου στο κοινωνικό δίκτυο Facebook ενώ ο επισκέπτης μπορεί να κάνει και απευθείας «Like» τη σελίδα, χωρίς να χρειαστεί να εγκαταλείψει τον ιστοχώρο. Στη σελίδα του έργου στο Facebook, γίνεται ανάρτηση όλων των εκδηλώσεων που αφορούν το έργο, ώστε οι ενδιαφερόμενοι να ενημερώνονται άμεσα στο λογαριασμό τους στο Facebook, χωρίς να χρειάζεται να επισκέπτονται τακτικά τον επίσημο ιστοχώρο του έργου. Ακριβώς από κάτω, υπάρχουν οι τίτλοι των φορέων χρηματοδότησης του έργου καθώς και τα λογότυπά τους, τα οποία αποτελούν και σύνδεσμο προς τις αντίστοιχες επίσημες σελίδες 12

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

14 Περιγραφή του έργου Εικόνα 4. Περιγραφή του έργου Στη συγκεκριμένη σελίδα παρουσιάζονται τα βασικά task του έργου και στη συνέχεια υπάρχει μία συνοπτική περιγραφή για κάθε ένα από το τρία πακέτα εργασίας του έργου (WP1, 2 και 3). 14

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

16 Νέα Εικόνα 6. Η σελίδα με τα νέα Στη συγκεκριμένη σελίδα αναρτώνται, σε αντίστροφη χρονολογική σειρά, ειδήσεις σχετικές με το έργο, όπως εκδηλώσεις κλπ. Για κάθε είδηση, υπάρχει ένας τίτλος, η ημερομηνία και μία σύντομη περιγραφή. Στο τέλος της περιγραφής υπάρχει ο σύνδεσμος «περισσότερα» ο οποίος οδηγεί σε μία νέα σελίδα όπου παρουσιάζεται αναλυτικά η συγκεκριμένη είδηση, ενώ υπάρχει και σύνδεσμος για επιστροφή στην κεντρική σελίδα των νέων. Στην παρακάτω εικόνα φαίνεται ο τρόπος παρουσίασης ενός άρθρου της ενότητας των νέων. 16

17 Εικόνα 7. Παράδειγμα παρουσίασης των νέων του έργου 17

18 Παραδοτέα Στη συγκεκριμένη ενότητα έχουν αναρτηθεί όλα τα παραδοτέα του έργου. Στην αγγλική έκδοση της σελίδας υπάρχουν τα αγγλικά παραδοτέα καθώς και τυχόν ελληνικές μεταφράσεις τους, ενώ στη γερμανική έκδοση της σελίδας τα γερμανικά. Όπως φαίνεται και στην παρακάτω εικόνα, για κάθε παραδοτέο υπάρχει ο τίτλος του, ο συγγραφέας ή οι συγγραφείς, το όνομα του εταίρου καθώς και η ημερομηνία του παραδοτέου. Αμέσως μετά, υπάρχει ο σύνδεσμος για το πλήρες κείμενο του παραδοτέου καθώς και η πληροφορία για μέγεθος του αρχείου. Τέλος, σε αρκετά παραδοτέα υπάρχουν περισσότερες από μία εκδόσεις καθώς και η ελληνική έκδοση των παραδοτέων. Εικόνα 8. Τα παραδοτέα του έργου 18

19 Επικοινωνία Εικόνα 9. Η φόρμα επικοινωνίας στη γερμανική γλώσσα Η τελευταία σελίδα του ιστοχώρου είναι αυτή με τη φόρμα επικοινωνίας, όπως φαίνεται στην παραπάνω εικόνα. Ο επισκέπτης του ιστοχώρου, αν θέλει να στείλει ένα μήνυμα στους εταίρους του έργου μπορεί να συμπληρώσει την παραπάνω φόρμα. Στο τέλος της φόρμας, έχει ενσωματωθεί το τεστ ReCAPTCHA της Google, ώστε να εμποδίζεται η κακόβουλη χρήση της από προγράμματα, για την αποστολή μαζικών μηνυμάτων (spam). 19

20 Επίλογος Στο παρόν παραδοτέο παρουσιάστηκε ο τρόπος με τον οποίο σχεδιάστηκε και αναπτύχθηκε ο επίσημος ιστοχώρος του έργου Fragmex. Συγκεκριμένα, παρουσιάστηκαν συνοπτικά τεχνικές λεπτομέρειες της υλοποίησης και στη συνέχεια αναλυτικά η δομή του ιστοχώρου καθώς και κάθε σελίδα ξεχωριστά. 20

Σχετικά έγγραφα

Fragmentation and Exclusion: Understanding and Overcoming the Multiple Impacts of the European Crisis (Fragmex)

Fragmentation and Exclusion: Understanding and Overcoming the Multiple Impacts of the European Crisis (Fragmex) Π3.5: Social networking electronic platform Έκδοση 0.1 R-2015-11 ΝΟΕΜΒΡΙΟΣ 2015 . 2 ΠΙΝΑΚΑΣ