Che cos'è un sito Responsive ?

Il termine responsive in inglese significa “reattivo”, e ciò che fa un sito responsive è “reagire” in maniera diversa a seconda del dispositivo con cui viene visualizzato.

 

Se hai deciso di creare un sito responsive, forse pensi che significhi solamente fare in modo che il testo vada a capo una volta arrivato al margine destro.

Ma il sito responsive è molto di più. Certo, prima di tutto deve adattarsi alla larghezza dello schermo utilizzato. Ma soprattutto il sito responsive è visualizzato da tutti i dispositivi senza perdita di contenuti, di elementi grafici essenziali e, infine, di usabilità.

Vorrei farti riflettere qualche secondo su questi aspetti, in modo che poi sarai in grado di creare un sito responsive con WordPress che sia veramente funzionale. Perciò, vediamo un attimo queste caratteristiche più nel dettaglio.
Creare un sito responsive: adatta il contenuto alla larghezza del dispositivo

Un sito responsive ha un layout fluido: il testo ritorna a capo una volta raggiunto il margine destro, mentre gli elementi affiancati si riposizionano uno sotto l'altro. La disposizione degli elementi che nel PC è orizzontale, nel dispositivo mobile diventa verticale.

Cosa significa per un designer progettare e realizzare un template responsivo? Significa progettare la grafica e l'interazione utente non di uno, ma di tanti layout, quante sono le risoluzioni dei display più diffusi:

    - Smartphone
    - Tablet
    - Desktop
    - …

è per questo che di solito un sito responsive costa più caro di un sito che non lo è: proprio perché ogni elemento deve essere tenuto sotto controllo in tutte le sue metamorfosi.
Spesso la maggiore cura viene dedicata alla progettazione del layout desktop, sia per contenere i costi, sia perché di solito il cliente ne è più consapevole. Il layout desktop quindi informa e guida tutti gli altri.
Tuttavia ci possono essere casi in cui la versione mobile di un sito è più importante di quella desktop: in questi casi è bene stravolgere la prassi abituale e partire dalla progettazione per mobile.

Comunicato chiude definitivamente MSN

15 MARZO 2013: LA CHIUSURA

L'annuncio risale allo scorso novembre, ma ora c'è una data ufficiale: il 15 marzo 2013, la popolare applicazione di chat MSN Messenger andrà definitivamente in pensione.
MSN era in circolazione addirittura dal 1995.
Microsoft ha deciso che a prendere il suo posto sarà Skype, acquistata dal colosso di Redmond per 8,5 miliardi di dollari.
Un pezzo di storia del web da 330 milioni di utenti se ne va per sempre, tranne che in Cina, dove rimarrà attivo perché la connettività Skype è gestita dalla società locale Tom.
Ma il fronte delle comunicazioni chat e vocali sul web negli ultimi tempi è diventato uno dei più agguerriti, con Facebook che ha deciso di svolgere un ruolo da operatore telefonico e app mobili come Whatsapp e Viber che spopolano tra gli utenti di smartphone, decretando tra l'altro la morte degli sms.

 

Struttura LAYOUT Sito WEB

Se conoscete il funzionamento di una griglia CSS quello che vi resta da apprendere è come poter costruire il vostro primo layout! Ed è proprio quello che andremo a fare insieme in questa lezione.

 

Lo scopo di questa lezione è andare a creare un layout che rappresenti i seguenti elementi

Sono sicuro che avete già visto moltissimi siti che hanno questa struttura e sperimentando con il box model avete iniziato a chiedervi come tutto questo fosse possibile. Uno dei vari modi per realizzare un layout riguarda quello di affidarsi alle griglie CSS che faciliteranno il nostro lavoro e lo renderanno compatibile con i vari browser senza alcuno sforzo da parte nostra.

Nell’esempio presentato sopra possiamo capire come ci basti delle semplici classi per poter creare il nostro primo layout. In questo caso abbiamo creato un layout di due colonne, una per i contenuti principali (#main) mentre un altra per la navigazione secondaria (#sidebar).

Che cos'e il LAYOUT WEB ?

Per layout web intendiamo il tipo di impaginazione che scegliamo durante la realizzazione di un sito web. Ci riferiamo, in pratica, alla struttura di base delle diverse pagine che lo costituiscono e al tipo di grafica usata per la loro costruzione. Tale processo di creazione può essere tuttavia complicato e necessita di una certa esperienza e di un’approfondita conoscenza di tutti i tipi di linguaggio utili (HTML, CSS, TEXT ecc.), e di tecniche di applicazione di grafic design.

 

 

Noi di Backorder siamo una web agency specializzata nella progettazione e nella personalizzazione di layout per le pagine web di siti internet. A differenza del servizio di web design, il layout web prevede l’utilizzo di template già creati e la successiva personalizzazione delle pagine in base ai contenuti da inserire.

L’impaginazione di un sito web è fondamentale, e include sia la struttura funzionale delle pagine, sia la parte grafica. Quando lavoriamo su pagine web dal layout predefinito, il nostro lavoro di personalizzazione prevede l’inserimento di testi “Seo friendly” e di immagini originali. L’impaginazione è uno degli aspetti più importanti nella creazione di un sito web, poiché un sito risulta più intuitivo e semplice da utilizzare solo se i suoi contenuti sono correttamente disposti all’interno della struttura, ossia del layout. La posizione di un testo e il suo aspetto grafico riguardano non solo il significato del messaggio, ma anche la sua funzionalità. Inoltre, i siti web vengono realizzati sempre con strutture rigorosamente responsive. 

Scelta del layout

Scegliere il giusto layout, poi, richiede attenzione ed esperienza: se utilizziamo una buona struttura, riusciremo ad ottenere una navigazione migliore dei contenuti all’interno del sito. Lo scopo principale è quello di valorizzare, in maniera univoca, il contenuto della comunicazione. La scelta del layout concerne, quindi, ciò che si sta presentando: ad esempio, se il testo è il vero oggetto in primo piano, il layout va costruito attorno ad esso. Se invece il contenuto principale della pagina web è rappresentato da immagini, bisognerà scegliere un layout che attiri l’attenzione degli utenti sulle immagini, includendo anche descrizioni testuali.

Cosa fa un WEB DESIGNER ?

Credo che un poco lo si diventi, un poco lo si sia sempre stati e man mano che si va avanti lo si scopra e lo si porti sempre maggiormente alla luce. Servono studi accademici ed esperienze sul campo. Credo che prendendo centinaia di persone che fanno questa stessa professione, si otterranno centinaia di risposte diverse. Personalmente ho fatto l’Università che mi ha dato grandi basi teoriche ma praticamente nulla di pratico, dopodiché ho iniziato a lavorare tramite uno stage non retribuito presso una grossa azienda e la sera frequentavo un corso pratico di programmi grafici. In azienda mi sono state date le basi di organizzazione sul lavoro e rudimenti di buon gusto, perché anche l’occhio deve essere educato, e nel corso serale mi sono stati insegnati i principali programmi di disegno e impaginazione, senza ai quali non puoi fare granché. Poi ho iniziato a lavorare presso altri studi di comunicazione dove tramite esperienza e suggerimenti di colleghi più anziani e assai preparati, sono riuscito ad imparare qualcosa e pian piano a diventare un professionista di questo settore.

 

Il fatto principale è che questo lavoro non finisce mai perché vai a vedere come sono impaginati i testi anche quando leggi il menù in pizzeria, cerchi i refusi, imprechi contro il carattere utilizzato e cerchi soluzioni alternative. è follia, certo: credo che anche una buona dose di questa sia necessaria.

Il web designer si occupa dell’aspetto visivo e del coinvolgimento emotivo di siti Web business to business e business to consumer . Il web designer risolve i problemi di comunicazione dei loro clienti, valorizzando l’identità del marchio in modo specificamente pensato per il web, sfruttandone i punti di forza, conoscendo le possibilità offerte dalla tecnologia. Collabora con il gruppo di lavoro e con i clienti per realizzare siti che siano accattivanti dal punto di vista grafico, abbiano un buon impatto visivo, siano semplice da navigare , compatibili con le esigenze dei visitatori e accessibili utilizzando browser e componenti diversi. A lui spetta il compito di coniugare design e navigazione mediante l’utilizzo delle tecnologie disponibili.

Le sue funzioni si articolano in diversi compiti, svolti in collaborazione con un team di lavoro.

Il web designer è fondamentalmente un comunicatore, capace di coniugare le esigenze del cliente con quelle degli utenti. Egli infatti:

    comprende la tecnologia da usare, conoscendo le possibilità e i limiti che si possono incontrare nella realizzazione di un sito e ne discute con i clienti e gli altri professionisti impegnati nel progetto
    traduce le esigenze, i contenuti e il marchio del cliente in concetti strutturati adatti a un sito web, rispondendo alle esigenze degli utenti e proponendo prove a colori, adatte allo strumento su cui saranno veicolate e realizzabili dal punto di vista tecnico
    progetta i componenti necessari alla navigazione
    trasforma gli elementi di progettazione realizzati con software grafici (Photoshop e Illustrator per esempio) in componenti utilizzabili e modificabili su un sito Web
    prepara il layout delle pagine del sito utilizzando l’HTML e altri linguaggi di programmazione (JavaScript e fogli di stile) insieme a sviluppatori e tecnici web
    decide lo stile delle pagine web a livello di grafica, layout, tipografia, colori…
    prepara e presenta i contenuti in modo che risultino ben leggibili e ben strutturati seguendo le linee guida stabilite dal content manager
    è responsabile del mantenimento del sito, apporta le modifiche grafiche e di codice necessarie, aggiornando e curando il sito.

Quindi, nello specifico, che cosa fa un Web Designer?

• deve riuscire a trasformare gli elementi di progettazione realizzati con software grafici (ad esempio Illustrator o Photoshop) in un linguaggio utilizzabile sul web;
  
• decide lo stile grafico delle pagine web, scegliendo i layout più adatti, nonché i colori e i fonts;
• dà vita a una struttura che risponda ai criteri di user experience e della SEO;
• realizza le pagine utilizzando il linguaggio più appropriato (fogli di stile, linguaggio HTML o JavaScript).