Μάθετε γιατί οι εικόνες δεν εμφανίζονται στον ιστότοπό σας και πώς να τις διορθώσετε
Η παλιά παροιμία λέει ότι "μια εικόνα αξίζει χίλιες λέξεις". Αυτό ισχύει ιδιαίτερα στον ιστό, όπου οι περιόδους προσοχής είναι φημισμένες και έτσι η σωστή εικόνα μπορεί πραγματικά να κάνει ή να σπάσει έναν ιστότοπο προσελκύοντας τη σωστή προσοχή και προσελκύοντας τους επισκέπτες της σελίδας αρκετά καιρό ώστε να μάθουν τι χρειάζονται για να μάθουν ή να εκτελέσουν μια συγκεκριμένη ενέργεια που σηματοδοτεί μια "νίκη" για τον ιστότοπο. Ναι, όταν πρόκειται για έναν ιστότοπο, οι εικόνες μπορεί να αξίζουν περισσότερο από χίλιες λέξεις!
Έτσι, με τη σημασία των online εικόνων που έχουν δημιουργηθεί, ας δούμε λοιπόν τι λέει ο ιστότοπός σας εάν δεν υπάρχει φόρτωση μιας εικόνας που υποτίθεται ότι βρίσκεται στον ιστότοπο; Αυτό μπορεί να συμβεί είτε έχετε ενσωματωμένες εικόνες που ανήκουν στις εικόνες HTML ή φόντου που εφαρμόζονται με το CSS (και ο ιστότοπός σας έχει και τα δύο). Η κατώτατη γραμμή είναι ότι όταν ένα γραφικό αποτυγχάνει να φορτώσει σε μια σελίδα, κάνει το σχέδιο να φαίνεται σπασμένο και, σε ορισμένες περιπτώσεις, μπορεί να καταστρέψει εντελώς την εμπειρία του χρήστη σε αυτό το site. Οι "χιλιάδες λέξεις" που στέλνει η εικόνα δεν είναι σίγουρα θετικές!
Ας ρίξουμε μια ματιά σε μερικούς από τους συνήθεις λόγους για τους οποίους οι εικόνες θα αποτύχουν να φορτωθούν σε έναν ιστότοπο, καθώς και σε αυτό που θα πρέπει να προσέχετε κατά την αντιμετώπιση αυτού του προβλήματος κατά τη διάρκεια της δοκιμής ιστοτόπων .
Λανθασμένες διαδρομές αρχείων
Όταν προσθέτετε εικόνες στο αρχείο HTML ή CSS ενός ιστότοπου, πρέπει να δημιουργήσετε μια διαδρομή για τη θέση στη δομή καταλόγου σας όπου βρίσκονται αυτά τα αρχεία. Αυτός είναι ο κώδικας που λέει στο πρόγραμμα περιήγησης το σημείο αναζήτησης και ανάκτησης της εικόνας. Στις περισσότερες περιπτώσεις, αυτό θα ήταν μέσα σε ένα φάκελο που ονομάζεται "εικόνες". Εάν η διαδρομή προς αυτόν το φάκελο και τα αρχεία μέσα σε αυτό είναι λανθασμένη, οι εικόνες δεν θα φορτωθούν σωστά επειδή το πρόγραμμα περιήγησης δεν θα μπορέσει να ανακτήσει τα σωστά αρχεία. Θα ακολουθήσει το μονοπάτι που του είπατε, αλλά θα χτυπήσει ένα αδιέξοδο και, αντί να εμφανίσει την κατάλληλη εικόνα, θα βγει κενό.
Το πρώτο βήμα για την αντιμετώπιση προβλημάτων φόρτωσης εικόνας είναι να βεβαιωθείτε ότι η διαδρομή του αρχείου που έχετε κωδικοποιήσει είναι σωστή. Ίσως έχετε ορίσει λάθος κατάλογο ή δεν έχετε καταχωρήσει σωστά τη διαδρομή προς αυτόν τον κατάλογο. Εάν δεν συμβαίνει αυτό, ίσως έχετε ένα άλλο πρόβλημα με αυτήν τη διαδρομή. Συνέχισε να διαβάζεις!
Τα ονόματα των αρχείων είναι εσφαλμένα
Καθώς εξετάζετε τις διαδρομές αρχείων για τα αρχεία σας, βεβαιωθείτε ότι έχετε γράψει σωστά το όνομα της εικόνας. Από την εμπειρία μας, τα λανθασμένα ονόματα ή ορθογραφικά λάθη είναι η συνηθέστερη αιτία προβλημάτων φόρτωσης εικόνας. Θυμηθείτε, τα προγράμματα περιήγησης ιστού είναι πολύ διασκεδαστικά όταν πρόκειται για ονόματα αρχείων. Εάν ξεχάσετε μια επιστολή κατά λάθος ή χρησιμοποιήσετε μια λάθος επιστολή, το πρόγραμμα περιήγησης δεν θα ψάξει για ένα παρόμοιο αρχείο και θα λέει: "Ω, μάλλον εννοούσα αυτό, σωστά;" Όχι - αν το αρχείο έχει γραφτεί λάθος, ακόμα και αν είναι κοντά, δεν θα φορτωθεί στη σελίδα.
Λάθος επέκταση αρχείου
Σε ορισμένες περιπτώσεις, ενδέχεται να έχετε γράψει σωστά το όνομα του αρχείου, αλλά η επέκταση αρχείου ενδέχεται να είναι εσφαλμένη. Εάν η εικόνα σας είναι αρχείο .jpg , αλλά η HTML σας ψάχνει για .png, θα υπάρξει πρόβλημα. Βεβαιωθείτε ότι χρησιμοποιείτε τον σωστό τύπο αρχείου για κάθε εικόνα και, στη συνέχεια, βεβαιωθείτε ότι έχετε καλέσει την ίδια επέκταση στον κώδικα του ιστοτόπου σας.
Επίσης, αναζητήστε ευαισθησία σε περίπτωση. Εάν το αρχείο σας τελειώνει με .JPG, με τα γράμματα όλα με κεφαλαία, αλλά με τις αναφορές κώδικα .jpg, με μικρά γράμματα, υπάρχουν ορισμένοι διακομιστές ιστού οι οποίοι θα δουν ότι τα δύο είναι διαφορετικά, παρόλο που είναι τα ίδια σύνολα γραμμάτων. Η ευαισθησία των περιπτώσεων μετρά! Αυτός είναι ο λόγος για τον οποίο αποθηκεύουμε πάντα τα αρχεία μας με όλα τα πεζά γράμματα. Με τον τρόπο αυτό, μπορούμε πάντα να χρησιμοποιούμε πεζούς κώδικες στον κώδικα μας, εξαλείφοντας ένα πιθανό πρόβλημα που θα μπορούσαμε να έχουμε με τα αρχεία εικόνας μας.
Τα αρχεία λείπουν
Εάν οι διαδρομές στα αρχεία εικόνας είναι σωστές και το όνομα και η επέκταση αρχείου είναι επίσης χωρίς σφάλματα, το επόμενο στοιχείο που πρέπει να ελέγξετε είναι να βεβαιωθείτε ότι τα αρχεία έχουν πραγματικά φορτωθεί στο διακομιστή ιστού. Η παραμέληση για τη μεταφόρτωση αρχείων στον συγκεκριμένο διακομιστή όταν ένα site ξεκινά είναι ένα συνηθισμένο λάθος που είναι εύκολο να παραβλεφθεί.
Πώς διορθώνετε αυτό το πρόβλημα; Μεταφορτώστε αυτές τις εικόνες, ανανεώστε την ιστοσελίδα σας και θα πρέπει να εμφανίσετε αμέσως τα αρχεία όπως αναμένεται. Μπορείτε επίσης να προσπαθήσετε να διαγράψετε την εικόνα στο διακομιστή και να την ανεβάσετε ξανά. Μπορεί να φαίνεται παράξενο, αλλά έχουμε δει αυτό το έργο περισσότερες από μία φορές. Μερικές φορές τα αρχεία καταστρέφονται, οπότε αυτή η μέθοδος "Διαγραφή και αντικατάσταση" μπορεί να καταλήξει να βοηθήσει.
Η ιστοσελίδα φιλοξενεί τις εικόνες είναι κάτω
Συνήθως θέλετε να φιλοξενήσετε όλες τις εικόνες που χρησιμοποιεί ο ιστότοπός σας στον δικό σας διακομιστή, αλλά σε ορισμένες περιπτώσεις ενδέχεται να χρησιμοποιείτε εικόνες που φιλοξενούνται αλλού. Αν ο ιστότοπος που φιλοξενεί την εικόνα μειωθεί, οι εικόνες σας δεν πρόκειται να φορτωθούν.
Πρόβλημα μεταφοράς
Εάν ένα αρχείο εικόνας έχει φορτωθεί από εξωτερικό τομέα ή από το δικό σας, υπάρχει πάντα πιθανότητα να υπάρχει πρόβλημα μεταφοράς αυτού του αρχείου όταν το ζητήσετε για πρώτη φορά από το πρόγραμμα περιήγησης. Αυτό δεν πρέπει να είναι ένα συνηθισμένο περιστατικό (αν είναι, μπορεί να χρειαστεί να ψάξετε για ένα νέο πάροχο φιλοξενίας ), αλλά μπορεί να συμβεί από καιρό σε καιρό.
Η δυσάρεστη πλευρά αυτού του ζητήματος είναι ότι πραγματικά δεν υπάρχει τίποτα που μπορείτε να κάνετε γι 'αυτό, καθώς πρόκειται για ένα πρόβλημα εκτός του ελέγχου σας. Τα καλά νέα είναι ότι πρόκειται για ένα προσωρινό πρόβλημα που συχνά επιλύεται αρκετά γρήγορα. Για παράδειγμα, όταν κάποιος βλέπει μια σπασμένη σελίδα και το ανανεώνει, αυτό μόνο θα λύσει συχνά το πρόβλημα και θα φορτώσει σωστά τις εικόνες. Εάν βλέπετε μια σπασμένη εικόνα, ανανεώστε το πρόγραμμα περιήγησης για να δείτε αν ίσως ήταν απλώς θέμα μετάδοσης το αρχικό σας αίτημα.
Μερικές τελικές σημειώσεις
Όταν σκέφτεστε τις εικόνες και τις ανησυχίες φόρτωσης, δύο πράγματα που πρέπει επίσης να προσέξετε είναι η σωστή χρήση των ετικετών ALT και της ταχύτητας και της συνολικής απόδοσης του ιστότοπού σας.
ALT ή "εναλλακτικό κείμενο", οι ετικέτες είναι αυτές που εμφανίζονται από ένα πρόγραμμα περιήγησης αν δεν γίνει φόρτωση μιας εικόνας. Είναι επίσης ένα σημαντικό στοιχείο στη δημιουργία προσβάσιμων ιστοσελίδων που μπορούν να χρησιμοποιηθούν από άτομα με ειδικές ανάγκες. Κάθε ενσωματωμένη εικόνα στον ιστότοπό σας θα πρέπει να διαθέτει μια κατάλληλη ετικέτα ALT. Σημειώστε ότι οι εικόνες που εφαρμόζονται με το CSS δεν έχουν αυτό το χαρακτηριστικό.
Όσον αφορά την απόδοση του ιστότοπου, η φόρτωση πάρα πολλών εικόνων ή ακόμη και λίγων εικόνων γιγάντων που δεν έχουν βελτιστοποιηθεί κατάλληλα για την παράδοση ιστού θα έχει αρνητικό αντίκτυπο στην ταχύτητα φόρτωσης. Για το λόγο αυτό, βεβαιωθείτε ότι έχετε δοκιμάσει τις επιπτώσεις των εικόνων που χρησιμοποιείτε στη σχεδίαση του ιστότοπού σας και λάβετε τα απαραίτητα μέτρα για να βελτιώσετε την απόδοση αυτού του ιστότοπου δημιουργώντας παράλληλα τη συνολική εμφάνιση και την αίσθηση που είναι κατάλληλη για το έργο του ιστότοπού σας.