×
Κατασκευή Ιστοσελίδων WordPress Joomla wordpress vs html/css
×
Κατασκευή Eshop Woocommerce Opencart Magento Shopify
×
Προώθηση Ιστοσελίδων Digital Marketing Μαθήματα Facebook Σεμινάρια Linkedin Μαθήματα Instagram Σεμινάρια Twitter Μαθήματα Pinterest
×
Κατασκευή web εφαρμογών Σεμινάρια JAVA Μαθήματα PHP Σεμινάρια MySQL Προγραμματισμός Παιχνιδιών
×
Μαθήματα Excel Σεμινάρια VBA Σεμινάρια Photoshop Μαθήματα PowerPoint Σεμινάρια Word Μαθήματα Προγραμματισμού Πληροφορική στο δημοτικό

balatsoukas logo balatsoukas.com

Το πρώτο βήμα για την κατασκευή ιστοσελίδας wordpress

Πώς να ξεκινήσετε την κατασκευή ιστοσελίδας με το wordpress. Δημιουργία αρχικής σελίδας, επιλογή στοιχείων menu και βελτιστοποίηση εικόνων με το Photoshop.

Εκπαιδευτής Ενηλίκων Νικόλαος Μπαλατσούκας Τηλ. (+30) 6977676785

Το πρώτο βήμα για την κατασκευή ιστοσελίδας wordpress είναι να κάνουμε συνάντηση με τον ιδιοκτήτη της ιστοσελίδας και να καταχωρήσουμε περιεχόμενο στην αρχική σελίδα του site. Η κατασκευή ιστοσελίδας το 2020 ενδιαφέρει κατά πολύ σε σύγκριση με τις αντίστοιχες τεχνικές που χρησιμοποιούσαμε το 2010. Πλέον οι ιστοσελίδες κατασκευάζονται σχεδόν αποκλειστικά με το wordpress. Δεν είναι μόνο η απλότητα στην εγκατάσταση του wordpress. Η βασική διαφορά συνίσταται στην ενσωμάτωση διαδικασιών βελτιστοποίησης ιστοσελίδας κατά τη δημιουργία του site καθώς και στις απαιτήσεις που αφορούν την ταχύτητα και τη φιλικότητα προς τα smartphones. Με άλλα λόγια όταν κατασκευάζουμε ένα site αυτό πρέπει να είναι πολύ φιλικό προς τις μηχανές αναζήτησης, πολύ φιλικό προς κινητά τηλέφωνα καθώς και πολύ γρήγορο.

Κατασκευή ιστοσελίδας με το wordpress

Όταν κάνουμε κατασκευή ιστοσελίδας με wordpress τότε όλα αυτά τα πράγματα σε ένα βαθμό είναι έτοιμα. Επίσης ο ιστότοπος θα πρέπει να έχει τη δυνατότητα συστηματικής καταχώρησης περιεχομένου. Αυτό σημαίνει ότι θα πρέπει ο ιδιοκτήτης της ιστοσελίδας ή κάποιος υπάλληλος αυτού να εκπαιδευτεί ώστε να ανεβάζει εύκολα και γρήγορα περιεχόμενο στο site χωρίς να επηρεάζει τις παραμέτρους που αφορούν ταχύτητα βελτιστοποίηση και φιλικότητα προς κινητά τηλέφωνα. Εδώ είναι που το wordpress πλεονεκτεί και κερδίζει κατά κράτος τα υπόλοιπα Content Management Systems. Η εκπαίδευση ενός ανθρώπου στην καταχώρηση άρθρων είναι πάρα πολύ απλή όταν κάνουμε κατασκευή ιστοσελίδας με wordpress. Όποιος δεν γνωρίζει καθόλου το λογισμικό μπορεί να παρακολουθήσει ένα σεμινάριο wordpress.

Παράδειγμα κατασκευής ιστοσελίδας

Στη συνέχεια του άρθρου θα παρουσιάσουμε ένα παράδειγμα διαδικασιών κατασκευής ιστοσελίδας. Ως παράδειγμα θα χρησιμοποιήσουμε την ιστοσελίδα noil.gr και θα κάνουμε συζήτηση πάνω στην επικοινωνία του κατασκευαστή ιστοσελίδας με τον ιδιοκτήτη της ιστοσελίδας. Εξετάζουμε όλα όσα ζητά ο κατασκευαστής από τον ιδιοκτήτη ώστε αυτή η διαδικασία να χρησιμοποιηθεί σε σεμινάριο κατασκευής ιστοσελίδων. Επιλέξαμε να κάνουμε την παρουσίαση με πολλές αναφορές σε εκπαίδευση πάνω στην κατασκευή ιστοσελίδων ώστε το άρθρο που διαβάζετε θα έχει και κάποια εκπαιδευτική αξία. Εδώ έχουμε δημιουργήσει ειδική σελίδα που αφορά την εκπαίδευση στην κατασκευή ιστοσελίδων.

Επιλογή προτυπου template

Οι περισσότερες συζητήσεις που αφορούν την κατασκευή ιστοσελίδας σχετίζονται γύρω από την επιλογή template. Υποθέτουμε οτι έχει γίνει η κατοχύρωση domain και η αγορά του πακέτου φιλοξενίας. Δηλαδή του προτύπου πάνω στον οποίο θα χτιστεί ολόκληρος ο ιστότοπος. Συνεπώς όταν κάποιος θέλει να φτιάξει ένα site πήγαινε σε μία εταιρεία και κάθεται μαζί με τον υπάλληλο της εταιρείας κατασκευής ιστοσελίδων για να επιλέξουν το κατάλληλο πρότυπο που θα χρησιμοποιηθεί για τη δημιουργία της ιστοσελίδας. Συνήθως γίνονται συζητήσεις που αφορούν τις εικόνες της πρώτης σελίδας, το slider και τα menu. Κατά τη γνώμη μου αυτή η κατεύθυνση της συζήτησης είναι εντελώς λανθασμένη διότι όλα τα σύγχρονα πρότυπα επιτρέπουν πάρα πολλούς συνδυασμούς. Δηλαδή μπορούμε να ρυθμίσουμε το πλήθος των στοιχείων του μενού, να επιλέξουμε αν θέλουμε ή όχι slider, να καθορίσουμε το πλήθος και τη διάταξη των εικόνων και των επικεφαλίδων που θα εμφανίζονται στην πρώτη σελίδα.

ενδεικτικό θέμα wordpress

Τα πρότυπα κατασκευής ιστοσελίδων μας δίνουν τη δυνατότητα να προσαρμόσουμε τόσο την επικεφαλίδα header όσο και το υποσέλιδο footer. Το μόνο που ενδέχεται να μας ταλαιπωρήσει κατά την προσαρμογή του προτύπου είναι τα χρώματα της εταιρείας. Τα πιο πολλά πρότυπα δέχονται προσαρμογή χρωμάτων μέσα από πολύ εύκολες διαδικασίες γραφικής παραμετροποίησης. Βεβαίως καλό θα είναι να επιλέξουμε εξαρχής ένα πρότυπο το οποίο χρωματικά να είναι πολύ κοντά στο λογότυπο της εταιρείας που μας ζήτησε να της κατασκευάσουμε το site.

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

αρχική σελίδα noil κατασκευασμένη στο wordpress

Πρώτη σελίδα του site

Όταν κατασκευάζουμε μία ιστοσελίδα τότε το μεγαλύτερο βάρος πρέπει να πέσει στην τελειοποίηση της πρώτης σελίδας. θα πρέπει ο επισκέπτης μπαίνεις στο site να καταλαβαίνει με τη μια περι τίνος πρόκειται. Επίσης θα πρέπει ο επισκέπτης να καταλαβαίνει Με την πρώτη ματιά ποια είναι τα δυνατά σημεία της εταιρείας στην οποία επισκέπτεται. Αυτό γίνεται επιλέγοντας κατάλληλες εικόνες κατάλληλες επικεφαλίδες και κατάλληλα κείμενα στην πρώτη σελίδα του site. Στην ακόλουθη εικόνα βλέπουμε κάποιες έτοιμες προτάσεις που μας δίνει το wordpress theme για την αρχική σελίδα του ιστότοπου noil.gr:

αρχική σελίδα noil από περιβάλλον επεξεργασίας wordpress

Συνάντηση με τον ιδιοκτήτη της ιστοσελίδας

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

Κατασκευή του menu

Ζητάμε από τον ιδιοκτητη της ιστοσελίδας να μας ενημερώσει για τις κατηγορίες περιεχομένου ώστε να τοποθετήσουμε τις αντίστοιχες κατηγορίες στο μενού του site. Δεδομένου ότι μία θέση στο μενού δεσμεύεται από τη λέξη αρχική και μία δεύτερη θέση στο μενού δεσμεύεται από τη λέξη επικοινωνία, τότε το πλήθος των κατηγοριών περιορίζεται σε τέσσερις το πολύ. Όμως μπορούμε να τοποθετήσουμε υποκατηγορίες. Για να γίνει αυτό θα προσθέσουμε drop down menu. Η επιλογή του μενού είναι ένα από τα κρισιμότερα σημεία στην κατασκευή της ιστοσελίδας διότι μπαίνει στο header και επαναλαμβάνεται σε κάθε σελίδα. Οσο καλύτερο είναι το menu τόσο ευκολότερη θα είναι η πλοήγηση στο site. Αντίθετα ένα καλοσχεδιασμένο menu θα δυσκολέψει την αναζήτηση πληροφοριών στην ιστοσελίδα και ενδεχομένως να απομακρύνει πολλούς επισκέπτες διότι δεν θα μπορέσουν να βρουν εύκολα αυτό που ψάχνουν.

Εγκατάσταση wordpress plugins

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

Κείμενα και εικόνες στην πρώτη σελίδα

Αφού επιλέξουμε το μενού στη συνέχεια πρέπει να σκεφτούμε πολύ σοβαρά πάνω στα κείμενα και τις εικόνες που θα τοποθετηθούν στην πρώτη σελίδα του ιστότοπου. Θα πρέπει να φτιάξουμε τέτοια κείμενα και τέτοιες εικόνες ώστε ο επισκέπτης με την πρώτη ματιά να καταλαβαίνει για ποιο λόγο να επιλέξει την εταιρεία ή το σύλλογο ή τον οργανισμό προβάλλεται μέσα από το site. Μία εικόνα ίσον χίλιες λέξεις. Όμως αυτό που καταλαβαίνει η Google είναι οι επικεφαλίδες. Καλό θα είναι όλα τα δυνατά σημεία της εταιρείας να προβάλλονται μέσα από επικεφαλίδες στην πρώτη σελίδα του site. Στη συνέχεια βλέπουμε έναν άλλο ιστότοπο ο οποίος χρησιμοποιεί το ίδιο wordpress theme:

ιστοσελίδα με παρόμοιο wordpress theme

Προώθηση της ιστοσελίδας

Οι παραπάνω παράμετροι είναι πολύ κρίσιμες για την προώθηση της ιστοσελίδας στο Google. Ενα καλό μενού θα διευκολύνει το χρήστη στην πλοήγηση στον ιστότοπο και θα βελτιώσει το click through rate καθώς και το bounce rate στο site. Αυτές οι δύο παράμετροι είναι έχουν πολύ μεγάλη βαρύτητα για την προώθηση της ιστοσελίδας. κατάλληλη επιλογή επικεφαλίδων θα βοηθήσει την Google να κατατάξει την ιστοσελίδα μας στην κατηγορία περιεχομένου που θέλουμε. εάν δει μία πρώτη σελίδα δεν έχει πληρότητα από λέξεις κλειδιά και να είναι σε συμφωνία με τις λέξεις που αναζητούν οι χρήστες για αυτού του είδους τις επιχειρήσεις τότε θα εμφανίσει πολύ πιο γρήγορα την ιστοσελίδα μας στις πρώτες θέσεις των αποτελεσμάτων αναζήτησης. Αυτές οι λεπτομέρειες καλό θα είναι να εξηγηθούν στον ιδιοκτήτη του ιστότοπου διότι είναι πολύ κρίσιμες για την προώθηση της ιστοσελίδας.

Σεμιναρια seo

Η συζήτηση που μόλις παρουσιάσαμε θα πρέπει να αποτελεί το κομβικό το σημείο στα σεμινάρια seo. Ο τρόπος που σκέφτεται η Google προκειμένου να ανεβάσει ένα site στην πρώτη σελίδα είναι πάρα πολύ απλός. Αυτή η απλότητα θα πρέπει να είναι εμφανής σε κάθε σεμινάριο προώθησης ιστοσελίδων. Και βεβαίως αυτή η απλότητα ταυτίζεται με την παραγωγή στοχευμένο και απλού περιεχομένου. Βεβαίως όμως δεν θα μείνουμε απλά στο περιεχόμενο αλλά έλα σεμινάριο seo περιλαμβάνει και τις τεχνικές με τις οποίες θα προβάλουμε το περιεχόμενο μέσα από ετικέτες title, description, h1, h2, alt και πολλές άλλες. Όποιος ενδιαφέρεται για το αντικείμενο προώθησης ιστοσελίδων μπορεί να ενημερωθεί εδώ για τα σεμινάρια seo.

Κατασκευή της ιστοσελίδας

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

Δημοσίευση άρθρων

Ουσιαστικά η κατασκευή της ιστοσελίδας ταυτίζεται με την δημιουργία της πρώτης σελίδας του site. Το υπόλοιπο κομμάτι είναι η ενημέρωση της ιστοσελίδας. αφού κατασκευάσουμε την πρώτη σελίδα και δημιουργήσουμε τις σχετικές κατηγορίες στη συνέχεια πρέπει να εξηγήσουμε στον υπεύθυνο ενημέρωσης του site πως θα καταχωρεί άρθρα. Εδώ πρέπει να προσέξουμε δύο πράγματα. Το πρώτο είναι να τοποθετεί τα άρθρα στις κατάλληλες κατηγορίες. Και το δεύτερο πράγμα που πρέπει να προσέξουμε κατά την καταχώρηση ενός άρθρου είναι η βελτιστοποίηση αυτού. εάν χρησιμοποιούμε το wordpress για την κατασκευή της ιστοσελίδας το ιδανικό εργαλείο βελτιστοποίησης είναι το yoast seo. Εδώ έχουμε ένα άρθρο στο οποίο δείχνουμε πώς μπορείτε να κάνετε βελτιστοποίηση άρθρου wordpress με χρήση του εργαλείου yoast seo.

Αλλαγή μεγέθους εικόνων

Για να πετύχουμε το τέλειο αποτέλεσμα στην κατασκευή ιστοσελίδας καλό θα είναι να προσαρμόσουμε τις εικόνες στο μέγεθος που μας ζητάει το πρότυπο. Για παράδειγμα εάν το πρότυπο ζητάει εικόνες σχήματος τετραγώνου τοτε θα πρέπει να κάνουμε αλλαγή μεγέθους εικόνων με το Photoshop και να ανεβάσουμε τετράγωνες εικόνες. Αυτό είναι πολύ σημαντικό για τις εικόνες που θα τοποθετηθούν στο slider όπως επίσης και για τις εικόνες που θα χρησιμοποιηθούν ως featured image σε κάθε άρθρο. Η αλλαγή του μεγέθους των εικόνων είναι μία εντελώς αναγκαία γνώση για την κατασκευή ιστοσελίδων. μπορεί να γίνει είτε με χρήση του προγράμματος photoshop είτε χρησιμοποιώντας κάποιο από τα εναλλακτικά online photoshop. Προτείνουμε να διαβάσετε ένα άρθρο στο οποίο δείχνει πώς να κάνουμε αλλαγή μεγέθους εικόνων με το Photoshop και να δημιουργήσουμε τετράγωνες εικόνες.

Βελτιστοποίηση εικόνων με το Photoshop

Η βελτιστοποίηση εικόνων αποτελεί ένα πολύ σημαντικό κομμάτι της κατασκευή ιστοσελίδας. Όσο μικρότερο το μέγεθος εικόνων σε kbyteτόσο πιο γρήγορα θα φορτώνουν. Για τη βελτιστοποίηση εικόνων χρησιμοποιούμε το πρόγραμμα photoshop. Εάν δεν έχετε στον υπολογιστή σας το photoshop τότε μπορείτε να χρησιμοποιήσετε online photoshop. Όσοι δεν γνωρίζουν τη χρήση αυτού του προγράμματος μπορούν να παρακολουθήσουν ένα σεμινάριο photoshop.

Κατασκευή, ενημέρωση και προώθηση ιστοσελίδας

Κλείνοντας αυτό το άρθρο καλό είναι να ξεκαθαρίσουμε τρία διαφορετικά πράγματα. Το πρώτο είναι η κατασκευή της ιστοσελίδας. Η κατασκευή της ιστοσελίδας ολοκληρώνεται με το στήσιμο του homepage, του header, του Footer και των κατηγοριών. Το δεύτερο είναι η ενημέρωση της ιστοσελίδας η οποία αφορά τη διαρκή καταχώρηση άρθρων στο site. Και το τρίτο αφορά την προώθηση ιστοσελίδας. Η οποία μπορεί να γίνει είτε με τη βελτιστοποίηση των άρθρων είτε μέσω καταχώρησης άρθρων σε άλλους ιστότοπους. Είμαι σημαντικό να τονίσουμε ότι η κατασκευή ιστοσελίδας ολοκληρώνεται όταν ο ιδιοκτήτης είναι ικανοποιημένος από το home page ενώ ο υπάλληλος του γνωρίζει με ποιον τρόπο να κάνει καταχώρηση άρθρων. Η προώθηση ιστοσελίδας είναι τελείως διαφορετικό κεφάλαιο το οποίο δεν θα το εξετάσουμε σε αυτό το άρθρο.

Κατασκευή e-shop

Αφού ολοκληρωθεί η ιστοσελίδα είναι πάρα πολύ πιθανό να ζητηθεί η δημιουργία ηλεκτρονικού καταστήματος. Μία καλή λύση είναι να κάνουμε δημιουργία ηλεκτρονικού καταστήματος σε ξεχωριστό φάκελο από την ιστοσελίδα μας δεν έχουμε ανεξαρτησία μεταξύ site και e-shop. Μπορεί όμως να συμβεί και το αντίστροφο δηλαδή να δημιουργηθεί το site σε ξεχωριστό φάκελο μέσα στο ηλεκτρονικό κατάστημα. όλες τις λύσεις ηλεκτρονικού εμπορίου θα τις βρείτε συγκεντρωμένες στη σελίδα μας που είναι αφιερωμένη στη δημιουργία e-shop.

Κατασκευή e-shop στο wordpress

Το wordpress μας δίνει τη δυνατότητα να δημιουργήσουμε ηλεκτρονικό κατάστημα ενσωματωμένο στο site και όχι σε ξεχωριστό φάκελο. Αυτό γίνεται μέσω ενός καταπληκτικού plug-in που είναι εξειδικευμένο στην κατασκευή e-shop το οποίο ονομάζεται WooCommerce. Η εγκατάσταση γίνεται μέσα σε 10 λεπτά μπορούμε να έχουμε ένα πλήρες ηλεκτρονικό κατάστημα. Εάν θέλετε πάρτε τα περισσότερα τότε μπορείτε να μεταβείτε στο άρθρο μας μιλάει αποκλειστικά για την κατασκευή e-shop με το WooCommerce.

Διαχείρηση προϊόντων στο woocommerce

Η διαχείρηση προίόντων στο woocommerce είναι εξίσου απλή με τη διαχείρηση άρθρων και κατηγοριών στο wordpress. όλες οι ενέργειες που αφορούν το woocommerce είναι απλές. Αυτό είναι ένα πολύ χρήσιμο άρθρο για τη διαχείρηση προϊόντων στο woocommerce και άλλες χρήσιμες ενέργειες πάνω στο eshop.

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