SEO & Discoverability

Miten kirjoittaa kuvien tiedostonimiä, jotka tukevat SEOa ja saavutettavuutta

Käytännöllinen nimeämiskäytäntö verkkokuville: kuvaava, vakaa, ihmisen luettavissa eikä täyteen avainsanoja ahdettu.

The Wux Webtools Team The Wux Webtools Team 8 min lukemista Tekoälyavusteinen, ihmisen tarkistama
Organized image thumbnails with file labels, an accessibility symbol, and a search magnifier on a desk.
Sisällysluettelo
  1. Kuvien tiedostonimillä on merkitystä, mutta ei niin paljon kuin usein väitetään
  2. Lyhyt sääntö
  3. Mitä hyvä kuvan tiedostonimi tekee SEOlle
  4. Mitä hyvä kuvan tiedostonimi tekee saavutettavuudelle
  5. Käytännöllinen nimeämiskäytäntö
  6. Käytä yhdysmerkkejä, pieniä kirjaimia ja tavallisia sanoja
  7. Pidä tiedostonimet lyhyinä mutta älä epämääräisinä
  8. Älä ahda kuvien tiedostonimiin avainsanoja
  9. Sovita tiedostonimi todelliseen kuvaan
  10. Erota tiedostonimet alt-tekstistä
  11. Kuvien nimeäminen eri sivustotyypeille
  12. Verkkokauppa
  13. Blogit ja toimitukselliset sivustot
  14. SaaS ja dokumentaatio
  15. Paikalliset yritykset
  16. Entä kuvien mitat ja versiot?
  17. Nopea tarkistuslista ennen julkaisua
  18. Hiljainen hyöty: paremmat tiimit

Kuvien tiedostonimillä on merkitystä, mutta ei niin paljon kuin usein väitetään

Kuvien tiedostonimet ovat yksi niistä pienistä verkkoyksityiskohdista, joihin liittyy liikaa varmuutta. Jotkut tiimit sivuuttavat ne kokonaan ja julkaisevat tiedostoja kuten IMG_7421.jpg. Toiset muuttavat jokaisen tuotekuvan pieneksi avainsanaesseeksi.

Hyödyllinen keskitie on yksinkertainen: kirjoita tiedostonimiä, jotka kuvaavat kuvan selvästi, auttavat ihmisiä hallitsemaan aineistoja ja antavat hakukoneille hieman lisäkontekstia. Älä odota, että tiedostonimet pelastavat heikon sisällön, puuttuvan alt-tekstin, hitaat kuvat tai sekavan sivun.

Google suosittelee nimenomaisesti käyttämään kuville lyhyitä ja kuvaavia tiedostonimiä. Se on hyvä neuvo. Se on myös rajallinen neuvo. Tiedostonimi on yksi kontekstivihje monien joukossa: ympäröivä teksti, sivun otsikko, strukturoitu data, kuvatekstit, alt-teksti, linkit, kuvan laatu ja se, onko kuva oikeasti hyödyllinen sivulle.

Saavutettavuuden osalta tilanne on samankaltainen. Hyvä tiedostonimi ei korvaa alt-tekstiä. Se voi kuitenkin vähentää haittaa, kun jokin menee pieleen, ja helpottaa toimittajien, kehittäjien ja niiden käyttäjien elämää, jotka lataavat, tallentavat tai jakavat tiedoston.

Lyhyt sääntö

Käytä tiedostonimeä, joka vastaa tähän kysymykseen:

Jos joku näkisi vain tiedostonimen, saisiko hän karkean käsityksen siitä, mitä kuva sisältää?

Hyvä:

  • red-running-shoes-side-view.jpg
  • checkout-error-message-mobile.png
  • oak-dining-table-120cm-walnut.jpg
  • team-planning-workshop-whiteboard.webp

Heikko:

  • IMG_7421.jpg
  • final-final-v3-new.jpg
  • best-cheap-running-shoes-buy-online-discount-sale.jpg
  • screenshot.png

Tavoite ei ole runollisuus. Tavoite on hyödyllinen täsmällisyys.

Mitä hyvä kuvan tiedostonimi tekee SEOlle

Hyvä tiedostonimi auttaa hakukoneita ymmärtämään kuvaa, erityisesti kuvahaun yhteydessä. Se voi vahvistaa sivun aihetta ja visuaalisen sisällön kohdetta.

Se on kuitenkin heikko signaali perusasioihin verrattuna:

  • Kuva on asiaankuuluvalla sivulla.
  • Ympäröivä teksti selittää tai tukee kuvaa.
  • Kuvalla on tarvittaessa sopiva alt-teksti.
  • Kuva on hakukoneiden indeksoitavissa.
  • Tiedosto ei ole tarpeettoman suuri.
  • Sivu latautuu luotettavasti.

Jos korjaat kuvia orgaanista hakua varten, aloita sivun relevanssista ja hyödyllisyydestä. Siisti sen jälkeen tiedostonimet. Tarkastele sitten pakkausta, formaatteja, mittoja, laiskaa latausta ja strukturoitua dataa silloin, kun se on tarkoituksenmukaista. Oppaamme kuvaformaateista vuonna 2026 on hyödyllinen rinnakkaislukemisto, jos nimeämisen siivous laajenee kuvien suorituskykykierrokseksi.

Mitä hyvä kuvan tiedostonimi tekee saavutettavuudelle

Tarkkaan ottaen tiedostonimet eivät ole kuvien tärkein saavutettavuusmekanismi. Alt-teksti on.

Jos kuva välittää tietoa, alt-attribuutin tulisi tarjota tekstivastine. Jos kuva on koristeellinen, alt-attribuutin tulisi yleensä olla tyhjä: alt="". Jos kuva on linkki tai painike, vaihtoehtoisen tekstin tulisi kuvata toimintoa tai kohdetta, ei pelkkiä pikseleitä.

Käsittelimme tätä yksityiskohtaisesti käytännönläheisessä oppaassa kuvien alt-teksteihin vuonna 2026, ja alt-tekstiä kannattaa pitää erillisenä toimituksellisena tehtävänä.

Miksi tiedostonimistä pitäisi siis välittää saavutettavuuden kannalta lainkaan?

Koska tiedostonimet nousevat usein esiin käyttökokemuksen reuna-alueilla:

  • Jotkin avustavan teknologian ja selaimen yhdistelmät saattavat näyttää tiedostonimen, kun alt-teksti puuttuu.
  • Ladatut kuvat tarvitsevat ymmärrettävät nimet verkkosivun ulkopuolella.
  • CMS:n mediakirjastoja on helpompi auditoida, kun nimet ovat kuvaavia.
  • Toimittajat liittävät epätodennäköisemmin väärän kuvan, kun tiedostot on nimetty selvästi.
  • Rikkoutuneita kuvia ja virheenkorjausnäkymiä on helpompi tulkita.

Tiedostonimi ei tee saavuttamattomasta kuvasta saavutettavaa. Huono tiedostonimi voi kuitenkin tehdä virhetilanteista sekavampia.

Käytännöllinen nimeämiskäytäntö

Käytä tätä oletusmallia:

subject-detail-context.ext

Esimerkkejä:

  • espresso-machine-steam-wand-closeup.jpg
  • pricing-table-enterprise-plan-desktop.png
  • garden-chair-green-metal-front-view.webp
  • password-reset-email-example.png

Tuotteille hieman rakenteisempi versio toimii usein paremmin:

brand-product-model-color-view.ext

Esimerkkejä:

  • acme-trail-jacket-blue-front.jpg
  • northline-desk-lamp-brass-side.webp
  • terra-ceramic-mug-white-top-view.jpg

Toimituksellisille kuville:

topic-specific-scene.ext

Esimerkkejä:

  • remote-team-video-call-laptop.jpg
  • city-bike-lane-rain-evening.jpg
  • developer-debugging-http-headers-terminal.png

Käyttöliittymän kuvakaappauksille:

feature-state-device.ext

Esimerkkejä:

  • checkout-validation-error-mobile.png
  • account-settings-two-factor-enabled-desktop.png
  • analytics-dashboard-empty-state-tablet.png

Tässä ei ole kyse jäykästä taksonomiasta. Kyse on epäselvyyden poistamisesta.

Käytä yhdysmerkkejä, pieniä kirjaimia ja tavallisia sanoja

Julkisille verkkosisällöille suosi:

  • Pieniä kirjaimia
  • Yhdysmerkkejä sanojen välissä
  • Ei välilyöntejä
  • Ei alaviivoja
  • Ei välimerkkejä yhdysmerkkejä lukuun ottamatta
  • Ei erikoismerkkejä, ellei järjestelmäsi niitä edellytä

Hyvä:

blue-cotton-shirt-front.jpg

Vältä:

Blue Cotton Shirt (Front).jpg

blue_cotton_shirt_front.jpg

bluecottonshirtfront.jpg

Yhdysmerkit ovat helpompia lukea, helpompia kopioida ja laajalti ymmärrettyjä sanojen erottimina URL-osoitteissa. Pienet kirjaimet myös ehkäisevät ärsyttäviä kirjainkokoriippuvaisia virheitä paikallisen kehitysympäristön, Linux-palvelinten, CDN:ien ja objektitallennuksen välillä.

Pidä tiedostonimet lyhyinä mutta älä epämääräisinä

Tiedostonimen tulisi olla riittävän pitkä kuvaamaan kuvaa ja riittävän lyhyt pysyäkseen luettavana.

Hyödyllinen pituus on yleensä 3–8 sanaa ennen tiedostopäätettä.

Liian epämääräinen:

shoes.jpg

Parempi:

red-running-shoes-side-view.jpg

Liikaa:

best-lightweight-red-running-shoes-for-marathon-training-side-view-discount.jpg

Parempi:

red-marathon-running-shoes-side-view.jpg

Jos ilmaus kuulostaa epätoivoisen markkinoijan kirjoittamalta hakukyselyltä, se on luultavasti liian pitkä.

Älä ahda kuvien tiedostonimiin avainsanoja

Avainsanojen tunkeminen tiedostonimiin on yleensä merkki siitä, ettei sivu tee tehtäväänsä.

Huono:

best-seo-agency-seo-services-seo-consultant-seo-company.jpg

Tämä ei auta käyttäjiä. Se ei auta toimittajia. Se ei ole vakavasti otettava saavutettavuuskäytäntö. Se saa myös sivustosi näyttämään heikkolaatuisemmalta.

Käytä kuvassa näkyvän asian luonnollista nimeä. Jos avainsana sopii, koska se kuvaa kuvaa täsmällisesti, käytä sitä. Jos ei, jätä se pois.

Jos kuva on esimerkiksi valokuva mustasta nahkasohvasta, black-leather-sofa-three-seat.jpg on hyvä. best-modern-luxury-living-room-furniture-online.jpg ei ole tiedostonimi; se on avunhuuto.

Sovita tiedostonimi todelliseen kuvaan

Tämä kuulostaa itsestään selvältä, mutta kuvakirjastot ajautuvat ajan myötä. Tiedosto nimeltä homepage-hero-new.jpg saattaa lopulta esittää eri tuotetta, eri henkilöä tai täysin eri kampanjaa.

Siitä syntyy kaksi ongelmaa.

Ensinnäkin hakukoneet ja käyttäjät saavat ristiriitaisia signaaleja. Toiseksi tiimit lakkaavat luottamasta mediakirjastoon.

Jos kuvan merkitys muuttuu, nimeä se uudelleen ennen julkaisua. Jos CMS tai CDN tekee uudelleennimeämisestä vaikeaa, harkitse vakaiden sisäisten aineistotunnisteiden käyttöä ja luo silti kuvaavia julkisia tiedostonimiä siellä, missä se on mahdollista.

Hyvä sisäinen työnkulku voisi olla:

  1. Lataa alkuperäinen aineisto.
  2. Poista tarpeeton metadata, jos yksityisyydellä on merkitystä.
  3. Nimeä sivustolla käytettävä johdannainen uudelleen.
  4. Vie se oikeissa mitoissa ja oikeassa formaatissa.
  5. Lisää alt-teksti ja kuvatekstit CMS:ssä.

Jos kuvat tulevat käyttäjiltä, henkilöstöltä tai kenttätiimeiltä, muista, että tiedostonimet ovat vain yksi yksityisyyden pinta. EXIF-data voi sisältää aikaleimoja, kameratietoja ja sijaintitietoja. Katso oppaamme EXIF-metadatan poistamisesta ennen kuvien jakamista verkossa ennen arkaluonteisten kuvien julkaisemista.

Erota tiedostonimet alt-tekstistä

Yleinen virhe on käyttää samaa ilmausta tiedostonimessä ja alt-tekstissä.

Joskus se on hyväksyttävää. Usein se on laiskaa.

Tiedostonimi:

red-running-shoes-side-view.jpg

Hyvä alt-teksti tuotesivulla:

Red running shoe shown from the side, with a white foam sole and black laces.

Hyvä alt-teksti värivalitsimen pikkukuvassa:

Red

Hyvä alt-teksti, jos kuva on koristeellinen:

alt=""

Tiedostonimi tunnistaa aineiston. Alt-teksti palvelee käyttäjää kontekstissa. Ne ovat toisiinsa liittyviä tehtäviä, eivät sama tehtävä.

Kuvien nimeäminen eri sivustotyypeille

Verkkokauppa

Sisällytä tuotetyyppi, tärkeä variantti ja kuvakulma.

Esimerkkejä:

  • linen-shirt-white-front.jpg
  • linen-shirt-white-back.jpg
  • linen-shirt-white-collar-detail.jpg

Vältä hintojen, kampanjoiden tai väliaikaisen kampanjakielen lisäämistä. Ne muuttuvat liian usein.

Blogit ja toimitukselliset sivustot

Kuvaa näkymää tai käsitettä, älä artikkelin otsikkoa.

Hyvä:

designer-reviewing-mobile-layout.jpg

Vähemmän hyödyllinen:

ultimate-guide-to-mobile-ux.jpg

Kuvaa voidaan käyttää uudelleen, rajata tai syndikoida. Näkymään perustuva nimi vanhenee paremmin.

SaaS ja dokumentaatio

Nimeä kuvakaappaukset ominaisuuden, tilan ja alustan mukaan.

Esimerkkejä:

  • billing-settings-payment-method-empty-state.png
  • project-dashboard-filter-menu-open.png
  • api-token-created-confirmation-modal.png

Tämä tekee dokumentaation päivittämisestä paljon vähemmän kivuliasta.

Paikalliset yritykset

Käytä palvelua, kohdetta tai sijaintia silloin, kun se todella näkyy kuvassa ja on relevantti.

Esimerkkejä:

  • bakery-window-display-sourdough-loaves.jpg
  • dental-clinic-reception-area-berlin.jpg
  • plumber-repairing-kitchen-sink.jpg

Älä lisää kaupunkien nimiä jokaiseen tiedostoon, jos kuva ei tue sitä. Kuva jakoavaimesta ei ole merkityksellisesti wrench-london.jpg.

Entä kuvien mitat ja versiot?

Vältä mittojen lisäämistä pääasialliseen kuvaavaan nimeen, ellei järjestelmäsi tarvitse sitä.

Parempi aineistoperhe:

  • red-running-shoes-side-view.jpg
  • red-running-shoes-side-view-800w.jpg
  • red-running-shoes-side-view-1600w.jpg

Jos rakennusjärjestelmäsi luo responsiiviset variantit automaattisesti, anna sen lisätä leveydet tai tiivisteet. Älä ylläpidä käsin kymmeniä tiedostonimiä, ellet nauti tulevaisuuden arkeologiasta.

Sisältötiivisteet sopivat hyvin välimuistitukseen:

red-running-shoes-side-view.a8f31c.webp

Kuvaava osa on edelleen mukana. Tiiviste palvelee konetta.

Nopea tarkistuslista ennen julkaisua

Ennen kuvan julkaisemista kysy:

  • Kuvaako tiedostonimi kuvaa selkeällä kielellä?
  • Onko se pienillä kirjaimilla ja yhdysmerkein erotettu?
  • Onko se vapaa avainsanojen tunkemisesta?
  • Välttääkö se väliaikaisia sanoja kuten new, final tai v2?
  • Onko alt-teksti järkevä sivun kontekstissa?
  • Ovatko tiedostomuoto ja koko sopivia?
  • Onko arkaluonteinen metadata poistettu tarvittaessa?

Jos voit vastata näihin kyllä, tiedostonimi on todennäköisesti riittävän hyvä. Älä käytä 20 minuuttia koristeellisen jakajan nimeämiseen. Käytä 20 sekuntia estääksesi sitä, että DSC0038.jpg muuttuu pysyväksi julkiseksi URL-osoitteeksi.

<!-- tool-cta:start -->

💡 Kokeile tätä: Normalisoi tiedostonimet erissä lowercase-kebab-case-muotoon Case Converter -työkalulla, jotta kuviesi nimet pysyvät yhtenäisinä koko projektissa.

<!-- tool-cta:end -->

Hiljainen hyöty: paremmat tiimit

Kuvien tiedostonimien SEO-arvo on maltillinen. Operatiivinen arvo on suurempi.

Hyvät tiedostonimet tekevät mediakirjastoista haettavia. Ne vähentävät päällekkäisiä latauksia. Ne auttavat suunnittelijoita, kehittäjiä, markkinoijia ja tukitiimejä puhumaan samasta aineistosta avaamatta kuutta esikatselua. Ne nopeuttavat auditointeja.

Tämä on todellinen syy kuvien nimeämisen standardointiin. Selkeys hyödyttää hakukoneita, mutta myös ihmisiä. Ja yleensä työ hajoaa ensin ihmisten kohdalla.

Usein kysytyt kysymykset

Vaikuttavatko kuvien tiedostonimet oikeasti SEOon?
Kyllä, mutta maltillisesti. Google suosittelee kuvaavia tiedostonimiä, koska ne auttavat tarjoamaan kontekstia erityisesti kuvahaussa. Ne eivät korvaa relevanttia sisältöä, hyödyllistä alt-tekstiä, indeksoitavia sivuja ja hyvää kuvien suorituskykyä.
Pitäisikö minun nimetä sivustoni vanhat kuvat uudelleen?
Nimeä arvokkaat kuvat uudelleen, jos nykyiset nimet ovat epämääräisiä tai harhaanjohtavia, mutta käsittele URL-osoitteita huolellisesti. Jos kuvan URL muuttuu, päivitä viittaukset ja harkitse uudelleenohjauksia silloin, kun vanhat kuvien URL-osoitteet saavat liikennettä tai niihin on takalinkkejä.
Ovatko yhdysmerkit parempia kuin alaviivat kuvien tiedostonimissä?
Yhdysmerkit ovat turvallisempi käytäntö julkisille verkkotiedostonimille. Ne ovat luettavia, URL-ystävällisiä ja niitä käsitellään laajalti sanojen erottimina. Pienillä kirjaimilla kirjoitetut ja yhdysmerkein erotetut tiedostonimet vähentävät myös alustojen välisiä tiedostopolkuongelmia.
Voinko käyttää samaa tekstiä tiedostonimessä ja alt-tekstissä?
Joskus, mutta älä tee siitä automaattista. Tiedostonimi tunnistaa aineiston; alt-teksti kuvaa kuvan tarkoitusta sivukontekstissa. Tuotteen tiedostonimi voi olla yleinen, kun taas alt-teksti voi tarvita yksityiskohtia, toiminnon tai tyhjän arvon, jos kuva on koristeellinen.
Pitäisikö tiedostonimien sisältää avainsanoja?
Vain silloin, kun avainsana kuvaa kuvaa luontevasti. Tiedosto nimeltä `black-leather-sofa-front.jpg` on hyödyllinen. Tiedosto nimeltä `best-cheap-luxury-sofa-buy-online.jpg` on avainsanojen tunkemista, ja sitä tulisi välttää.

Lähteet ja lisälukeminen

  1. Google Search Central: Image SEO best practices
  2. W3C Web Accessibility Initiative: Alt Decision Tree
  3. MDN Web Docs: The Image Embed element
  4. WebAIM: Alternative Text
Tietoja kirjoittajasta
The Wux Webtools Team

Viimeksi päivitetty:

Jatka lukemista