Badge vettoriali 2.0 free + tutorial photoshop

Una saerie di icone “distintivi” da poter scaricare  interamente in formato vettoriale.

Sono incluse le immagini JPG e PNG in download così come AI, EPS, SVG  file di origine.
Se si desidera personalizzare i file avrete bisogno di un editor di grafica vettoriale come Illustrator, Freehand ecc.

Download ( 9.4 MB formato ZIP)

Una serie di link con interessanti tutorial

• A questo link trovate un interessante tutorial per fare i vostri badge 2.0 con photoshop;
• Altra soluzione, altri badge da photoshopstar.com;

DIV con angoli arrotondati solo con CSS

Sino a poco tempo fa, ottenere un box con angoli arrotondati non era così semplice e comunque di cattiva gestione nel momento in cui il contenuto cambiava.

In origine si utilizzavano tabelle annidate e piccole gif graficamente arrotondate.

In seguito le immagini potevano essere inserite di sfondo ai  DIV tramite CSS, generando comunque non poco codice di cattiva gestione.

Oggi, la soluzione migliore cross-browser è questa:

<div class=”esempio”> contenuto </div>

.esempio {

/*angolo superiore sinistro*/
-moz-border-radius-topleft: 6px;
-webkit-border-top-left-radius: 6px;

/*angolo superiore destro*/
-moz-border-radius-topright: 6px;
-webkit-border-top-right-radius: 6px;

/*angolo inferiore sinistro*/
-moz-border-radius-bottomleft: 6px;
-webkit-border-bottom-left-radius: 6px;

/*angolo inferiore destro*/
-moz-border-radius-bottomright: 6px;
-webkit-border-bottom-right-radius: 6px;

}

ecco fatto, compatibile con tutti i browser ad esclusione di IE 5 ormai in disuso.

L’aspetto grafico del web 2.0

Il Web 2.0 è caratterizzato, oltre che dall’aspetto Social delle sue applicazioni, anche da un ben definito aspetto grafico. Colori e layout di questo nuovo genere di applicazioni Internet sono facilmente riconoscibili: colori pastello, angoli arrotondati e quant’altro.

Ora, se siete interessati a dare anche al vostro sito questo tipo di sembianze, eccovi accontentati. Qui sotto trovate un elenco di siti che mettono a vostra disposizione molte risorse:

• Web 2.0 how-to design style guide
• Web 2.0 Design in a nutshell
• Web 2.0 Design Kit
• Web 2.0 Color Palette
• Web 2.0 style buttons

Buon lavoro!