Επαγγελματικός Κλάδος
- Κρεβάτια Μασάζ
- Ολιστικές Θεραπείες
Υπηρεσίες
- Έρευνα
- Ανάπτυξη
- PSD to WEB
Χώρα
- Ελλάδα
Massage Tables
Ο Μιχάλης Χριστόπουλος (a.k.a. Paribodha) εκτός από πολύ καλός φίλος και άνθρωπος, είναι και ο δάσκαλός από τον οποίο πήρα τον 1ο βαθμό μου στο Reiki.
Η επαγγελματική συνεργασία μας ξεκίνησε όταν μου ανέθεσε την ανανέωση του περιεχομένου της ιστοσελίδας του. Το σύστημα που είχε χτιστεί η ιστοσελίδα ήταν δύσχρηστο και απαρχαιωμένο.
δεν ήταν εύκολη στην διαχείριση και στο ανέβασμα νέων φωτογραφιών και προϊόντων
ο σχεδιασμός ήταν ξεπερασμένος χωρίς να δείχνει το πραγματικό πρόσωπο της επιχείρησης.
Μετά από αρκετό καιρό ταλαιπωρίας και σπαταλημένων ωρών για εργασίες που κανονικά χρειάζονταν λίγα λεπτά, του πρότεινα να αλλάξει την ιστοσελίδα του σε WordPress και το πήρε απόφαση άμεσα.
Μεγάλο ρόλο σε αυτήν την απόφαση έπαιξε και η έλλειψη του responsive design μιας και οι επισκέπτες της ιστοσελίδας δεν μπορούσαν να δούν εύκολα και να ενημερωθούν σωστά για τα προιόντα της εταιρείας.
Ιδιαίτερη προσοχή δόθηκε στην διατήρηση των αποτελεσμάτων που είχε ήδη η ιστοσελίδα στο ευρετήριο των μηχανών αναζήτησης και η περαιτέρω βελτίωση στην γενική της κατάταξη για αναζητήσεις όπως “κρεβάτια μασάζ”, “καρέκλες μασάζ”, “αναλώσιμα μασάζ”.
Client
Healing Touch
Scope
Website Redesign
Deliverables
PSD to WEB, Responsive Web Design, SEO, Analytics Integration
Before
After
01.
Στάδιο Ανάλυσης
Παλιά τεχνολογία
Η ιστοσελίδα ήταν φτιαγμένη με παλιό CMS που ήταν βασισμένο σε HTML και PHP και είχε σταματήσει να παρέχει αναβαθμίσεις.
Παρωχημένος σχεδιασμός
Ο σχεδιασμός ήταν πολύ ξεπερασμένος για τα σύγχρονα δεδομένα. Ο Μιχάλης είχε πλέον ανάγκη να δείξει ένα σύγχρονο πρόσωπο για την εταιρεία του με μια νέα, μοντέρνα ιστοσελίδα.
Μη φιλική προς κινητά
Η σελίδα δεν ήταν φιλική προς τα κινητά με αποτέλεσμα οι επισκέπτες να μην να μπορούν να διαβάζουν το περιεχόμενο με ευκολία.
Δύσκολη διαχείριση
Το σύστημα διαχείρισης της ιστοσελίδας ήταν δύσχρηστο και απαιτούσε πολύ χρόνο για να ανέβουν τα προϊόντα και οι φωτογραφίες τους.
”Η ιστοσελίδα μου ήταν τόσο δύσχρηστη που έπρεπε να λέω στον Μανώλη να ανεβάζει τα νέα προϊόντα. Το αποτέλεσμα ήταν να σπαταλάω χρήματα και χρόνο σε μια ιστοσελίδα που επιπλέον είχε παλιό σχεδιασμό.
Μιχάλης ΧριστόπουλοςFounder της Healing Touch και του Massage Tables
02.
Κατανόηση των στόχων της επιχείρησης
Αύξηση των επισκεπτών
Κύριος στόχος ήταν η αύξηση των επισκεπτών στην ιστοσελίδα της επιχείρησης για να μάθουν για τα προσφερόμενα προϊόντα και τις υπηρεσίες της εταιρείας.
“Ανέβασμα” στις αναζητήσεις
Ο Μιχάλης ήθελε να ανεβάσει την ιστοσελίδα της εταιρείας του ψηλότερα στις αναζητήσεις σχετικά με τα προϊόντα και τις υπηρεσίες που παρείχε.
Ιστοσελίδα φιλική προς κινητά
Η χρήση των κινητών τηλεφώνων είχε αυξηθεί κατακόρυφα από τότε που κατασκευάστηκε η προηγούμενη ιστοσελίδα και οι επισκέπτες έπρεπε να μπαίνουν σε μια ιστοσελίδα που να είναι σχεδιασμένη για αυτά.
Εύκολη διαχείριση
Κύριο μέλημα ήταν να μπορεί να γίνεται η διαχείριση του περιεχομένου και το ανέβασμα νέων φωτογραφιών, προϊόντων και υπηρεσιών από τους υπαλλήλους της εταιρείας.
03.
Ανάλυση και διατήρηση των καλών στοιχείων
Ανακατευθύνσεις παλιών URL
Όλα τα παλιά URLs (σύνδεσμοι) πέρασαν με 301 redirects στα καινούργια URLs στα οποία δημιουργήθηκαν. Αυτό κρίθηκε απαραίτητο για να διατηρηθεί η κατάταξη της ιστοσελίδας στο Google και τις υπόλοιπες μηχανές αναζήτησης.
Λέξεις-κλειδιά
Η ιστοσελίδα είχε ήδη κάποιες λέξεις-κλειδιά (keywords) με τις οποίες εμφανίζονταν στις μηχανές αναζήτησης (Google, Bing). Όλες διατηρήθηκαν για να μην χαθούν τα αποτελέσματα αυτά στις αναζητήσεις.
Google Webmaster Tools
Η ιστοσελίδα προστέθηκε στο Google Webmaster Tools για να έχουμε λεπτομερή εικόνα σχετικά με το ποιες ακριβώς αναζητήσεις στο Google φέρνουν τους επισκέπτες στην ιστοσελίδα.
Google Analytics Integration
Εγκατέστησα τον απαραίτητο κώδικα από το Google Analytics για να μπορεί να μετρηθεί και αξιολογηθεί η χρήση της ιστοσελίδας χωρίς να υποθέτουμε πώς μπορεί να την χρησιμοποιεί ο κάθε επισκέπτης.
Μετατροπή μακέτας Photoshop σε ιστοσελίδα
PSD
WEB
04.
Προεργασία και πλάνο εκτέλεσης
Νέα πλατφόρμα
Για την νέα πλατφόρμα υλοποίησης της ιστοσελίδας επιλέχθηκε το διαχειριστικό σύστημα WordPress, το οποίο είναι γνωστό για την ευχρηστία του και την παραμετροποίησή του.
PSD to WEB
Ο σχεδιασμός έγινε από designer του πελάτη σε Photoshop και μου ανατέθηκε να “μεταφράσω” τον σχεδιασμό σε ιστοσελίδα.
Staging
Για την ανάπτυξη του νέου website και για να έχει ο ιδιοκτήτης άμεση εικόνα για την πρόοδο έγινε εγκατάσταση της πλατφόρμας σε προσωρινό domain name και νέο Linux server.
User Personas
Αναλύσαμε τον ιδανικό επισκέπτη της ιστοσελίδας το οποίο μας βοήθησε στον γενικό σχεδιασμό και τον τόνο των κειμένων μας. Για περισσότερες πληροφορίες δες παρακάτω.
Παλέτα Χρωμάτων
Η χρωματική παλέτα που χρησιμοποιήθηκε βασίστηκε στα ήδη υπάρχοντα χρώματα της εταιρείας.
#04D9C4
#049DD9
#0487D9
#0D0D0D
#DDDDDD
#FFFFFF
Γραμματοσειρά
Για την γραμματοσειρά, επιλέχθηκε η Open Sans με πιο ισχυρά βάρη για τις επικεφαλίδες και ελαφρότερα βάρη για το κυρίως κείμενο. Η γραμματοσειρά είναι Sans Serif (χωρίς “μαγκουράκια”), έχει πλήρη υποστήριξη για Ελληνικά, είναι ευανάγνωστη και μοντέρνα και έδωσε στην ιστοσελίδα μια φρέσκια και νεωτεριστική αίσθηση.
Opens Sans Bold
Aa
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m n o p q r s t u v w x y z
Open Sans Regular
Aa
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m n o p q r s t u v w x y z
Opens Sans Light
Aa
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
a b c d e f g h i j k l m n o p q r s t u v w x y z
Τεχνολογίες
Κάτω από το “καπό” η ιστοσελίδα έχει τεχνολογίες που την βοηθάνε τόσο στην ευχρηστία της όσο και στην κατάταξή της ψηλότερα στις μηχανές αναζήτησης.
WordPress CMS
- Bridge theme
- Ελληνική γλώσσα
- Privacy plugins
Google Optimized
- Google Analytics 4
- Google Search Console
- Google My Business
Custom CSS
Χρησιμοποίησα custom κώδικα για να επιτύχω το look που υπήρχε το Photoshop file που μου δόθηκε και δεν υπήρχε στο theme του website
Speed Enhancements
- Page caching
- Javascript & CSS Minification
- Image resizing and compression
