fbpx

Προετοιμασία εικόνων για ανέβασμα στην ιστοσελίδα

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

Βασικά χαρακτηριστικά καλής εικόνας για την ιστοσελίδα

1. Σωστό μέγεθος και σωστές διαστάσεις εικόνας

Δύο από τα βασικά χαρακτηριστικά των φωτογραφιών και των εικόνων είναι οι διαστάσεις και το μέγεθος. Έτσι, κάθε εικόνα πρέπει να ανεβαίνει στην ιστοσελίδα μας στο σωστό μέγεθος και στις σωστές διαστάσεις. Ειδικότερα, οι διαστάσεις περιλαμβάνουν το πλάτος και το ύψος της φωτογραφίας και μετριούνται σε Pixels. Από την άλλη η μέτρηση του μεγέθους της φωτογραφίας είναι σε kilobytes (KB) ή megabytes (ΜΒ).

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

Αξίζει να σημειωθεί ότι μειώνοντας τις διαστάσεις μιας εικόνας, τότε μειώνεται και το μέγεθος της.

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

2. Σωστή μορφή εικόνας

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

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

Επομένως, οι δύο τύποι αρχείων που προτείνονται για την ιστοσελίδα σας είναι το jpg, και το webp, ενώ όπου είναι απαραίτητη η διαφάνεια μπορείτε να χρησιμοποιήσετε εικόνες png, όταν το webp δεν υποστηρίζεται.

3. Σωστή όνομα εικόνας

Μια φωτογραφία πρέπει να ανεβαίνει με σωστό όνομα, και όχι με ένα όνομα που λαμβάνει αυτόματα από το κινητό μας τηλέφωνο για παράδειγμα. Δηλαδή δεν ανεβάζουμε μια φωτογραφία με τίτλο π.χ. IMG_1234. Και αυτό γιατί οι μηχανές αναζήτησης χρησιμοποιούν τον τίτλο των φωτογραφιών και των εικόνων ως πληροφορίες στα αποτελέσματα αναζήτησης. Έτσι ένα ο τίτλος μιας φωτογραφίας ή μιας εικόνας θα πρέπει να είναι περιγραφικός, με λατινικούς χαρακτήρες και χωρίς κενά. Για τον διαχωρισμό των λέξεων χρησιμοποιούμε παύλες. Ένα καλό παράδειγμα είναι anatomika-papoutsia.jpg

Βήματα επεξεργασίας εικόνας με το Pixlr (δωρεάν εργαλείο)

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

Βήμα 1

Ανοίγουμε το PIXLR στον browser του υπολογιστή σας.

Επιλέγουμε στο πλαίσιο Pixlr E το πεδίο “Ξεκινήστε ένα έργο επεξεργασίας φωτογραφιών”.

Επιλέξτε στο πλαίσιο Pixlr E το πεδίο "Ξεκινήστε ένα έργο επεξεργασίας φωτογραφιών"

Βήμα 2

Στην σελίδα που ανοίγει επιλέγουμε το κουμπί “Άνοιγμα εικόνας”.

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

Στην σελίδα που ανοίγει επιλέξτε το κουμπί "Άνοιγμα εικόνας".

Βήμα 3

Αφού φορτώσει η φωτογραφία ή εικόνα σας, επιλέγουμε από το δεξιά μενού το εικονίδιο για ην αλλαγή μεγέθους “smart size”.

Αφού φορτώσει η φωτογραφία ή εικόνα σας, επιλέξτε από το δεξιά μενού το εικονίδιο για ην αλλαγή μεγέθους "smart size".

Βήμα 4

Από το μενού δεξιά επιλέγουμε τις διαστάσεις του πλάτους και του ύψους. Αν δεν θέλουμε να αλλάξουν οι αναλογίες τις φωτογραφίες, προσέχουμε να είναι ενεργή η επιλογή “lock proportions”.

παρουσίαση βήματος 4

Βήμα 5

Στη συνέχεια επιλέγουμε από το κύριο μενού “Αρχείο” και στη συνέχει “Αποθήκευση..” ή πατάμε την συντόμευση Ctrl + S.

πως κάνουμε αποθήκευση

Βήμα 6

Σε αυτό το τελευταίο βήμα επιλέγουμε την μορφή του αρχείου και την ποιότητα. Μπορούμε να επιλέξουμε jpg και ποιότητα 60-65% ή μπορούμε να επιλέξουμε WebP στην ίδια ποιότητα.

Στο τέλος πατάμε το κουμπί κάτω δεξιά “Αποθήκευση ως…”

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

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

Web Support

Διαχείριση | Βελτιστοποίηση | Συντήρηση | Επιδιόρθωση

Χρειάζεστε βοήθεια?

Επικοινωνήστε μαζί μας

Σχολιάστε