Realizzazione Siti e Portali Web – Wordpress CODING – Mobile APP – Consulenze SEO – Web design – Ecommerce

Da PSD a WordPress: come costruire un tema WP da zero

La diffusione dei CMS e di WordPress in particolare, negli anni ha determinato una modifica sostanziale nell’approccio con i clienti per la presentazione di un progetto di restyling del sito web: in precedenza il percorso tipico era la presentazione dalla proposta grafica da sottoporre ai clienti nelle “canoniche” 3 varianti per arrivare, dopo l’approvazione di una di queste, alla realizzazione degli elementi grafici e al montaggio  del sito. Con i CMS il percorso è molto più spesso fondato sulla proposta di demo di temi
costruiti con tutti i vantaggi e gli svantaggi del caso. I vantaggi sono rappresentati dalla vastità delle soluzioni  e delle varianti disponibili, senza la necessità di lavorare a priori sulla realizzazione dei PSD da presentare. Gli svantaggi sono la maggior difficoltà di fare comprendere al cliente il risultato finale, la maggiore esposizione alla  concorrenza e la sensazione, sempre presente, di non avere un sito veramente “originale” ma piuttosto uguale o molto simile a tanti altri. Sebbene si tratti di una preoccupazione remota e poco realistica, visto che la personalizzazione degli elementi grafici e l’organizzazione dei contenuti può rendere il tema assolutamente originale ( a condizione che la web-agency incaricata sappia il fatto suo ) non si può nascondere che la presentazione di un progetto grafico veramente esclusivo costruito su misura per il cliente possa rappresentare un valore aggiunto molto importante.

Come costruire un theme wordpress da un progetto grafico PSD

Probabilmente la maggiore difficoltà di costruire un tema WP da un progetto PSD consiste nell’interazione fra le persone demandate alla sua realizzazione; per ottenere un risultato ottimale sono infatti necessarie competenze grafiche, di CSS avanzato, di programmazione html/javascript e di php/wordpress, idealmente sintetizzate in una persona o in un ristretto team di persone


custom-template-wordpress


  1. Se il file PSD è ben confezionato sarà facile distinguere le varie sezioni in cui i layer sono ragguppati per poter effettuare operazioni di ritaglio selettivo di quelli che sono elementi grafici non riproducibili con  puro CSS ovvero le immagini (loghi, icone social, flags, titoli particolari, etc)
  2. Con un occhio al file PSD si dovrà cominciare a strutturare il tema attraverso la installazione di un tema vergine ( es. underscores ) e a montare le librerie css e javascript attraverso le funzioni di wp_enqueue_script() e wp_enqueue_style(). Personalmente tendo spesso, salvo casi di layout molto particolari) ad utilizzare librerie basate su bootstrap per disporre della grande quantità di funzioni disponibili e soprattutto delle caratteristiche di “layout responsive” che sono ormai un must, tuttavia esistono altre librerie disponibili che hanno analoghi risultati.
  3. Realizzare i “templates” fondamentali che verranno utilizzati dalle pagine del sito WP ovvero single.php, page.php , archive.php come punto di partenza minimo oltre ai files di struttura: index.php, header.php, footer.php e sidebar.php 
  4. Determinare quali sono parti da rendere opzionali e di conseguenza implementare le funzionalità per poter ad esempio caricare un logo o un’immagine di testata o qualsiasi altra funzionalità che si possa scegliere di mostrare o utilizzare  in tutto il sito o in parti di esso. La gestione delle “options” è demandata alla “options API” e ad alcune funzioni di cui ad esempio get_option()
  5. Implementare i CSS per rendere il tema aderente al progetto grafico ( colori, caratteri tipografici etc) e per adattare le inevitabili incongruenze che emergeranno sulla parte “responsive” attraverso le “@media queries”. Quest’ultima parte può risultare molto dispendiosa in termini di tempo per ottenere il livello di perfezione richiesto.

temi-wordpress-su-misura


La realizzazione di un tema originale per WordPress da file PSD non è un’operazione semplice, ma una volta compresa l’architettura dell’applicazione i risultati sono straordinari, caratterizzati da un’aderenza perfetta al progetto grafico e da un’assoluta originalità del tema.

Altro aspetto assolutamente non secondario della costruzione personalizzata di un WP Theme  è il controllo totale sulle componenti installate, in particolare sui blocchi .js/jQuery che possono rappresentare un serio impatto sulle performances di caricamento di un sito. Con la progettazione di un template su misura anche questo aspetto può essere curato nel dettaglio, usando librerie leggere con script caricati solo nelle pagine che li usano a tutto vantaggio della UX e del SEO, per cui se il budget lo consente (si tratta di un investimento di alcune centinaia di Euro, con variazioni determinate dal tipo di progetto) la realizzazione di un tema WP originale è senza dubbio un ottimo investimento che conferisce un importante valore aggiunto per l’immagine del cliente.

Related posts

Leave a Comment

Lascia un commento

Your email address will not be published.




Top