Unlimited AE and Premiere Pro templates, videos & more! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Photo & Video
  2. Metadata
Photography

Da Lightroom a WordPress: come creare immagini ottimizzato per SEO

by
Difficulty:IntermediateLength:LongLanguages:
This post is part of a series called Digital Asset Management for Photographers (Learning Resource Guide).
How to Organize Your Photos in WordPress With WP Real Media Library
Getting Started With Photos for OS X

Italian (Italiano) translation by Loris Pizii (you can also view the original English article)

WordPress è un pezzo di software che alimenta tanto quanto il 25% dei siti Web del web. Principali siti Web come The New York Times, CNN, Forbes e tutti utilizzare WordPress per alimentare i loro siti Web.

Che cosa è WordPress agli sviluppatori web, Adobe Lightroom è ai fotografi. In questo tutorial imparerete come utilizzare questi due potenti strumenti insieme. Potrai imparare a prendere le immagini da Lightroom e in un WordPress guidato sito rapidamente e facilmente. La cosa più importante, lo faremo in un modo che è SEO-friendly in modo che le immagini ottenere scoperto.

Immagine SEO per principianti

Search engine optimization (noto anche come SEO) è un insieme di pratiche di gestione progettazione, pubblicazione e dati correlati tra loro che aiutano a pagine web di interesse. La verità è che non c'è davvero alcuna magia SEO quando si tratta di immagini. Tutto si riduce a aggiungere contesto alle immagini in modo che questo ha un senso ai computer.

Informazioni semantiche

Pensare in questo modo: si immette una query di ricerca nel motore di ricerca di vostra scelta. Il motore di ricerca vi propone un elenco di pagine che corrispondono a quello che pensa che stai cercando. Motori di ricerca utilizzano crawler — programmi informatici e algonrhithms — che esplorare il web automaticamente e costruire elenchi di siti che corrispondono alle parole chiave.

Un motore di ricerca può dire che le immagini sono in una pagina Web, ma non può determinare facilmente cosa raffigura un'immagine, quindi abbiamo bisogno di integrare con ulteriori dati, un genere che può capire. Questo tipo di dati viene chiamato informazioni semantiche: di informazioni che aiuta a costruire il significato per singole fotografie nel contesto a vicenda e il resto della pagina Web. Usiamo i campi di metadati per trasmettere questi dati sematic.

Google guarda ad alcuni dei tag nascosti nel nostro HTML per aiutare a trovare immagini. Possiamo aggiungere cose come titoli, tag e testo alt nel codice del nostro sito Web per aiutare un motore di ricerca di indicizzare il nostro sito più facilmente possibile. Non c'è alcuna garanzia che da aggiunta di sematic informating sarete in grado di spostare il tuo sito alla prima pagina dei risultati di Google, ma prendendo alcuni passaggi di base SEO può sicuramente aiutare le tue possibilità. È anche dati solo una buona igiene!

Qui ci sono quattro pezzi chiave di informazioni di ottimizzazione SEO per aggiungere alle vostre immagini:

Nomi dei file

Se non altro, assicurarsi di rinominare le immagini in un modo che li descrive. Un nome di file semplice come "ridimensionamento-immagini-tutorial.jpg" è un miglioramento enorme sopra "IMG_9052.cr2." Utilizzando un nome file con alcune parole che lo descrivono migliorerà la sua probabilità di essere trovati.

Durante l'esportazione da Lightroom, il mio modo preferito per farlo è quello di utilizzare la sezione "Denominazione dei File" della finestra di esportazione. Tenete a mente che vogliamo rinominare l'immagine esportata, non il file originale. Individuare la sezione di denominazione dei File e selezionare la casella Rinomina per. Quindi scegliete un'opzione di menu a discesa che include "nome personalizzato" in modo che possiamo aggiungere il nostro proprio testo personalizzato.

L'ultimo passo è quello di aggiungere del testo personalizzato. Per il web, si consiglia di separare le parole in un nome di file mediante trattini invece degli spazi. Personalizzare il nome del file di ogni immagine per ottenere risultati ottimali.

Custom Name - Sequence
Utilizzare un'opzione di nome personalizzato per dare i nomi di file una migliore possibilità di essere trovati. Poche parole che descrivono il contenuto di un'immagine andare un lungo cammino!

Testo ALT

Testo alternativo, o "alt text", viene utilizzato per fornire una descrizione di testo del contenuto di un'immagine. Ricordate che un motore di ricerca non è possibile determinare che cosa è in un'immagine (ancora) quindi abbiamo bisogno di farne a meno utilizzando testo alt.

Tu probabilmente non vedrai il testo alt; la parte importante è che un motore di ricerca.
Image alt text
Testo alternativo di un'immagine deve essere impostato anche in HTML. Il testo alt dovrebbe descrivere brevemente l'immagine. Possiamo impostare questo testo alt nella Mediateca di WordPress e WordPress lo aggiungerà automaticamente.

Testo ALT è posto nello stesso pezzo di codice HTML che contiene le immagini. Si usa per aggiungere una descrizione dell'immagine. Una breve descrizione del contenuto di un'immagine è fondamentale per SEO-amicizia. Se la scrittura di codice non sei tu sei cosa, nessun problema; vedremo come aggiungere questo testo alt utilizzando WordPress nella prossima sezione di questa guida.

Avere il testo alt per le immagini è anche cruciale per i non vedenti. Software progettato per aiutare coloro che hanno perdita totale o parziale della vista di lettura dello schermo leggerà il testo alt al posto di un'immagine. Amherst College ha un'ottima guida all'ottimizzazione di pagine web per l'accessibilità.

Titoli

Titolo di un'immagine anche deve essere contenuto nel tag HTML. Il titolo dovrebbe essere una versione ancora più breve della descrizione, con solo poche parole che segnalano il contenuto di un'immagine.

Image title text
È anche necessario impostare un'immagine titolo in HTML con il "title =" tag nello stesso blocco di immagine. Ancora, WordPress rende facile aggiungere.

I titoli sono un altro pezzo del puzzle per aiutare i motori di ricerca di indicizzare il nostro sito. WordPress contiene un campo di titolo che aiuterà i nostri sforzi di SEO.

Didascalie

Pensare a una didascalia del testo che mostra immediatamente dopo un'immagine che fornisce ulteriore commento. Le didascalie non vengono aggiunti direttamente a un tag di immagine direttamente, ma certamente integrarla. In HTML5, il <figcaption>tag fa parte del <figure>gruppo, che è ancora meglio.</figure> </figcaption> Si può imparare di più su come scrivere didascalie efficaci nel didascalia, descrizione, titolo di Dawn Oosterhoff, ALT: come aggiungere informazioni semantiche per immagini. Scrivere una didascalia forte è una delle abilità più sottovalutato, uno che è utile per ogni fotografo!

Metadati di mapping da Lightroom a WordPress

Ora che abbiamo capito i pilastri dell'immagine SEO, diamo un'occhiata a come aggiungerli facilmente e rapidamente al nostro sito basato su WordPress. Possiamo portare avanti titolo e didascalia di un'immagine dal nostro catalogo di Lightroom per WordPress.

Nel modulo libreria di Lightroom, è possibile trovare il pannello metadati sul lato destro. Si può vedere il titolo dell'immagine e la didascalia.

Quando si esporta un'immagine da Lightroom, assicurarsi che stai includendo "tutti i metadati." Ciò garantirà che il titolo e la didascalia vengono salvate l'immagine JPEG e saranno leggere e incluso da WordPress.

Include metadata on export
Assicurarsi che quando si esporta un'immagine, è includere i metadati nel file. Questo farà che i metadati disponibili in WordPress.

Caricare su WordPress

Una volta che hai salvato un file di immagine ordinatamente denominata con un set di titolo e didascalia, sei pronto a caricarlo a WordPress. Vai alla Mediateca di WordPress e caricare questa immagine come si farebbe normalmente. L'immagine caricata porterà attraverso lo stesso titolo e didascalia che abbiamo impostato nel pannello Metadati di Lightroom!

Image Uploaded to WordPress
Infine, i frutti del nostro lavoro! Il titolo e la didascalia che noi

È necessario aggiungere manualmente testo alt per le immagini una volta che raggiungono WordPress. Purtroppo, non c'è un campo in Lightroom che esegue il mapping a "testo alternativo" in WordPress. Ricordate che questo è il testo nascosto nel codice HTML che vi aiuterà a motori di ricerca trovare e indicizzare le nostre immagini.

Alt text
Testo ALT dovrà essere aggiunto alle immagini all'interno della libreria di Media di WordPress.

Dopo aver impostato il testo alt, premere Aggiorna per salvare l'immagine. Quando si inserisce un post o una pagina, WordPress sarà portare a compimento i metadati e includono i metadati che abbiamo aggiunto nel codice HTML.

Questi passaggi sono un aiuto importante per l'ottimizzazione di un'immagine per il web. Possiamo anche andare un passo avanti di ridimensionamento e la compressione delle immagini per il web.

Ridimensionamento per il Web

Preparando le immagini per il web è circa più di caricarli con parole chiave e farli cadere in WordPress. Dobbiamo anche pensare alla dimensione del file e dimensioni. Ricorda che una parte enorme della popolazione connesso a internet non è abbastanza fortunata da essere in una grande connessione a banda larga, e dovremmo considerare anche la loro esperienza.

mobiForge ha scritto recentemente che la dimensione del file di pagina Web medio è più grande l'intero 1993 il classico videogioco Doom. Questo non è intrinsecamente un male, ma è un grande richiamo che le pagine Web sono più pieni di immagini multimediale e grandi che siano mai stati. Serve come un grande richiamo che noi dovremmo sempre ottimizzare vostri formati di file immagine.

Quando siamo pronti a inviare immagini sul Web, ci sono due fattori chiave per ottimizzare per: dimensioni e qualità. Diamo un'occhiata a come perfezionare entrambi.

Dimensioni

Le dimensioni di un'immagine digitale sono la lunghezza e la larghezza dell'immagine, misurata in pixel. Un'immagine dice di essere "600 per 400 pixel" si deduce che per essere 600 pixel di larghezza e 400 pixel in altezza.

Le immagini acquisite con la mia Canon 6D sono 5472 x 3648 pixel. Per il momento che li vedete su Tuts, essi sei vincolati nel layout per 850 pixel sul lato lungo. Teoricamente potrei caricare l'immagine completa, ma non importa quello che sta per apparire in un massimo di 850 pixel.

Questo effetto è esattamente perché ho sempre ridimensionare le mie immagini in un formato web-friendly. Miei spettatori non devono di monitor che mostrano ogni singolo pixel, quindi ha senso solo per ridimensionare l'immagine e salvare il tempo di caricamento.

Web Size Simulation
Questa simulazione illustra quanto grande è un'immagine da 10 megapixel originale contro come apparirà sul web. L'anteprima di grande immagine che vedete è una versione in scala della versione completa, 10 megapixel immagine ho catturato. L'inserto, la dimensione è stata confrontata a come appare sul Tuts. Un'immagine da 10 megapixel di interi è oltre 4000 pixel in larghezza, mentre appare in Tuts articoli a soli 850 pixel sul lato lungo. Si tratta di una grande illustrazione di questo ridimensionamento è così importante.

Che cosa è le dimensioni corrette per un'immagine sul web? La risposta è, "dipende dove sta andando." Se stai usando WordPress, consultare la documentazione per il tuo tema per le larghezze di immagine supportati. Lo sviluppatore determina come le immagini appariranno in un tema di WordPress. Se la documentazione non è disponibile, provare un sito come PiliApp a fare le tue misurazioni su un'immagine sul sito che verrà eseguita la pubblicazione.

Qualità

Immagini di alta qualità utilizzano più spazio su disco. Più dettagliata e colorata è un'immagine, più grande sarà il file. Anche se il nostro archivio di immagini dovrebbe includere queste immagini di qualità full, preparare un'immagine per il web significa fare trade-off tra qualità e dimensioni del file. Rinunciare a un po' di qualità conduce ad un tempo di caricamento molto più veloce per lo spettatore.

Quando si esporta in Lightroom, è possibile utilizzare il cursore per regolare la qualità di output di un'immagine. È un 0-100 scala, con un'immagine di qualità 0 rendering di file di dimensioni ridotte. Un'immagine di 100 qualità massimizza le dimensioni del file e qualità.

Image quality comparison
Questo confronto di qualità di immagine mostra qualche sottile differenza tra le varie impostazioni di qualità. Alcune differenze possono essere osservate in dettagli più fini, come pure i colori nel cielo. Si noti che nella minore qualità di immagine, c'è qualche "banding" nel cielo (linee sottili) mentre le immagini di qualità superiore. L'immagine di 25 qualità mi ha dato un'immagine di 91kb, mentre 100 qualità immagine era un'immagine di 366kb. Si tratta di trovare l'equilibrio di qualità e le dimensioni.

Uno dei miei modi preferiti per controllare la dimensione del file consiste nell'utilizzare l'opzione "Limite File Size To". Io uso spesso questa opzione quando Esporta immagini da pubblicare su Tuts, dato che Tuts ha un limite di 150 kilobyte per le immagini negli articoli.

Utilizzando l'opzione "Limite File Size To" bypassa il cursore qualità complessivamente. Invece di scegliere una qualità tra 0 e 100, è possibile semplicemente impostare una dimensione massima (in kilobyte) e Lightroom scegliere un'impostazione di qualità per voi.

Limit File Size screenshot
La casella "Limite File Size To" può essere utilizzata invece il dispositivo di scorrimento di qualità. Quando si seleziona la casella nella finestra di esportazione, scegliere la dimensione massima del file per l'immagine e Lightroom renderà di lavorare.

Dalla mia esperienza, quando si utilizza il cursore qualità per le immagini web, in genere vi lascio l'impostazione di qualità nell'intervallo 60-75. Questo sembra essere il punto dolce per file dimensione e qualità dell'immagine. Aumentando il cursore ben di là di che produce un file molto grande senza molta differenza visiva.

Se volete saperne di più sulle chiavi per ridimensionare le immagini per il web, check out mio write-up dall'anno scorso, come jpg Esporta per il Web da Adobe Photoshop Lightroom. Mentre l'obiettivo di questa esercitazione è i metadati per il SEO, dimensione dell'immagine è ancora una parte essenziale di essere ricerca-friendly.

Recap

In questo tutorial, abbiamo coperto come scegliere la frutta a basso impiccagione per esportare le immagini da Lightroom in un sito WordPress. Non commettere errori; Questo non sparerai istantaneamente il tuo sito al top di Google per i termini comuni, ma andrà un lungo cammino per aiutare qualcuno a trovare le tue immagini.

Vale la pena notare che ci sono diversi plugin WordPress, o add-on, che è possibile automatizzare questo processo. Tuttavia, plugin che non sono aggiornati di frequente può aprire il sito per le vulnerabilità di sicurezza. Devi anche contare su uno sviluppatore mantenendo la compatibilità del plugin con nuove versioni di WordPress. Due plugin popolari includono WP/LR Sync e LR/Blog.

Se volete saperne di più su WordPress, la sezione di codice Tuts ha una ricchezza di contenuti per modificare ed estendere WordPress. La sezione dei video e foto ha anche alcuni un'ampia copertura di Adobe Lightroom se si desidera affinare quelle competenze.

Infine, SEO è un'area di ricerca mutevoli. Google aggiorna costantemente il loro algoritmo utilizzato per trovare le pagine che pensano che corrispondono alla query di ricerca il meglio. C'è un sacco di cattivi consigli e "trucchi" per SEO là fuori. La mia Vai alla fonte per SEO è il Blog di Moz. Geni a Smashing Magazine hanno anche un grande write-up su come costruire un sito web SEO ottimizzato.

Che cosa stanno facendo per ottenere le immagini pronte per il web? Fammi sapere nella sezione commenti.


Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.