Realizzazione siti web, progettazione e sviluppo di siti internet web 2.0

Creazione siti web con i CMS – Corso online Joomla
9 agosto 2010
Collegare direttamente un video negli articoli
9 agosto 2010

La creazione di siti web non è di sicuro una scienza ma più un metodo di comunicazione visiva molto potente e flessibile, anche se, vi sono innumerevoli aspetti da considerare quando affrontiamo lo sviluppo di un nuovo progetto per il web, il suo look and feel (web design), la tipologia di contenuti che questo dovrà contenere, se dovrà essere ottimizzato per i motori di ricerca, etc. etc. ma il principio fondamentale è la centralità dell’utente.

realizzazione siti webSe non si riesce a ragionare tenendo nella dovuta considerazione i destinatari di un sito si rischia di fare un pesante flop che comprometterà soprattutto la visibilità sui motori di ricerca

rendendo così vani tutti gli sforzi profusi nella creazione del sito stesso. Ormai è abbastanza chiaro a tutti gli esperti del settore che i sistemi di analisi, controllo e verifica (i cosiddetti algoritmi utilizzati da Big G e simili) stanno diventando sempre più sofisticati e complessi, negli anni precedenti riuscire a scalare e raggiungere posizioni di vetta nelle pagine di ricerca era relativamente facile, un po’ di testo, una descrizione e una bella infornata di keyword potevano fare miracoli, oggi per fortuna (ma anche per nostra croce e delizia) non è più così.
Ma è davvero possibile occuparsi della creazione di siti web in un ottica che privilegi realmente la figura dell’utente e allo stesso tempo risulti “digeribile” e assimilabile con facilità da parte dei motori?
Non si corre invece il rischio che l’intera progettazione sia volta esclusivamente ad ottenere risultati concreti nell’indicizzazione?
La risposta è si ad entrambe le questioni, ed è anzi molto facile essere fuorviati e cadere vittima della “sindrome da metatag” che colpisce molti colleghi.
Cosa è dunque effettivamente necessario fare per riuscire a comporre un puzzle formato da:
• Layout gradevole
Usabilità
• Visibilità
E nel quale l’utenza rappresenti l’unica immagine centrale presente sul piano di lavoro?
La risposta è progettazione strutturale e completa dei siti internet, dal layout ai contenuti.
Non siamo certo di fronte a un rompicapo, in effetti, a ben guardare i blocchi di riferimento sono solo due, i motori di ricerca e gli utenti, quindi i nostri sforzi dovranno egualmente essere orientati in entrambi i sensi.
Problematiche relative al posizionamento nei motori di ricerca:
1. Struttura di impaginazione del layout (o del template)
Sfatiamo un mito!
Sicuramente tutti abbiamo sempre sentito dire che è buona regola fare in modo che gli spider che visitano le pagine di un sito trovino subito disponibili i contenuti, e per questo eravamo costretti ad utilizzare strutture tableless regolate attraverso fogli di stile che utilizzando proprietà adatte posizionavano il mainbody (inteso come contenitore dei testi) in cima a tutto il resto, oggi grazie sempre all’evoluzione del sistema di analisi dei bot (spider) questo non è necessario, e la prova è visibile agli occhi di tutti, basta una semplice ricerca per rendersi conto che molti siti web in testa alle SERP (SEARCH ENGINE RESEARCH PAGE) non rispettano assolutamente questo requisito, addirittura alcune hanno solo una intro page con un modesto contenuto di meta, a volte anche in flash ( e vi invito a fare questa prova e smentirmi nel caso), quindi questo si traduce in una maggiore libertà di sviluppo.
Impostiamo dunque l’impaginazione del sito nel modo più consono ai contenuti che esso dovrà ospitare evitando gli eccessi, ad esempio:
è perfettamente inutile e anzi dannoso realizzare una struttura (template) con 5 colonne centrali se poi ne useremo solo due, ottimizzare il codice significa anche questo, eliminare ciò che non è di giovamento al sistema.
Tenendo presente questo aspetto riusciamo ad accontentare e facilitare sia il lavoro dei motori sia il nostro visitatore
2. Velocità di caricamento
Questo è uno dei fattori più importanti da considerare, come più volte ribadito dal gruppo di sviluppo di Big G essendo la mole di dati che gli spider devono analizzare in continua crescita, è logico che i tempi di visita sul ns sito siano notevolmente ridotti rispetto al passato (si riferiscono velocità di passaggio di circa 3 secondi………quando và bene) quindi la nostra progettazione deve prevedere:
• Ottimizzazione e compressione delle immagini
• Ottimizzazione del codice xhtml
• Ottimizzazione e compressione del foglio di stile
• Ottimizzazione e compressione dei javascript se presenti
Tutto ciò non è assolutamente penalizzante nei confronti di un web design gradevole, non è necessario rinunciare a una grafica piacevole evoluta e di impatto,quello che invece è nostro compito è riuscire a ridurre le dimensioni dei file generati senza perdita di qualità, e possiamo riuscirci in maniera molto semplice anche con strumenti completamene gratuiti:
SuperPNG
• PNGCrushrrr
PNGGauntlet
SuperGIF
Online Image Optimizer
PNGOUT
RIOT
smush.it!
I risultati sono assolutamente straordinari e rappresentano sicuramente un “must have” tra i nostri preferiti.
Anche ovviamente il codice generato necessità di una “pulizia” e riferendoci al codice xhtml dovremmo tanto per cominciare evitare sia gli spazi vuoti sia i commenti, mentre nel foglio di stile l’ottimizzazione si concretizza (in combinazione con il codice xhtml) nell’uso ridotto di ID a favore delle classi e nella scrittura perfezionata. Nell’eventualità che comunque il foglio di stile sia “corposo” è utile procedere a una sua ottimizzazione e compressione usando anche in questo caso dei tool gratuiti reperibili online:
cssoptimizer
Lato Javascript
Librerie Ajax che passione!
Mootools e Jquery ci regalano continuamente nuovi plugin per l’implementazione di pagine interattive, effetti a volte straordinari divenuti ormai indispensabili,di per sé già di dimensioni molto contenute, ma il consiglio è quello di non eccedere nel loro utilizzo. Inutile e anzi dannoso presentare sia all’utente che al motore di ricerca più di un effetto per pagina.
Anche su questo secondo punto otteniamo una sorta di pareggio dunque tra utenza e Big G.
3. Creazione di siti web 2.0 il web semantico
Il termine web semantico è spesso associato, giustamente al concetto più ampio di web 2.0, in parole molto semplici esso cerca di stabilire dei concetti ed impostare dei parametri universali che permettano una migliore fruizione, analisi ed archiviazione delle informazioni presenti nelle pagine web. La creazione di siti web 2.0 si tradurrà dunque nell’agevolazione della ricerca sia da parte dell’utenza sia da parte dei motori . Ma nella pratica cosa significa tutto questo?
Nella corretta struttura di presentazione dei contenuti!
Nel nostro caso avremo ad esempio:
• Titolo dell’articolo (risposta all’input di ricerca dell’utenza e key principale della ricerca)
• Paragrafo (spiegazione ad esempio della soluzione con inserimento di altre keyword relative)
• Risorse (link alla fine dell’articolo per approfondimenti)
Anche in questo caso il contesto semantico permette di produrre un risultato importantissimo sia per l’utente sia per i motori presentando un formato ideale all’interrogazione, all’interpretazione e, più in generale, all’elaborazione automatica
4. Usabilità
Il concetto di usabilità nella creazione di siti internet non deve essere inteso come l’ultima moda del momento, al contrario è l’affermazione assoluta di quanto detto fin’ora, e cioè sviluppare centralizzando l’utenza, e tra l’altro è il punto che meglio riesce ad accomunare i nostri intenti risucendo a favorire nel contempo l’utente, i motori di ricerca e la comunicazione visiva a nostro favore. Ciò che l’utilizzatore del sito si aspetta di trovare, il modo e i tempi in cui si aspetta di trovarlo, il suo livello di confidenza con Internet: tutti questi sono veri e propri vincoli che il web designer deve tenere presente nella creazione di siti web, adottando le soluzioni più semplici ed efficaci possibili. Il nostro utente ci ha trovato sul web poiché ha necessità di risolvere un quesito, ha bisogno di informazioni ed è logico che queste gli siano presentate immediatamente, è l’approccio diretto, il famoso “call to action”, non bisogna presentare testi lunghi e altisonanti ad elogio personale della propria bravura e capacità, dimostrare quanto si è super hero è inutile e dannoso, ti ho trovato perchè ho bisogno di una risposta, non per sapere cosa hai fatto, cosa stai facendo e cosa farai!
Quindi progettare a favore di una maggiore usabilità da parte dell’utenza si trasforma anche nel più potente strumento di marketing esistente!
In questo contesto vanno naturalmente considerati altri parametri egualmente importanti: testi di facile lettura (quindi buona spaziatura sia nell’interlinea che tra gli elementi grafici) e navigazione quanto più diretta e facile possibile.
Resta un aspetto altrettanto importante da considerare, l’accessibilità delle pagine del ns sito, ma è un concetto sicuramente molto vasto che merita un capitolo a sé stante, anche perché presenta incomprensioni e serie difficoltà di attuazione, nessuno è in grado di garantire la piena accessibilità ma non per carenze personali, piuttosto per una non completa evoluzione del sistema, ciò non vuol dire che comunque non vadano prese in considerazione tutte le possibilità che abbiamo per garantire almeno un livello passabile.

Portfolio 2010