Archivio per la categoria 'web design'

Creare List Item fluidi con i CSS

Le Navigation Tabs sono sempre più in voga nei siti di ultima generazione, soprattutto quando sono basate su liste di links orizzontali. Permettono una navigazione semplice ma allo stesso tempo elegante.

La tecnica che vi mostro oggi mette in pratica la creazione di queste liste, le Sliding Fluid Tabs,  ovvero liste a contenuto fluido. Il vantaggio principale è che non ci sono limiti di spazio, il testo delle tabs può essere lunghissimo, corto o variabile: si otterrà sempre lo stesso effetto. In aggiunta, non occorre utilizzare immagini di grandi dimensioni come accade in molte altre tecniche, e le righe CSS necessarie sono davvero poche.

Prima di presentarvi questa tecnica (il cui nome e implementazione sono da me inventati)

RD Theme 1.0

Oggi riccardodegni.it cambia uffcialmente tema, denominato  RD Theme 1.0 e interamente sviluppato da me (con la collaborazione di Chiara, fashion designer).
E’ un tema Web2.0 interattivo che utilizza Mootools come framework e stili grafici basati sulle sfumature dell’azzurro.

E’ al 100% compatibile con gli standard XHTML e CSS (come pochissimi altri temi in circolazione) e utilizza diversi tra i più utili e accattivanti plug-in per Wordpress.

Per scrivere i commenti ora gli utenti hanno a disposizione una comoda pulsantiera che gli permette di inserire i tag HTML pertinenti, come i link o le enfasi (strong).

E’ possbile inoltre condividere articoli e pagine del sito sui principali Social Bookmarking System, come del.icio.us, technorati, digg, furl, e cosi via.

I big del Web2.0 - Parte 2

Continuiamo la lista delle componenti fondamentali che hanno reso e che rendono il Web2.0 una tecnologia affermata e apprezzata:

Software Web-Based

Tutti associano alla parola software un programma da installare sul pc tramite cd o dvd, e da cui si accede tramite desktop.
Questo fino a che non nacquero i primi software basati sul web: delle vere e proprie applicazioni da installare e gestire tramite browser.
Il noto Delicious ad esempio, permette di salvare i siti o gli articoli che desideriamo (come se fosse una lista di preferiti) e di condividerli con gli altri utenti;

Flickr che permette tra le tante altre cose, di condividere immagini;

Digg, che

I big del Web2.0 - Parte 1

Web 2.0: una sigla, tantissimi significati.
Ognuno può immaginare il significato di questo termine a proprio piacere, magari volendo sottolineare la maggiore interattività dei siti moderni, la nascita delle chiamate Ajax al server, i moderni effetti grafici come i tooltips, oppure  la grafica composta da gradienti, ombre e righe diagonali.

Fatto sta che ormai il Web2.0 è IL nuovo web.
Si capisce subito se un sito è Web2.0 oppure non lo è. E se lo è, da all’utente un’esperienza di navigazione molto più profonda.

In questo articolo vediamo una lista dei componenti che hanno permesso a questa nuovo universo di diffondersi, di crescere e soprattutto di appassionare gli utenti e gli sviluppatori.

Framework JS

Senza

Safari 3 ora arriva su Windows

Questa è un'incredibile notizia che ormai da giorni imperversa su ogni sito riguardante il web.

E ci credo, fino a poco tempo fa si poteva considerare una perfetta utopia.

Il browser di casa Apple su Windows migliora in modo considerevole il lavoro dei programmatori/web designer. Niente più immagini o screenshot per vedere la resa (statica…) delle pagine su Safari per gli utenti che non possegono un Mac.

Quando sarà disponibile la versione "full" 3.0 di Safari, sarà possibile testare le nostre applicazioni anche su Safari, anche se non si possiede un Mac

Lo considero un grande, grandissimo passo in avanti.

Per tutte le informazioni ufficiali, demo, date e quanto altro, rimando alla pagina del sito ufficiale: Safari 3 - Public Beta. Provate a vedere

Icone per tutti i gusti

Dopo una settimana di assenza dalla scrittura di articoli per motivi di impegno, segnalo una carrellata di link utili che contengono set di icone pronti da utilizzare, che riguardano un pò tutte le categorie, in partoclare web, pc, software, ma anche sport, loghi e cartoon.

Free Icons

SmashingMagazine


My Cool Button

Go Squared

Nei siti segnalati inoltre sono presenti molti link ad altre autorevoli fonti di icone.

Moo.Rd su DesMM.com

Un ringraziamento a Massimo per la sua segnalazione riguardo Moo.Rd su Design & MultiMedia (desmm.com), uno dei più illustri blog (provate a vedere l’home page di WordPress Italia e lo trovate tra i primi link :) ) dedito appunto al design, Web Deisgn e multimedia in generale.

Qui trovi l’articolo completo.

Grazie ancora!

desmm_logo.gif

Floatutorial

Quella che riporto oggi è un’ottima guida all’utilizzo della proprietà css float.
Una proprietà dalle potenzialità enormi, ma che può comportare non poche sorprese all’interno di ogni tipo di layout.
Rendere un elemento “float” infatti, provoca la rimozione dello stesso dal normale flusso del documento, e quandi occorre sapere precisamente come e quando gestire questa situazione.
Qui trovate una vasta gamma di esempi e consigli molto interessanti.

L’utilizzo della proprietà float senza una conoscenza approfondita, è pericoloso.
Ma anche sapendola utilizzare e sapendo quali conseguenze comporta, c’è chi preferisce gestire gli elementi ricorrendo a tecniche differenti, come posizionamenti o margini negativi e cosi via.
A mio avviso rendere un element “float” può essere utile in due casi: liste di immagini disposte orizzontalmente ed elementi …