Το παλιό ρητό λέει ότι "μια εικόνα αξίζει χίλιες λέξεις." Αυτό το σύνθημα λάμπει στον ιστό, όπου εκτείνεται η προσοχή είναι εξαιρετικά σύντομες - η σωστή εικόνα μπορεί να δημιουργήσει ή να σπάσει έναν ιστότοπο προσελκύοντας τη σωστή προσοχή και ελκυστική σελίδα επισκέπτες.
Ωστόσο, όταν ένα γραφικό δεν φορτώνει, κάνει το σχέδιο να φαίνεται σπασμένο και, σε ορισμένες περιπτώσεις, μπορεί να υποβαθμίσει την εμπειρία χρήστη σε αυτόν τον ιστότοπο. Οι «χιλιάδες λέξεις» που στέλνει η σπασμένη εικόνα σίγουρα δεν είναι θετικές!
1. Λανθασμένες διαδρομές αρχείων
Όταν προσθέτετε εικόνες σε έναν ιστότοπο HTML ή CSS αρχείο, πρέπει να δημιουργήσετε μια διαδρομή προς τη θέση στη δομή του καταλόγου σας όπου βρίσκονται αυτά τα αρχεία. Αυτός είναι ένας κώδικας που λέει στο πρόγραμμα περιήγησης από πού να αναζητήσει και να πάρει την εικόνα. Στις περισσότερες περιπτώσεις, αυτό θα ήταν μέσα σε ένα φάκελο με το όνομα εικόνες. Εάν η διαδρομή προς αυτόν το φάκελο και τα αρχεία μέσα του είναι λανθασμένα, οι εικόνες δεν θα φορτωθούν σωστά, επειδή το πρόγραμμα περιήγησης δεν θα μπορεί να ανακτήσει τα σωστά αρχεία. Θα ακολουθήσει το μονοπάτι στο οποίο το είπατε, αλλά θα βρει αδιέξοδο και, αντί να εμφανίσει την κατάλληλη εικόνα, θα εμφανιστεί κενό.
2. Ονόματα αρχείων με ορθογραφικά λάθη
Καθώς εξετάζετε το διαδρομές αρχείων για τα αρχεία σας, βεβαιωθείτε ότι έχετε γράψει σωστά το όνομα της εικόνας. Λανθασμένα ονόματα ή ορθογραφικά λάθη είναι η πιο κοινή αιτία προβλημάτων φόρτωσης εικόνας.
3. Λάθος επεκτάσεις αρχείων
Σε ορισμένες περιπτώσεις, ενδέχεται να έχετε το όνομα του αρχείου σωστά γραμμένο, αλλά η επέκταση αρχείου ενδέχεται να είναι λανθασμένη. Εάν η εικόνα σας είναι α αρχείο .jpg, αλλά το HTML σας αναζητά .png, θα υπάρξει πρόβλημα. Χρησιμοποιήστε τον σωστό τύπο αρχείου για κάθε εικόνα και, στη συνέχεια, αναφέρετε την ίδια επέκταση στον κώδικα του ιστότοπού σας
Επίσης, αναζητήστε ευαισθησία περίπτωσης. Εάν το αρχείο σας τελειώνει με .JPG, με τα γράμματα όλα σε κεφαλαία, αλλά ο κώδικας σας αναφέρει .jpg, όλα πεζά, ορισμένοι διακομιστές ιστού βλέπουν αυτούς τους δύο να είναι διαφορετικοί, παρόλο που είναι τα ίδια σύνολα γράμματα. Η ευαισθησία της υπόθεσης μετράει.
Είναι βέλτιστη πρακτική να αποθηκεύετε πάντα αρχεία με κεφαλαία γράμματα. Κάτι τέτοιο μας επιτρέπει να χρησιμοποιούμε πάντα πεζά στον κώδικα μας, εξαλείφοντας ένα πιθανό πρόβλημα που θα μπορούσαμε να έχουμε με τα αρχεία εικόνας μας.
4. Λείπουν αρχεία
Εάν οι διαδρομές στα αρχεία εικόνας σας είναι σωστές, και το όνομα και επέκταση αρχείου είναι επίσης χωρίς σφάλματα, ελέγξτε ότι τα αρχεία έχουν μεταφορτωθεί στον διακομιστή ιστού. Η παραμέληση για τη μεταφόρτωση αρχείων σε αυτόν τον διακομιστή κατά την εκκίνηση ενός ιστότοπου είναι ένα κοινό λάθος που είναι εύκολο να παραβλεφθεί.
Ανεβάστε αυτές τις εικόνες, ανανεώστε την ιστοσελίδα σας και θα πρέπει να εμφανίζει αμέσως τα αρχεία όπως αναμένεται. Μπορείτε επίσης να προσπαθήσετε να διαγράψετε την εικόνα στο διακομιστή και να την ανεβάσετε ξανά. Μερικές φορές τα αρχεία καταστρέφονται κατά τη μεταφορά (π.χ. με κείμενο αντί για δυαδική μεταφορά κατά τη διάρκεια FTP), επομένως αυτή η μέθοδος "διαγραφή και αντικατάσταση" βοηθά μερικές φορές.
5. Ο ιστότοπος που φιλοξενεί τις εικόνες είναι κάτω
Συνήθως θα φιλοξενείτε τις εικόνες που χρησιμοποιεί ο ιστότοπός σας μόνοι σας υπηρέτης, αλλά σε ορισμένες περιπτώσεις, ενδέχεται να χρησιμοποιείτε εικόνες που φιλοξενούνται αλλού. Εάν αυτός ο ιστότοπος που φιλοξενεί την εικόνα πέσει, οι εικόνες σας δεν πρόκειται να φορτωθούν.
6. Προβλήματα μεταφοράς
Είτε ένα αρχείο εικόνας φορτώνεται από εξωτερικό τομέα είτε από δικό σας, υπάρχει πάντα η πιθανότητα να υπάρχει πρόβλημα μεταφοράς για αυτό το αρχείο όταν ζητηθεί για πρώτη φορά από το πρόγραμμα περιήγησης. Αυτό το πρόβλημα δεν πρέπει να είναι ένα συνηθισμένο συμβάν (αν είναι, ίσως χρειαστεί να αναζητήσετε έναν νέο πάροχο φιλοξενίας), αλλά μπορεί να συμβεί κατά καιρούς.
Ένας κοινός λόγος για αυτό το πρόβλημα είναι ότι ο διακομιστής είναι συντριμμένος και δεν μπορεί να εξυπηρετήσει όλα τα στοιχεία της σελίδας αρκετά γρήγορα πριν λήξει το αίτημα. Θα δείτε αυτό το πρόβλημα πιο συχνά με φθηνά παρεχόμενους εικονικούς διακομιστές ιστού που αγωνίζονται να χειριστούν πιο περίπλοκους ιστότοπους με σενάριο. Εάν αυτό το πρόβλημα παρουσιάζεται συχνά, εξετάστε το ενδεχόμενο αναβάθμισης των δυνατοτήτων του διακομιστή ή βρείτε έναν νέο κεντρικό υπολογιστή.
7. Προβλήματα βάσης δεδομένων
Οι σύγχρονες δυναμικές εφαρμογές ιστού, όπως το WordPress, βασίζονται σε μια βάση δεδομένων για την αποθήκευση πληροφοριών σχετικά με τα πάντα σε έναν ιστότοπο, συμπεριλαμβανομένων των εικόνων. Εάν ο ιστότοπός σας δεν φορτώνει εικόνες, υπάρχει πιθανότητα η βάση δεδομένων να αντιμετωπίζει κάποιο πρόβλημα.
Υπάρχουν πολλοί τρόποι με τους οποίους μπορούν να προκύψουν προβλήματα στη βάση δεδομένων. Η εφαρμογή σας ενδέχεται να μην είναι καν συνδεδεμένη στη βάση δεδομένων, επειδή είναι είτε εκτός λειτουργίας είτε δεν είναι δυνατή η πρόσβαση σε διαφορετικό διακομιστή. Κάτι μπορεί να έχει καταστραφεί στην ίδια τη βάση δεδομένων ή να αλλάξουν οι πληροφορίες χρήστη της βάσης δεδομένων σας, αποσυνδεόμενοι. Ακόμη και απλές αλλαγές ρυθμίσεων θα μπορούσαν να προκαλέσουν ανεπιθύμητες συνέπειες που είτε τροποποιούν τη βάση δεδομένων είτε την καθιστούν απρόσιτη. Ελέγξτε τα αρχεία καταγραφής διακομιστή για να δείτε εάν η βάση δεδομένων μπορεί να είναι ο ένοχος.
Λίγες τελικές σημειώσεις
Σκεψου το σωστή χρήση των ετικετών ALT και την ταχύτητα και τη συνολική απόδοση του ιστότοπού σας.
Οι ετικέτες ALT ή "εναλλακτικό κείμενο" είναι αυτό που εμφανίζεται από ένα πρόγραμμα περιήγησης εάν δεν φορτωθεί μια εικόνα. Αποτελούν επίσης σημαντικό συστατικό στη δημιουργία προσβάσιμων ιστότοπων που μπορούν να χρησιμοποιηθούν από άτομα με συγκεκριμένες αναπηρίες. Κάθε ενσωματωμένη εικόνα στον ιστότοπό σας πρέπει να έχει την κατάλληλη ετικέτα ALT. Οι εικόνες που εφαρμόζονται με CSS δεν προσφέρουν αυτό το χαρακτηριστικό.