Risultati della Ricerca per: css

Pillole CSS: progettare un sito con font accessibili

Una scelta comune a molti web designer alle prime armi riguarda l’uso dell’unità di misura pixel nei fogli di stile. Il pixel è un’unità di misura relativa al dispositivo (schermo, palmari, ipad, ecc) che può presentare tuttavia – aldilà della sua semplicità di utilizzo rispetto alle unità percentuali – alcune problematiche dovute alla sua scarsa flessibilità.

L’utilizzo dell’unità pixel in alcuni browser più obsoleti non permette agli utenti di modificare la dimensione del font, e questo ovviamente comporta un grave problema di accessibilità del sito agli utenti ipovedenti che necessitano di ingrandire il carattere.

In altri casi, anche se fosse possibile lavorare sulla dimensione dei vari elementi tipografici, probabilmente tali modifiche comprometterebbero la struttura della pagina rendendo il sito di difficile fruizione. || Leggi altro »

Come rendere trasparenti gli elementi con CSS3?

La gestione della trasparenza è stata sempre una delle operazioni più noiose del web design, dato che non c'era un modo effettivo di applicarla agli elementi di un sito se non tramite immagini preparate ad hoc (filtri proprietari esclusi). Le...

14 commenti

Pillole CSS: che cos’è il box model e come sfruttarlo per i nostri layout?

Negli ultimi due articoli abbiamo visto come strutturare un layout fisso a due e tre colonne utilizzando i float opposti, e abbiamo costruito una piccola pagina di esempio. Il risultato era accettabile, ma risultava un po' troppo "attaccato": ogni elemento...

16 commenti

Pillole di CSS: Height 100%: perché non funziona mai come ci aspettiamo? Cause e soluzioni!

Oggi parliamo di pillole di CSS: come risolvere problematiche legate al CSS apparentemente semplici per i più esperti ma che possono rivelarsi problematiche e cavillose per gli aspiranti web designer. Questo è probabilmente uno dei problemi più comuni quando si...

8 commenti

Creare gallerie thumbnail accattivanti con effetti hover CSS3

In questo tutorial vediamo come creare alcuni effetti hover sulle gallerie immagini in miniatura o cosiddette thumbnail. Lo scopo è sia quello di rendere accattivante la galleria che quello di aumentare l'interattività dell’utente che al passaggio del mouse riesce a...

9 commenti

Come sfruttare le animazioni CSS3 per realizzare le skills del tuo sito web

Hai mai realizzato le skills per il tuo sito web? Le skills sono un elemento fondamentale del portfolio di web designer e grafici perché: mettono in evidenza le proprie competenze ed abilità servono a catturare l’attenzione di potenziali clienti. Da qualche...

12 commenti

Olìmpo: il template xhtml/css per il tuo portfolio online

In quest'estate cosi afosa che ci siamo lasciati alle spalle (ma anche no!), per passare il tempo in un modo diverso dal solito (ah ah, bella questa!)  mi sono detta: perché non preparare una bella risorsa free da rilasciare agli...

39 commenti

Pillole CSS: come modificare la resa visiva del testo con la proprietà white-space?

Pillole CSS: come modificare la resa visiva del testo con la proprietà white-space?

Uno degli aspetti meno conosciuti dei CSS è quello relativo alla gestione degli spazi bianchi all'interno di un testo. Spesso infatti si ha la necessità di avere un controllo sulla formattazione del testo maggiore rispetto a quella predefinita effettuata dal...

10 commenti

Pillola CSS: come realizzare un layout fisso a tre colonne?

Nella pillola della scorsa settimana abbiamo visto come realizzare un layout fisso a due colonne. Sono sempre più diffusi però - complice l'aumento esponenziale della risoluzione dei monitor - i layout a tre colonne. Come fare dunque per aggiungere un'ulteriore...

15 commenti

Pillole CSS: come centrare un elemento?

Spesso durante lo sviluppo di siti web, ci troviamo a dover risolvere tanti piccoli problemi la cui soluzione, per quanto semplice, può richiedere molto tempo in termini di ricerca e implementazione. Per questo ho pensato di inaugurare una nuova rubrica,...

13 commenti

Responsive web design: compatibilità e testing

Compatibilità e browser: penso che per noi sviluppatori web questi due termini messi insieme significhino davvero tanto. Durante la fase di sviluppo scegliamo di controllare la resa visiva del sito sul nostro browser preferito (il mio è Firefox). A fine...

8 commenti

Responsive Design: come e perchè progettare siti responsive?

Il tuo sito è Responsive? I tuoi visitatori riescono ad accedere comodamente da qualunque dispositivo? La parola d’ordine è mobilità, il fornire applicazioni, soprattutto web, su qualunque dispositivo, in qualunque angolo dell’Universo. Prima di parlare, però, direttamente di Responsive Design,...

46 commenti

Quali sono i libri migliori per diventare web designer?

È Natale, tempo di regali. Perché non approfittare e regalarsi un bel libro sul web design? Ho raccolto alcuni libri che, secondo me, dovrebbe essere letti almeno una volta nella vita. Nel farlo, ho cercato di creare una sorta di...

48 commenti

Come utilizzare font non standard su un sito web?

Ogni nuova scoperta nell'ambito del web design, già dalla sua nascita deve confrontarsi con un ostacolo spesso duro da sormontare: la compatibilità con Internet Explorer. Emblematici sono gli esempi di ombreggiature, o angoli arrotondati: sono facilmente ottenibili tramite moduli del...

36 commenti

Form accessibile: come posizionare gli elementi e renderlo attraente?

Form accessibile: come posizionare gli elementi e renderlo attraente?

Ci eravamo lasciati con gran suspance, curiosi di vedere come il nostro brutto anatroccolo, di difficile comprensione, si sarebbe trasformato in uno splendido cigno... e ora sei pronto per seguirmi in questo processo di trasformazione attraverso il codice CSS? (altro…)

14 commenti

Come progettare un layout web responsive con le media queries?

Dopo le prime due lezioni introduttive sul Responsive Web Design, oggi ci addentreremo nel codice CSS attraverso le nuove istruzioni messe a disposizione nella terza versione dei fogli di stile. In particolare vedremo come realizzare un semplice layout responsive utilizzando...

38 commenti

HTML Mobile App: 5 Consigli per aumentare le performance

Negli articoli precedenti (HTML5 Mobile App: transizioni ed animazioni CSS3 parte 1 e parte 2) abbiamo visto come poter realizzare applicazioni HTML5 e Javascript con interfacce che sfruttano animazioni CSS3, e come poter controllare quest’ultime grazie agli eventi che abbiamo...

10 commenti

Come velocizzare un sito WordPress

In questo articolo voglio dare alcuni suggerimenti che possono essere messi in pratica da tutti per velocizzare il proprio sito web WordPress. Alcuni dei consigli saranno regole da utilizzare con costanza, altri invece configurazioni e strumenti (come i plugin) che...

13 commenti

4 jQuery tricks che non potete non conoscere

jQuery. Un framework javascript talmente potente e popolare che equivale praticamente a Zend per il PHP. Sempre più siti web lo utilizzano per la sua capacità di essere sintetico ma altamente funzionale, e non se ne può più fare a...

16 commenti