SlideShare a Scribd company logo
1 of 62
Download to read offline
ΤΕΧΝΟΛΟΓΙΚΟ ΕΚΠΑΙΔΕΥΤΙΚΟ ΙΔΡΥΜΑ ΠΕΙΡΑΙΑ
Τ.Ε.Ι ΠΕΙΡΑΙΑ
ΚΑΤΑΣΚΕΥΗ ΗΛΕΚΤΡΟΝΙΚΗΣ ΣΕΛΙΔΑΣ ΜΕ
ΕΝΣΩΜΑΤΩΜΕΝΟ ΔΙΑΔΡΑΣΤΙΚΟ ΦΟΡΟΥΜ ΜΕ
JOOMLA
SITE WITH EMBEDDED FORUM CONSTRUCTION
WITH JOOMLA
ΓΡΗΓΟΡΟΠΟΥΛΟΣ ΜΙΧΑΗΛ
ΕΠΙΒΛΕΠΟΝ: Ι.Δ ΑΓΓΕΛΟΠΟΥΛΟΣ
ΠΤΥΧΙΑΚΗ ΕΡΓΑΣΙΑ
ΣΧΟΛΗ ΤΕΧΝΟΛΟΓΙΚΩΝ ΕΦΑΡΜΟΓΩΝ
ΤΜΗΜΑ ΑΥΤΟΜΑΤΙΣΜΟΥ
ΔΕΚΕΜΒΡΙΟΣ 2013
2 | Σ ε λ ί δ α
ΤΜΗΜΑ ΜΗΧΑΝΙΚΩΝ ΑΥΤΟΜΑΤΙΣΜΟΥ
Π. Ράλλη & Θηβών 250, 12244 Αιγάλεω , Αθήνα – Ελλάδα
Τηλ. 210-5381488
Περίληψη
Στόχος της παρούσας πτυχιακής εργασίας, αποτελεί η ανάπτυξη μίας ιστοσελίδας
με χρήση CMS ανοιχτού κώδικα (Joomla) και με ενσωματωμένο Φόρουμ. Για την
ενσωμάτωση του Φόρουμ στην ιστοσελίδα, θα χρησιμοποιηθεί η εφαρμογή Kunena
Forums, με αρκετές τροποποιήσεις τόσο στον κώδικα CSS και τα αρχεία γλώσσας
όσο και στον κώδικα PHP της εφαρμογής.
Αρχικά θα γίνει μία ιστορική αναδρομή στην εξέλιξη των Φόρουμ και στα
λογισμικά που εμφανίστηκαν μέχρι σήμερα και επίσης θα γίνει ανάλυση της
λειτουργίας των σύγχρονων Φόρουμ.
Εν συνεχεία θα μελετηθούν και θα παρουσιαστούν οι αρχές σχεδιασμού μιας
ιστοσελίδας. Για να καταφέρουμε να έχουμε ένα άρτιο αποτέλεσμα στον σχεδιασμό
και επίσης για να καταφέρουμε να κατασκευάσουμε μια ιστοσελίδα φιλική προς τον
χρήστη και με υψηλή επισκεψιμότητα, θα πρέπει να αναλυθούν τα χαρακτηριστικά
και οι στόχοι της ιστοσελίδας και να καθοριστούν οι μέθοδοι για την ανάπτυξη και
τον σχεδιασμό της. Σημαντικά κομμάτια αποτελούν η εργονομία, η αισθητική, καθώς
και το κομμάτι του SEO της ιστοσελίδας.
Θα παρουσιαστούν αναλυτικά τα πλεονεκτήματα της χρήσης συστημάτων
διαχείρισης περιεχομένου και θα επικεντρωθούμε κυρίως στο CMS ανοιχτού κώδικα
που ονομάζεται Joomla. Θα επεξηγηθούν οι λειτουργίες του και θα παρουσιαστεί
ένας αναλυτικός οδηγός εγκατάστασης της εφαρμογής. Ενδεικτικά θα παρουσιαστούν
και κάποιες συμβουλές για αύξηση της ασφάλειας του ιστότοπου.
Τέλος, θα γίνει παρουσίαση του αποτελέσματος και ένας αναλυτικός οδηγός για
τις βασικές λειτουργίες του Φόρουμ που κατασκευάσαμε.
3 | Σ ε λ ί δ α
Περιεχόμενα
Περίληψη........................................................................................................................2
1. Εισαγωγή.....................................................................................................................5
1.1 Φόρουμ (Forum) ....................................................................................................... 5
1.2 Ιστορική Αναδρομή ................................................................................................... 6
1.3 Δομή και λειτουργία.................................................................................................. 7
1.3.1 Όροι Χρήσης............................................................................................................. 7
1.3.2 Δομή ......................................................................................................................... 7
1.3.3 Κατηγορίες Χρηστών................................................................................................ 8
1.3.4 Εγγραφή Χρήστη....................................................................................................... 8
1.3.5 Προφίλ Χρήστη......................................................................................................... 8
1.3.6 Προσωπικά Μηνύματα (Personal Messages – PMs)................................................ 8
Αναφορές 1ου Κεφαλαίου.................................................................................................... 9
2. Αρχές Σχεδιασμού Ιστοσελίδων.................................................................................. 10
2.1 Ιστοσελίδα - Χαρακτηριστικά........................................................................................ 10
2.2 Στόχοι και Χαρακτηριστικά Ιστότοπου.......................................................................... 11
2.3 Μεθοδολογία για την ανάπτυξη και τον σχεδιασμό .................................................... 11
2.4 Εργονομία και αισθητική ιστοσελίδων......................................................................... 12
2.5 SEO................................................................................................................................. 13
2.6 Τεχνολογίες και εργαλεία ............................................................................................. 15
2.6.1 Apache.................................................................................................................... 15
2.6.2 MySQL..................................................................................................................... 16
2.6.3 PHP ......................................................................................................................... 17
2.6.4 CSS .......................................................................................................................... 17
2.6.5 PhpMyAdmin.......................................................................................................... 17
Αναφορές 2ου Κεφαλαίου.................................................................................................. 18
3. Η πλατφόρμα Joomla................................................................................................ 19
3.1 Γενικά για το Joomla...................................................................................................... 19
4 | Σ ε λ ί δ α
3.2 Η δομή του Joomla........................................................................................................ 21
3.2.1 Διεπαφή χρηστών................................................................................................... 21
3.2.2 Διεπαφή διαχειριστών ........................................................................................... 21
3.2.3 Πρότυπα (Templates)............................................................................................. 21
3.2.4 Επεκτάσεις (Extentions) ......................................................................................... 22
3.3 Εγκατάσταση Joomla..................................................................................................... 22
3.3.1 Δημιουργία βάσης δεδομένων .............................................................................. 22
3.3.2 Μεταφόρτωση και εγκατάσταση Joomla............................................................... 24
3.4 Διαχείριση Περιεχομένου ............................................................................................. 29
3.4.1 Δημιουργία κατηγοριών......................................................................................... 29
3.4.2 Δημιουργία Άρθρων............................................................................................... 31
3.4.3 Διαχείριση Μενού .................................................................................................. 32
3.5 Ασφάλεια Ιστοσελίδας.................................................................................................. 35
3.5.1 Χωρίς joomla generator tag ................................................................................... 35
3.5.2 Προστασία αρχείου configuration.php.................................................................. 35
Αναφορές 3ου Κεφαλαίου.................................................................................................. 37
4. Το Φόρουμ Vespophrenia.gr ...................................................................................... 38
4.1 Template / Πρότυπο...................................................................................................... 38
4.2 Modules / Ενθέματα...................................................................................................... 43
4.3 Add-ons / Πρόσθετα...................................................................................................... 44
4.4 Components / Εφαρμογές............................................................................................. 46
4.4.1 Γενικά...................................................................................................................... 46
4.4.2 Kunena Component................................................................................................ 47
4.5 Παρουσίαση του Φόρουμ............................................................................................. 49
4.5.1 Εγγραφή Χρήστη..................................................................................................... 49
4.5.2 Προφίλ Χρήστη....................................................................................................... 52
4.5.3 Προσωπικά Μηνύματα .......................................................................................... 53
4.5.4 Ανάγνωση Θεμάτων και Δημιουργία Νέων ........................................................... 56
4.5.5 Αναφορά σε συντονιστή......................................................................................... 59
Αναφορές 4ου Κεφαλαίου.................................................................................................. 62
5 | Σ ε λ ί δ α
1. Εισαγωγή
Καθώς το internet εισχωρεί καθημερινά στη ζωή μας όλο και περισσότερο, η
ανάγκη κατασκευής ιστοσελίδων αυξάνεται προκειμένου να εξυπηρετηθεί η
ανάρτηση πληροφοριών ή οπτικοακουστικού υλικού, η ενημέρωση, η προώθηση μιας
επιχείρησης, η κοινωνική δικτύωση αλλά και οποιαδήποτε άλλη δραστηριότητα
μπορεί να εκφραστεί διαδικτυακά.
Η ανάγκη για ευκολότερη και πιο γρήγορη κατασκευή – διαχείριση ιστοσελίδων,
οδήγησε στην εξέλιξη των Συστημάτων Διαχείρισης Περιεχομένου (Content
Management System – CMS). Το CMS είναι ένα πακέτο λογισμικού σχεδιασμένο για
την διαχείριση ενός ιστότοπου. Διαχειρίζεται ολόκληρο τον κύκλο ζωής μιας
ιστοσελίδας, από την δημιουργία της μέχρι και την αρχειοθέτηση της.[1]
Στην παρούσα εργασία θα μελετηθεί η κατασκευή μίας ιστοσελίδας με χρήση
CMS ανοιχτού κώδικα (Joomla) και με ενσωματωμένο φόρουμ που θα αναφέρεται
στους λάτρες του κλασικού μοτοσυκλετισμού και συγκεκριμένα σε ένα δίκυκλο το
οποίο έγραψε ιστορία στον χώρο αυτό, την γνωστή σε όλους μας Vespa της Piaggio.
1.1 Φόρουμ (Forum)
Το Φόρουμ (Forum) είναι ένας διαδικτυακός τόπος συνάθροισης ανθρώπων,
διαμοιρασμού ιδεών και απόψεων. Είναι μια υπηρεσία ενός ηλεκτρονικού
διαδικτυακού πίνακα όπου χρήστες με κοινά και όχι μόνο ενδιαφέροντα, μπορούν να
τοποθετήσουν τις απόψεις και σημειώσεις τους πάνω σε ένα ή περισσότερα θέματα.
Αποτελεί ένα διαδικτυακό εργαλείο στο οποίο εγγεγραμμένα μέλη και όχι μόνο,
μπορούν να δημιουργήσουν συζητήσεις, να ανταλλάξουν απόψεις, ιδέες και να
μοιράζονται πληροφορίες για θέματα ποικίλης ύλης, λειτουργώντας ως μία
διαδικτυακή κοινότητα.
Η βασική διαφορά ενός Φόρουμ από τα chat rooms είναι ότι τα μηνύματα των
χρηστών αρχειοθετούνται έτσι ώστε να μπορούν οι χρήστες του διαδικτύου να
ανατρέξουν σε αυτά οποιαδήποτε στιγμή χρειαστεί.
6 | Σ ε λ ί δ α
Με την ανάπτυξη των Φόρουμ, αναπτύχθηκε και η γλώσσα η οποία σχετίζεται με
αυτά. Για παράδειγμα, μία συζήτηση ονομάζεται Thread (Νήμα) ή Topic (Θέμα).
1.2 Ιστορική Αναδρομή
Τα σύγχρονα Φόρουμ, προέρχονται από τα Bulletin Boards που είναι η
τεχνολογική εξέλιξη του dial up Bulletin Board συστήματος που αναπτύχθηκε στα
τέλη της δεκαετίας του ‘70. [2]
Τα πρώιμα διαδικτυακά Φόρουμ, μπορούν να περιγραφούν ως οι web εκδόσεις
από ηλεκτρονικές λίστες αλληλογραφίας ή newsgroups που επέτρεπαν στους χρήστες
τους να δημοσιεύσουν μηνύματα ή σχόλια στα μηνύματα άλλων χρηστών.
Ένα από τα πρώτα διαδικτυακά Φόρουμ που πλησίαζε την μορφή των σημερινών
Φόρουμ ήταν το “Delphi Forums” το οποίο το 1983 απαριθμούσε 4.000.000
εγγεγραμμένους χρήστες. Τα Φόρουμ στη σημερινή τους μορφή άρχισαν να
εμφανίζονται και να εξελίσσονται περίπου από το 1994 με την ανάπτυξη του WIT
Project από την W3 Consortium (Διεθνής Κοινότητα Προτυποποίησης Διαδικτύου).
Από το 1994 και μετά αναπτύχθηκαν πολλές εναλλακτικές πλατφόρμες (Εικόνα 1).
[3]
Εικόνα 1: Χρονικό διάγραμμα ανάπτυξης λογισμικών για φόρουμ
7 | Σ ε λ ί δ α
Με την ανάπτυξη σχετικών εφαρμογών, αρχίζουν να δημιουργούνται
διαδικτυακές κοινότητες γύρω από τα Φόρουμ τα οποία πλέον έχουν σταθερούς
χρήστες. Η θεματολογία του κάθε φόρουμ ποικίλει. Δημιουργούνται Φόρουμ
τεχνολογίας, αθλητισμού, παιχνιδιών, μουσικής, μόδας, θρησκείας, πολιτικής και
γενικής θεματολογίας με αποτέλεσμα να φτάσουμε στην σημερινή μορφή των
Φόρουμ.
1.3 Δομή και λειτουργία
Τα Φόρουμ προωθούν την ανοιχτή και ελεύθερη συζήτηση και συχνά υιοθετούν
γενικά πρότυπα. Τα πιο συχνά θέματα που μπορεί να συναντήσει κάποιος σε ένα
φόρουμ περιέχουν ερωτήσεις, συγκρίσεις, ψηφοφορίες σχετικά με την γνώμη των
μελών σε κάποιο συγκεκριμένο ζήτημα και δημόσιες συζητήσεις.[2]
1.3.1 Όροι Χρήσης
Η λειτουργία ενός φόρουμ είναι σημαντικό να διέπεται από κανόνες έτσι ώστε να
μην ξεφεύγουν οι συζητήσεις σε σημείο που παραβιάζονται προσωπικά δεδομένα
μελλών ή τρίτων, προσβάλλονται μέλη ή τρίτοι, παρακωλύεται η εύρυθμη λειτουργία
της ιστοσελίδας ή παραβιάζεται η νομοθεσία που διέπει το διαδίκτυο. Για την
αποφυγή όλων των παραπάνω, θεσπίζονται οι όροι χρήσης του Φόρουμ τους οποίους
αποδέχεται κάθε χρήστης με την εγγραφή του. Οι διαχειριστές του φόρουμ διατηρούν
το δικαίωμα να αποκλείσουν κάποιον χρήστη (Ban) είτε για ορισμένο χρονικό
διάστημα είτε επ’ αόριστον, εάν αυτός δεν τηρεί τους όρους αυτούς. Μερικοί από
τους όρους που μπορεί να συναντήσει κάποιος σε ένα φόρουμ είναι οι εξής:
 Απαγορεύεται η δημιουργία περισσότερων του ενός λογαριασμού πρόσβασης
 Απαγορεύονται τα μηνύματα για παράνομο λογισμικό, λογισμικό
εξουδετέρωσης προστασίας, ή αναφέρονται σε παράνομη απόκτηση προστατευμένου
περιεχόμενου.
 Απαγορεύονται οι διαφημίσεις στα μηνύματα
 Απαγορεύεται η δημοσίευση προσωπικών δεδομένων άλλου μέλους ή τρίτων
χωρίς πρώτα να έχει ζητηθεί η άδεια τους.
 Απαγορεύεται η ανάρτηση φωτογραφιών με ακατάλληλο για ανηλίκους
περιεχόμενο, ρατσιστικό ή θρησκευτικό περιεχόμενο καθώς και προσωπικά δεδομένα
τρίτων των οποίων δεν έχει πρώτα ζητηθεί η άδεια.
1.3.2 Δομή
Ένα Φόρουμ δομείται ιεραρχικά ή με την μορφή δέντρου. Μπορεί να περιέχει
Subforums (Υποκατηγορίες) οι οποίες με την σειρά τους θα περιέχουν πολλά Topics
8 | Σ ε λ ί δ α
(Θέματα) μέσα στα οποία θα υπάρχουν πολλαπλά Threads (Νήματα). Σε κάθε νέο
Thread που ξεκινάει από έναν χρήστη, οι υπόλοιποι χρήστες, καθώς και ο δημιουργός
του Thread, μπορούν να δημοσιεύσουν πολλαπλά μηνύματα (Posts) ή απαντήσεις.
1.3.3 Κατηγορίες Χρηστών
Οι χρήστες ενός Φόρουμ χωρίζονται σε κατηγορίες όπως:
 Επισκέπτες – Επισκέπτες είναι αυτοί που επισκέπτονται τον ιστότοπο και δεν
έχουν πραγματοποιήσει εγγραφή.
 Μέλη – Είναι όσοι έχουν πραγματοποιήσει εγγραφή και έχουν συγκεκριμένα
δικαιώματα. Αναλόγως την συμμετοχή τους στο φόρουμ, αποκτούν βαθμό (Rank).
 Συντονιστές (Moderators) – Είναι αυτοί που τους έχει εκχωρηθεί το δικαίωμα
να συντονίζουν συζητήσεις, να επεξεργάζονται τις κατηγορίες, τις υποκατηγορίες και
τις αναρτήσεις των μελών.
 Διαχειριστές Ιστότοπου (Administrators) – Είναι οι διαχειριστές ολόκληρου
του ιστότοπου που έχουν πλήρη δικαιώματα στην επεξεργασία όλων των κατηγοριών,
των υποκατηγοριών των αναρτήσεων και είναι υπεύθυνοι για την εύρυθμη
λειτουργία της ιστοσελίδας.
1.3.4 Εγγραφή Χρήστη
Για να μπορεί να δημοσιεύσει την άποψη του κάποιος σε ένα Φόρουμ, πρέπει να
πραγματοποιήσει εγγραφή. Κατά την εγγραφή ζητείται υποχρεωτικά από τον χρήστη
να δηλώσει μία διεύθυνση ηλεκτρονικού ταχυδρομείου, ένα όνομα χρήστη
(Username) και ένα κωδικό πρόσβασης (Password) καθώς επίσης και να αποδεχτεί
τους όρους χρήσης του φόρουμ. Προαιρετικά ζητείται από τον χρήστη να δηλώσει το
όνομα του και κάποια προσωπικά του στοιχεία όπως την ημερομηνία γέννησης του,
μία φωτογραφία του ή κάποια υπογραφή που θα ενσωματώνεται στα μηνύματα του.
1.3.5 Προφίλ Χρήστη
Ο κάθε χρήστης έχει την δυνατότητα δημιουργίας προσωπικού προφίλ στο οποίο
μπορεί να δημοσιεύσει προσωπικές πληροφορίες, φωτογραφία, στοιχεία επικοινωνίας
και κάποια υπογραφή που θα ενσωματώνεται στα μηνύματα του. Με αυτό τον τρόπο
μπορεί κάθε εγγεγραμμένος χρήστης να επισκεφτεί το προφίλ ενός άλλου χρήστη για
να δει κάποια στοιχεία για αυτόν.
1.3.6 Προσωπικά Μηνύματα (Personal Messages – PMs)
9 | Σ ε λ ί δ α
Τα προσωπικά μηνύματα είναι μηνύματα τα οποία απευθύνονται σε έναν μόνο
χρήστη και δεν είναι δημόσια. Με την χρήση προσωπικών μηνυμάτων, μπορούν δύο
χρήστες να επικοινωνήσουν μεταξύ τους χωρίς να βρίσκεται σε κοινή θέα η
συζήτηση τους. Τα προσωπικά μηνύματα λειτουργούν περίπου σαν μια υπηρεσία
ηλεκτρονικού ταχυδρομείου (webmail) και χωρίζονται σε εισερχόμενα (inbox),
εξερχόμενα (outbox) και διαγραμμένα (deleted). [2]
Αναφορές 1ου Κεφαλαίου
1. http://www.slideshare.net/rodotheos/cms-421346 , προσπέλαση 19/11/2013
2. http://en.wikipedia.org/wiki/Internet_forum, προσπέλαση 19/11/2013
3. http://www.forum-software.org/forum-software-timeline-from-1994-to-today,
προσπέλαση 19/11/2013
10 | Σ ε λ ί δ α
2. Αρχές Σχεδιασμού Ιστοσελίδων
Παλαιότερα, για την δημιουργία μιας ιστοσελίδας, χρειάζονταν η εξειδικευμένη
γνώση γραφής κώδικα σε HTML. Πλέον με τα Συστήματα Διαχείρισης Περιεχομένου
ο δημιουργός – διαχειριστής δεν χρειάζεται εξειδικευμένες γνώσεις και μπορεί να
επιτύχει ιστότοπους μεγάλης αισθητικής με γνώσεις μορφοποίησης κειμένου και
απλού χειρισμού ενός CMS. Πριν γνωρίσουμε τα CMS, θα δούμε τις ενέργειες που
χρειάζεται να γίνουν για την δημιουργία ενός ιστότοπου. Ο σχεδιασμός και η έρευνα
αλλά και τα εργαλεία που θα χρησιμοποιηθούν, είναι ίσως τα σημαντικότερα στοιχεία
στην κατασκευή ενός λειτουργικού και φιλικού προς τον χρήστη ιστότοπου.[1]
2.1 Ιστοσελίδα - Χαρακτηριστικά
Ιστοσελίδα είναι το έγγραφο – πληροφορία η οποία προορίζεται για τον
Παγκόσμιο Ιστό (WWW). Ένα σύνολο ιστοσελίδων, δημιουργούν έναν ιστότοπο.
Μία ιστοσελίδα μπορεί να είναι δυναμική ή στατική. Η επιλογή για το είδος που θα
χρησιμοποιηθεί πρέπει να γίνει κατά κύριο λόγο από το κατά πόσο συχνά θα
ανανεώνουμε την πληροφορία που θα εμπεριέχει ο ιστότοπος.
Οι στατικές σελίδες χαρακτηρίζονται από την μονιμότητα του περιεχομένου τους
και της διάταξής τους. Κυρίως χρησιμοποιείται για την γραφή τους η γλώσσα
σήμανσης HTML(HyperText Markup Language), η οποία δημιουργήθηκε από την
IBM για την τυποποιημένη εμφάνιση των κειμένων της, αλλά και κάποιο πρόγραμμα
με κειμενογράφο WYSIWYG (What You See Is What You Get) όπως είναι το
Macromedia / Adobe Dreamweaver. Είναι κατάλληλες για γενικές παρουσιάσεις και
για ιστότοπους που το περιεχόμενο τους δεν χρειάζεται συχνά ανανέωση. [2],[3]
Τα κυριότερα χαρακτηριστικά μιας στατικής σελίδας είναι:
 Χαμηλό κόστος κατασκευής.
 Χαμηλό κόστος φιλοξενίας.
 Γρήγορη κατασκευή.
 Εύκολη κατασκευή.
 Γρήγορη προβολή της σελίδας.
11 | Σ ε λ ί δ α
 Δυσκολία ανανέωσης περιεχομένου.
 Δυσκολία υποστήριξης μεγάλου περιεχομένου.
Οι δυναμικές ιστοσελίδες χαρακτηρίζονται από την διαδραστικότητα που
υπάρχει μεταξύ χρήστη και σελίδας. Για την δημιουργία του χρησιμοποιούνται
διάφορες γλώσσες σεναρίων όπως είναι η ASP, JSP, Perl ή PHP. Όλες οι
πληροφορίες για τις σελίδες αποθηκεύονται σε βάσεις δεδομένων όπου οι χρήστες
μπορούν να τις διαχειρίζονται μέσω των Συστημάτων Διαχείρισης Περιεχομένου. Οι
δυναμικές σελίδες περιέχουν και στατικό περιεχόμενο το οποίο επιλέγεται από τον
κατασκευαστή του ιστότοπου ποιο θα είναι. [2],[3]
Τα κυριότερα χαρακτηριστικά των δυναμικών ιστοσελίδων είναι:
 Εύκολη ανανέωση περιεχομένου
 Εύκολη υποστήριξη μεγάλου περιεχομένου
 Μεγάλο κόστος κατασκευής
 Μεγάλο κόστος φιλοξενίας
2.2 Στόχοι και Χαρακτηριστικά Ιστότοπου
Το πρώτο βήμα κατά το σχεδιασμό ενός ιστότοπου, είναι η ανάλυση των στόχων
και των χαρακτηριστικών του ιστότοπου. Μερικά ερωτήματα που είναι απαραίτητο
να απαντηθούν είναι τα ακόλουθα:
 Ποιος θα είναι ο στόχος ή διαφορετικά ο λόγος ύπαρξης του ιστότοπου;
 Προϊδεάζει το όνομα του ιστότοπου για την πληροφορία που θα πάρουμε;
 Ποια είναι η φύση και η ποσότητα του περιεχομένου που θα παρουσιαστεί
μέσα από αυτόν; Δηλαδή το είδος του υλικού που θα εμφανίζεται στις σελίδες του
ιστότοπου, κείμενα, φωτογραφίες, και αν θα είναι το περιεχόμενο στατικό ή θα
ανανεώνεται συχνά;
 Ποιό θα είναι το κοινό στο οποίο θα απευθύνεται; Δηλαδή ποιοι θα είναι οι
τελικοί του χρήστες, αλλά και ποιοι θα είναι οι χρήστες που θα ενημερώνουν το
περιεχόμενο του ιστότοπου;
 Ποιος είναι ο προϋπολογισμός και το χρονοδιάγραμμα ανάπτυξης;
 Ποια είναι τα διαθέσιμα μέσα (γνώσεις, τεχνικές λύσεις κλπ); Αν υπάρχουν
γνώσεις εγκατάστασης εφαρμογών και βάσεων δεδομένων, δημιουργίας ιστοσελίδων,
γνώσεις εξυπηρετητών (server) του Παγκόσμιου Ιστού και ποιες τεχνικές λύσεις
υπάρχουν στη διάθεσή μας; [4],[6],[19]
2.3 Μεθοδολογία για την ανάπτυξη και τον σχεδιασμό
12 | Σ ε λ ί δ α
Εφόσον έχει γίνει μια αρχική ανάλυση των χαρακτηριστικών του ιστότοπου που
σκοπεύουμε να αναπτύξουμε και έχει διαμορφωθεί μια πρωταρχική άποψη για τα
εργαλεία που θα χρησιμοποιήσουμε, η επιλογή των εργαλείων επιβάλλεται να γίνει
με βάση τις ανάγκες που πρέπει να καλυφθούν σε συνάρτηση με τις δυνατότητες που
υπάρχουν. Μερικές ερωτήσεις που δημιουργούνται είναι οι ακόλουθες:
 Υπάρχουν οι τεχνικές γνώσεις εγκατάστασης και παραμετροποίησης της
MySQL και του Joomla;
 Ο διακομιστής του web που θα φιλοξενήσει τον ιστότοπο, μπορεί να
υποστηρίξει MySQL, PHP και εγκατάσταση Joomla;
 Μετά την ανάπτυξη του ιστότοπου με Joomla θα είναι εφικτή η συντήρηση
και ενημέρωση των εφαρμογών του;
 Υπάρχουν προβλήματα ασφάλειας τα οποία πιθανόν να έρχονται σε
σύγκρουση με το Joomla;
 Το είδος και η ποσότητα του περιεχομένου του ιστότοπου είναι τέτοιο ώστε
να δικαιολογεί την εγκατάσταση, διαχείριση και συντήρηση συστήματος διαχείρισης
περιεχομένου;
Ο σχεδιασμός είναι ένα απολύτως απαραίτητο βήμα πριν από την οποιαδήποτε
ενέργεια ανάπτυξης λογισμικού. Η έλλειψη σχεδιασμού ή ο κακός σχεδιασμός
δημιουργεί προβλήματα και καθυστερήσεις στην πορεία του έργου, με συνέπεια το
επιπλέον κόστος. Ένας καλός και προσεκτικός σχεδιασμός λειτουργεί ως οδηγός για
την ανάπτυξη του ιστότοπου και πρέπει να περιέχει όσο γίνεται περισσότερες
λεπτομέρειες. [6]
Τα βήματα σχεδιασμού ενός δικτυακού τόπου με Joomla και όχι μόνο είναι τα
εξής:
1. Λεπτομερής ανάλυση των απαιτήσεων του ιστότοπου.
2. Σχεδίαση του δικτυακού τόπου.
3. Συλλογή – ανάπτυξη – επεξεργασία της παρεχόμενης πληροφορίας.
2.4 Εργονομία και αισθητική ιστοσελίδων
Η εργονομία ενός ιστότοπου πρέπει να περιλαμβάνεται στους κορυφαίους
στόχους κατά την δημιουργία του. Ένας επισκέπτης ο οποίος ικανοποίησε τον σκοπό
για τον οποίο επισκέφθηκε τον ιστότοπο είναι πιθανόν να το προτείνει σε φίλους και
γνωστούς, να κάνει εγγραφή ώστε να ενημερώνεται για τα νέα μας, και το κυριότερο
να επισκεφθεί ξανά τον ιστότοπο μας.
Κατά την δημιουργία ενός ιστότοπου (δεν έχει σημασία το είδος του, εμπορικό,
ενημερωτικό κ.α.) είναι βασικό η ανάπτυξη του να στηρίζεται στις απαιτήσεις των
επισκεπτών για τους οποίους προορίζεται και να είναι φιλικό στον επισκέπτη. Φιλικό
13 | Σ ε λ ί δ α
σημαίνει η πληροφορία να είναι εύκολα προσπελάσιμη, να διαβάζεται και να
κατανοείται εύκολα από τους επισκέπτες του ιστότοπου.
Πιο συγκεκριμένα ένας ιστότοπος για να θεωρηθεί ότι είναι φιλικός προς τον
χρήστη θα πρέπει να έχει κάποια συγκεκριμένα χαρακτηριστικά:
 Γρήγορη εμφάνιση σελίδων, δεν είναι όλοι οι επισκέπτες υπομονετικοί οπότε
καλό θα είναι οι σελίδες μας να περιέχουν μόνο την πληροφορία που χρειάζεται.
Παράγοντες που μπορούν να ευθύνονται για την αργή φόρτωση μπορεί να είναι
φωτογραφίες, επιπλέον flash, κώδικας Java αλλά και το μέγεθος της σελίδας.
 Πλοήγηση, δημιουργία πλοηγού μέσα στον ιστότοπο μας ώστε ο επισκέπτης
να γνωρίζει την θέση του μέσα στον ιστότοπο την κάθε στιγμή
 Χάρτης ιστότοπου, όσο και αν είναι το μέγεθος του ιστότοπου ο επισκέπτης
πρέπει με την πρώτη ματιά να αντιληφθεί τα διαφορετικά επίπεδα του ιστότοπου.
Επίσης η δημιουργία χάρτη είναι πολύ ‘φιλική’ στις μηχανές αναζήτησης.
 Αρχική, ο επισκέπτης πρέπει να έχει την δυνατότητα επιστροφής στην αρχική
σελίδα με ένα κλικ από οποιοδήποτε σημείο της. Επίσης το λογότυπο του ιστότοπου
να λειτουργεί και σαν σύνδεσμος για την αρχική σελίδα.
 Περιεχόμενο, ο ιστότοπος πρέπει να είναι όσο το δυνατόν
κατηγοριοποιημένος και να μην περιέχει διαφόρων ειδών πληροφορίες.
 Αναζήτηση, ο επισκέπτης να έχει την δυνατότητα αναζήτησης σε όλα τα
επίπεδα του ιστότοπου.
 Νέο παράθυρο (pop-up), άνοιγμα σε νέο παράθυρο μόνο για .pdf αρχεία.
 Λειτουργίες, θα πρέπει να γίνει έλεγχος ότι όλες οι φόρμες επικοινωνίας και
όλες οι λειτουργίες του ιστότοπου μας λειτουργούν σωστά.
 Γλώσσα, η γλώσσα γραφής πρέπει να είναι προσανατολισμένη για το κοινό
στο οποίο απευθύνεται ο ιστότοπος.
 Γραμματοσειρά, όχι περίεργη επιλογή η οποία θα κουράσει τον επισκέπτη.
Πρέπει να παρέχεται δυνατότητα αλλαγής του μεγέθους.
 Χρώματα, σωστή ισορροπία χρωμάτων για πιο ξεκούραστη πλοήγηση και
ανάγνωση. [5],[6]
2.5 SEO
Από τα μέσα τις δεκαετίας του ’90, με την άνθιση του διαδικτύου δημιουργήθηκε
η ανάγκη για την βελτιστοποίηση των ιστότοπων καθώς οι πρώτες μηχανές
αναζήτησης δημιουργούσαν τους πρώτους τους καταλόγους. Είτε δημιουργούμε έναν
εμπορικό ιστότοπο είτε όχι, αυτό που πρέπει να μας ενδιαφέρει είναι να μπορεί ο
επισκέπτης να εντοπίσει τον ιστότοπο μας μέσω μιας μηχανής αναζήτησης. Ο όρος
SEO (search engine optimization) αναφέρεται σε όλες τις ενέργειες που μπορούμε να
κάνουμε (θεμιτές και μη – white/black hat), ώστε ο ιστότοπος μας να γίνει πιο
14 | Σ ε λ ί δ α
αρεστός για τις μηχανές αναζήτησης, με αποτέλεσμα να εμφανίζεται υψηλότερα στη
λίστα με τα αποτελέσματα τους - SERP (Search Engine Result Page).
Στις αρχικές εκδόσεις των μηχανών αναζήτησης υπήρξε χειραγώγηση των
αποτελεσμάτων από τους κατασκευαστές ιστοσελίδων με αποτέλεσμα οι μηχανές
αναζήτησης να αρχίσουν να αναπτύσσουν τους αλγόριθμους αναζήτησης
αποκρύπτοντας τους από το κοινό. Οι αλγόριθμοι πλέον λάμβαναν υπόψη και άλλα
κριτήρια εκτός από το περιεχόμενο του ιστότοπου όπως είναι οι αναφορές που
γίνονται σε έναν ιστότοπο από άλλους ιστότοπους, με τον αλγόριθμο PageRank.
Οι ενέργειες για την βελτιστοποίηση ενός ιστότοπου που μπορούμε να κάνουμε,
διακρίνονται σε τρεις γενικές κατηγορίες:
 Σχεδίασης και περιεχομένου
 Τεχνικών χαρακτηριστικών
 Ποιότητας
Στις πρώτες δύο, δηλαδή στην σχεδίαση – περιεχόμενο και στα τεχνικά
χαρακτηριστικά, οι ενέργειες που μπορούμε να κάνουμε για την βελτιστοποίηση είναι
πάρα πολλές όπως.
 Χρήση κειμένου αντί φωτογραφίας. Οι μηχανές αναζήτησης ψάχνουν για
κείμενο και δεν διαβάζουν κείμενα μέσα σε φωτογραφίες. Αν πρέπει να γίνει χρήση
φωτογραφιών καλό είναι να υπάρχει πλούσια περιγραφή.
 Λέξεις κλειδιά. Να σκεφτούμε τις λέξεις που θα χρησιμοποιήσουν οι χρήστες
(που απευθυνόμαστε) στην αναζήτηση τους και να σιγουρευτούμε ότι τις
περιλαμβάνουμε στον ιστότοπο.
 Ακρίβεια και περιγραφικότητα. Οι τίτλοι και οι περιγραφές να είναι ακριβείς
για το περιεχόμενο τους.
 Χαλασμένοι σύνδεσμοι. Να γίνεται έλεγχος όλων των συνδέσμων (εσωτ./
εξωτ.) ότι λειτουργούν σωστά.
 Έλεγχο σε Τext Βrowser. Όλες οι μηχανές αναζήτησης βλέπουν το
περιεχόμενο μας όπως οι text browsers, οπότε η χρήση τους θα μας δώσει μια εικόνα
για την πληροφορία που μπορούν να διαβάσουν.
 If-Modified-Since. Έλεγχο ότι ο διακομιστής μας υποστηρίζει If-Modified-
Since HTTP header, ώστε να ενημερώνεται η μηχανή αναζήτησης για αλλαγή του
περιεχομένου του ιστότοπου μας.
 Ταχύτητα φόρτωσης. Στόχος των μηχανών αναζήτησης είναι να προσφέρουν
στους χρήστες τους ακρίβεια αποτελεσμάτων αλλά και καλύτερη εμπειρία χρήστη.
Πέραν της βελτιστοποίησης που μπορούμε να κάνουμε στον ιστότοπο στη
σχεδίαση, και στα τεχνικά χαρακτηριστικά μας υπάρχουν κάποιες αρχές (της
ποιότητας) οι οποίες πρέπει να ακολουθηθούν ώστε να μην τιμωρηθεί (penalized) ο
15 | Σ ε λ ί δ α
ιστότοπος μας από τις μηχανές αναζήτησης, με αποτέλεσμα την μη εμφάνιση του στα
αποτελέσματα τους. [6],[7],[8],[9],[10]
Οι βασικές αρχές είναι:
 Αποφυγή κρυφών κειμένων και συνδέσμων (hidden text/ links).
Χαρακτηριστικό παράδειγμα αυτού είναι η χρήση λευκού κειμένου σε λευκό φόντο
έτσι ώστε να εντοπισθεί από την μηχανή αναζήτησης αλλά όχι από τον επισκέπτη.
 Αποφυγή τεχνικών cloaking, sneak redirects και Doorway pages. Δηλαδή την
διαφορετική εμφάνιση περιεχομένου - διεύθυνσης στις μηχανές αναζήτησης από ότι
στους χρήστες, αλλά και την κατασκευή ιστοσελίδων φθηνού περιεχομένου με χρήση
συγκεκριμένων λέξεων κλειδιών.
 Αποφυγή χρήσης αυτοματοποιημένων ερωτημάτων. Συνήθως με χρήση
κάποιου εγκατεστημένου λογισμικού με σκοπό την απότομη άνοδο στα
αποτελέσματα των μηχανών.
 Αποφυγή ‘άσχετων’ λέξεων κλειδιών. Όπως και η υπερφόρτωση με διάφορες
λέξεις με σκοπό την καλύτερη κατάταξη.
 Αποφυγή διπλότυπου περιεχομένου. Είναι τα περιεχόμενα που υπάρχουν μέσα
στον ιστότοπο μας ή και σαν εξωτερικός σύνδεσμος τα οποία είναι αισθητά
παρόμοια.
2.6 Τεχνολογίες και εργαλεία
Για την ανάπτυξη ενός δυναμικού ιστότοπου θα χρειαστούμε κάποια εργαλεία
όπως είναι η βάση δεδομένων, ο εξυπηρετητής και η γλώσσα προγραμματισμού:
 Apache Server.
 MySQL
 PHP
 CSS
 PhpMyAdmin
2.6.1 Apache
Όταν αναφερόμαστε στον Server (εξυπηρετητή) εννοούμε τον υπολογιστή που
παρέχει υπηρεσίες σε άλλους υπολογιστές μέσα σε ένα τοπικό δίκτυο. Για τον
παγκόσμιο ιστό υπάρχουν οι web servers οι οποίοι είναι υπεύθυνοι για την εμφάνιση
των ιστοσελίδων τους. Από τους πιο γνωστούς εξυπηρετητές είναι οι Apache και IIS
(Internet Information Server).
Για την δημιουργία του Apache έπρεπε να φτάσουμε στο 1994 όταν ο Robert
McCool αποχωρεί από το πρόγραμμα HTTPd (HTTP daemon) για το National Center
16 | Σ ε λ ί δ α
for Supercomputing Applications (NCSA) σταματώντας την εξέλιξη του HTTPd που
ήταν ο πιο δημοφιλής μέχρι και το 1995. Αναλαμβάνει τότε το πρόγραμμα Apache
Software Foundation όπου διατηρείται μέχρι τις μέρες μας.
Ο Apache εγκαθίσταται σε έναν υπολογιστή ο οποίος μπορεί να χρησιμοποιεί
διάφορα λειτουργικά συστήματα όπως Linux, Unix, Microsoft Windows, GNU,
FreeBSD, Solaris, Novell NetWare, Mac OS X, OS/2, TPF. Ο ρόλος του Apache
είναι να αναμένει αιτήσεις από διάφορα προγράμματα – χρήστες (clients) όπως είναι
ένας ο φυλλομετρητής (browser) ενός χρήστη και στη συνέχεια να εξυπηρετεί αυτές
τις αιτήσεις “σερβίροντας” τις σελίδες που ζητούν είτε απευθείας μέσω μιας
ηλεκτρονικής διεύθυνσης (URL), είτε μέσω ενός συνδέσμου (link). Ο τρόπος με τον
οποίο ο Apache εξυπηρετεί αυτές τις αιτήσεις, είναι σύμφωνος με τα πρότυπα που
ορίζει το πρωτόκολλο HTTP (Hypertext Transfer Protocol).
Ο Apache HTTP αναπτύσσεται από την “Κοινότητα Ανοιχτού Λογισμικού” και
η εποπτεία, υποστήριξη, και διάθεση του προγράμματος γίνεται από το Apache
Software Foundation. Το πρόγραμμα είναι ανοιχτού κώδικα (open source), κάτι που
σημαίνει ότι σύμφωνα με την άδεια χρήσης του (license), διατίθεται δωρεάν και
μπορούν να γίνουν ελεύθερα από το χρήστη προσθήκες και τροποποιήσεις στον
κώδικα του.
Για το όνομά του υπάρχουν δύο διαφορετικές εκδοχές. Η πρώτη αναφέρει ότι το
όνομα είναι προς τιμή της φυλής των ιθαγενών της Αμερικής (Apache), ενώ η
δεύτερη αναφέρεται στα πρώτα χρόνια δημιουργίας του όπου έπρεπε να βγαίνουν
συνέχεια διορθώσεις (patches) πάνω στον αρχικό κώδικα και ονομάστηκε “A
PAtCHy server”. [1],[12]
2.6.2 MySQL
Η MySQL είναι ένα πολύ γρήγορο και δυνατό σύστημα διαχείρισης σχεσιακών
βάσεων ανοικτού κώδικα που χρησιμοποιεί την Structured Query Language (SQL),
την πιο γνωστή γλώσσα ερωτημάτων για την προσθήκη, την πρόσβαση και την
επεξεργασία δεδομένων σε μία Βάση Δεδομένων. Είναι υπεύθυνη για την πρόσβαση
των διαπιστευμένων χρηστών στα δεδομένα της. Η MySQL διατίθεται και σαν
λογισμικό ανοιχτού κώδικα αλλά και σαν κλειστού κώδικα, είναι εκτελέσιμο σε
διαλειτουργικά συστήματα και μετρά πάνω από 11 εκατομμύρια εγκαταστάσεις
καθιστώντας την, από τις πιο δημοφιλείς βάσεις δεδομένων.
H MySQL είναι διαθέσιμη από το 1996 αλλά η ιστορία της ξεκινά από το 1979.
[1],[13]
17 | Σ ε λ ί δ α
2.6.3 PHP
Η PHP είναι μια γλώσσα προγραμματισμού που σχεδιάστηκε για τη δημιουργία
δυναμικών σελίδων στο διαδίκτυο και είναι επισήμως γνωστή ως: HyperText
preprocessor.
Είναι μια server-side (εκτελείται στον διακομιστή) scripting γλώσσα που
γράφεται συνήθως πλαισιωμένη από HTML, για μορφοποίηση των αποτελεσμάτων.
Αντίθετα από μια συνηθισμένη HTML σελίδα η σελίδα PHP δεν στέλνεται
άμεσα σε έναν πελάτη (client), αντί αυτού πρώτα αναλύεται και μετά αποστέλλεται
το παραγόμενο αποτέλεσμα. Τα στοιχεία HTML στον πηγαίο κώδικα μένουν ως
έχουν, αλλά ο PHP κώδικας ερμηνεύεται και εκτελείται. Ο κώδικας PHP μπορεί να
θέσει ερωτήματα σε βάσεις δεδομένων, να δημιουργήσει εικόνες, να διαβάσει και να
γράψει αρχεία, να συνδεθεί με απομακρυσμένους υπολογιστές , κ.ο.κ. Σε γενικές
γραμμές οι δυνατότητες που μας δίνει είναι απεριόριστες.
Αρχικά η ονομασία της ήταν PHP/FI από το Forms Interpreter η οποία
δημιουργήθηκε το 1995 από τον Rasmus Lerdorf ως μια συλλογή από Perl scripts που
τα χρησιμοποιούσε στην προσωπική του σελίδα. Δεν άργησε να τα εμπλουτίσει με
λειτουργίες επεξεργασίας δεδομένων με SQL, αλλά τα σημαντικά βήματα που έφεραν
και την μεγάλη αποδοχή της PHP ήταν αρχικά η μετατροπή τους σε C και μετέπειτα
η δωρεάν παροχή του πηγαίου κώδικα μέσω της σελίδας του ώστε να επωφεληθούν
όλοι από αυτό που είχε φτιάξει, αλλά και να τον βοηθήσουν στην περαιτέρω
ανάπτυξή της. [1],[14],[15]
2.6.4 CSS
Η CSS (Cascading Style Sheets-Διαδοχικά Φύλλα Στυλ) ή ( αλληλουχία φύλλων
στύλ ) είναι μια γλώσσα υπολογιστή που ανήκει στην κατηγορία των γλωσσών
φύλλων στυλ που χρησιμοποιείται για τον έλεγχο της εμφάνισης ενός εγγράφου που
έχει γραφτεί με μια γλώσσα σήμανσης. Χρησιμοποιείται δηλαδή για τον έλεγχο της
εμφάνισης ενός εγγράφου που γράφτηκε στις γλώσσες HTML και XHTML, δηλαδή
για τον έλεγχο της εμφάνισης μιας ιστοσελίδας και γενικότερα ενός ιστοτόπου. Η
CSS είναι μια γλώσσα υπολογιστή προορισμένη να αναπτύσσει στυλιστικά μια
ιστοσελίδα δηλαδή να διαμορφώνει περισσότερα χαρακτηριστικά, χρώματα, στοίχιση
και δίνει περισσότερες δυνατότητες σε σχέση με την HTML. Για μια όμορφη και
καλοσχεδιασμένη ιστοσελίδα η χρήση της CSS κρίνεται ως απαραίτητη. [16],[17]
2.6.5 PhpMyAdmin
18 | Σ ε λ ί δ α
Το PhpMyAdmin είναι ένα εργαλείο διαχείρισης των βάσεων δεδομένων του
συστήματος, από τον διαχειριστή μέσω ενός φυλλομετρητή. Είναι λογισμικό
ανοιχτού κώδικα γραμμένο σε PHP, ανεξάρτητου λογισμικού (cross-platform) και
πολυγλωσσικό (62 γλώσσες). Μέσω της έξυπνης διεπαφής (interface) επιτρέπει την
δημιουργία / διαγραφή μιας βάσης, δημιουργία / διαγραφή / αλλαγή πινάκων –
πεδίων, χειρισμό δικαιωμάτων, εξαγωγή δεδομένων σε διάφορες μορφές. [18]
Αναφορές 2ου Κεφαλαίου
1. http://www.greenwebdesign.com/Glossary-Of-Technical-Terms.htm
2. http://www.edinteractive.co.uk/article/?id=4
3. http://www.theonestopwebsiteshop.com/web-design/dynamic-vs-static.htm
4. http://suite101.com/a/user-experience-design-a28857
5. http://www.dailyblogtips.com/user-friendly-website/
6. Πτυχιακή εργασία, Δημιουργία δυναμικής ιστοσελίδας για το μάθημα της Διδακτικής
χρησιμοποιώντας το εργαλείο της JOOMLA, Καστώρης Παντελής, Λάρισα 2012
7. http://www.searchengineguide.com/kalena-jordan/10-easy-steps-to-a-user-friendly-
website.php
8. http://googlewebmastercentral.blogspot.gr/
9. http://support.google.com/webmasters/bin/answer.py?hl=el&answer=35291&ctx=cb
&src=cb&cbid=1xdrdguf7eq8i&cbrank=0
10. https://support.google.com/webmasters/answer/35769?hl=el#3
11. https://support.google.com/webmasters/answer/66356?hl=el
12. http://httpd.apache.org/ABOUT_APACHE.html
13. http://dev.mysql.com/doc/refman/5.1/en/what-is-mysql.html
14. http://en.wikipedia.org/wiki/PHP
15. http://www.php.net/
16. http://el.wikipedia.org/wiki/CSS
17. http://www.wlearn.gr/index.php/home-css-83
18. www.phpmyadmin.net/
19. http://www.cmsreview.com/Steps/
19 | Σ ε λ ί δ α
3. Η πλατφόρμα Joomla
Το Joomla είναι αναμφισβήτητα ένα από τα δημοφιλέστερα συστήματα
διαχείρισης περιεχομένου ανοικτού κώδικα. 23 εκατομμύρια άνθρωποι έχουν
“κατεβάσει” το Joomla, ενώ από αυτούς οι 21 εκατομμύρια το ‘κατέβασαν’ μεταξύ
Σεπτεμβρίου 2005, και ήταν η μετεξέλιξη του Mambo project, και από τότε
κυκλοφόρησαν άλλες τρεις βασικές εκδόσεις με τελευταία την 3.2 τον Νοέμβρη του
2013.
3.1 Γενικά για το Joomla
Το Joomla είναι λογισμικό ανοιχτού κώδικα, το οποίο ανήκει στην κατηγορία
των συστημάτων διαχείρισης περιεχομένου (CMS). Οι λέξεις «διαχείριση» και
«περιεχόμενο», αναφέρονται σε ένα σύστημα λογισμικού το οποίο χρησιμοποιείται
για την οργάνωση, την ταξινόμηση και την αρχειοθέτηση της πληροφορίας.
Η διαχείριση του Joomla γίνεται αποκλειστικά μέσω ενός φυλλομετρητή
(Browser).Ολόκληρη η λειτουργία του συστήματος, είναι διαθέσιμη μέσω της
διεπαφής του φυλλομετρητή, αφού είναι εγκατεστημένο και προσπελάσιμο μέσω μιας
διεύθυνσης διαδικτύου.
Μερικές από τις δυνατότητες του Joomla είναι οι εξής:
 Δωρεάν διανομή (ελεύθερο λογισμικό ανοιχτού κώδικα), μπορούμε δηλαδη να το
διανείμουμε – αντιγράψουμε – τροποποιήσουμε σύμφωνα με τους όρους της
GNU (General Public License).
20 | Σ ε λ ί δ α
 Δυνατότητα δοκιμής και φιλοξενίας (CloudAccess.net) του ιστότοπου για 30
μέρες.
 Δημιουργία δυναμικών σελίδων, που σημαίνει ότι οι σελίδες του ιστότοπου δεν
θα είναι αποθηκευμένες ως στατικές σελίδες, αλλά το περιεχόμενό τους
δημιουργείται και αποστέλλεται στο χρήστη όταν αυτός το ζητήσει.
 Παρέχει τη δυνατότητα διαχείρισης του περιεχομένου του ιστότοπου από τον
διαχειριστή του περιεχομένου μέσα από τον ίδιο τον ιστότοπο (back-end και
front-end) με εύκολο και φιλικό τρόπο χωρίς την απαίτηση επιπλέον
προγράμματος επεξεργασίας ιστοσελίδων, όπως π.χ. FrontPage, DreamWeaver
κλπ. Ο διαχειριστής του περιεχομένου χρειάζεται απλά να κάνει είσοδο στο
σύστημα και με τα προκαθορισμένα δικαιώματα που έχει να επέμβει στο
περιεχόμενο.
 Έλεγχο της πρόσβασης των χρηστών. Στο Joomla υπάρχουν συγκεκριμένες
ομάδες με ξεχωριστά δικαιώματα για την καλύτερη ασφάλεια με δυνατότητα
δημιουργίας και άλλων ομάδων.
 Δυνατότητα δημιουργίας αλλά και επεξεργασίας των άρθρων για την
μορφοποίηση τους με τον επεξεργαστή κειμένου που είναι ενσωματωμένος στο
Joomla.
Το Joomla ακολουθεί μια συγκεκριμένη φιλοσοφία όσον αφορά στο περιεχόμενο
του ιστότοπου. Έτσι το περιεχόμενο, σύμφωνα με το Joomla, αποτελείται από άρθρα,
τα οποία εμφανίζονται ένα-ένα ή πολλά μαζί στις σελίδες του ιστότοπου. Τα άρθρα
κατατάσσονται με τη σειρά τους σε κατηγορίες όπου και αυτές με τη σειρά τους σε
ενότητες μέχρι και στις εκδόσεις 1.5.x, όπου μετά την 1.6 συγχωνεύτηκαν για να
μείνουν μόνο οι κατηγορίες. Το Joomla υποχρεώνει το δημιουργό του περιεχομένου
να κατατάσσει το κάθε άρθρο που δημιουργεί σε κατηγορία-υποκατηγορία που θα
έχει πρώτα ο ίδιος δημιουργήσει.
Στο Joomla δίνεται επίσης η δυνατότητα επιλογής προτύπου παρουσίασης
(template) μέσα από μία μεγάλη ποικιλία από έτοιμα πρότυπα (δωρεάν και μη) αλλά
και της κατασκευής, αφήνοντας στον δημιουργό μόνο την παραμετροποίηση του.
Επιπλέον υπάρχει η δυνατότητα δημιουργίας μενού που οδηγούν σε συγκεκριμένο
περιεχόμενο με τον δημιουργό του ιστότοπου να μπορεί με πολύ εύκολο τρόπο να
δημιουργήσει την εμφάνιση των σελίδων του μενού που οδηγούν σε δυναμικό
περιεχόμενο συγκεκριμένης κατηγορίας. Η εμφάνιση του περιεχομένου στις
ιστοσελίδες μπορεί να παραμετροποιηθεί σύμφωνα με τις προτιμήσεις και τις ανάγκες
του δημιουργού. Έτσι σε μια σελίδα είναι δυνατόν να εμφανίζεται ένα άρθρο, άρθρα
μιας κατηγορίας ταξινομημένα ή και όλα τα άρθρα . Επίσης εύκολη είναι και η
προσθήκη λειτουργίας αναζήτησης στον ιστότοπο που παρέχει το Joomla που δίνει τη
δυνατότητα αναζήτησης σε όλο το περιεχόμενο του ιστότοπου μας.
Το Joomla ως το πιο δημοφιλές Σύστημα Διαχείρισης Περιεχομένου επιτρέπει
την ανάπτυξη διαρκώς πρόσθετων εφαρμογών ανοιχτού λογισμικού που είναι
διαθέσιμες στο ευρύ κοινό. Οι εφαρμογές αυτές μπορεί να είναι άλμπουμ
φωτογραφιών, ημερολόγια κλπ. Πολλές από τις παραπάνω λειτουργίες διευκολύνουν
21 | Σ ε λ ί δ α
την ανάπτυξη ενός σύγχρονου ιστότοπου μειώνοντας κατά πολύ το χρόνο
υλοποίησης.
Πολύ σημαντικό είναι ότι το Joomla μετά την αρχική εγκατάσταση,
παραμετροποίηση και διαμόρφωση του ιστότοπου, καταργεί την ανάγκη για έναν
ειδικό που θα ασχολείται με την καθημερινή διαχείριση του περιεχομένου ενός
ιστότοπου. Η λειτουργία προσθήκης και αλλαγής του περιεχομένου είναι τόσο
εύκολη που μπορεί να γίνει από οποιονδήποτε χρήστη με βασικές γνώσεις χρήσης
υπολογιστών. Κατά το πρώτο στάδιο όμως, δηλαδή το στάδιο δημιουργίας του
ιστότοπου είναι απαραίτητο να υπάρχουν οι τεχνικές γνώσεις διαχείρισης του Joomla.
[1]
3.2 Η δομή του Joomla
Τα δομικά στοιχεία του Joomla είναι τα ακόλουθα:
 Διεπαφή χρηστών – δημόσιο τμήμα (Front-End)
 Διεπαφή διαχειριστών (Back-End )
1) Ρυθμίσεις συστήματος (configuration settings)
2) Ρυθμίσεις πρόσβασης χρηστών (Access control settings)
 Πρότυπα (Templates)
 Επεκτάσεις (Extensions)
3.2.1 Διεπαφή χρηστών
Η διεπαφή χρήστη αποτελεί το δημόσιο μέρος του CMS που είναι διαθέσιμο
στους επισκέπτες (απλούς ή διαπιστευμένους) του ιστότοπου, όπου περιλαμβάνονται
όλες οι λειτουργίες που έχουν καθοριστεί από την διεπαφή διαχειριστών.
3.2.2 Διεπαφή διαχειριστών
Η διεπαφή διαχειριστών αποτελεί το επίπεδο διαχείρισης για την ομάδα συντήρησης
και προσφέρει λειτουργίες ρύθμισης συστήματος, διαχείρισης χρηστών (προσθήκη /
αφαίρεση / θέματα πρόσβασης), διαχείρισης επεκτάσεων και τέλος του περιεχομένου του
ιστότοπου αυτού καθεαυτού.
3.2.3 Πρότυπα (Templates)
Τα πρότυπα αποτελούν το αισθητικό (εμφάνιση) και λειτουργικό επίπεδο του
ιστότοπου που θα βασιστεί σε CMS. Μπορούμε να θεωρήσουμε τα πρότυπα ως κενές
μακέτες πάνω στις οποίες θα τοποθετηθεί το περιεχόμενου που θα επιλέξουμε να
22 | Σ ε λ ί δ α
εμφανίζεται από το CMS. Το κάθε πρότυπο έχει συγκεκριμένες θέσεις στις οποίες
μπορεί να εμφανιστεί η πληροφορία μας, όπου για να δούμε τις διαθέσιμες θέσεις
μπορούμε να ελέγξουμε το εγχειρίδιο του κατασκευαστή αλλά και με την παράμετρο
“?tp=1” στην διεύθυνση του ιστότοπου μας. Στα πρότυπα καθορίζονται οι
παράμετροι εμφάνισης της σελίδας (χρώματα, διαστάσεις, τυπογραφία) καθώς επίσης
παρέχονται όλα τα αρχεία γραφικών που θα χρησιμοποιηθούν για την εμφάνισή της.
3.2.4 Επεκτάσεις (Extentions)
Οι επεκτάσεις αποτελούν κομμάτια λογισμικού (software components) τα οποία
ακολουθούν ένα καθορισμένο προγραμματιστικό μοντέλο, το οποίο τους επιτρέπει να
αλληλεπιδρούν με το CMS και να επεκτείνουν ακολούθως τη λειτουργικότητά του.
Οι επεκτάσεις κάνουν ένα CMS όπως το Joomla εξαιρετικά ισχυρό και αποτελούν
σημαντικό μοχλό ανάπτυξης και διάδοσης αυτού, μέσω μιας εξαιρετικά δραστήριας
κοινότητας προγραμματιστών. Τυπικά παραδείγματα επεκτάσεων είναι για
παράδειγμα: ρολόι, ημερολόγιο, φωτογραφική έκθεση, καιρός, δίγλωσσο και
πολύγλωσσο ιστότοπο.
3.3 Εγκατάσταση Joomla
Η εγκατάσταση του Joomla είναι μία διαδικασία που διαρκεί λίγα λεπτά αρκεί να
δοθεί η απαραίτητη προσοχή. Για της ανάγκες της εργασίας, έχει μισθωθεί ένας linux
server, που εδρεύει στη Γερμανία, με εγκατεστημένο Apache έκδοση 2.2.22. Επίσης
έχει καταχωρηθεί το domain name www.vespophrenia.gr , το οποίο παραπέμπει στον
συγκεκριμένο server.
3.3.1 Δημιουργία βάσης δεδομένων
Πριν την εγκατάσταση του Joomla θα πρέπει να δημιουργήσουμε την βάση
δεδομένων (MySQL).
Μπαίνοντας στο διαχειριστικό περιβάλλον του server χρησιμοποιώντας έναν
φυλλομετρητή, δημιουργούμε την βάση δεδομένων.
Αφού εισάγουμε Username και password, βλέπουμε την παρακάτω εικόνα
(Εικόνα 3.3.1.1).
23 | Σ ε λ ί δ α
Εικόνα 3.3.1.1 – Διαχειριστικό, Αρχική σελίδα
Εν συνεχεία επιλέγουμε ‘Manage SQL’ > ‘Add SQL Database’, στο πεδίο
Database name εισάγουμε ένα όνομα για την βάση μας και επιλέγουμε ‘Add’ (Εικόνα
3.3.1.2).
Εικόνα 3.3.1.2 – Δημιουργία βάσης δεδομένων
Επόμενο βήμα είναι η δημιουργία ενός χρήστη για την βάση μας. Από το
πινακάκι που εμφανίζεται, επιλέγουμε ‘Add SQL User’ (Εικόνα 3.3.1.3).
24 | Σ ε λ ί δ α
Εικόνα 3.3.1.3 – Δημιουργία χρήστη
Στο πεδίο ‘SQL Username’ εισάγουμε ένα όνομα χρήστη. Στα πεδία ‘Password’
και ‘Repeat password’ εισάγουμε έναν κωδικό πρόσβασης και επιλέγουμε ‘Add’
(Εικόνα 3.3.1.4).
Εικόνα 3.3.1.4 – Δημιουργία χρήστη
3.3.2 Μεταφόρτωση και εγκατάσταση Joomla
Αφού δημιουργήσαμε την βάση δεδομένων, επόμενο βήμα είναι να κατεβάσουμε
την έκδοση του Joomla που θα εγκαταστήσουμε. Μπορούμε να κατεβάσουμε την
διανομή από την σελίδα http://www.joomla.org/download.html . Για τις ανάγκες τις
εργασίας και για έχουμε πλήρη συμβατότητα με όλα τα extensions που θα
χρησιμοποιηθούν, θα κατεβάσουμε την έκδοση 2.5.16 .
25 | Σ ε λ ί δ α
Έχοντας κατεβάσει το αρχείο ZIP στον υπολογιστή μας, χρησιμοποιούμε τον File
Manager του server, για να μεταφορτώσουμε το αρχείο στον server και να το
αποσυμπιέσουμε. Η αποσυμπίεση θα πρέπει να γίνει στο δημόσιο directory του
ιστότοπού μας το οποίο στη συγκεκριμένη περίπτωση είναι το directory με το όνομα
“httpdocs”.
Η εικόνα των μεταφορτωμένων αρχείων μετά την αποσυμπίεση είναι η
παρακάτω (Εικόνα 3.3.5). Όπως φαίνεται και στην εικόνα υπάρχει ένας φάκελος με
όνομα ‘Installation’ ο οποίος περιέχει τα αρχεία εγκατάστασης και μετά την
εγκατάσταση θα διαγραφεί.
Εικόνα 3.3.1.5 – Αποσυμπιεσμένα αρχεία
Για να πραγματοποιήσουμε την εγκατάσταση πλέον αρκεί να πληκτρολογήσουμε
την διεύθυνση του ιστότοπου μας στην μπάρα διευθύνσεων του φυλλομετρητή.
Πληκτρολογούμε λοιπόν http://www.vespophrenia.gr και εμφανίζεται η παρακάτω
εικόνα (Εικόνα 3.3.2.1). Επιλέγουμε την γλώσσα και πατάμε “Επόμενο”.
26 | Σ ε λ ί δ α
Εικόνα 3.3.2.1 – Επιλογή γλώσσας
Εν συνεχεία γίνεται έλεγχος συμβατότητας με τον server, εμφανίζεται η
παρακάτω εικόνα (Εικόνα 3.3.2.2) και επιλέγουμε “Επόμενο” εφόσον όλα είναι
εντάξει. [2],[4]
Εικόνα 3.3.2.2 – Έλεγχος ρυθμίσεων διακομιστή
Στο επόμενο βήμα, εμφανίζονται η όροι χρήσης του Joomla. Τους διαβάζουμε
προσεχτικά και επιλέγουμε “Επόμενο” (Εικόνα 3.3.2.3).
27 | Σ ε λ ί δ α
Εικόνα 3.3.2.3 – Όροι χρήσης
Σε αυτό το σημείο, θα χρειαστεί να εισάγουμε τις ρυθμίσεις για την βάση
δεδομένων. Αφού εισάγουμε τις σωστές ρυθμίσεις επιλέγουμε “Επόμενο” (Εικόνα
3.3.2.4).
Εικόνα 3.3.2.4 – Ρυθμίσεις Βάσης Δεδομένων
Δεν θα χρειαστεί να κάνουμε ρυθμίσεις για τον FTP. Παρακάμπτουμε λοιπόν το
βήμα 5 πατώντας “Επόμενο” (Εικόνα 3.3.2.5).
28 | Σ ε λ ί δ α
Εικόνα 3.3.2.5 – Ρυθμίσεις FTP
Εισάγουμε τις βασικές ρυθμίσεις του ιστότοπου (Όνομα, ηλεκτρονική διεύθυνση
επικοινωνίας, όνομα χρήστη και κωδικό πρόσβασης του διαχειριστή) και επιλέγουμε
“Επόμενο” (Εικόνα 3.3.2.6).
Εικόνα 3.3.2.6 – Βασικές Ρυθμίσεις Ιστοτόπου
Τέλος, θα πρέπει να διαγράψουμε τον φάκελο installation που περιέχει τα αρχεία
εγκατάστασης (Εικόνα 3.3.2.7). Επιλέγουμε “Διαγραφή του καταλόγου με τα αρχεία
εγκατάστασης (installation)” και εν συνεχεία πατάμε “Διαχείριση”. [2],[3]
29 | Σ ε λ ί δ α
Εικόνα 3.3.2.7 – Διαγραφή καταλόγου installation
3.4 Διαχείριση Περιεχομένου
Πριν ξεκινήσουμε να δουλέψουμε με ένα σύστημα διαχείρισης περιεχομένου
πρέπει να έχουμε μια ξεκάθαρη άποψη για το ποιο και πόσο μεγάλο θα είναι το
περιεχόμενο μας. Απαιτείται να κατασκευάσουμε αρχικά ένα δέντρο κατηγοριών στις
οποίες θα υπάγονται τα άρθρα που καταχωρούμε. Εν συνεχεία θα πρέπει να
συντάξουμε τα άρθρα και τέλος να δημιουργήσουμε τα μενού, τα οποία θα μας
δρομολογούν στα άρθρα μίας ή περισσότερων κατηγοριών.
3.4.1 Δημιουργία κατηγοριών
Το πρώτο βήμα είναι να δημιουργήσουμε την πρώτη μας κατηγορία όπου και θα
ανήκουν κάποια από τα άρθρα - περιεχόμενο μας.
Για να δημιουργήσουμε μια κατηγορία, από την κεντρική σελίδα της διαχείρισης,
επιλέγουμε διαχείριση κατηγοριών και στη συνέχεια επιλέγουμε νέο. (Εικόνα 3.4.1.1)
30 | Σ ε λ ί δ α
Εικόνα 3.4.1.1 – Δημιουργία νέας κατηγορίας
Συμπληρώνουμε τον τίτλο της κατηγορίας που θέλουμε να δημιουργήσουμε. Στο
πεδίο Ψευδώνυμο αν και δεν είναι υποχρεωτικό, συμπληρώνουμε ένα σχετικό όνομα
καθώς θα εμφανίζεται στην γραμμή διευθύνσεων και θα διαβάζεται από τις μηχανές
αναζήτησης. Η προκαθορισμένη τιμή, στην περίπτωση όπου αφεθεί κενό ή
χρησιμοποιηθούν μη λατινικοί χαρακτήρες είναι η ημερομηνία και ώρα δημιουργίας.
Το πεδίο Γονικό μας ενδιαφέρει μόνο στην περίπτωση που δημιουργούμε
υποκατηγορία. Η κατάσταση είναι το αν θέλουμε τα περιεχόμενα – άρθρα της
κατηγορίας να δημοσιεύονται, ενώ η ‘Πρόσβαση’ και τα ’Δικαιώματα’ το ποιοι θα
έχουν πρόσβαση. Αφού συμπληρώσουμε τα πεδία, επιλέγουμε αποθήκευση (Εικόνα
3.4.1.2).
31 | Σ ε λ ί δ α
Εικόνα 3.4.1.2 – Νέα κατηγορία
3.4.2 Δημιουργία Άρθρων
Έχοντας δημιουργήσει την πρώτη μας κατηγορία, είμαστε πλέον σε θέση να
δημιουργήσουμε τα άρθρα της κατηγορίας. Τα άρθρα είναι το βασικό στοιχείο
πληροφορίας του ιστότοπου μας. Η ονομασία παραπέμπει σε άρθρα εφημερίδας όπου
υπάρχει το όνομα του άρθρου, το όνομα του συντάκτη, το περιεχόμενο που μπορεί να
είναι μόνο κείμενο ή και φωτογραφίες, η ημερομηνία δημοσίευσης, και η κατηγορία
όπου ανήκουν. Έτσι τα άρθρα μας τα οργανώνουμε σε κατηγορίες και υποκατηγορίες
που δημιουργούν το περιεχόμενο μας.
Για την δημιουργία ενός άρθρου απ;o την κεντρική σελίδα της διαχείρισης,
επιλέγουμε Προσθήκη Νέου Άρθρου, συμπληρώνουμε τα απαραίτητα πεδία,
επιλέγουμε κατηγορία, ελέγχουμε τις ρυθμίσεις εμφάνισης του άρθρου και πατάμε
αποθήκευση (Εικόνα 3.4.2.3).
32 | Σ ε λ ί δ α
Εικόνα 3.4.2.3 – Δημιουργία νέου άρθρου
3.4.3 Διαχείριση Μενού
Ένας ιστότοπος μπορεί να έχει ένα αλλά και περισσότερα μενού τοποθετημένα
σε όποια σημεία του ιστότοπου μας επιθυμούμε και μας επιτρέπει το πρότυπο μας.
Το κάθε μενού έχει έναν μεγάλο αριθμό επιλογών, οι οποίες μπορούν να
οργανώνονται σε άπειρο βάθος, προσφέροντας έτσι τη δυνατότητα δημιουργίας
εξαιρετικά πολύπλοκων δενδροειδών δομών.
Τα μενού παρέχουν τη διεπαφή με όλες σχεδόν τις λειτουργίες του ιστότοπου, οι
οποίες δεν υπάρχει δυνατότητα να εμφανιστούν με διαφορετικό τρόπο. Ένα στοιχείο
μενού μπορεί να είναι ένα από τα παρακάτω (Περιλαμβάνονται στοιχεία που
εμφανίζονται μετά την εγκατάσταση της εκάστοτε επέκτασης) (Εικόνα 3.4.3.1):
33 | Σ ε λ ί δ α
Εικόνα 3.4.3.1 – Είδη στοιχείων μενού
Για την δημιουργία ενός νέου μενού αρκεί να πάμε από την Διαχείριση Μενού
και να επιλέξουμε Νέο. Στη συνέχεια μπορούμε να προσθέσουμε όσα στοιχεία από
την παραπάνω φωτογραφία θέλουμε. Καλό είναι τα μενού, αν δημιουργήσουμε πάνω
από ένα, να έχουν ξεκάθαρες διαφορές στις λειτουργίες τους. Αφού συμπληρώσουμε
τα απαραίτητα πεδία, επιλέγουμε αποθήκευση (Εικόνα 3.4.3.2).
34 | Σ ε λ ί δ α
Εικόνα 3.4.3.2 – Δημιουργία μενού
35 | Σ ε λ ί δ α
3.5 Ασφάλεια Ιστοσελίδας
3.5.1 Χωρίς joomla generator tag
Πολλές φορές δεν θέλουμε "κακόβουλοι" επισκέπτες να βλέπουν το generator tag
που υπάρχει στο index.php του joomla και δείχνει το cms που χρησιμοποιείται από το
διαδικτυακό µας τόπο.
<meta name="generator" content="Joomla! 2.5 - Open Source Content
Management" />
Η εύκολη λύση που προτείνεται είναι να αφαιρείται το κομμάτι αυτό κώδικα
από τα αρχεία του core του joomla. Η λύση αυτή δεν είναι σωστή, καθώς αντιβαίνει
στην άδεια χρήσης του joomla
.
Η σωστή λύση είναι να κάνουμε την παρακάτω μικρή τροποποίηση στο αρχείο
index.php στο template µας, τοποθετώντας στο τέλος του πρώτου php tag το
παρακάτω κομμάτι κώδικα:
$this->setGenerator(null);
3.5.2 Προστασία αρχείου configuration.php
Ένας από τους τρόπους βελτίωσης της ασφάλειας ενός δικτυακού τόπου είναι η
προστασία από την απευθείας πρόσβαση συγκεκριμένων αρχείων php που βρίσκονται
στον κατάλογο PUBLIC_HTML και περιέχουν εκτελέσιμο κώδικα ή σημαντικά
δεδομένα.
Υπάρχουν διάφοροι τρόποι για να πετύχουμε κάτι τέτοιο. Απλούστερος και
ασφαλέστερος θεωρείται να µην αποθηκεύονται κρίσιμα δεδομένα µέσα στον
κατάλογο public_html . Και από τον Apache.org υπάρχει µια συνεχής σύσταση να
αποφεύγεται η διατήρηση τέτοιων αρχείων, µε κρίσιμα δεδομένα, στον κατάλογο
public_html. Στο κείμενο που ακολουθεί, προστατεύουμε το αρχείο
configuration.php, που είναι το πιο σηµαντικό (για τον τομέα της ασφάλειας) αρχείο
για ένα Joomla site [5].
Οδηγίες:
1. Μετακινούμε το αρχείο configuration.php σε ένα ασφαλή κατάλογο, έξω από
τον public_html και ονομάζουμε όπως θέλουμε εμείς. Στο παράδειγμα
χρησιμοποιούμε το όνομα joomla.conf.
2. Δημιουργούμε ένα νέο αρχείο configuration.php που θα περιέχει τον
παρακάτω κώδικα:
36 | Σ ε λ ί δ α
<?php
require( dirname( __FILE__ ) . '/../joomla.conf' );
?>
3. Σιγουρευόμαστε ότι το νέο configuration.php δεν είναι σε καμία περίπτωση
εγγράψιμο (444), και δεν θα αλλάξει το περιεχόμενό του από το com_config.
4. Εάν χρειαστεί να αλλάξετε κάποια από τις ρυθμίσεις, τις αλλάξετε µε το χέρι
στο αρχείο joomla.conf.
Σημείωση: Χρησιμοποιώντας τη μέθοδο αυτή, ακόμα και αν για κάποιο λόγο ο
Web server μεταδώσει τα περιεχόμενα αρχείων php, λόγω κάποιας λανθασμένης
ρύθμισης, κανείς δεν θα μπορεί να δει τα περιεχόμενα του πραγματικού αρχείου
configuration.php.
37 | Σ ε λ ί δ α
Αναφορές 3ου Κεφαλαίου
1. http://www.joomla.org/about-joomla.html
2. The Official Joomla Book by Jennifer Marriott & Elin Waring εκδόσεις Addison-
Wesley Professional, 2011.
3. http://cocoate.com/sites/cocoate.com/files/pdf/j25en.pdf
4. http://docs.joomla.org/Technical_requirements
5. http://apache.org
38 | Σ ε λ ί δ α
4. Το Φόρουμ Vespophrenia.gr
Το Φόρουμ Vespophrenia αναφέρεται στους λάτρες του κλασικού
μοτοσυκλετισμού και συγκεκριμένα σε ένα δίκυκλο το οποίο έγραψε ιστορία στον
χώρο αυτό, την γνωστή σε όλους μας Vespa της Piaggio. Για την κατασκευή του
χρησιμοποιήθηκε CMS ανοιχτού κώδικα (Joomla) πάνω στο οποίο εγκαταστάθηκε
και προσαρμόστηκε η πλατφόρμα φόρουμ Kunena 3.0.1 μαζί με αρκετά πρόσθετα και
ενθέματα τα οποία θα δούμε παρακάτω αναλυτικά.
Το Template που χρησιμοποιήθηκε έχει φτιαχτεί εξολοκλήρου για τις ανάγκες
της εργασίας και δεν έχει χρησιμοποιηθεί έτοιμο (PHP και CSS).
Το Φόρουμ απευθύνεται κυρίως σε Έλληνες χρήστες καθώς έχει εγκατασταθεί η
ελληνική γλώσσα και τα μηνύματα είναι στα ελληνικά. Τη δεδομένη στιγμή,
απαριθμεί 159 μέλη, 9 ενότητες, 34 κατηγορίες, 205 θέματα, 5187 μηνύματα με μέσο
όρο 20 νέων μηνυμάτων και περίπου 55 μοναδικών επισκεπτών ανά ημέρα.
4.1 Template / Πρότυπο
To εικαστικό μέρος ενός site αποτελεί σημαντικό παράγοντα για την
επισκεψιμότητα του. Όλα τα λογότυπα και οι εικόνες έχουν σχεδιαστεί σε Adobe
Illustrator και Photoshop. Χρησιμοποιήθηκαν χρώματα και γραμματοσειρές που δεν
κουράζουν το ανθρώπινο μάτι και προέκυψε το παρακάτω αποτέλεσμα (Εικόνα 4.1.1
- Εικόνα 4.1.2) [17].
Εικόνα 4.1.1 – Αρχική σελίδα
39 | Σ ε λ ί δ α
Εικόνα 4.1.2 – Φόρουμ (Τελείωμα σελίδας)
Δείγμα του CSS κώδικα του προτύπου που χρησιμοποιήθηκε είναι ο παρακάτω:
#mic-main
{
background: #D7D5C1 url('../images/pageglare.png') top center no-repeat scroll;
background: url('../images/pageglare.png') top center no-repeat, linear-gradient(top,
#E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1;
background: url('../images/pageglare.png') top center no-repeat, -webkit-linear-
gradient(top, #E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1;
background: url('../images/pageglare.png') top center no-repeat, -moz-linear-gradient(top,
#E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1;
background: url('../images/pageglare.png') top center no-repeat, -o-linear-gradient(top,
#E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1;
background: url('../images/pageglare.png') top center no-repeat, -ms-linear-gradient(top,
#E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1;
background: url('../images/pageglare.png') top center no-repeat, linear-gradient(top,
#E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1;
-svg-background: url('../images/pageglare.png') top center no-repeat, linear-gradient(top,
#E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1;
background-size: auto, 100% 285px, auto !important;
margin: 0 auto;
font-size: 13px;
font-family: Tahoma, Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-style: normal;
position: relative;
40 | Σ ε λ ί δ α
width: 100%;
min-height: 100%;
left: 0;
top: 0;
cursor: default;
overflow: hidden;
}
h1, h2, h3, h4, h5, h6, p, a, ul, ol, li
{
margin: 0;
padding: 0;
}
.mic-button
{
border: 0;
border-collapse: separate;
-webkit-background-origin: border !important;
-moz-background-origin: border !important;
background-origin: border-box !important;
background: #B0AB87;
-webkit-box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.15);
-moz-box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.15);
box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.15);
border-width: 0;
padding: 0 7px;
margin: 0 auto;
height: 25px;
}
.mic-postcontent h1, .mic-postcontent h1 a, .mic-postcontent h1 a:link, .mic-postcontent h1
a:visited, .mic-postcontent h1 a:hover, .mic-postcontent h2, .mic-postcontent h2 a, .mic-
postcontent h2 a:link, .mic-postcontent h2 a:visited, .mic-postcontent h2 a:hover, .mic-
postcontent h3, .mic-postcontent h3 a, .mic-postcontent h3 a:link, .mic-postcontent h3
a:visited, .mic-postcontent h3 a:hover, .mic-postcontent h4, .mic-postcontent h4 a, .mic-
postcontent h4 a:link, .mic-postcontent h4 a:visited, .mic-postcontent h4 a:hover, .mic-
postcontent h5, .mic-postcontent h5 a, .mic-postcontent h5 a:link, .mic-postcontent h5
a:visited,.mic-postcontent h5 a:hover, .mic-postcontent h6, .mic-postcontent h6 a, .mic-
postcontent h6 a:link, .mic-postcontent h6 a:visited, .mic-postcontent h6 a:hover,.mic-
blockheader .t, .mic-blockheader .t a, .mic-blockheader .t a:link, .mic-blockheader .t
a:visited, .mic-blockheader .t a:hover, .mic-vmenublockheader .t,.mic-vmenublockheader .t
a, .mic-vmenublockheader .t a:link, .mic-vmenublockheader .t a:visited, .mic-
vmenublockheader .t a:hover, .mic-headline, .mic-headline a,.mic-headline a:link, .mic-
headline a:visited, .mic-headline a:hover, .mic-slogan, .mic-slogan a, .mic-slogan a:link, .mic-
41 | Σ ε λ ί δ α
slogan a:visited, .mic-slogan a:hover,.mic-postheader, .mic-postheader a, .mic-postheader
a:link, .mic-postheader a:visited, .mic-postheader a:hover
{
font-size: 22px;
font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-style: normal;
line-height: 120%;
}
ul.mic-hmenu>li>a
{
background: #4A4730 url('../images/menuitem.png') scroll;
-webkit-border-radius: 6px 0 0;
-moz-border-radius: 6px 0 0;
border-radius: 6px 0 0;
padding: 0 17px;
margin: 0 auto;
position: relative;
display: block;
height: 31px;
cursor: pointer;
text-decoration: none;
color: #FFFFFF;
line-height: 31px;
text-align: center;
}
.mic-hmenu a, .mic-hmenu a:link, .mic-hmenu a:visited, .mic-hmenu a.active, .mic-hmenu
a:hover
{
font-size: 13px;
font-family: Tahoma, Arial, Helvetica, Sans-Serif;
font-weight: bold;
font-style: normal;
text-decoration: none;
text-align: left;
}
ul.mic-hmenu>li>a.active
{
background: #9A9365 url('../images/menuactiveitem.png') scroll;
-webkit-border-radius: 6px 0 0;
-moz-border-radius: 6px 0 0;
border-radius: 6px 0 0;
padding: 0 17px;
42 | Σ ε λ ί δ α
margin: 0 auto;
color: #FBF9F3;
padding-bottom: 1px;
margin-bottom: -1px;
text-decoration: none;
}
Στην παρακάτω εικόνα μπορούμε να δούμε τις διαθέσιμες θέσεις του προτύπου που
χρησιμοποιήθηκε [17].
Εικόνα 4.1.3 – Διαθέσιμες θέσεις
43 | Σ ε λ ί δ α
4.2 Modules / Ενθέματα
Στην παρακάτω εικόνα (Εικόνα 4.2.1) μπορούμε να δούμε τα Ενθέματα/Modules
που χρησιμοποιήθηκαν, σε ποια θέση έχει οριστεί να εμφανίζεται το καθένα και σε
ποιο είδος ενθεμάτων ανήκει [1].
Εικόνα 4.2.1 – Modules που χρησιμοποιήθηκαν
 Main Menu – Eμφανίζει το κεντρικό μενού.
 Login Form – Εμφανίζει την φόρμα σύνδεσης/ εγγραφής χρήστη πάνω
δεξιά (Λειτουργεί σε συνδυασμό με το πρόσθετο Hotlogin και
χρησιμοποιεί JQuery για το εφέ κίνησης) [11],[12].
 Shoutbox – Εμφανίζει το Shoutbox / Chat (Λειτουργεί σε συνδυασμό με
την εφαρμογή Kide Chat) [5].
 Αναζήτηση – Εμφανίζει την γραμμή αναζήτησης.
 Online Χρήστες – Εμφανίζει τους συνδεμένους χρήστες αλλά και τους
επισκέπτες του ιστότοπου [10].
 Ειδοποιήσεις – Εμφανίζει τις ειδοποιήσεις νέων προσωπικών μηνυμάτων
(Λειτουργεί σε συνδυασμό με την εφαρμογή UddeIM).
 Πρόσφατα Θέματα – Εμφανίζει τα 10 χρονικά πιο πρόσφατα θέματα
στους επισκέπτες μόνο [10].
 Νέα από την τελευταία σας επίσκεψη – Εμφανίζει τα αδιάβαστα
μηνύματα από την τελευταία είσοδο του χρήστη [10].
 Refresh Page – Αποτελεί ένθεμα προσαρμοσμένου HTML κώδικα το
οποίο δημιουργήσαμε για να γίνεται αυτόματη ανανέωση της σελίδας σε
περίπτωση που ο χρήστης την αφήσει ανοιχτή για περισσότερο από 3
44 | Σ ε λ ί δ α
λεπτά (180 sec). Ο κώδικας είναι ο εξής: <meta http-equiv="refresh"
content="180"/>
 Σύνδεση – Εμφανίζει το μενού σύνδεσης/εγγραφής στα δεξιά. Όταν
συνδεθεί ο χρήστης, εμφανίζει ένα μενού με τις επιλογές του χρήστη.
 Σημερινές επισκέψεις - Εμφανίζει τους χρήστες που συνδέθηκαν μέσα
στην τρέχουσα ημέρα.
 Κορυφαία θέματα – Εμφανίζει τα θέματα με τις περισσότερες
απαντήσεις.
 Γενέθλια Μελών – Εμφανίζει ποια μέλη έχουν γενέθλια σε διάστημα 2
ημερών (Χρησιμοποιεί την ημερομηνία γέννησης που έχει δηλώσει ο
χρήστης στο προφίλ του).
 Καιρός – Εμφανίζει πληροφορίες για τον καιρό σε 7 επιλεγμένες πόλεις
(Χρησιμοποιεί iframe για να εμφανίζει τα δεδομένα από άλλο ιστότοπο).
 Εορτολόγιο – Εμφανίζει τις ονομαστικές εορτές της τρέχουσας και
επόμενης ημέρας (Χρησιμοποιεί iframe για να εμφανίζει τα δεδομένα από
άλλο ιστότοπο).
 Ψηφοφορία – Εμφανίζει δημοσκοπήσεις στις οποίες μπορούν να
συμμετέχουν οι εγγεγραμμένοι χρήστες [6].
4.3 Add-ons / Πρόσθετα
Στην παρακάτω εικόνα (Εικόνα 4.3.1) εμφανίζονται τα πρόσθετα που έχουν
χρησιμοποιηθεί [1].
45 | Σ ε λ ί δ α
Εικόνα 4.3.1 – Add-ons που χρησιμοποιήθηκαν
 XMAP – δημιουργεί ένα χάρτη της ιστοσελίδας σε μορφή XML για να
διαβάζεται από τις μηχανές αναζήτησης και χρησιμεύει στο SEO της
ιστοσελίδας [3].
 Tapatalk – χρησιμοποιείται για να μπορεί ο χρήστης να διαβάσει τα
θέματα του φόρουμ από την εφαρμογή Tapatalk για φορητές συσκευές με
android OS ή IOS [8],[9].
46 | Σ ε λ ί δ α
 Hot Login – χρησιμοποιείται για να εμφανίζεται η φόρμα σύνδεσης πάνω
δέξιά (Jquery) [11],[12].
 Title manager – τροποποιεί αυτόματα τους τίτλους των σελίδων έτσι ώστε
να είναι φιλικοί στις μηχανές αναζήτησης [13].
 TinyMCE – ο βασικός κειμενογράφος του back-end [7].
 Advanced Google Analytics – στέλνει δεδομένα επισκεψιμότητας στην
google για την ανανέωση των δεδομένων της υπηρεσίας google analytics
[15].
 Youtube plugin – Εμφανίζει στο περιεχόμενο βίντεο από το Youtube [14].
 SEF – προσθέτει υποστήριξη SEF στους συνδέσμους του εγγράφου [16].
Ενεργεί απευθείας στον κώδικα HTML και δεν απαιτεί κάποια ιδιαίτερη
ετικέτα.
4.4 Components / Εφαρμογές
4.4.1 Γενικά
Στην παρακάτω εικόνα (Εικόνα 4.4.1.1) εμφανίζονται οι εφαρμογές που έχουν
χρησιμοποιηθεί [1].
Εικόνα 4.4.1 .1– Εφαρμογές που χρησιμοποιήθηκαν
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction
Website with Embedded Forum Construction

More Related Content

Similar to Website with Embedded Forum Construction

Σχεδιασμός & Κατασκευή Δυναμικών Διαδικτυακών τόπων με CMS για on-line κρατήσ...
Σχεδιασμός & Κατασκευή Δυναμικών Διαδικτυακών τόπων με CMS για on-line κρατήσ...Σχεδιασμός & Κατασκευή Δυναμικών Διαδικτυακών τόπων με CMS για on-line κρατήσ...
Σχεδιασμός & Κατασκευή Δυναμικών Διαδικτυακών τόπων με CMS για on-line κρατήσ...e-Bi Lab
 
Aρχιτεκτονική yπολογιστών i nikolos
Aρχιτεκτονική yπολογιστών i nikolosAρχιτεκτονική yπολογιστών i nikolos
Aρχιτεκτονική yπολογιστών i nikolosSpyridon Athanasiadis
 
Case study bpr
Case study bprCase study bpr
Case study bprVaso Gorou
 
Δημιουργία Πλατφόρμας Διεξαγωγής Online Διαγωνισμών Προγραμματισμού
Δημιουργία Πλατφόρμας Διεξαγωγής Online Διαγωνισμών ΠρογραμματισμούΔημιουργία Πλατφόρμας Διεξαγωγής Online Διαγωνισμών Προγραμματισμού
Δημιουργία Πλατφόρμας Διεξαγωγής Online Διαγωνισμών ΠρογραμματισμούStesia Papavasileiou
 
Σχεδιασμός & Κατασκευή Δυναμικού Διαδικτυακού Τόπου με Σύστημα Διαχείρισης Πε...
Σχεδιασμός & Κατασκευή Δυναμικού Διαδικτυακού Τόπου με Σύστημα Διαχείρισης Πε...Σχεδιασμός & Κατασκευή Δυναμικού Διαδικτυακού Τόπου με Σύστημα Διαχείρισης Πε...
Σχεδιασμός & Κατασκευή Δυναμικού Διαδικτυακού Τόπου με Σύστημα Διαχείρισης Πε...e-Bi Lab
 
Fortran notes panepistimio_kritis
Fortran notes panepistimio_kritisFortran notes panepistimio_kritis
Fortran notes panepistimio_kritisFanis Vlazakis
 
Η ΘΕΜΑΤΙΚΗ ΚΑΙ ΣΧΕΔΙΑΣΤΙΚΗ ΕΞΕΛΙΞΗ ΤΟΥ WEB DESIGN ΑΠΟ ΤΙΣ ΠΡΩΤΕΣ ΗΜΕΡΕΣ ΤΟΥ...
Η ΘΕΜΑΤΙΚΗ ΚΑΙ ΣΧΕΔΙΑΣΤΙΚΗ ΕΞΕΛΙΞΗ ΤΟΥ  WEB  DESIGN ΑΠΟ ΤΙΣ ΠΡΩΤΕΣ ΗΜΕΡΕΣ ΤΟΥ...Η ΘΕΜΑΤΙΚΗ ΚΑΙ ΣΧΕΔΙΑΣΤΙΚΗ ΕΞΕΛΙΞΗ ΤΟΥ  WEB  DESIGN ΑΠΟ ΤΙΣ ΠΡΩΤΕΣ ΗΜΕΡΕΣ ΤΟΥ...
Η ΘΕΜΑΤΙΚΗ ΚΑΙ ΣΧΕΔΙΑΣΤΙΚΗ ΕΞΕΛΙΞΗ ΤΟΥ WEB DESIGN ΑΠΟ ΤΙΣ ΠΡΩΤΕΣ ΗΜΕΡΕΣ ΤΟΥ...e-Bi Lab
 
ptuxiakh-teliki_morfi _ savakis-koutroumanos
ptuxiakh-teliki_morfi _ savakis-koutroumanosptuxiakh-teliki_morfi _ savakis-koutroumanos
ptuxiakh-teliki_morfi _ savakis-koutroumanosVasileios Savvakis
 
Joomla@psd kaltsidis christos
Joomla@psd kaltsidis christosJoomla@psd kaltsidis christos
Joomla@psd kaltsidis christosNikos Michailidis
 
Επιχειρηματικά μοντέλα για ευέλικτη παροχή υπηρεσιών σε δυναμικά αναπροσαρμοζ...
Επιχειρηματικά μοντέλα για ευέλικτη παροχή υπηρεσιών σε δυναμικά αναπροσαρμοζ...Επιχειρηματικά μοντέλα για ευέλικτη παροχή υπηρεσιών σε δυναμικά αναπροσαρμοζ...
Επιχειρηματικά μοντέλα για ευέλικτη παροχή υπηρεσιών σε δυναμικά αναπροσαρμοζ...akargas
 

Similar to Website with Embedded Forum Construction (20)

Σχεδιασμός & Κατασκευή Δυναμικών Διαδικτυακών τόπων με CMS για on-line κρατήσ...
Σχεδιασμός & Κατασκευή Δυναμικών Διαδικτυακών τόπων με CMS για on-line κρατήσ...Σχεδιασμός & Κατασκευή Δυναμικών Διαδικτυακών τόπων με CMS για on-line κρατήσ...
Σχεδιασμός & Κατασκευή Δυναμικών Διαδικτυακών τόπων με CMS για on-line κρατήσ...
 
Aρχιτεκτονική yπολογιστών i nikolos
Aρχιτεκτονική yπολογιστών i nikolosAρχιτεκτονική yπολογιστών i nikolos
Aρχιτεκτονική yπολογιστών i nikolos
 
Pialoglou_Alexandros_Dip_2015
Pialoglou_Alexandros_Dip_2015Pialoglou_Alexandros_Dip_2015
Pialoglou_Alexandros_Dip_2015
 
Blogs manual wordpress-sch.gr
Blogs manual wordpress-sch.grBlogs manual wordpress-sch.gr
Blogs manual wordpress-sch.gr
 
Case study bpr
Case study bprCase study bpr
Case study bpr
 
αναφορά
αναφοράαναφορά
αναφορά
 
Δημιουργία Πλατφόρμας Διεξαγωγής Online Διαγωνισμών Προγραμματισμού
Δημιουργία Πλατφόρμας Διεξαγωγής Online Διαγωνισμών ΠρογραμματισμούΔημιουργία Πλατφόρμας Διεξαγωγής Online Διαγωνισμών Προγραμματισμού
Δημιουργία Πλατφόρμας Διεξαγωγής Online Διαγωνισμών Προγραμματισμού
 
Σχεδιασμός & Κατασκευή Δυναμικού Διαδικτυακού Τόπου με Σύστημα Διαχείρισης Πε...
Σχεδιασμός & Κατασκευή Δυναμικού Διαδικτυακού Τόπου με Σύστημα Διαχείρισης Πε...Σχεδιασμός & Κατασκευή Δυναμικού Διαδικτυακού Τόπου με Σύστημα Διαχείρισης Πε...
Σχεδιασμός & Κατασκευή Δυναμικού Διαδικτυακού Τόπου με Σύστημα Διαχείρισης Πε...
 
Fortran notes panepistimio_kritis
Fortran notes panepistimio_kritisFortran notes panepistimio_kritis
Fortran notes panepistimio_kritis
 
Η ΘΕΜΑΤΙΚΗ ΚΑΙ ΣΧΕΔΙΑΣΤΙΚΗ ΕΞΕΛΙΞΗ ΤΟΥ WEB DESIGN ΑΠΟ ΤΙΣ ΠΡΩΤΕΣ ΗΜΕΡΕΣ ΤΟΥ...
Η ΘΕΜΑΤΙΚΗ ΚΑΙ ΣΧΕΔΙΑΣΤΙΚΗ ΕΞΕΛΙΞΗ ΤΟΥ  WEB  DESIGN ΑΠΟ ΤΙΣ ΠΡΩΤΕΣ ΗΜΕΡΕΣ ΤΟΥ...Η ΘΕΜΑΤΙΚΗ ΚΑΙ ΣΧΕΔΙΑΣΤΙΚΗ ΕΞΕΛΙΞΗ ΤΟΥ  WEB  DESIGN ΑΠΟ ΤΙΣ ΠΡΩΤΕΣ ΗΜΕΡΕΣ ΤΟΥ...
Η ΘΕΜΑΤΙΚΗ ΚΑΙ ΣΧΕΔΙΑΣΤΙΚΗ ΕΞΕΛΙΞΗ ΤΟΥ WEB DESIGN ΑΠΟ ΤΙΣ ΠΡΩΤΕΣ ΗΜΕΡΕΣ ΤΟΥ...
 
Diploma thesis
Diploma thesisDiploma thesis
Diploma thesis
 
ptuxiakh-teliki_morfi _ savakis-koutroumanos
ptuxiakh-teliki_morfi _ savakis-koutroumanosptuxiakh-teliki_morfi _ savakis-koutroumanos
ptuxiakh-teliki_morfi _ savakis-koutroumanos
 
thesis
thesisthesis
thesis
 
UML
UMLUML
UML
 
Joomla@psd kaltsidis christos
Joomla@psd kaltsidis christosJoomla@psd kaltsidis christos
Joomla@psd kaltsidis christos
 
Mικροεπεξεργαστές
MικροεπεξεργαστέςMικροεπεξεργαστές
Mικροεπεξεργαστές
 
Blogs manual v5
Blogs manual v5Blogs manual v5
Blogs manual v5
 
Blogs manual.
Blogs manual.Blogs manual.
Blogs manual.
 
Επιχειρηματικά μοντέλα για ευέλικτη παροχή υπηρεσιών σε δυναμικά αναπροσαρμοζ...
Επιχειρηματικά μοντέλα για ευέλικτη παροχή υπηρεσιών σε δυναμικά αναπροσαρμοζ...Επιχειρηματικά μοντέλα για ευέλικτη παροχή υπηρεσιών σε δυναμικά αναπροσαρμοζ...
Επιχειρηματικά μοντέλα για ευέλικτη παροχή υπηρεσιών σε δυναμικά αναπροσαρμοζ...
 
Python tutorial by example
Python tutorial by examplePython tutorial by example
Python tutorial by example
 

Website with Embedded Forum Construction

  • 1. ΤΕΧΝΟΛΟΓΙΚΟ ΕΚΠΑΙΔΕΥΤΙΚΟ ΙΔΡΥΜΑ ΠΕΙΡΑΙΑ Τ.Ε.Ι ΠΕΙΡΑΙΑ ΚΑΤΑΣΚΕΥΗ ΗΛΕΚΤΡΟΝΙΚΗΣ ΣΕΛΙΔΑΣ ΜΕ ΕΝΣΩΜΑΤΩΜΕΝΟ ΔΙΑΔΡΑΣΤΙΚΟ ΦΟΡΟΥΜ ΜΕ JOOMLA SITE WITH EMBEDDED FORUM CONSTRUCTION WITH JOOMLA ΓΡΗΓΟΡΟΠΟΥΛΟΣ ΜΙΧΑΗΛ ΕΠΙΒΛΕΠΟΝ: Ι.Δ ΑΓΓΕΛΟΠΟΥΛΟΣ ΠΤΥΧΙΑΚΗ ΕΡΓΑΣΙΑ ΣΧΟΛΗ ΤΕΧΝΟΛΟΓΙΚΩΝ ΕΦΑΡΜΟΓΩΝ ΤΜΗΜΑ ΑΥΤΟΜΑΤΙΣΜΟΥ ΔΕΚΕΜΒΡΙΟΣ 2013
  • 2. 2 | Σ ε λ ί δ α ΤΜΗΜΑ ΜΗΧΑΝΙΚΩΝ ΑΥΤΟΜΑΤΙΣΜΟΥ Π. Ράλλη & Θηβών 250, 12244 Αιγάλεω , Αθήνα – Ελλάδα Τηλ. 210-5381488 Περίληψη Στόχος της παρούσας πτυχιακής εργασίας, αποτελεί η ανάπτυξη μίας ιστοσελίδας με χρήση CMS ανοιχτού κώδικα (Joomla) και με ενσωματωμένο Φόρουμ. Για την ενσωμάτωση του Φόρουμ στην ιστοσελίδα, θα χρησιμοποιηθεί η εφαρμογή Kunena Forums, με αρκετές τροποποιήσεις τόσο στον κώδικα CSS και τα αρχεία γλώσσας όσο και στον κώδικα PHP της εφαρμογής. Αρχικά θα γίνει μία ιστορική αναδρομή στην εξέλιξη των Φόρουμ και στα λογισμικά που εμφανίστηκαν μέχρι σήμερα και επίσης θα γίνει ανάλυση της λειτουργίας των σύγχρονων Φόρουμ. Εν συνεχεία θα μελετηθούν και θα παρουσιαστούν οι αρχές σχεδιασμού μιας ιστοσελίδας. Για να καταφέρουμε να έχουμε ένα άρτιο αποτέλεσμα στον σχεδιασμό και επίσης για να καταφέρουμε να κατασκευάσουμε μια ιστοσελίδα φιλική προς τον χρήστη και με υψηλή επισκεψιμότητα, θα πρέπει να αναλυθούν τα χαρακτηριστικά και οι στόχοι της ιστοσελίδας και να καθοριστούν οι μέθοδοι για την ανάπτυξη και τον σχεδιασμό της. Σημαντικά κομμάτια αποτελούν η εργονομία, η αισθητική, καθώς και το κομμάτι του SEO της ιστοσελίδας. Θα παρουσιαστούν αναλυτικά τα πλεονεκτήματα της χρήσης συστημάτων διαχείρισης περιεχομένου και θα επικεντρωθούμε κυρίως στο CMS ανοιχτού κώδικα που ονομάζεται Joomla. Θα επεξηγηθούν οι λειτουργίες του και θα παρουσιαστεί ένας αναλυτικός οδηγός εγκατάστασης της εφαρμογής. Ενδεικτικά θα παρουσιαστούν και κάποιες συμβουλές για αύξηση της ασφάλειας του ιστότοπου. Τέλος, θα γίνει παρουσίαση του αποτελέσματος και ένας αναλυτικός οδηγός για τις βασικές λειτουργίες του Φόρουμ που κατασκευάσαμε.
  • 3. 3 | Σ ε λ ί δ α Περιεχόμενα Περίληψη........................................................................................................................2 1. Εισαγωγή.....................................................................................................................5 1.1 Φόρουμ (Forum) ....................................................................................................... 5 1.2 Ιστορική Αναδρομή ................................................................................................... 6 1.3 Δομή και λειτουργία.................................................................................................. 7 1.3.1 Όροι Χρήσης............................................................................................................. 7 1.3.2 Δομή ......................................................................................................................... 7 1.3.3 Κατηγορίες Χρηστών................................................................................................ 8 1.3.4 Εγγραφή Χρήστη....................................................................................................... 8 1.3.5 Προφίλ Χρήστη......................................................................................................... 8 1.3.6 Προσωπικά Μηνύματα (Personal Messages – PMs)................................................ 8 Αναφορές 1ου Κεφαλαίου.................................................................................................... 9 2. Αρχές Σχεδιασμού Ιστοσελίδων.................................................................................. 10 2.1 Ιστοσελίδα - Χαρακτηριστικά........................................................................................ 10 2.2 Στόχοι και Χαρακτηριστικά Ιστότοπου.......................................................................... 11 2.3 Μεθοδολογία για την ανάπτυξη και τον σχεδιασμό .................................................... 11 2.4 Εργονομία και αισθητική ιστοσελίδων......................................................................... 12 2.5 SEO................................................................................................................................. 13 2.6 Τεχνολογίες και εργαλεία ............................................................................................. 15 2.6.1 Apache.................................................................................................................... 15 2.6.2 MySQL..................................................................................................................... 16 2.6.3 PHP ......................................................................................................................... 17 2.6.4 CSS .......................................................................................................................... 17 2.6.5 PhpMyAdmin.......................................................................................................... 17 Αναφορές 2ου Κεφαλαίου.................................................................................................. 18 3. Η πλατφόρμα Joomla................................................................................................ 19 3.1 Γενικά για το Joomla...................................................................................................... 19
  • 4. 4 | Σ ε λ ί δ α 3.2 Η δομή του Joomla........................................................................................................ 21 3.2.1 Διεπαφή χρηστών................................................................................................... 21 3.2.2 Διεπαφή διαχειριστών ........................................................................................... 21 3.2.3 Πρότυπα (Templates)............................................................................................. 21 3.2.4 Επεκτάσεις (Extentions) ......................................................................................... 22 3.3 Εγκατάσταση Joomla..................................................................................................... 22 3.3.1 Δημιουργία βάσης δεδομένων .............................................................................. 22 3.3.2 Μεταφόρτωση και εγκατάσταση Joomla............................................................... 24 3.4 Διαχείριση Περιεχομένου ............................................................................................. 29 3.4.1 Δημιουργία κατηγοριών......................................................................................... 29 3.4.2 Δημιουργία Άρθρων............................................................................................... 31 3.4.3 Διαχείριση Μενού .................................................................................................. 32 3.5 Ασφάλεια Ιστοσελίδας.................................................................................................. 35 3.5.1 Χωρίς joomla generator tag ................................................................................... 35 3.5.2 Προστασία αρχείου configuration.php.................................................................. 35 Αναφορές 3ου Κεφαλαίου.................................................................................................. 37 4. Το Φόρουμ Vespophrenia.gr ...................................................................................... 38 4.1 Template / Πρότυπο...................................................................................................... 38 4.2 Modules / Ενθέματα...................................................................................................... 43 4.3 Add-ons / Πρόσθετα...................................................................................................... 44 4.4 Components / Εφαρμογές............................................................................................. 46 4.4.1 Γενικά...................................................................................................................... 46 4.4.2 Kunena Component................................................................................................ 47 4.5 Παρουσίαση του Φόρουμ............................................................................................. 49 4.5.1 Εγγραφή Χρήστη..................................................................................................... 49 4.5.2 Προφίλ Χρήστη....................................................................................................... 52 4.5.3 Προσωπικά Μηνύματα .......................................................................................... 53 4.5.4 Ανάγνωση Θεμάτων και Δημιουργία Νέων ........................................................... 56 4.5.5 Αναφορά σε συντονιστή......................................................................................... 59 Αναφορές 4ου Κεφαλαίου.................................................................................................. 62
  • 5. 5 | Σ ε λ ί δ α 1. Εισαγωγή Καθώς το internet εισχωρεί καθημερινά στη ζωή μας όλο και περισσότερο, η ανάγκη κατασκευής ιστοσελίδων αυξάνεται προκειμένου να εξυπηρετηθεί η ανάρτηση πληροφοριών ή οπτικοακουστικού υλικού, η ενημέρωση, η προώθηση μιας επιχείρησης, η κοινωνική δικτύωση αλλά και οποιαδήποτε άλλη δραστηριότητα μπορεί να εκφραστεί διαδικτυακά. Η ανάγκη για ευκολότερη και πιο γρήγορη κατασκευή – διαχείριση ιστοσελίδων, οδήγησε στην εξέλιξη των Συστημάτων Διαχείρισης Περιεχομένου (Content Management System – CMS). Το CMS είναι ένα πακέτο λογισμικού σχεδιασμένο για την διαχείριση ενός ιστότοπου. Διαχειρίζεται ολόκληρο τον κύκλο ζωής μιας ιστοσελίδας, από την δημιουργία της μέχρι και την αρχειοθέτηση της.[1] Στην παρούσα εργασία θα μελετηθεί η κατασκευή μίας ιστοσελίδας με χρήση CMS ανοιχτού κώδικα (Joomla) και με ενσωματωμένο φόρουμ που θα αναφέρεται στους λάτρες του κλασικού μοτοσυκλετισμού και συγκεκριμένα σε ένα δίκυκλο το οποίο έγραψε ιστορία στον χώρο αυτό, την γνωστή σε όλους μας Vespa της Piaggio. 1.1 Φόρουμ (Forum) Το Φόρουμ (Forum) είναι ένας διαδικτυακός τόπος συνάθροισης ανθρώπων, διαμοιρασμού ιδεών και απόψεων. Είναι μια υπηρεσία ενός ηλεκτρονικού διαδικτυακού πίνακα όπου χρήστες με κοινά και όχι μόνο ενδιαφέροντα, μπορούν να τοποθετήσουν τις απόψεις και σημειώσεις τους πάνω σε ένα ή περισσότερα θέματα. Αποτελεί ένα διαδικτυακό εργαλείο στο οποίο εγγεγραμμένα μέλη και όχι μόνο, μπορούν να δημιουργήσουν συζητήσεις, να ανταλλάξουν απόψεις, ιδέες και να μοιράζονται πληροφορίες για θέματα ποικίλης ύλης, λειτουργώντας ως μία διαδικτυακή κοινότητα. Η βασική διαφορά ενός Φόρουμ από τα chat rooms είναι ότι τα μηνύματα των χρηστών αρχειοθετούνται έτσι ώστε να μπορούν οι χρήστες του διαδικτύου να ανατρέξουν σε αυτά οποιαδήποτε στιγμή χρειαστεί.
  • 6. 6 | Σ ε λ ί δ α Με την ανάπτυξη των Φόρουμ, αναπτύχθηκε και η γλώσσα η οποία σχετίζεται με αυτά. Για παράδειγμα, μία συζήτηση ονομάζεται Thread (Νήμα) ή Topic (Θέμα). 1.2 Ιστορική Αναδρομή Τα σύγχρονα Φόρουμ, προέρχονται από τα Bulletin Boards που είναι η τεχνολογική εξέλιξη του dial up Bulletin Board συστήματος που αναπτύχθηκε στα τέλη της δεκαετίας του ‘70. [2] Τα πρώιμα διαδικτυακά Φόρουμ, μπορούν να περιγραφούν ως οι web εκδόσεις από ηλεκτρονικές λίστες αλληλογραφίας ή newsgroups που επέτρεπαν στους χρήστες τους να δημοσιεύσουν μηνύματα ή σχόλια στα μηνύματα άλλων χρηστών. Ένα από τα πρώτα διαδικτυακά Φόρουμ που πλησίαζε την μορφή των σημερινών Φόρουμ ήταν το “Delphi Forums” το οποίο το 1983 απαριθμούσε 4.000.000 εγγεγραμμένους χρήστες. Τα Φόρουμ στη σημερινή τους μορφή άρχισαν να εμφανίζονται και να εξελίσσονται περίπου από το 1994 με την ανάπτυξη του WIT Project από την W3 Consortium (Διεθνής Κοινότητα Προτυποποίησης Διαδικτύου). Από το 1994 και μετά αναπτύχθηκαν πολλές εναλλακτικές πλατφόρμες (Εικόνα 1). [3] Εικόνα 1: Χρονικό διάγραμμα ανάπτυξης λογισμικών για φόρουμ
  • 7. 7 | Σ ε λ ί δ α Με την ανάπτυξη σχετικών εφαρμογών, αρχίζουν να δημιουργούνται διαδικτυακές κοινότητες γύρω από τα Φόρουμ τα οποία πλέον έχουν σταθερούς χρήστες. Η θεματολογία του κάθε φόρουμ ποικίλει. Δημιουργούνται Φόρουμ τεχνολογίας, αθλητισμού, παιχνιδιών, μουσικής, μόδας, θρησκείας, πολιτικής και γενικής θεματολογίας με αποτέλεσμα να φτάσουμε στην σημερινή μορφή των Φόρουμ. 1.3 Δομή και λειτουργία Τα Φόρουμ προωθούν την ανοιχτή και ελεύθερη συζήτηση και συχνά υιοθετούν γενικά πρότυπα. Τα πιο συχνά θέματα που μπορεί να συναντήσει κάποιος σε ένα φόρουμ περιέχουν ερωτήσεις, συγκρίσεις, ψηφοφορίες σχετικά με την γνώμη των μελών σε κάποιο συγκεκριμένο ζήτημα και δημόσιες συζητήσεις.[2] 1.3.1 Όροι Χρήσης Η λειτουργία ενός φόρουμ είναι σημαντικό να διέπεται από κανόνες έτσι ώστε να μην ξεφεύγουν οι συζητήσεις σε σημείο που παραβιάζονται προσωπικά δεδομένα μελλών ή τρίτων, προσβάλλονται μέλη ή τρίτοι, παρακωλύεται η εύρυθμη λειτουργία της ιστοσελίδας ή παραβιάζεται η νομοθεσία που διέπει το διαδίκτυο. Για την αποφυγή όλων των παραπάνω, θεσπίζονται οι όροι χρήσης του Φόρουμ τους οποίους αποδέχεται κάθε χρήστης με την εγγραφή του. Οι διαχειριστές του φόρουμ διατηρούν το δικαίωμα να αποκλείσουν κάποιον χρήστη (Ban) είτε για ορισμένο χρονικό διάστημα είτε επ’ αόριστον, εάν αυτός δεν τηρεί τους όρους αυτούς. Μερικοί από τους όρους που μπορεί να συναντήσει κάποιος σε ένα φόρουμ είναι οι εξής:  Απαγορεύεται η δημιουργία περισσότερων του ενός λογαριασμού πρόσβασης  Απαγορεύονται τα μηνύματα για παράνομο λογισμικό, λογισμικό εξουδετέρωσης προστασίας, ή αναφέρονται σε παράνομη απόκτηση προστατευμένου περιεχόμενου.  Απαγορεύονται οι διαφημίσεις στα μηνύματα  Απαγορεύεται η δημοσίευση προσωπικών δεδομένων άλλου μέλους ή τρίτων χωρίς πρώτα να έχει ζητηθεί η άδεια τους.  Απαγορεύεται η ανάρτηση φωτογραφιών με ακατάλληλο για ανηλίκους περιεχόμενο, ρατσιστικό ή θρησκευτικό περιεχόμενο καθώς και προσωπικά δεδομένα τρίτων των οποίων δεν έχει πρώτα ζητηθεί η άδεια. 1.3.2 Δομή Ένα Φόρουμ δομείται ιεραρχικά ή με την μορφή δέντρου. Μπορεί να περιέχει Subforums (Υποκατηγορίες) οι οποίες με την σειρά τους θα περιέχουν πολλά Topics
  • 8. 8 | Σ ε λ ί δ α (Θέματα) μέσα στα οποία θα υπάρχουν πολλαπλά Threads (Νήματα). Σε κάθε νέο Thread που ξεκινάει από έναν χρήστη, οι υπόλοιποι χρήστες, καθώς και ο δημιουργός του Thread, μπορούν να δημοσιεύσουν πολλαπλά μηνύματα (Posts) ή απαντήσεις. 1.3.3 Κατηγορίες Χρηστών Οι χρήστες ενός Φόρουμ χωρίζονται σε κατηγορίες όπως:  Επισκέπτες – Επισκέπτες είναι αυτοί που επισκέπτονται τον ιστότοπο και δεν έχουν πραγματοποιήσει εγγραφή.  Μέλη – Είναι όσοι έχουν πραγματοποιήσει εγγραφή και έχουν συγκεκριμένα δικαιώματα. Αναλόγως την συμμετοχή τους στο φόρουμ, αποκτούν βαθμό (Rank).  Συντονιστές (Moderators) – Είναι αυτοί που τους έχει εκχωρηθεί το δικαίωμα να συντονίζουν συζητήσεις, να επεξεργάζονται τις κατηγορίες, τις υποκατηγορίες και τις αναρτήσεις των μελών.  Διαχειριστές Ιστότοπου (Administrators) – Είναι οι διαχειριστές ολόκληρου του ιστότοπου που έχουν πλήρη δικαιώματα στην επεξεργασία όλων των κατηγοριών, των υποκατηγοριών των αναρτήσεων και είναι υπεύθυνοι για την εύρυθμη λειτουργία της ιστοσελίδας. 1.3.4 Εγγραφή Χρήστη Για να μπορεί να δημοσιεύσει την άποψη του κάποιος σε ένα Φόρουμ, πρέπει να πραγματοποιήσει εγγραφή. Κατά την εγγραφή ζητείται υποχρεωτικά από τον χρήστη να δηλώσει μία διεύθυνση ηλεκτρονικού ταχυδρομείου, ένα όνομα χρήστη (Username) και ένα κωδικό πρόσβασης (Password) καθώς επίσης και να αποδεχτεί τους όρους χρήσης του φόρουμ. Προαιρετικά ζητείται από τον χρήστη να δηλώσει το όνομα του και κάποια προσωπικά του στοιχεία όπως την ημερομηνία γέννησης του, μία φωτογραφία του ή κάποια υπογραφή που θα ενσωματώνεται στα μηνύματα του. 1.3.5 Προφίλ Χρήστη Ο κάθε χρήστης έχει την δυνατότητα δημιουργίας προσωπικού προφίλ στο οποίο μπορεί να δημοσιεύσει προσωπικές πληροφορίες, φωτογραφία, στοιχεία επικοινωνίας και κάποια υπογραφή που θα ενσωματώνεται στα μηνύματα του. Με αυτό τον τρόπο μπορεί κάθε εγγεγραμμένος χρήστης να επισκεφτεί το προφίλ ενός άλλου χρήστη για να δει κάποια στοιχεία για αυτόν. 1.3.6 Προσωπικά Μηνύματα (Personal Messages – PMs)
  • 9. 9 | Σ ε λ ί δ α Τα προσωπικά μηνύματα είναι μηνύματα τα οποία απευθύνονται σε έναν μόνο χρήστη και δεν είναι δημόσια. Με την χρήση προσωπικών μηνυμάτων, μπορούν δύο χρήστες να επικοινωνήσουν μεταξύ τους χωρίς να βρίσκεται σε κοινή θέα η συζήτηση τους. Τα προσωπικά μηνύματα λειτουργούν περίπου σαν μια υπηρεσία ηλεκτρονικού ταχυδρομείου (webmail) και χωρίζονται σε εισερχόμενα (inbox), εξερχόμενα (outbox) και διαγραμμένα (deleted). [2] Αναφορές 1ου Κεφαλαίου 1. http://www.slideshare.net/rodotheos/cms-421346 , προσπέλαση 19/11/2013 2. http://en.wikipedia.org/wiki/Internet_forum, προσπέλαση 19/11/2013 3. http://www.forum-software.org/forum-software-timeline-from-1994-to-today, προσπέλαση 19/11/2013
  • 10. 10 | Σ ε λ ί δ α 2. Αρχές Σχεδιασμού Ιστοσελίδων Παλαιότερα, για την δημιουργία μιας ιστοσελίδας, χρειάζονταν η εξειδικευμένη γνώση γραφής κώδικα σε HTML. Πλέον με τα Συστήματα Διαχείρισης Περιεχομένου ο δημιουργός – διαχειριστής δεν χρειάζεται εξειδικευμένες γνώσεις και μπορεί να επιτύχει ιστότοπους μεγάλης αισθητικής με γνώσεις μορφοποίησης κειμένου και απλού χειρισμού ενός CMS. Πριν γνωρίσουμε τα CMS, θα δούμε τις ενέργειες που χρειάζεται να γίνουν για την δημιουργία ενός ιστότοπου. Ο σχεδιασμός και η έρευνα αλλά και τα εργαλεία που θα χρησιμοποιηθούν, είναι ίσως τα σημαντικότερα στοιχεία στην κατασκευή ενός λειτουργικού και φιλικού προς τον χρήστη ιστότοπου.[1] 2.1 Ιστοσελίδα - Χαρακτηριστικά Ιστοσελίδα είναι το έγγραφο – πληροφορία η οποία προορίζεται για τον Παγκόσμιο Ιστό (WWW). Ένα σύνολο ιστοσελίδων, δημιουργούν έναν ιστότοπο. Μία ιστοσελίδα μπορεί να είναι δυναμική ή στατική. Η επιλογή για το είδος που θα χρησιμοποιηθεί πρέπει να γίνει κατά κύριο λόγο από το κατά πόσο συχνά θα ανανεώνουμε την πληροφορία που θα εμπεριέχει ο ιστότοπος. Οι στατικές σελίδες χαρακτηρίζονται από την μονιμότητα του περιεχομένου τους και της διάταξής τους. Κυρίως χρησιμοποιείται για την γραφή τους η γλώσσα σήμανσης HTML(HyperText Markup Language), η οποία δημιουργήθηκε από την IBM για την τυποποιημένη εμφάνιση των κειμένων της, αλλά και κάποιο πρόγραμμα με κειμενογράφο WYSIWYG (What You See Is What You Get) όπως είναι το Macromedia / Adobe Dreamweaver. Είναι κατάλληλες για γενικές παρουσιάσεις και για ιστότοπους που το περιεχόμενο τους δεν χρειάζεται συχνά ανανέωση. [2],[3] Τα κυριότερα χαρακτηριστικά μιας στατικής σελίδας είναι:  Χαμηλό κόστος κατασκευής.  Χαμηλό κόστος φιλοξενίας.  Γρήγορη κατασκευή.  Εύκολη κατασκευή.  Γρήγορη προβολή της σελίδας.
  • 11. 11 | Σ ε λ ί δ α  Δυσκολία ανανέωσης περιεχομένου.  Δυσκολία υποστήριξης μεγάλου περιεχομένου. Οι δυναμικές ιστοσελίδες χαρακτηρίζονται από την διαδραστικότητα που υπάρχει μεταξύ χρήστη και σελίδας. Για την δημιουργία του χρησιμοποιούνται διάφορες γλώσσες σεναρίων όπως είναι η ASP, JSP, Perl ή PHP. Όλες οι πληροφορίες για τις σελίδες αποθηκεύονται σε βάσεις δεδομένων όπου οι χρήστες μπορούν να τις διαχειρίζονται μέσω των Συστημάτων Διαχείρισης Περιεχομένου. Οι δυναμικές σελίδες περιέχουν και στατικό περιεχόμενο το οποίο επιλέγεται από τον κατασκευαστή του ιστότοπου ποιο θα είναι. [2],[3] Τα κυριότερα χαρακτηριστικά των δυναμικών ιστοσελίδων είναι:  Εύκολη ανανέωση περιεχομένου  Εύκολη υποστήριξη μεγάλου περιεχομένου  Μεγάλο κόστος κατασκευής  Μεγάλο κόστος φιλοξενίας 2.2 Στόχοι και Χαρακτηριστικά Ιστότοπου Το πρώτο βήμα κατά το σχεδιασμό ενός ιστότοπου, είναι η ανάλυση των στόχων και των χαρακτηριστικών του ιστότοπου. Μερικά ερωτήματα που είναι απαραίτητο να απαντηθούν είναι τα ακόλουθα:  Ποιος θα είναι ο στόχος ή διαφορετικά ο λόγος ύπαρξης του ιστότοπου;  Προϊδεάζει το όνομα του ιστότοπου για την πληροφορία που θα πάρουμε;  Ποια είναι η φύση και η ποσότητα του περιεχομένου που θα παρουσιαστεί μέσα από αυτόν; Δηλαδή το είδος του υλικού που θα εμφανίζεται στις σελίδες του ιστότοπου, κείμενα, φωτογραφίες, και αν θα είναι το περιεχόμενο στατικό ή θα ανανεώνεται συχνά;  Ποιό θα είναι το κοινό στο οποίο θα απευθύνεται; Δηλαδή ποιοι θα είναι οι τελικοί του χρήστες, αλλά και ποιοι θα είναι οι χρήστες που θα ενημερώνουν το περιεχόμενο του ιστότοπου;  Ποιος είναι ο προϋπολογισμός και το χρονοδιάγραμμα ανάπτυξης;  Ποια είναι τα διαθέσιμα μέσα (γνώσεις, τεχνικές λύσεις κλπ); Αν υπάρχουν γνώσεις εγκατάστασης εφαρμογών και βάσεων δεδομένων, δημιουργίας ιστοσελίδων, γνώσεις εξυπηρετητών (server) του Παγκόσμιου Ιστού και ποιες τεχνικές λύσεις υπάρχουν στη διάθεσή μας; [4],[6],[19] 2.3 Μεθοδολογία για την ανάπτυξη και τον σχεδιασμό
  • 12. 12 | Σ ε λ ί δ α Εφόσον έχει γίνει μια αρχική ανάλυση των χαρακτηριστικών του ιστότοπου που σκοπεύουμε να αναπτύξουμε και έχει διαμορφωθεί μια πρωταρχική άποψη για τα εργαλεία που θα χρησιμοποιήσουμε, η επιλογή των εργαλείων επιβάλλεται να γίνει με βάση τις ανάγκες που πρέπει να καλυφθούν σε συνάρτηση με τις δυνατότητες που υπάρχουν. Μερικές ερωτήσεις που δημιουργούνται είναι οι ακόλουθες:  Υπάρχουν οι τεχνικές γνώσεις εγκατάστασης και παραμετροποίησης της MySQL και του Joomla;  Ο διακομιστής του web που θα φιλοξενήσει τον ιστότοπο, μπορεί να υποστηρίξει MySQL, PHP και εγκατάσταση Joomla;  Μετά την ανάπτυξη του ιστότοπου με Joomla θα είναι εφικτή η συντήρηση και ενημέρωση των εφαρμογών του;  Υπάρχουν προβλήματα ασφάλειας τα οποία πιθανόν να έρχονται σε σύγκρουση με το Joomla;  Το είδος και η ποσότητα του περιεχομένου του ιστότοπου είναι τέτοιο ώστε να δικαιολογεί την εγκατάσταση, διαχείριση και συντήρηση συστήματος διαχείρισης περιεχομένου; Ο σχεδιασμός είναι ένα απολύτως απαραίτητο βήμα πριν από την οποιαδήποτε ενέργεια ανάπτυξης λογισμικού. Η έλλειψη σχεδιασμού ή ο κακός σχεδιασμός δημιουργεί προβλήματα και καθυστερήσεις στην πορεία του έργου, με συνέπεια το επιπλέον κόστος. Ένας καλός και προσεκτικός σχεδιασμός λειτουργεί ως οδηγός για την ανάπτυξη του ιστότοπου και πρέπει να περιέχει όσο γίνεται περισσότερες λεπτομέρειες. [6] Τα βήματα σχεδιασμού ενός δικτυακού τόπου με Joomla και όχι μόνο είναι τα εξής: 1. Λεπτομερής ανάλυση των απαιτήσεων του ιστότοπου. 2. Σχεδίαση του δικτυακού τόπου. 3. Συλλογή – ανάπτυξη – επεξεργασία της παρεχόμενης πληροφορίας. 2.4 Εργονομία και αισθητική ιστοσελίδων Η εργονομία ενός ιστότοπου πρέπει να περιλαμβάνεται στους κορυφαίους στόχους κατά την δημιουργία του. Ένας επισκέπτης ο οποίος ικανοποίησε τον σκοπό για τον οποίο επισκέφθηκε τον ιστότοπο είναι πιθανόν να το προτείνει σε φίλους και γνωστούς, να κάνει εγγραφή ώστε να ενημερώνεται για τα νέα μας, και το κυριότερο να επισκεφθεί ξανά τον ιστότοπο μας. Κατά την δημιουργία ενός ιστότοπου (δεν έχει σημασία το είδος του, εμπορικό, ενημερωτικό κ.α.) είναι βασικό η ανάπτυξη του να στηρίζεται στις απαιτήσεις των επισκεπτών για τους οποίους προορίζεται και να είναι φιλικό στον επισκέπτη. Φιλικό
  • 13. 13 | Σ ε λ ί δ α σημαίνει η πληροφορία να είναι εύκολα προσπελάσιμη, να διαβάζεται και να κατανοείται εύκολα από τους επισκέπτες του ιστότοπου. Πιο συγκεκριμένα ένας ιστότοπος για να θεωρηθεί ότι είναι φιλικός προς τον χρήστη θα πρέπει να έχει κάποια συγκεκριμένα χαρακτηριστικά:  Γρήγορη εμφάνιση σελίδων, δεν είναι όλοι οι επισκέπτες υπομονετικοί οπότε καλό θα είναι οι σελίδες μας να περιέχουν μόνο την πληροφορία που χρειάζεται. Παράγοντες που μπορούν να ευθύνονται για την αργή φόρτωση μπορεί να είναι φωτογραφίες, επιπλέον flash, κώδικας Java αλλά και το μέγεθος της σελίδας.  Πλοήγηση, δημιουργία πλοηγού μέσα στον ιστότοπο μας ώστε ο επισκέπτης να γνωρίζει την θέση του μέσα στον ιστότοπο την κάθε στιγμή  Χάρτης ιστότοπου, όσο και αν είναι το μέγεθος του ιστότοπου ο επισκέπτης πρέπει με την πρώτη ματιά να αντιληφθεί τα διαφορετικά επίπεδα του ιστότοπου. Επίσης η δημιουργία χάρτη είναι πολύ ‘φιλική’ στις μηχανές αναζήτησης.  Αρχική, ο επισκέπτης πρέπει να έχει την δυνατότητα επιστροφής στην αρχική σελίδα με ένα κλικ από οποιοδήποτε σημείο της. Επίσης το λογότυπο του ιστότοπου να λειτουργεί και σαν σύνδεσμος για την αρχική σελίδα.  Περιεχόμενο, ο ιστότοπος πρέπει να είναι όσο το δυνατόν κατηγοριοποιημένος και να μην περιέχει διαφόρων ειδών πληροφορίες.  Αναζήτηση, ο επισκέπτης να έχει την δυνατότητα αναζήτησης σε όλα τα επίπεδα του ιστότοπου.  Νέο παράθυρο (pop-up), άνοιγμα σε νέο παράθυρο μόνο για .pdf αρχεία.  Λειτουργίες, θα πρέπει να γίνει έλεγχος ότι όλες οι φόρμες επικοινωνίας και όλες οι λειτουργίες του ιστότοπου μας λειτουργούν σωστά.  Γλώσσα, η γλώσσα γραφής πρέπει να είναι προσανατολισμένη για το κοινό στο οποίο απευθύνεται ο ιστότοπος.  Γραμματοσειρά, όχι περίεργη επιλογή η οποία θα κουράσει τον επισκέπτη. Πρέπει να παρέχεται δυνατότητα αλλαγής του μεγέθους.  Χρώματα, σωστή ισορροπία χρωμάτων για πιο ξεκούραστη πλοήγηση και ανάγνωση. [5],[6] 2.5 SEO Από τα μέσα τις δεκαετίας του ’90, με την άνθιση του διαδικτύου δημιουργήθηκε η ανάγκη για την βελτιστοποίηση των ιστότοπων καθώς οι πρώτες μηχανές αναζήτησης δημιουργούσαν τους πρώτους τους καταλόγους. Είτε δημιουργούμε έναν εμπορικό ιστότοπο είτε όχι, αυτό που πρέπει να μας ενδιαφέρει είναι να μπορεί ο επισκέπτης να εντοπίσει τον ιστότοπο μας μέσω μιας μηχανής αναζήτησης. Ο όρος SEO (search engine optimization) αναφέρεται σε όλες τις ενέργειες που μπορούμε να κάνουμε (θεμιτές και μη – white/black hat), ώστε ο ιστότοπος μας να γίνει πιο
  • 14. 14 | Σ ε λ ί δ α αρεστός για τις μηχανές αναζήτησης, με αποτέλεσμα να εμφανίζεται υψηλότερα στη λίστα με τα αποτελέσματα τους - SERP (Search Engine Result Page). Στις αρχικές εκδόσεις των μηχανών αναζήτησης υπήρξε χειραγώγηση των αποτελεσμάτων από τους κατασκευαστές ιστοσελίδων με αποτέλεσμα οι μηχανές αναζήτησης να αρχίσουν να αναπτύσσουν τους αλγόριθμους αναζήτησης αποκρύπτοντας τους από το κοινό. Οι αλγόριθμοι πλέον λάμβαναν υπόψη και άλλα κριτήρια εκτός από το περιεχόμενο του ιστότοπου όπως είναι οι αναφορές που γίνονται σε έναν ιστότοπο από άλλους ιστότοπους, με τον αλγόριθμο PageRank. Οι ενέργειες για την βελτιστοποίηση ενός ιστότοπου που μπορούμε να κάνουμε, διακρίνονται σε τρεις γενικές κατηγορίες:  Σχεδίασης και περιεχομένου  Τεχνικών χαρακτηριστικών  Ποιότητας Στις πρώτες δύο, δηλαδή στην σχεδίαση – περιεχόμενο και στα τεχνικά χαρακτηριστικά, οι ενέργειες που μπορούμε να κάνουμε για την βελτιστοποίηση είναι πάρα πολλές όπως.  Χρήση κειμένου αντί φωτογραφίας. Οι μηχανές αναζήτησης ψάχνουν για κείμενο και δεν διαβάζουν κείμενα μέσα σε φωτογραφίες. Αν πρέπει να γίνει χρήση φωτογραφιών καλό είναι να υπάρχει πλούσια περιγραφή.  Λέξεις κλειδιά. Να σκεφτούμε τις λέξεις που θα χρησιμοποιήσουν οι χρήστες (που απευθυνόμαστε) στην αναζήτηση τους και να σιγουρευτούμε ότι τις περιλαμβάνουμε στον ιστότοπο.  Ακρίβεια και περιγραφικότητα. Οι τίτλοι και οι περιγραφές να είναι ακριβείς για το περιεχόμενο τους.  Χαλασμένοι σύνδεσμοι. Να γίνεται έλεγχος όλων των συνδέσμων (εσωτ./ εξωτ.) ότι λειτουργούν σωστά.  Έλεγχο σε Τext Βrowser. Όλες οι μηχανές αναζήτησης βλέπουν το περιεχόμενο μας όπως οι text browsers, οπότε η χρήση τους θα μας δώσει μια εικόνα για την πληροφορία που μπορούν να διαβάσουν.  If-Modified-Since. Έλεγχο ότι ο διακομιστής μας υποστηρίζει If-Modified- Since HTTP header, ώστε να ενημερώνεται η μηχανή αναζήτησης για αλλαγή του περιεχομένου του ιστότοπου μας.  Ταχύτητα φόρτωσης. Στόχος των μηχανών αναζήτησης είναι να προσφέρουν στους χρήστες τους ακρίβεια αποτελεσμάτων αλλά και καλύτερη εμπειρία χρήστη. Πέραν της βελτιστοποίησης που μπορούμε να κάνουμε στον ιστότοπο στη σχεδίαση, και στα τεχνικά χαρακτηριστικά μας υπάρχουν κάποιες αρχές (της ποιότητας) οι οποίες πρέπει να ακολουθηθούν ώστε να μην τιμωρηθεί (penalized) ο
  • 15. 15 | Σ ε λ ί δ α ιστότοπος μας από τις μηχανές αναζήτησης, με αποτέλεσμα την μη εμφάνιση του στα αποτελέσματα τους. [6],[7],[8],[9],[10] Οι βασικές αρχές είναι:  Αποφυγή κρυφών κειμένων και συνδέσμων (hidden text/ links). Χαρακτηριστικό παράδειγμα αυτού είναι η χρήση λευκού κειμένου σε λευκό φόντο έτσι ώστε να εντοπισθεί από την μηχανή αναζήτησης αλλά όχι από τον επισκέπτη.  Αποφυγή τεχνικών cloaking, sneak redirects και Doorway pages. Δηλαδή την διαφορετική εμφάνιση περιεχομένου - διεύθυνσης στις μηχανές αναζήτησης από ότι στους χρήστες, αλλά και την κατασκευή ιστοσελίδων φθηνού περιεχομένου με χρήση συγκεκριμένων λέξεων κλειδιών.  Αποφυγή χρήσης αυτοματοποιημένων ερωτημάτων. Συνήθως με χρήση κάποιου εγκατεστημένου λογισμικού με σκοπό την απότομη άνοδο στα αποτελέσματα των μηχανών.  Αποφυγή ‘άσχετων’ λέξεων κλειδιών. Όπως και η υπερφόρτωση με διάφορες λέξεις με σκοπό την καλύτερη κατάταξη.  Αποφυγή διπλότυπου περιεχομένου. Είναι τα περιεχόμενα που υπάρχουν μέσα στον ιστότοπο μας ή και σαν εξωτερικός σύνδεσμος τα οποία είναι αισθητά παρόμοια. 2.6 Τεχνολογίες και εργαλεία Για την ανάπτυξη ενός δυναμικού ιστότοπου θα χρειαστούμε κάποια εργαλεία όπως είναι η βάση δεδομένων, ο εξυπηρετητής και η γλώσσα προγραμματισμού:  Apache Server.  MySQL  PHP  CSS  PhpMyAdmin 2.6.1 Apache Όταν αναφερόμαστε στον Server (εξυπηρετητή) εννοούμε τον υπολογιστή που παρέχει υπηρεσίες σε άλλους υπολογιστές μέσα σε ένα τοπικό δίκτυο. Για τον παγκόσμιο ιστό υπάρχουν οι web servers οι οποίοι είναι υπεύθυνοι για την εμφάνιση των ιστοσελίδων τους. Από τους πιο γνωστούς εξυπηρετητές είναι οι Apache και IIS (Internet Information Server). Για την δημιουργία του Apache έπρεπε να φτάσουμε στο 1994 όταν ο Robert McCool αποχωρεί από το πρόγραμμα HTTPd (HTTP daemon) για το National Center
  • 16. 16 | Σ ε λ ί δ α for Supercomputing Applications (NCSA) σταματώντας την εξέλιξη του HTTPd που ήταν ο πιο δημοφιλής μέχρι και το 1995. Αναλαμβάνει τότε το πρόγραμμα Apache Software Foundation όπου διατηρείται μέχρι τις μέρες μας. Ο Apache εγκαθίσταται σε έναν υπολογιστή ο οποίος μπορεί να χρησιμοποιεί διάφορα λειτουργικά συστήματα όπως Linux, Unix, Microsoft Windows, GNU, FreeBSD, Solaris, Novell NetWare, Mac OS X, OS/2, TPF. Ο ρόλος του Apache είναι να αναμένει αιτήσεις από διάφορα προγράμματα – χρήστες (clients) όπως είναι ένας ο φυλλομετρητής (browser) ενός χρήστη και στη συνέχεια να εξυπηρετεί αυτές τις αιτήσεις “σερβίροντας” τις σελίδες που ζητούν είτε απευθείας μέσω μιας ηλεκτρονικής διεύθυνσης (URL), είτε μέσω ενός συνδέσμου (link). Ο τρόπος με τον οποίο ο Apache εξυπηρετεί αυτές τις αιτήσεις, είναι σύμφωνος με τα πρότυπα που ορίζει το πρωτόκολλο HTTP (Hypertext Transfer Protocol). Ο Apache HTTP αναπτύσσεται από την “Κοινότητα Ανοιχτού Λογισμικού” και η εποπτεία, υποστήριξη, και διάθεση του προγράμματος γίνεται από το Apache Software Foundation. Το πρόγραμμα είναι ανοιχτού κώδικα (open source), κάτι που σημαίνει ότι σύμφωνα με την άδεια χρήσης του (license), διατίθεται δωρεάν και μπορούν να γίνουν ελεύθερα από το χρήστη προσθήκες και τροποποιήσεις στον κώδικα του. Για το όνομά του υπάρχουν δύο διαφορετικές εκδοχές. Η πρώτη αναφέρει ότι το όνομα είναι προς τιμή της φυλής των ιθαγενών της Αμερικής (Apache), ενώ η δεύτερη αναφέρεται στα πρώτα χρόνια δημιουργίας του όπου έπρεπε να βγαίνουν συνέχεια διορθώσεις (patches) πάνω στον αρχικό κώδικα και ονομάστηκε “A PAtCHy server”. [1],[12] 2.6.2 MySQL Η MySQL είναι ένα πολύ γρήγορο και δυνατό σύστημα διαχείρισης σχεσιακών βάσεων ανοικτού κώδικα που χρησιμοποιεί την Structured Query Language (SQL), την πιο γνωστή γλώσσα ερωτημάτων για την προσθήκη, την πρόσβαση και την επεξεργασία δεδομένων σε μία Βάση Δεδομένων. Είναι υπεύθυνη για την πρόσβαση των διαπιστευμένων χρηστών στα δεδομένα της. Η MySQL διατίθεται και σαν λογισμικό ανοιχτού κώδικα αλλά και σαν κλειστού κώδικα, είναι εκτελέσιμο σε διαλειτουργικά συστήματα και μετρά πάνω από 11 εκατομμύρια εγκαταστάσεις καθιστώντας την, από τις πιο δημοφιλείς βάσεις δεδομένων. H MySQL είναι διαθέσιμη από το 1996 αλλά η ιστορία της ξεκινά από το 1979. [1],[13]
  • 17. 17 | Σ ε λ ί δ α 2.6.3 PHP Η PHP είναι μια γλώσσα προγραμματισμού που σχεδιάστηκε για τη δημιουργία δυναμικών σελίδων στο διαδίκτυο και είναι επισήμως γνωστή ως: HyperText preprocessor. Είναι μια server-side (εκτελείται στον διακομιστή) scripting γλώσσα που γράφεται συνήθως πλαισιωμένη από HTML, για μορφοποίηση των αποτελεσμάτων. Αντίθετα από μια συνηθισμένη HTML σελίδα η σελίδα PHP δεν στέλνεται άμεσα σε έναν πελάτη (client), αντί αυτού πρώτα αναλύεται και μετά αποστέλλεται το παραγόμενο αποτέλεσμα. Τα στοιχεία HTML στον πηγαίο κώδικα μένουν ως έχουν, αλλά ο PHP κώδικας ερμηνεύεται και εκτελείται. Ο κώδικας PHP μπορεί να θέσει ερωτήματα σε βάσεις δεδομένων, να δημιουργήσει εικόνες, να διαβάσει και να γράψει αρχεία, να συνδεθεί με απομακρυσμένους υπολογιστές , κ.ο.κ. Σε γενικές γραμμές οι δυνατότητες που μας δίνει είναι απεριόριστες. Αρχικά η ονομασία της ήταν PHP/FI από το Forms Interpreter η οποία δημιουργήθηκε το 1995 από τον Rasmus Lerdorf ως μια συλλογή από Perl scripts που τα χρησιμοποιούσε στην προσωπική του σελίδα. Δεν άργησε να τα εμπλουτίσει με λειτουργίες επεξεργασίας δεδομένων με SQL, αλλά τα σημαντικά βήματα που έφεραν και την μεγάλη αποδοχή της PHP ήταν αρχικά η μετατροπή τους σε C και μετέπειτα η δωρεάν παροχή του πηγαίου κώδικα μέσω της σελίδας του ώστε να επωφεληθούν όλοι από αυτό που είχε φτιάξει, αλλά και να τον βοηθήσουν στην περαιτέρω ανάπτυξή της. [1],[14],[15] 2.6.4 CSS Η CSS (Cascading Style Sheets-Διαδοχικά Φύλλα Στυλ) ή ( αλληλουχία φύλλων στύλ ) είναι μια γλώσσα υπολογιστή που ανήκει στην κατηγορία των γλωσσών φύλλων στυλ που χρησιμοποιείται για τον έλεγχο της εμφάνισης ενός εγγράφου που έχει γραφτεί με μια γλώσσα σήμανσης. Χρησιμοποιείται δηλαδή για τον έλεγχο της εμφάνισης ενός εγγράφου που γράφτηκε στις γλώσσες HTML και XHTML, δηλαδή για τον έλεγχο της εμφάνισης μιας ιστοσελίδας και γενικότερα ενός ιστοτόπου. Η CSS είναι μια γλώσσα υπολογιστή προορισμένη να αναπτύσσει στυλιστικά μια ιστοσελίδα δηλαδή να διαμορφώνει περισσότερα χαρακτηριστικά, χρώματα, στοίχιση και δίνει περισσότερες δυνατότητες σε σχέση με την HTML. Για μια όμορφη και καλοσχεδιασμένη ιστοσελίδα η χρήση της CSS κρίνεται ως απαραίτητη. [16],[17] 2.6.5 PhpMyAdmin
  • 18. 18 | Σ ε λ ί δ α Το PhpMyAdmin είναι ένα εργαλείο διαχείρισης των βάσεων δεδομένων του συστήματος, από τον διαχειριστή μέσω ενός φυλλομετρητή. Είναι λογισμικό ανοιχτού κώδικα γραμμένο σε PHP, ανεξάρτητου λογισμικού (cross-platform) και πολυγλωσσικό (62 γλώσσες). Μέσω της έξυπνης διεπαφής (interface) επιτρέπει την δημιουργία / διαγραφή μιας βάσης, δημιουργία / διαγραφή / αλλαγή πινάκων – πεδίων, χειρισμό δικαιωμάτων, εξαγωγή δεδομένων σε διάφορες μορφές. [18] Αναφορές 2ου Κεφαλαίου 1. http://www.greenwebdesign.com/Glossary-Of-Technical-Terms.htm 2. http://www.edinteractive.co.uk/article/?id=4 3. http://www.theonestopwebsiteshop.com/web-design/dynamic-vs-static.htm 4. http://suite101.com/a/user-experience-design-a28857 5. http://www.dailyblogtips.com/user-friendly-website/ 6. Πτυχιακή εργασία, Δημιουργία δυναμικής ιστοσελίδας για το μάθημα της Διδακτικής χρησιμοποιώντας το εργαλείο της JOOMLA, Καστώρης Παντελής, Λάρισα 2012 7. http://www.searchengineguide.com/kalena-jordan/10-easy-steps-to-a-user-friendly- website.php 8. http://googlewebmastercentral.blogspot.gr/ 9. http://support.google.com/webmasters/bin/answer.py?hl=el&answer=35291&ctx=cb &src=cb&cbid=1xdrdguf7eq8i&cbrank=0 10. https://support.google.com/webmasters/answer/35769?hl=el#3 11. https://support.google.com/webmasters/answer/66356?hl=el 12. http://httpd.apache.org/ABOUT_APACHE.html 13. http://dev.mysql.com/doc/refman/5.1/en/what-is-mysql.html 14. http://en.wikipedia.org/wiki/PHP 15. http://www.php.net/ 16. http://el.wikipedia.org/wiki/CSS 17. http://www.wlearn.gr/index.php/home-css-83 18. www.phpmyadmin.net/ 19. http://www.cmsreview.com/Steps/
  • 19. 19 | Σ ε λ ί δ α 3. Η πλατφόρμα Joomla Το Joomla είναι αναμφισβήτητα ένα από τα δημοφιλέστερα συστήματα διαχείρισης περιεχομένου ανοικτού κώδικα. 23 εκατομμύρια άνθρωποι έχουν “κατεβάσει” το Joomla, ενώ από αυτούς οι 21 εκατομμύρια το ‘κατέβασαν’ μεταξύ Σεπτεμβρίου 2005, και ήταν η μετεξέλιξη του Mambo project, και από τότε κυκλοφόρησαν άλλες τρεις βασικές εκδόσεις με τελευταία την 3.2 τον Νοέμβρη του 2013. 3.1 Γενικά για το Joomla Το Joomla είναι λογισμικό ανοιχτού κώδικα, το οποίο ανήκει στην κατηγορία των συστημάτων διαχείρισης περιεχομένου (CMS). Οι λέξεις «διαχείριση» και «περιεχόμενο», αναφέρονται σε ένα σύστημα λογισμικού το οποίο χρησιμοποιείται για την οργάνωση, την ταξινόμηση και την αρχειοθέτηση της πληροφορίας. Η διαχείριση του Joomla γίνεται αποκλειστικά μέσω ενός φυλλομετρητή (Browser).Ολόκληρη η λειτουργία του συστήματος, είναι διαθέσιμη μέσω της διεπαφής του φυλλομετρητή, αφού είναι εγκατεστημένο και προσπελάσιμο μέσω μιας διεύθυνσης διαδικτύου. Μερικές από τις δυνατότητες του Joomla είναι οι εξής:  Δωρεάν διανομή (ελεύθερο λογισμικό ανοιχτού κώδικα), μπορούμε δηλαδη να το διανείμουμε – αντιγράψουμε – τροποποιήσουμε σύμφωνα με τους όρους της GNU (General Public License).
  • 20. 20 | Σ ε λ ί δ α  Δυνατότητα δοκιμής και φιλοξενίας (CloudAccess.net) του ιστότοπου για 30 μέρες.  Δημιουργία δυναμικών σελίδων, που σημαίνει ότι οι σελίδες του ιστότοπου δεν θα είναι αποθηκευμένες ως στατικές σελίδες, αλλά το περιεχόμενό τους δημιουργείται και αποστέλλεται στο χρήστη όταν αυτός το ζητήσει.  Παρέχει τη δυνατότητα διαχείρισης του περιεχομένου του ιστότοπου από τον διαχειριστή του περιεχομένου μέσα από τον ίδιο τον ιστότοπο (back-end και front-end) με εύκολο και φιλικό τρόπο χωρίς την απαίτηση επιπλέον προγράμματος επεξεργασίας ιστοσελίδων, όπως π.χ. FrontPage, DreamWeaver κλπ. Ο διαχειριστής του περιεχομένου χρειάζεται απλά να κάνει είσοδο στο σύστημα και με τα προκαθορισμένα δικαιώματα που έχει να επέμβει στο περιεχόμενο.  Έλεγχο της πρόσβασης των χρηστών. Στο Joomla υπάρχουν συγκεκριμένες ομάδες με ξεχωριστά δικαιώματα για την καλύτερη ασφάλεια με δυνατότητα δημιουργίας και άλλων ομάδων.  Δυνατότητα δημιουργίας αλλά και επεξεργασίας των άρθρων για την μορφοποίηση τους με τον επεξεργαστή κειμένου που είναι ενσωματωμένος στο Joomla. Το Joomla ακολουθεί μια συγκεκριμένη φιλοσοφία όσον αφορά στο περιεχόμενο του ιστότοπου. Έτσι το περιεχόμενο, σύμφωνα με το Joomla, αποτελείται από άρθρα, τα οποία εμφανίζονται ένα-ένα ή πολλά μαζί στις σελίδες του ιστότοπου. Τα άρθρα κατατάσσονται με τη σειρά τους σε κατηγορίες όπου και αυτές με τη σειρά τους σε ενότητες μέχρι και στις εκδόσεις 1.5.x, όπου μετά την 1.6 συγχωνεύτηκαν για να μείνουν μόνο οι κατηγορίες. Το Joomla υποχρεώνει το δημιουργό του περιεχομένου να κατατάσσει το κάθε άρθρο που δημιουργεί σε κατηγορία-υποκατηγορία που θα έχει πρώτα ο ίδιος δημιουργήσει. Στο Joomla δίνεται επίσης η δυνατότητα επιλογής προτύπου παρουσίασης (template) μέσα από μία μεγάλη ποικιλία από έτοιμα πρότυπα (δωρεάν και μη) αλλά και της κατασκευής, αφήνοντας στον δημιουργό μόνο την παραμετροποίηση του. Επιπλέον υπάρχει η δυνατότητα δημιουργίας μενού που οδηγούν σε συγκεκριμένο περιεχόμενο με τον δημιουργό του ιστότοπου να μπορεί με πολύ εύκολο τρόπο να δημιουργήσει την εμφάνιση των σελίδων του μενού που οδηγούν σε δυναμικό περιεχόμενο συγκεκριμένης κατηγορίας. Η εμφάνιση του περιεχομένου στις ιστοσελίδες μπορεί να παραμετροποιηθεί σύμφωνα με τις προτιμήσεις και τις ανάγκες του δημιουργού. Έτσι σε μια σελίδα είναι δυνατόν να εμφανίζεται ένα άρθρο, άρθρα μιας κατηγορίας ταξινομημένα ή και όλα τα άρθρα . Επίσης εύκολη είναι και η προσθήκη λειτουργίας αναζήτησης στον ιστότοπο που παρέχει το Joomla που δίνει τη δυνατότητα αναζήτησης σε όλο το περιεχόμενο του ιστότοπου μας. Το Joomla ως το πιο δημοφιλές Σύστημα Διαχείρισης Περιεχομένου επιτρέπει την ανάπτυξη διαρκώς πρόσθετων εφαρμογών ανοιχτού λογισμικού που είναι διαθέσιμες στο ευρύ κοινό. Οι εφαρμογές αυτές μπορεί να είναι άλμπουμ φωτογραφιών, ημερολόγια κλπ. Πολλές από τις παραπάνω λειτουργίες διευκολύνουν
  • 21. 21 | Σ ε λ ί δ α την ανάπτυξη ενός σύγχρονου ιστότοπου μειώνοντας κατά πολύ το χρόνο υλοποίησης. Πολύ σημαντικό είναι ότι το Joomla μετά την αρχική εγκατάσταση, παραμετροποίηση και διαμόρφωση του ιστότοπου, καταργεί την ανάγκη για έναν ειδικό που θα ασχολείται με την καθημερινή διαχείριση του περιεχομένου ενός ιστότοπου. Η λειτουργία προσθήκης και αλλαγής του περιεχομένου είναι τόσο εύκολη που μπορεί να γίνει από οποιονδήποτε χρήστη με βασικές γνώσεις χρήσης υπολογιστών. Κατά το πρώτο στάδιο όμως, δηλαδή το στάδιο δημιουργίας του ιστότοπου είναι απαραίτητο να υπάρχουν οι τεχνικές γνώσεις διαχείρισης του Joomla. [1] 3.2 Η δομή του Joomla Τα δομικά στοιχεία του Joomla είναι τα ακόλουθα:  Διεπαφή χρηστών – δημόσιο τμήμα (Front-End)  Διεπαφή διαχειριστών (Back-End ) 1) Ρυθμίσεις συστήματος (configuration settings) 2) Ρυθμίσεις πρόσβασης χρηστών (Access control settings)  Πρότυπα (Templates)  Επεκτάσεις (Extensions) 3.2.1 Διεπαφή χρηστών Η διεπαφή χρήστη αποτελεί το δημόσιο μέρος του CMS που είναι διαθέσιμο στους επισκέπτες (απλούς ή διαπιστευμένους) του ιστότοπου, όπου περιλαμβάνονται όλες οι λειτουργίες που έχουν καθοριστεί από την διεπαφή διαχειριστών. 3.2.2 Διεπαφή διαχειριστών Η διεπαφή διαχειριστών αποτελεί το επίπεδο διαχείρισης για την ομάδα συντήρησης και προσφέρει λειτουργίες ρύθμισης συστήματος, διαχείρισης χρηστών (προσθήκη / αφαίρεση / θέματα πρόσβασης), διαχείρισης επεκτάσεων και τέλος του περιεχομένου του ιστότοπου αυτού καθεαυτού. 3.2.3 Πρότυπα (Templates) Τα πρότυπα αποτελούν το αισθητικό (εμφάνιση) και λειτουργικό επίπεδο του ιστότοπου που θα βασιστεί σε CMS. Μπορούμε να θεωρήσουμε τα πρότυπα ως κενές μακέτες πάνω στις οποίες θα τοποθετηθεί το περιεχόμενου που θα επιλέξουμε να
  • 22. 22 | Σ ε λ ί δ α εμφανίζεται από το CMS. Το κάθε πρότυπο έχει συγκεκριμένες θέσεις στις οποίες μπορεί να εμφανιστεί η πληροφορία μας, όπου για να δούμε τις διαθέσιμες θέσεις μπορούμε να ελέγξουμε το εγχειρίδιο του κατασκευαστή αλλά και με την παράμετρο “?tp=1” στην διεύθυνση του ιστότοπου μας. Στα πρότυπα καθορίζονται οι παράμετροι εμφάνισης της σελίδας (χρώματα, διαστάσεις, τυπογραφία) καθώς επίσης παρέχονται όλα τα αρχεία γραφικών που θα χρησιμοποιηθούν για την εμφάνισή της. 3.2.4 Επεκτάσεις (Extentions) Οι επεκτάσεις αποτελούν κομμάτια λογισμικού (software components) τα οποία ακολουθούν ένα καθορισμένο προγραμματιστικό μοντέλο, το οποίο τους επιτρέπει να αλληλεπιδρούν με το CMS και να επεκτείνουν ακολούθως τη λειτουργικότητά του. Οι επεκτάσεις κάνουν ένα CMS όπως το Joomla εξαιρετικά ισχυρό και αποτελούν σημαντικό μοχλό ανάπτυξης και διάδοσης αυτού, μέσω μιας εξαιρετικά δραστήριας κοινότητας προγραμματιστών. Τυπικά παραδείγματα επεκτάσεων είναι για παράδειγμα: ρολόι, ημερολόγιο, φωτογραφική έκθεση, καιρός, δίγλωσσο και πολύγλωσσο ιστότοπο. 3.3 Εγκατάσταση Joomla Η εγκατάσταση του Joomla είναι μία διαδικασία που διαρκεί λίγα λεπτά αρκεί να δοθεί η απαραίτητη προσοχή. Για της ανάγκες της εργασίας, έχει μισθωθεί ένας linux server, που εδρεύει στη Γερμανία, με εγκατεστημένο Apache έκδοση 2.2.22. Επίσης έχει καταχωρηθεί το domain name www.vespophrenia.gr , το οποίο παραπέμπει στον συγκεκριμένο server. 3.3.1 Δημιουργία βάσης δεδομένων Πριν την εγκατάσταση του Joomla θα πρέπει να δημιουργήσουμε την βάση δεδομένων (MySQL). Μπαίνοντας στο διαχειριστικό περιβάλλον του server χρησιμοποιώντας έναν φυλλομετρητή, δημιουργούμε την βάση δεδομένων. Αφού εισάγουμε Username και password, βλέπουμε την παρακάτω εικόνα (Εικόνα 3.3.1.1).
  • 23. 23 | Σ ε λ ί δ α Εικόνα 3.3.1.1 – Διαχειριστικό, Αρχική σελίδα Εν συνεχεία επιλέγουμε ‘Manage SQL’ > ‘Add SQL Database’, στο πεδίο Database name εισάγουμε ένα όνομα για την βάση μας και επιλέγουμε ‘Add’ (Εικόνα 3.3.1.2). Εικόνα 3.3.1.2 – Δημιουργία βάσης δεδομένων Επόμενο βήμα είναι η δημιουργία ενός χρήστη για την βάση μας. Από το πινακάκι που εμφανίζεται, επιλέγουμε ‘Add SQL User’ (Εικόνα 3.3.1.3).
  • 24. 24 | Σ ε λ ί δ α Εικόνα 3.3.1.3 – Δημιουργία χρήστη Στο πεδίο ‘SQL Username’ εισάγουμε ένα όνομα χρήστη. Στα πεδία ‘Password’ και ‘Repeat password’ εισάγουμε έναν κωδικό πρόσβασης και επιλέγουμε ‘Add’ (Εικόνα 3.3.1.4). Εικόνα 3.3.1.4 – Δημιουργία χρήστη 3.3.2 Μεταφόρτωση και εγκατάσταση Joomla Αφού δημιουργήσαμε την βάση δεδομένων, επόμενο βήμα είναι να κατεβάσουμε την έκδοση του Joomla που θα εγκαταστήσουμε. Μπορούμε να κατεβάσουμε την διανομή από την σελίδα http://www.joomla.org/download.html . Για τις ανάγκες τις εργασίας και για έχουμε πλήρη συμβατότητα με όλα τα extensions που θα χρησιμοποιηθούν, θα κατεβάσουμε την έκδοση 2.5.16 .
  • 25. 25 | Σ ε λ ί δ α Έχοντας κατεβάσει το αρχείο ZIP στον υπολογιστή μας, χρησιμοποιούμε τον File Manager του server, για να μεταφορτώσουμε το αρχείο στον server και να το αποσυμπιέσουμε. Η αποσυμπίεση θα πρέπει να γίνει στο δημόσιο directory του ιστότοπού μας το οποίο στη συγκεκριμένη περίπτωση είναι το directory με το όνομα “httpdocs”. Η εικόνα των μεταφορτωμένων αρχείων μετά την αποσυμπίεση είναι η παρακάτω (Εικόνα 3.3.5). Όπως φαίνεται και στην εικόνα υπάρχει ένας φάκελος με όνομα ‘Installation’ ο οποίος περιέχει τα αρχεία εγκατάστασης και μετά την εγκατάσταση θα διαγραφεί. Εικόνα 3.3.1.5 – Αποσυμπιεσμένα αρχεία Για να πραγματοποιήσουμε την εγκατάσταση πλέον αρκεί να πληκτρολογήσουμε την διεύθυνση του ιστότοπου μας στην μπάρα διευθύνσεων του φυλλομετρητή. Πληκτρολογούμε λοιπόν http://www.vespophrenia.gr και εμφανίζεται η παρακάτω εικόνα (Εικόνα 3.3.2.1). Επιλέγουμε την γλώσσα και πατάμε “Επόμενο”.
  • 26. 26 | Σ ε λ ί δ α Εικόνα 3.3.2.1 – Επιλογή γλώσσας Εν συνεχεία γίνεται έλεγχος συμβατότητας με τον server, εμφανίζεται η παρακάτω εικόνα (Εικόνα 3.3.2.2) και επιλέγουμε “Επόμενο” εφόσον όλα είναι εντάξει. [2],[4] Εικόνα 3.3.2.2 – Έλεγχος ρυθμίσεων διακομιστή Στο επόμενο βήμα, εμφανίζονται η όροι χρήσης του Joomla. Τους διαβάζουμε προσεχτικά και επιλέγουμε “Επόμενο” (Εικόνα 3.3.2.3).
  • 27. 27 | Σ ε λ ί δ α Εικόνα 3.3.2.3 – Όροι χρήσης Σε αυτό το σημείο, θα χρειαστεί να εισάγουμε τις ρυθμίσεις για την βάση δεδομένων. Αφού εισάγουμε τις σωστές ρυθμίσεις επιλέγουμε “Επόμενο” (Εικόνα 3.3.2.4). Εικόνα 3.3.2.4 – Ρυθμίσεις Βάσης Δεδομένων Δεν θα χρειαστεί να κάνουμε ρυθμίσεις για τον FTP. Παρακάμπτουμε λοιπόν το βήμα 5 πατώντας “Επόμενο” (Εικόνα 3.3.2.5).
  • 28. 28 | Σ ε λ ί δ α Εικόνα 3.3.2.5 – Ρυθμίσεις FTP Εισάγουμε τις βασικές ρυθμίσεις του ιστότοπου (Όνομα, ηλεκτρονική διεύθυνση επικοινωνίας, όνομα χρήστη και κωδικό πρόσβασης του διαχειριστή) και επιλέγουμε “Επόμενο” (Εικόνα 3.3.2.6). Εικόνα 3.3.2.6 – Βασικές Ρυθμίσεις Ιστοτόπου Τέλος, θα πρέπει να διαγράψουμε τον φάκελο installation που περιέχει τα αρχεία εγκατάστασης (Εικόνα 3.3.2.7). Επιλέγουμε “Διαγραφή του καταλόγου με τα αρχεία εγκατάστασης (installation)” και εν συνεχεία πατάμε “Διαχείριση”. [2],[3]
  • 29. 29 | Σ ε λ ί δ α Εικόνα 3.3.2.7 – Διαγραφή καταλόγου installation 3.4 Διαχείριση Περιεχομένου Πριν ξεκινήσουμε να δουλέψουμε με ένα σύστημα διαχείρισης περιεχομένου πρέπει να έχουμε μια ξεκάθαρη άποψη για το ποιο και πόσο μεγάλο θα είναι το περιεχόμενο μας. Απαιτείται να κατασκευάσουμε αρχικά ένα δέντρο κατηγοριών στις οποίες θα υπάγονται τα άρθρα που καταχωρούμε. Εν συνεχεία θα πρέπει να συντάξουμε τα άρθρα και τέλος να δημιουργήσουμε τα μενού, τα οποία θα μας δρομολογούν στα άρθρα μίας ή περισσότερων κατηγοριών. 3.4.1 Δημιουργία κατηγοριών Το πρώτο βήμα είναι να δημιουργήσουμε την πρώτη μας κατηγορία όπου και θα ανήκουν κάποια από τα άρθρα - περιεχόμενο μας. Για να δημιουργήσουμε μια κατηγορία, από την κεντρική σελίδα της διαχείρισης, επιλέγουμε διαχείριση κατηγοριών και στη συνέχεια επιλέγουμε νέο. (Εικόνα 3.4.1.1)
  • 30. 30 | Σ ε λ ί δ α Εικόνα 3.4.1.1 – Δημιουργία νέας κατηγορίας Συμπληρώνουμε τον τίτλο της κατηγορίας που θέλουμε να δημιουργήσουμε. Στο πεδίο Ψευδώνυμο αν και δεν είναι υποχρεωτικό, συμπληρώνουμε ένα σχετικό όνομα καθώς θα εμφανίζεται στην γραμμή διευθύνσεων και θα διαβάζεται από τις μηχανές αναζήτησης. Η προκαθορισμένη τιμή, στην περίπτωση όπου αφεθεί κενό ή χρησιμοποιηθούν μη λατινικοί χαρακτήρες είναι η ημερομηνία και ώρα δημιουργίας. Το πεδίο Γονικό μας ενδιαφέρει μόνο στην περίπτωση που δημιουργούμε υποκατηγορία. Η κατάσταση είναι το αν θέλουμε τα περιεχόμενα – άρθρα της κατηγορίας να δημοσιεύονται, ενώ η ‘Πρόσβαση’ και τα ’Δικαιώματα’ το ποιοι θα έχουν πρόσβαση. Αφού συμπληρώσουμε τα πεδία, επιλέγουμε αποθήκευση (Εικόνα 3.4.1.2).
  • 31. 31 | Σ ε λ ί δ α Εικόνα 3.4.1.2 – Νέα κατηγορία 3.4.2 Δημιουργία Άρθρων Έχοντας δημιουργήσει την πρώτη μας κατηγορία, είμαστε πλέον σε θέση να δημιουργήσουμε τα άρθρα της κατηγορίας. Τα άρθρα είναι το βασικό στοιχείο πληροφορίας του ιστότοπου μας. Η ονομασία παραπέμπει σε άρθρα εφημερίδας όπου υπάρχει το όνομα του άρθρου, το όνομα του συντάκτη, το περιεχόμενο που μπορεί να είναι μόνο κείμενο ή και φωτογραφίες, η ημερομηνία δημοσίευσης, και η κατηγορία όπου ανήκουν. Έτσι τα άρθρα μας τα οργανώνουμε σε κατηγορίες και υποκατηγορίες που δημιουργούν το περιεχόμενο μας. Για την δημιουργία ενός άρθρου απ;o την κεντρική σελίδα της διαχείρισης, επιλέγουμε Προσθήκη Νέου Άρθρου, συμπληρώνουμε τα απαραίτητα πεδία, επιλέγουμε κατηγορία, ελέγχουμε τις ρυθμίσεις εμφάνισης του άρθρου και πατάμε αποθήκευση (Εικόνα 3.4.2.3).
  • 32. 32 | Σ ε λ ί δ α Εικόνα 3.4.2.3 – Δημιουργία νέου άρθρου 3.4.3 Διαχείριση Μενού Ένας ιστότοπος μπορεί να έχει ένα αλλά και περισσότερα μενού τοποθετημένα σε όποια σημεία του ιστότοπου μας επιθυμούμε και μας επιτρέπει το πρότυπο μας. Το κάθε μενού έχει έναν μεγάλο αριθμό επιλογών, οι οποίες μπορούν να οργανώνονται σε άπειρο βάθος, προσφέροντας έτσι τη δυνατότητα δημιουργίας εξαιρετικά πολύπλοκων δενδροειδών δομών. Τα μενού παρέχουν τη διεπαφή με όλες σχεδόν τις λειτουργίες του ιστότοπου, οι οποίες δεν υπάρχει δυνατότητα να εμφανιστούν με διαφορετικό τρόπο. Ένα στοιχείο μενού μπορεί να είναι ένα από τα παρακάτω (Περιλαμβάνονται στοιχεία που εμφανίζονται μετά την εγκατάσταση της εκάστοτε επέκτασης) (Εικόνα 3.4.3.1):
  • 33. 33 | Σ ε λ ί δ α Εικόνα 3.4.3.1 – Είδη στοιχείων μενού Για την δημιουργία ενός νέου μενού αρκεί να πάμε από την Διαχείριση Μενού και να επιλέξουμε Νέο. Στη συνέχεια μπορούμε να προσθέσουμε όσα στοιχεία από την παραπάνω φωτογραφία θέλουμε. Καλό είναι τα μενού, αν δημιουργήσουμε πάνω από ένα, να έχουν ξεκάθαρες διαφορές στις λειτουργίες τους. Αφού συμπληρώσουμε τα απαραίτητα πεδία, επιλέγουμε αποθήκευση (Εικόνα 3.4.3.2).
  • 34. 34 | Σ ε λ ί δ α Εικόνα 3.4.3.2 – Δημιουργία μενού
  • 35. 35 | Σ ε λ ί δ α 3.5 Ασφάλεια Ιστοσελίδας 3.5.1 Χωρίς joomla generator tag Πολλές φορές δεν θέλουμε "κακόβουλοι" επισκέπτες να βλέπουν το generator tag που υπάρχει στο index.php του joomla και δείχνει το cms που χρησιμοποιείται από το διαδικτυακό µας τόπο. <meta name="generator" content="Joomla! 2.5 - Open Source Content Management" /> Η εύκολη λύση που προτείνεται είναι να αφαιρείται το κομμάτι αυτό κώδικα από τα αρχεία του core του joomla. Η λύση αυτή δεν είναι σωστή, καθώς αντιβαίνει στην άδεια χρήσης του joomla . Η σωστή λύση είναι να κάνουμε την παρακάτω μικρή τροποποίηση στο αρχείο index.php στο template µας, τοποθετώντας στο τέλος του πρώτου php tag το παρακάτω κομμάτι κώδικα: $this->setGenerator(null); 3.5.2 Προστασία αρχείου configuration.php Ένας από τους τρόπους βελτίωσης της ασφάλειας ενός δικτυακού τόπου είναι η προστασία από την απευθείας πρόσβαση συγκεκριμένων αρχείων php που βρίσκονται στον κατάλογο PUBLIC_HTML και περιέχουν εκτελέσιμο κώδικα ή σημαντικά δεδομένα. Υπάρχουν διάφοροι τρόποι για να πετύχουμε κάτι τέτοιο. Απλούστερος και ασφαλέστερος θεωρείται να µην αποθηκεύονται κρίσιμα δεδομένα µέσα στον κατάλογο public_html . Και από τον Apache.org υπάρχει µια συνεχής σύσταση να αποφεύγεται η διατήρηση τέτοιων αρχείων, µε κρίσιμα δεδομένα, στον κατάλογο public_html. Στο κείμενο που ακολουθεί, προστατεύουμε το αρχείο configuration.php, που είναι το πιο σηµαντικό (για τον τομέα της ασφάλειας) αρχείο για ένα Joomla site [5]. Οδηγίες: 1. Μετακινούμε το αρχείο configuration.php σε ένα ασφαλή κατάλογο, έξω από τον public_html και ονομάζουμε όπως θέλουμε εμείς. Στο παράδειγμα χρησιμοποιούμε το όνομα joomla.conf. 2. Δημιουργούμε ένα νέο αρχείο configuration.php που θα περιέχει τον παρακάτω κώδικα:
  • 36. 36 | Σ ε λ ί δ α <?php require( dirname( __FILE__ ) . '/../joomla.conf' ); ?> 3. Σιγουρευόμαστε ότι το νέο configuration.php δεν είναι σε καμία περίπτωση εγγράψιμο (444), και δεν θα αλλάξει το περιεχόμενό του από το com_config. 4. Εάν χρειαστεί να αλλάξετε κάποια από τις ρυθμίσεις, τις αλλάξετε µε το χέρι στο αρχείο joomla.conf. Σημείωση: Χρησιμοποιώντας τη μέθοδο αυτή, ακόμα και αν για κάποιο λόγο ο Web server μεταδώσει τα περιεχόμενα αρχείων php, λόγω κάποιας λανθασμένης ρύθμισης, κανείς δεν θα μπορεί να δει τα περιεχόμενα του πραγματικού αρχείου configuration.php.
  • 37. 37 | Σ ε λ ί δ α Αναφορές 3ου Κεφαλαίου 1. http://www.joomla.org/about-joomla.html 2. The Official Joomla Book by Jennifer Marriott & Elin Waring εκδόσεις Addison- Wesley Professional, 2011. 3. http://cocoate.com/sites/cocoate.com/files/pdf/j25en.pdf 4. http://docs.joomla.org/Technical_requirements 5. http://apache.org
  • 38. 38 | Σ ε λ ί δ α 4. Το Φόρουμ Vespophrenia.gr Το Φόρουμ Vespophrenia αναφέρεται στους λάτρες του κλασικού μοτοσυκλετισμού και συγκεκριμένα σε ένα δίκυκλο το οποίο έγραψε ιστορία στον χώρο αυτό, την γνωστή σε όλους μας Vespa της Piaggio. Για την κατασκευή του χρησιμοποιήθηκε CMS ανοιχτού κώδικα (Joomla) πάνω στο οποίο εγκαταστάθηκε και προσαρμόστηκε η πλατφόρμα φόρουμ Kunena 3.0.1 μαζί με αρκετά πρόσθετα και ενθέματα τα οποία θα δούμε παρακάτω αναλυτικά. Το Template που χρησιμοποιήθηκε έχει φτιαχτεί εξολοκλήρου για τις ανάγκες της εργασίας και δεν έχει χρησιμοποιηθεί έτοιμο (PHP και CSS). Το Φόρουμ απευθύνεται κυρίως σε Έλληνες χρήστες καθώς έχει εγκατασταθεί η ελληνική γλώσσα και τα μηνύματα είναι στα ελληνικά. Τη δεδομένη στιγμή, απαριθμεί 159 μέλη, 9 ενότητες, 34 κατηγορίες, 205 θέματα, 5187 μηνύματα με μέσο όρο 20 νέων μηνυμάτων και περίπου 55 μοναδικών επισκεπτών ανά ημέρα. 4.1 Template / Πρότυπο To εικαστικό μέρος ενός site αποτελεί σημαντικό παράγοντα για την επισκεψιμότητα του. Όλα τα λογότυπα και οι εικόνες έχουν σχεδιαστεί σε Adobe Illustrator και Photoshop. Χρησιμοποιήθηκαν χρώματα και γραμματοσειρές που δεν κουράζουν το ανθρώπινο μάτι και προέκυψε το παρακάτω αποτέλεσμα (Εικόνα 4.1.1 - Εικόνα 4.1.2) [17]. Εικόνα 4.1.1 – Αρχική σελίδα
  • 39. 39 | Σ ε λ ί δ α Εικόνα 4.1.2 – Φόρουμ (Τελείωμα σελίδας) Δείγμα του CSS κώδικα του προτύπου που χρησιμοποιήθηκε είναι ο παρακάτω: #mic-main { background: #D7D5C1 url('../images/pageglare.png') top center no-repeat scroll; background: url('../images/pageglare.png') top center no-repeat, linear-gradient(top, #E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1; background: url('../images/pageglare.png') top center no-repeat, -webkit-linear- gradient(top, #E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1; background: url('../images/pageglare.png') top center no-repeat, -moz-linear-gradient(top, #E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1; background: url('../images/pageglare.png') top center no-repeat, -o-linear-gradient(top, #E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1; background: url('../images/pageglare.png') top center no-repeat, -ms-linear-gradient(top, #E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1; background: url('../images/pageglare.png') top center no-repeat, linear-gradient(top, #E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1; -svg-background: url('../images/pageglare.png') top center no-repeat, linear-gradient(top, #E7E6DA 0, #B6B390 285px) no-repeat, #D7D5C1; background-size: auto, 100% 285px, auto !important; margin: 0 auto; font-size: 13px; font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-weight: normal; font-style: normal; position: relative;
  • 40. 40 | Σ ε λ ί δ α width: 100%; min-height: 100%; left: 0; top: 0; cursor: default; overflow: hidden; } h1, h2, h3, h4, h5, h6, p, a, ul, ol, li { margin: 0; padding: 0; } .mic-button { border: 0; border-collapse: separate; -webkit-background-origin: border !important; -moz-background-origin: border !important; background-origin: border-box !important; background: #B0AB87; -webkit-box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.15); -moz-box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.15); box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.15); border-width: 0; padding: 0 7px; margin: 0 auto; height: 25px; } .mic-postcontent h1, .mic-postcontent h1 a, .mic-postcontent h1 a:link, .mic-postcontent h1 a:visited, .mic-postcontent h1 a:hover, .mic-postcontent h2, .mic-postcontent h2 a, .mic- postcontent h2 a:link, .mic-postcontent h2 a:visited, .mic-postcontent h2 a:hover, .mic- postcontent h3, .mic-postcontent h3 a, .mic-postcontent h3 a:link, .mic-postcontent h3 a:visited, .mic-postcontent h3 a:hover, .mic-postcontent h4, .mic-postcontent h4 a, .mic- postcontent h4 a:link, .mic-postcontent h4 a:visited, .mic-postcontent h4 a:hover, .mic- postcontent h5, .mic-postcontent h5 a, .mic-postcontent h5 a:link, .mic-postcontent h5 a:visited,.mic-postcontent h5 a:hover, .mic-postcontent h6, .mic-postcontent h6 a, .mic- postcontent h6 a:link, .mic-postcontent h6 a:visited, .mic-postcontent h6 a:hover,.mic- blockheader .t, .mic-blockheader .t a, .mic-blockheader .t a:link, .mic-blockheader .t a:visited, .mic-blockheader .t a:hover, .mic-vmenublockheader .t,.mic-vmenublockheader .t a, .mic-vmenublockheader .t a:link, .mic-vmenublockheader .t a:visited, .mic- vmenublockheader .t a:hover, .mic-headline, .mic-headline a,.mic-headline a:link, .mic- headline a:visited, .mic-headline a:hover, .mic-slogan, .mic-slogan a, .mic-slogan a:link, .mic-
  • 41. 41 | Σ ε λ ί δ α slogan a:visited, .mic-slogan a:hover,.mic-postheader, .mic-postheader a, .mic-postheader a:link, .mic-postheader a:visited, .mic-postheader a:hover { font-size: 22px; font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif; font-weight: normal; font-style: normal; line-height: 120%; } ul.mic-hmenu>li>a { background: #4A4730 url('../images/menuitem.png') scroll; -webkit-border-radius: 6px 0 0; -moz-border-radius: 6px 0 0; border-radius: 6px 0 0; padding: 0 17px; margin: 0 auto; position: relative; display: block; height: 31px; cursor: pointer; text-decoration: none; color: #FFFFFF; line-height: 31px; text-align: center; } .mic-hmenu a, .mic-hmenu a:link, .mic-hmenu a:visited, .mic-hmenu a.active, .mic-hmenu a:hover { font-size: 13px; font-family: Tahoma, Arial, Helvetica, Sans-Serif; font-weight: bold; font-style: normal; text-decoration: none; text-align: left; } ul.mic-hmenu>li>a.active { background: #9A9365 url('../images/menuactiveitem.png') scroll; -webkit-border-radius: 6px 0 0; -moz-border-radius: 6px 0 0; border-radius: 6px 0 0; padding: 0 17px;
  • 42. 42 | Σ ε λ ί δ α margin: 0 auto; color: #FBF9F3; padding-bottom: 1px; margin-bottom: -1px; text-decoration: none; } Στην παρακάτω εικόνα μπορούμε να δούμε τις διαθέσιμες θέσεις του προτύπου που χρησιμοποιήθηκε [17]. Εικόνα 4.1.3 – Διαθέσιμες θέσεις
  • 43. 43 | Σ ε λ ί δ α 4.2 Modules / Ενθέματα Στην παρακάτω εικόνα (Εικόνα 4.2.1) μπορούμε να δούμε τα Ενθέματα/Modules που χρησιμοποιήθηκαν, σε ποια θέση έχει οριστεί να εμφανίζεται το καθένα και σε ποιο είδος ενθεμάτων ανήκει [1]. Εικόνα 4.2.1 – Modules που χρησιμοποιήθηκαν  Main Menu – Eμφανίζει το κεντρικό μενού.  Login Form – Εμφανίζει την φόρμα σύνδεσης/ εγγραφής χρήστη πάνω δεξιά (Λειτουργεί σε συνδυασμό με το πρόσθετο Hotlogin και χρησιμοποιεί JQuery για το εφέ κίνησης) [11],[12].  Shoutbox – Εμφανίζει το Shoutbox / Chat (Λειτουργεί σε συνδυασμό με την εφαρμογή Kide Chat) [5].  Αναζήτηση – Εμφανίζει την γραμμή αναζήτησης.  Online Χρήστες – Εμφανίζει τους συνδεμένους χρήστες αλλά και τους επισκέπτες του ιστότοπου [10].  Ειδοποιήσεις – Εμφανίζει τις ειδοποιήσεις νέων προσωπικών μηνυμάτων (Λειτουργεί σε συνδυασμό με την εφαρμογή UddeIM).  Πρόσφατα Θέματα – Εμφανίζει τα 10 χρονικά πιο πρόσφατα θέματα στους επισκέπτες μόνο [10].  Νέα από την τελευταία σας επίσκεψη – Εμφανίζει τα αδιάβαστα μηνύματα από την τελευταία είσοδο του χρήστη [10].  Refresh Page – Αποτελεί ένθεμα προσαρμοσμένου HTML κώδικα το οποίο δημιουργήσαμε για να γίνεται αυτόματη ανανέωση της σελίδας σε περίπτωση που ο χρήστης την αφήσει ανοιχτή για περισσότερο από 3
  • 44. 44 | Σ ε λ ί δ α λεπτά (180 sec). Ο κώδικας είναι ο εξής: <meta http-equiv="refresh" content="180"/>  Σύνδεση – Εμφανίζει το μενού σύνδεσης/εγγραφής στα δεξιά. Όταν συνδεθεί ο χρήστης, εμφανίζει ένα μενού με τις επιλογές του χρήστη.  Σημερινές επισκέψεις - Εμφανίζει τους χρήστες που συνδέθηκαν μέσα στην τρέχουσα ημέρα.  Κορυφαία θέματα – Εμφανίζει τα θέματα με τις περισσότερες απαντήσεις.  Γενέθλια Μελών – Εμφανίζει ποια μέλη έχουν γενέθλια σε διάστημα 2 ημερών (Χρησιμοποιεί την ημερομηνία γέννησης που έχει δηλώσει ο χρήστης στο προφίλ του).  Καιρός – Εμφανίζει πληροφορίες για τον καιρό σε 7 επιλεγμένες πόλεις (Χρησιμοποιεί iframe για να εμφανίζει τα δεδομένα από άλλο ιστότοπο).  Εορτολόγιο – Εμφανίζει τις ονομαστικές εορτές της τρέχουσας και επόμενης ημέρας (Χρησιμοποιεί iframe για να εμφανίζει τα δεδομένα από άλλο ιστότοπο).  Ψηφοφορία – Εμφανίζει δημοσκοπήσεις στις οποίες μπορούν να συμμετέχουν οι εγγεγραμμένοι χρήστες [6]. 4.3 Add-ons / Πρόσθετα Στην παρακάτω εικόνα (Εικόνα 4.3.1) εμφανίζονται τα πρόσθετα που έχουν χρησιμοποιηθεί [1].
  • 45. 45 | Σ ε λ ί δ α Εικόνα 4.3.1 – Add-ons που χρησιμοποιήθηκαν  XMAP – δημιουργεί ένα χάρτη της ιστοσελίδας σε μορφή XML για να διαβάζεται από τις μηχανές αναζήτησης και χρησιμεύει στο SEO της ιστοσελίδας [3].  Tapatalk – χρησιμοποιείται για να μπορεί ο χρήστης να διαβάσει τα θέματα του φόρουμ από την εφαρμογή Tapatalk για φορητές συσκευές με android OS ή IOS [8],[9].
  • 46. 46 | Σ ε λ ί δ α  Hot Login – χρησιμοποιείται για να εμφανίζεται η φόρμα σύνδεσης πάνω δέξιά (Jquery) [11],[12].  Title manager – τροποποιεί αυτόματα τους τίτλους των σελίδων έτσι ώστε να είναι φιλικοί στις μηχανές αναζήτησης [13].  TinyMCE – ο βασικός κειμενογράφος του back-end [7].  Advanced Google Analytics – στέλνει δεδομένα επισκεψιμότητας στην google για την ανανέωση των δεδομένων της υπηρεσίας google analytics [15].  Youtube plugin – Εμφανίζει στο περιεχόμενο βίντεο από το Youtube [14].  SEF – προσθέτει υποστήριξη SEF στους συνδέσμους του εγγράφου [16]. Ενεργεί απευθείας στον κώδικα HTML και δεν απαιτεί κάποια ιδιαίτερη ετικέτα. 4.4 Components / Εφαρμογές 4.4.1 Γενικά Στην παρακάτω εικόνα (Εικόνα 4.4.1.1) εμφανίζονται οι εφαρμογές που έχουν χρησιμοποιηθεί [1]. Εικόνα 4.4.1 .1– Εφαρμογές που χρησιμοποιήθηκαν