De la Lightroom la WordPress Cum puteți crea imagini SEO optimizate

WordPress este o bucată de software care are puteri de până la 25% din site-urile Web. Site-uri majore precum The New York Times, CNN și Forbes utilizează WordPress pentru a-și propulsa site-urile web.

Ce este WordPress pentru dezvoltatorii web, Adobe Lightroom este pentru fotografi. În acest tutorial veți învăța cum să utilizați împreună aceste două instrumente puternice. Veți învăța cum să faceți imaginile de la Lightroom și într-un site condus de WordPress rapid și ușor. Cel mai important, o vom face într-un mod care este prietenos cu SEO, astfel încât imaginile dvs. să fie descoperite.

Image SEO pentru începători

Optimizarea motoarelor de căutare (cunoscută și sub numele de SEO) este un set de practici intermediare de proiectare, publicare și gestionare a datelor care ajută la găsirea paginilor web. Adevărul este că nu există nici o magie pentru SEO atunci când vine vorba de imagini. Totul se reduce la adăugarea de context imaginilor dvs. într-un mod care are sens la calculatoare.

Informații Semantice

Gândiți-vă la acest lucru: introduceți o interogare de căutare în motorul de căutare dorit. Motorul de căutare vă arată o listă de pagini care se potrivesc cu ceea ce reprezintă crede te uiti dupa. Motoarele de căutare utilizează programe crawlere-computere și algonitmete - care explorează în mod automat web-ul și construiesc listele de site-uri care se potrivesc cu cuvintele cheie. 

Un motor de căutare poate spune că imaginile se află pe o pagină web, dar nu poate determina cu ușurință ce este o imagine, așa că trebuie să o completăm cu date suplimentare, așa încât poate sa a intelege. Acest tip de date se numește informație semantică: este o informație care ajută la construirea sensului pentru fotografiile individuale în context reciproc și în restul paginii web. Utilizăm câmpuri de metadate pentru a transmite aceste date sematice.

Google arată unele dintre ele Etichete ascuns în HTML pentru a găsi imagini. Putem adăuga lucruri de genul titluri, Etichete, și Alt text în codul site-ului nostru pentru a ajuta un motor de căutare să indexeze site-ul nostru cât mai ușor posibil. Nu există nicio garanție că prin adăugarea de informații sematice veți putea să vă mutați site-ul pe prima pagină a rezultatelor Google, însă luarea câtorva pași de bază SEO vă poate ajuta cu siguranță la șansele dumneavoastră. Este de asemenea o bună igienă a datelor!

Iată patru piese cheie ale informațiilor de optimizare SEO pentru a adăuga imaginile dvs.:

Numele fișierelor

Dacă nu faceți altceva, asigurați-vă că redenumiți imaginile într-un mod care le descrie. Un nume de fișier simplu precum "resizing-images-tutorial.jpg" reprezintă o îmbunătățire masivă față de "IMG_9052.cr2". Folosirea unui nume de fișier cu câteva cuvinte care îl descriu va îmbunătăți șansele de a fi găsit.

Atunci când exportați din Lightroom, modul meu preferat de a face acest lucru este de a utiliza "Denumirea fișierelor" din fereastra de export. Rețineți că dorim să redenumiți imaginea exportată, nu fișierul original. Găsi File Naming și verificați Redenumiți la cutie. Apoi alegeți o opțiune dropdown care include "nume personalizat" astfel încât să putem adăuga propriul nostru text personalizat.

Ultimul pas este să adăugați textul personalizat. Pentru web, este mai bine să separați cuvintele într-un nume de fișier utilizând liniuțe în loc de spații. Personalizați numele fișierului pentru a obține cele mai bune rezultate. 

Utilizați o opțiune de nume personalizat pentru a da șabloanelor dvs. mai multe șanse de a fi găsite. Câteva cuvinte care descriu conținutul unei imagini au un drum lung!

Alt text

Text alternativ sau "alt text" este folosit pentru a furniza o descriere text a conținutului unei imagini. Amintiți-vă că un motor de căutare nu poate determina ce este într-o imagine (încă), așa că trebuie să o ajutăm prin utilizarea alt text.

Probabil nu veți mai vedea alt text; partea importantă este că un motor de căutare va.
Alt text al unei imagini trebuie setat și în HTML. Alt text trebuie să descrie pe scurt imaginea. Putem seta acest text alt în WordPress Media Library, iar WordPress îl va adăuga automat.

Alt text este plasat în același bit de HTML care conține imaginile. Utilizați-l pentru a adăuga o descriere a imaginii. O scurtă descriere a conținutului unei imagini este esențială pentru prietenia cu SEO. Dacă scrieți codul nu sunteți chestii, nu vă faceți griji; vom examina cum să adăugăm acest alt text utilizând WordPress în următoarea secțiune a acestui ghid.

Având alt text pentru imaginile dvs. este, de asemenea, crucial pentru persoanele cu deficiențe de vedere. Ecranul de citire software conceput pentru a ajuta pe cei care au pierderea totală sau parțială a vederii va citi alt text în locul unei imagini. Colegiul Amherst are un ghid excelent pentru optimizarea paginilor dvs. web pentru accesibilitate.

titlurile

Titlul unei imagini trebuie să fie de asemenea conținut în eticheta HTML. Titlul ar trebui să fie o versiune mai scurtă a descrierii, cu doar câteva cuvinte care semnalează conținutul unei imagini.

De asemenea, trebuie să setați un titlu de imagine în HTML cu eticheta "title =" din același bloc de imagini. Din nou, WordPress face acest lucru ușor de adăugat.

Titlurile reprezintă o altă piesă a puzzle-ului pentru a ajuta motoarele de căutare să indexeze site-ul nostru. WordPress conține un câmp de titlu care va ajuta eforturile noastre SEO.

legende

Gândiți-vă la o legendă ca la textul care apare imediat după o imagine care oferă comentarii suplimentare. Titlurile nu sunt adăugate direct la o etichetă de imagine direct, dar cu siguranță o suplimentează. În HTML5,

eticheta face parte din
grup, care este chiar mai bine. Puteți afla mai multe despre cum să scrieți subtitrări eficiente în Dawn Oosterhoff's Titlu, Descriere, Titlu, ALT: Cum să adăugați informații semantice la imagini. Scriso subtitrare puternică este una dintre cele mai subevaluate abilități, una folositoare pentru fiecare fotograf!

Maparea metadatelor de la Lightroom la WordPress

Acum, că înțelegem pilonii imaginii SEO, să ne uităm cum să le adăugăm cu ușurință și rapid la site-ul nostru condus de WordPress. Putem continua o imagine titlu și legendă de la catalogul nostru Lightroom la WordPress.

În Lightroom Bibliotecă modul, găsiți metadate panou pe partea dreaptă. Puteți vedea titlul și titlul imaginii. 

Când exportați o imagine din Lightroom, asigurați-vă că includeți "toate metadatele."Aceasta va asigura că titlul și titlul sunt salvate în imaginea JPEG și vor fi citite și incluse de WordPress.

Asigurați-vă că atunci când exportați o imagine, includeți metadatele în fișier. Acest lucru va face metadatele disponibile în WordPress.

Încărcați în WordPress

Odată ce ați exportat un fișier imagine bine denumit cu un titlu și set de legendă, sunteți gata să îl încărcați în WordPress. Du-te la WordPress Biblioteca media și încărcați această imagine în mod normal. Imaginea încărcată va avea același titlu și titlul pe care l-am setat în panoul de metadate Lightroom!

În cele din urmă, roadele muncii noastre! Titlul și legenda pe care noi

Va trebui să adăugați manual alt text imaginilor odată ce ajung la WordPress. Din păcate, în Lightroom nu există un câmp care să găsească un "text alternativ" în WordPress. Rețineți că acesta este textul ascuns în codul HTML care va ajuta motoarele de căutare să găsească și să indexeze imaginile noastre.

Alt text va trebui să fie adăugat la imagini din Biblioteca Media WordPress.

După ce ați setat alt text, apăsați Actualizați pentru a salva imaginea. Când îl inserați într-un post sau într-o pagină, WordPress va efectua metadatele și va include metadatele pe care le-am adăugat în codul HTML.

Acești pași reprezintă un ajutor major pentru optimizarea unei imagini pentru web. De asemenea, putem merge mai departe prin redimensionarea și comprimarea imaginilor pentru web.

Redimensionarea pentru Web

Obținerea imaginilor gata pentru web este mai mult decât să le încărcați cu cuvinte cheie și să le abandonați în WordPress. De asemenea, trebuie să ne gândim la mărimea și dimensiunile fișierului. Amintiți-vă că o mare parte din populația conectată la internet nu este suficient de norocoasă pentru a avea o conexiune de bandă largă și ar trebui să luăm în considerare și experiența acestora.

mobiForge a scris recent că dimensiunea medie a fișierului web este mai mare decât întregul joc video Doom din 1993 clasic. Acest lucru nu este în mod inerent un lucru rău, dar este o mare amintire că paginile web sunt mai pline de imagini multimedia și de mari decât au fost vreodată. Acesta servește ca o mare amintire că trebuie să optimizăm mereu dimensiunile fișierelor de imagine. 

Când suntem gata să trimitem imagini pe web, există doi factori-cheie care se pot optimiza pentru: dimensiuni și calitate. Să ne uităm la cum să ne perfecționăm ambele.

Dimensiuni

Dimensiunile unei imagini digitale sunt lungimea și lățimea imaginii, măsurate în pixeli. O imagine despre care se spune că este "600 x 400 pixeli" se deduce a fi de 600 de pixeli latime și 400 de pixeli în înălțime. 

Imaginile captate cu Canon 6D sunt de 5472 x 3648 pixeli. Până când le veți vedea pe Tuts +, ei vor fi constrânși în aspect la 850 de pixeli pe latura lungă. Teoretic, aș putea încărca imaginea completă, dar indiferent de ce va apărea la maxim 850 de pixeli. 

Acest efect este exact de ce îmi redimensionez întotdeauna imaginile într-un format web-friendly. Telespectatorii mei nu dispun de monitoare care să arate fiecare pixel, deci este suficient să redimensionați imaginea și să salvați timpul de încărcare.

Această simulare ilustrează cât de mare este o imagine originală de 10 megapixeli față de modul în care va apărea pe web. Previzualizarea mare a imaginii pe care o vedeți este versiunea scalată a imaginii complete, de 10 megapixeli pe care am capturat-o. În inset, dimensiunea a fost comparată cu modul în care apare pe Tuts +. O imagine de 10 megapixeli cu o lățime întreagă are o lățime de peste 4000 de pixeli, în timp ce apare în articolele Tuts + la doar 850 de pixeli pe latura lungă. Aceasta este o ilustrare excelentă a motivului pentru care redimensionarea este atât de importantă.

Care sunt dimensiunile corecte pentru o imagine de pe web? Răspunsul este că "depinde de locul în care merge." Dacă utilizați WordPress, verificați documentația pentru tema pentru lățimea imaginii acceptată. Dezvoltatorul determină modul în care imaginile vor apărea într-o temă WordPress. Dacă documentația nu este disponibilă, încercați un site ca PiliApp să faceți propriile măsurători pe o imagine de pe site-ul pe care îl veți publica.

Calitate

Imaginile de înaltă calitate utilizează mai mult spațiu pe disc. Cu cât imaginea este mai detaliată și mai colorată, cu atât este mai mare fișierul. Deși arhiva noastră de imagini ar trebui să includă aceste imagini de calitate completă, pregătirea unei imagini pentru web înseamnă a face compromisuri între calitate și dimensiunea fișierului. Oferirea unui pic de calitate duce la o încărcare mult mai rapidă pentru spectator.

Când exportați în Lightroom, puteți utiliza Calitate pentru a ajusta calitatea de ieșire a unei imagini. Este o scară de la 0 la 100, cu o imagine de calitate 0, care oferă cea mai mică dimensiune a fișierului. O imagine de 100 de culori maximizează atât calitatea, cât și dimensiunea fișierului.

Această comparație a calității imaginii arată o anumită diferență subtilă între diferitele setări de calitate. Unele diferențe pot fi observate în detaliile mai fine, precum și în culorile de pe cer. Rețineți că în imaginea de cea mai mică calitate, există unele "banding" pe cer (linii subtile) în timp ce imaginile de o calitate superioară. Imaginea de 25 de calitate mi-a dat o imagine de 91kb, în ​​timp ce 100 de imagini de calitate era o imagine de 366kb. Este vorba despre găsirea echilibrului de calitate și a dimensiunii fișierului.

Una dintre modalitățile mele preferate de a controla dimensiunea fișierului este să utilizez "Limitați dimensiunea fișierului la" opțiuneFolosesc frecvent această opțiune când exportesc imagini pentru publicare pe Tuts +, având în vedere că Tuts + are o limită de 150 kilobytes pentru imagini în articole.

Utilizarea opțiunii "Dimensiune fișier limitat la" depășește complet cursorul de calitate. În loc să alegeți o calitate între 0 și 100, puteți seta pur și simplu o dimensiune maximă a fișierului (în kilobytes) și Lightroom va alege o setare de calitate pentru dvs..

În locul casetei de culori, poate fi folosită caseta "Dimensiune fișier limitat". Când bifați caseta din fereastra de export, alegeți dimensiunea maximă a imaginii dvs. și Lightroom o va face să funcționeze.

Din experiența mea, când folosesc cursorul de calitate pentru imagini web, în ​​mod obișnuit voi lăsa setarea de calitate în 60-75 gamă. Acest lucru pare a fi locul dulce pentru dimensiunea fișierului și calitatea imaginii. Creșterea cursorului mult dincolo de acesta duce la obținerea unui fișier mult mai mare, fără prea multe diferențe vizuale.

Dacă doriți să aflați mai multe despre cheile pentru redimensionarea imaginilor pentru web, consultați descrierea mea de anul trecut, Cum se exportă JPG-uri pentru Web din Adobe Photoshop Lightroom. În timp ce accentul acestui tutorial este metadatele pentru SEO, dimensiunea imaginii este încă o parte esențială a faptului că este ușor de găsit. 

Recaptați și păstrați învățarea

În acest tutorial, am descoperit modul de alegere a fructelor cu agățare scăzută pentru exportarea imaginilor de la Lightroom pe un site WordPress. Nu faceți nici o greșeală; acest lucru nu va trage instantaneu site-ul dvs. în partea de sus a Google pentru termeni comuni, dar aceasta voi mergeți mult în a ajuta pe cineva să vă găsească imaginile.

Merită menționat faptul că există mai multe pluginuri WordPress sau add-on-uri, care pot automatiza acest proces. Cu toate acestea, pluginurile care nu sunt actualizate frecvent pot deschide site-ul pentru vulnerabilitățile de securitate. De asemenea, trebuie să conta pe un dezvoltator care să mențină compatibilitatea plugin-ului cu noile versiuni ale WordPress. Două pluginuri populare includ WP / LR Sync și LR / Blog.

Dacă doriți să aflați mai multe despre WordPress, secțiunea de cod Tuts + are o mulțime de conținut pentru modificarea și extinderea WordPress. Secțiunea pentru fotografii și video are, de asemenea, o acoperire extensivă a Adobe Lightroom dacă doriți să vă îmbunătățiți aceste abilități.

În cele din urmă, SEO este o zonă în continuă schimbare de cercetare. Google își actualizează în mod constant algoritmul folosit pentru a găsi cele mai bune pagini pe care le consideră potrivite pentru interogarea de căutare. Există o mulțime de sfaturi proaste și "sfaturi" pentru SEO acolo. Mergi-sursa mea pentru SEO este blog-ul Moz. Geniile de la Smashing Magazine au, de asemenea, o mare poveste despre modul de a construi un site SEO optimizat.

Ce faci pentru ca imaginile tale să fie pregătite pentru web? Anunță-mă în secțiunea de comentarii.