Det gamle ordtaket sier at et bilde er verdt tusen ord. Dette gjelder spesielt på nettet, hvor oppmerksomhetsspennene er notorisk korte, og det riktige bildet kan virkelig lage eller ødelegge et nettsted ved å tiltrekke den rette oppmerksomheten og engasjerende sidebesøkende lenge nok til at de skal lære hva de trenger for å lære eller utføre en bestemt handling som signalerer en "seier" for nettstedet. Ja, når det kommer til et nettsted, kan bilder faktisk være verdt mer enn tusen ord!
Så med betydningen av online-bilder opprettet, la oss nå vurdere hva nettstedet ditt sier om et bilde som skal være på nettstedet, ikke lastes inn? Dette kan skje hvis du har inlinebilder som er en del av HTML- eller bakgrunnsbildene som brukes med CSS (og nettstedet ditt sannsynligvis har begge disse). Bunnlinjen er at når et grafikk ikke laster på en side, gjør det designet ødelagt, og i noen tilfeller kan det helt ødelegge brukeropplevelsen på dette nettstedet. De tusen ordene som bildet sender er absolutt ikke positive!
La oss ta en titt på noen av de vanlige årsakene til at bilder ikke kunne lastes på et nettsted, samt hva du bør være oppmerksom på når du feilsøker dette problemet under testen på nettstedet.
Feil filbaner
Når du legger til bilder på et nettsteds HTML- eller CSS-fil, må du opprette en bane til plasseringen i katalogstrukturen der disse filene ligger. Dette er kode som forteller nettleseren hvor du skal lete etter og hente bildet fra. I de fleste tilfeller vil dette være inne i en mappe som heter "bilder." Hvis banen til denne mappen og filene i den er feil, blir bildene ikke lastet riktig fordi nettleseren ikke vil kunne hente de riktige filene. Det vil følge stien du fortalte det til, men det vil treffe en blindgyde, og i stedet for å vise det riktige bildet vil det komme tomt ut.
Trinn 1 i feilsøking av bildeopplasting er å sørge for at filbanen du har kodet, er riktig. Kanskje du har oppgitt feil katalog eller ikke riktig oppført banen til katalogen. Hvis dette ikke er tilfelle, kan det hende du har et annet problem med den banen. Les videre!
Filnavnene feilstavet
Når du undersøker filbanene for filene, må du også være sikker på at du stavet navnet på bildet riktig. I vår erfaring er feil navn eller feilstavinger den vanligste årsaken til problemer med å laste inn bilder. Husk at nettlesere er svært uforgivende når det gjelder filnavn. Hvis du glemmer et brev ved en feil eller bruker feil bokstav, vil nettleseren ikke se etter en fil som er lik og si, "Åh, du antok sannsynligvis denne, ikke sant?" Nei - hvis filen er stavet feil, selv om den er nær, vil den ikke lastes på siden.
Feil filutvidelse
I enkelte tilfeller kan du ha navnet på filen riktig stavet, men filtypen kan være feil. Hvis bildet ditt er en .jpg-fil, men HTML-en din ser etter en .png, blir det et problem. Pass på at du bruker riktig filtype for hvert bilde, og vær sikker på at du har kalt for samme utvidelse i nettstedets kode.
Se også etter sårfølsomhet. Hvis filen din slutter med .JPG, med bokstavene alle i caps, men koden referanser .jpg, alle små bokstaver, er det visse webservere som vil se at de to er forskjellige, selv om de er de samme settene med bokstaver. Case følsomhet teller! Derfor lagrer vi alltid filene våre med små bokstaver. Hvis du gjør det, kan vi alltid bruke små bokstaver i vår kode, og eliminere et mulig problem vi kunne ha med våre bildefiler.
Filer mangler
Hvis stiene til bildefilene dine er riktige, og navnet og filutvidelsen også er feilfri, er det neste elementet som skal kontrolleres, at filene faktisk er lastet opp til webserveren. Forsinkelse å laste opp filer til den serveren når et nettsted lanseres er en vanlig feil som er lett å overse.
Hvordan løser du dette problemet? Last opp disse bildene, oppdater websiden din, og den skal umiddelbart vise filene som forventet. Du kan også prøve å slette bildet på serveren og laste det opp på nytt. Det kan virke rart, men vi har sett dette arbeidet mer enn en gang. Noen ganger blir filene skadet, så denne "slett og erstatt" -metoden kan ende med å hjelpe.
Nettstedet hvor bildene er ned
Du vil vanligvis være vert for alle bilder som nettstedet ditt bruker på din egen server, men i noen tilfeller kan du bruke bilder som er vert andre steder. Hvis den websiden som hoster bildet går ned, vil bildene dine ikke laste inn heller.
Overføringsproblem
Enten en bildefil er lastet fra et eksternt domene eller fra egen side, er det alltid en sjanse for at det kan være et overføringsproblem for den filen når den først blir bedt om av nettleseren. Dette bør ikke være en vanlig forekomst (hvis det er, må du kanskje se etter en ny hostingleverandør), men det kan skje fra tid til annen.
Den uheldige siden av dette problemet er at det egentlig ikke er noe du kan gjøre med det, siden det er et problem utenfor din kontroll. Den gode nyheten er at det er et midlertidig problem som ofte løses ganske raskt. For eksempel, når noen ser en ødelagt side og oppdaterer den, vil det alene ofte løse problemet og laste bildene riktig. Hvis du ser et ødelagt bilde, oppdater du nettleseren for å se om det kanskje bare var et overføringsproblem på din første forespørsel.
Et par siste notater
Når du tenker på bilder og laster bekymringer, er to ting du må huske på, riktig bruk av ALT-tagger og din nettsidehastighet og generelle ytelse.
ALT, eller "alternativ tekst", er koder det som vises av en nettleser hvis et bilde ikke laster inn. De er også en viktig komponent i å skape tilgjengelige nettsteder som kan brukes av personer med visse funksjonshemninger. Alle inline-bilder på nettstedet ditt bør ha en passende ALT-tag. Vær oppmerksom på at bilder som er brukt med CSS ikke har denne attributtet.
Når det gjelder ytelse på nettstedet, laster du for mange bilder, eller til og med bare noen få gigantiske bilder som ikke er riktig optimalisert for weblevering, vil ha en negativ innvirkning på lasthastigheten. Av denne grunn må du teste effekten av bilder som du bruker i nettstedets design, og ta noen skritt som er nødvendige for å forbedre ytelsen til nettstedet, samtidig som du oppretter det generelle utseendet som passer for ditt nettstedsprosjekt.
