web-coding

Realizzare siti web gratis per un business: è possibile?

La creazione di un sito è alla portata di tutti? Ecco i risultati di un sito creato con SITE123.

Per chi lavora sul web non è una novità: gli strumenti a disposizione per la realizzazione di siti web gratis sono sempre di più, e soprattutto negli ultimi 1-2 anni le possibilità sono aumentate in maniera esponenziale.

È un ambito che mi interessa molto: fino a qualche anno fa era impensabile automatizzare la creazione di un sito. Adesso invece sono sempre più anche i professionisti che invece di sporcarsi le mani con HTML e CSS ricorrono a soluzioni già pronte da personalizzare per i propri clienti.

C’è qualcosa di male in tutto questo?

La risposta è semplice: dipende dal risultato e dalla professionalità di chi lavora.

Continua a leggere Realizzare siti web gratis per un business: è possibile? »

tomstardust-2016

TomStardust 2016: nuovo tema WordPress

La nuova versione di questo sito è online: più spazio al mobile e alla leggibilità degli articoli. In questo post l’analisi completa dei cambiamenti e i dettagli tecnici dello sviluppo.

Chi mi segue dal lontano 2006 sa bene che questo sito non è mai stato stravolto dal momento della sua prima pubblicazione. Ho fatto alcuni aggiornamenti negli anni immediatamente successivi, ma il tema WordPress realizzato in origine non è mai cambiato in maniera radicale.

Era da tempo (anni!) che volevo intervenire, ma per mancanza di determinazione e priorità maggiori di altri progetti ho sempre posticipato lo sviluppo.

Sono così arrivato ad Aprile 2016 con molte idee, alcune bozze di design, ed un nulla di fatto. Il giorno del 10° compleanno di questo sito ho capito che se volevo veramente cambiare qualcosa dovevo darmi degli obiettivi concreti e a breve termine, così ho preparato una board su Trello con le cose indispensabili, e dopo circa un mese ho pubblicato l’aggiornamento che potete vedere.

Continua a leggere TomStardust 2016: nuovo tema WordPress »

Atomic design

Living Style Guide: nuove prospettive

Le guide di stile servono davvero? Mantenerle aggiornate automaticamente è la vera sfida per il prossimo futuro.

Sono ormai passati i tempi in cui bastava un semplice set di elementi grafici ed un manuale di stile per definire l’identità di un brand. Le possibilità a disposizione sono sempre di più e sono aumentati i canali utilizzabili: mobile, tablet, desktop, app…

In uno scenario di questo tipo è indispensabile parlare di linee guida e guide di stile, sapere quando utilizzarle, e capire come si sta muovendo il mondo dello sviluppo per rimanere al passo con i tempi.

Continua a leggere Living Style Guide: nuove prospettive »

Creare siti con un website builder: la mia analisi

Esistono sempre più strumenti alla portata di tutti per creare siti. Avete mai visto Wix?

Chiave inglese

Il tema non è nuovo: in questi anni sta diventando sempre più facile creare un sito web senza bisogno di conoscenze tecniche. Esistono molti strumenti per farlo, e in questi giorni ho dedicato un po’ di tempo a studiare Wix.

È una delle soluzioni più famose per creare siti web, ma non è certamente l’unica. Esistono numerosi site builder in commercio e tutti hanno in comune la possibilità di creare un sito gratuitamente. I piani a pagamento (con prezzi anche elevati) solitamente offrono maggiori possibilità di personalizzazione e l’associazione ad un nome a dominio.

Riflettere sull’efficacia di questi strumenti e confrontarli con la professione del web designer è naturale: ha ancora senso dedicarsi a questo ramo se esistono soluzioni alla portata di tutti per creare un sito web dal nulla?

Continua a leggere Creare siti con un website builder: la mia analisi »

Magie con i selettori CSS3

Non stai ancora usando i selettori CSS3? Stai perdendo un’opportunità.

Già in passato avevo parlato dei selettori CSS3, che aiutano a scrivere codice HTML ordinato e pulito. Sfruttare i fogli di stile è un ottimo modo per evitare di aggiungere id e classi inutili nelle pagine, ed in particolare nei miei post avevo affrontato due argomenti:

Cosa è cambiato nel frattempo?

Una cosa fondamentale: sono passati più di 5 anni ed ormai non ci sono più problemi di compatibilità cross-browser. È possibile sperimentare, usare tutti i selettori esistenti senza problemi, e se rimangono dei dubbi c’è una risorsa imperdibile come caniuse.com a disposizione.

Continua a leggere Magie con i selettori CSS3 »

Il web design è morto?

Essere un esperto di HTML e CSS ormai non è sufficiente: è tempo di specializzarsi.

Con l’inizio del 2014 è tornata alla ribalta una discussione non del tutto nuova: conoscere HTML e CSS è sufficiente per potersi considerare dei web designer professionisti?

La risposta è no.

È iniziato tutto dal post di Jeff Croft: Web Standards killed the HTML star.
Abbiamo attraversato un periodo in cui lavorare con IE6 ci provocava incubi ogni giorno: essere un web designer significava saper risolvere in pochi secondi i problemi più assurdi.

È stata dura battersi per il riconoscimento degli standard web e per un comportamento coerente tra tutti i browser, ma alla fine i risultati sono arrivati. Gli standard erano importanti proprio perchè i browser si comportavano in maniera diversa, con un grande caos per tutti.

Continua a leggere Il web design è morto? »

HTML: addio title sui link

Usare il title sui link di una pagina web è inutile per gli screen reader e crea solo confusione.

Codice HTML

Ammettetelo: se avete fatto attenzione all’accessibilità dei vostri siti, fino a qualche tempo fa vi siete sicuramente preoccupati di inserire sui link poco comprensibili un attributo title. Lo scopo era chiaro: spiegare meglio la destinazione del collegamento.

Un esempio su tutti è quello dei classici “read more” o “continua…”, dove un attributo title poteva dare qualche informazione in più:

<a title="Titolo della pagina di destinazione">continua...</a>

Leggendo un post di David Ball ho fatto la scoperta: il title non serve perchè non viene letto dagli screen reader, e utilizzarlo crea solo confusione. Incredibile fino a qualche anno fa: se cercate in rete articoli che parlano di accessibilità, erano in molti a raccomandare l’uso di questo attributo.

Continua a leggere HTML: addio title sui link »

Guida all’uso di HTML5

Tutte le indicazioni per utilizzare HTML5: semantica, CSS reset, tag video e compatibilità cross-browser.

Le sperimentazioni con HTML5 sono già iniziate da tempo, e nonostante serviranno ancora degli anni prima che la specifica diventi uno standard del W3C, si possono già trovare in rete molti esempi del suo utilizzo.

Dopo avere introdotto l’argomento su questo blog, ho approfittato di un piccolo progetto basato su Sweetcron per prepararmi e testare con mano lo stato attuale di HTML5. E’ così che è nata la nuova versione di 1la.it, lavoro che mi ha aiutato a mettere in ordine le idee per scrivere questa guida.

Continua a leggere Guida all’uso di HTML5 »

Raccolta di font open-source per @font-face

Una collezione di link utili da cui scaricare font liberamente utilizzabili con @font-face.

Utilizzare font personalizzati sui propri siti web ormai non è più un’utopia: con il supporto ormai diffuso della proprietà @font-face è possibile in pochi passi personalizzare un progetto senza dover ricorrere ai classici Arial e Georgia.

Ricordando che è comunque fondamentale preservare la leggibilità, uno dei punti critici è l’utilizzo di font protetti da copyright: non è infatti possibile pubblicarli su una pagina web se sono tutelati dal diritto d’autore. Per questo motivo le soluzioni possibili sono utilizzare servizi esterni come Typekit, oppure scegliere font open-source che non presentano alcun problema legale.

Se optate per la seconda ipotesi, questa raccolta di web font liberamente utilizzabili potrebbe tornarvi utile:

  • The league of Moveable Type: una collezione appena nata di font open-source disegnati in maniera specifica per l’utilizzo su web con @font-face.
  • Font Squirrel: una delle migliori raccolte attualmente disponibili. Sul sito sono presenti anche diversi strumenti utili per includere font nei propri progetti.
  • Google Font Directory: Google mette a disposizione una buona raccolta di font, che è possibile includere sui propri siti direttamente dai server di Mountain View. Sono presenti comunque anche i link per il download.
  • Webfonts Wiki: offre un elenco abbastanza dettagliato di font utilizzabili con vari tipi di licenze come OpenFont, GNU, CC oppure open-source.
  • Fonthead: una discreta collezione di font gratuiti ed a pagamento.
  • Ten by twenty: tutti i font gratuiti di questo sito sono espressamente utilizzabili con @font-face; quelli a pagamento no.
  • Dafont: una delle più ampie collezioni di font gratuiti. Potete utilizzarli con @font-face, ma fate sempre attenzione ad eventuali clausole prima del download

Come utilizzare @font-face?

Avete trovato il font che fa per voi ma non sapete come includerlo sul vostro sito? Se la semplice guida che ho pubblicato vi risulta ancora troppo complessa, troverete fantastico il @font-face generator di Font Squirrel: dovrete solo caricare il font desiderato ed avrete immediatamente un kit pronto all’uso con tutti i file necessari.

CSS design e standard di lavoro

Le linee guida della BBC per i “future media” includono diverse raccomandazioni sulla scrittura dei CSS. Simili pratiche sono solo inutili complicazioni?

Uno dei siti corporate che presta più attenzione ai dettagli è quello della BBC: all’apparenza semplice ed ordinato nonostante i numerosi contenuti, si basa su molte pagine di specifiche tecniche e linee guida che devono essere rispettate dai suoi sviluppatori.

Continua a leggere CSS design e standard di lavoro »