mercoledì 21 novembre 2007

Javascript FX

0 commenti
Un ottimo sito che contiene una vasta raccolta di Javascript già pronti all'uso. Menu, rollover, animazioni, slideshow... Insomma ce n'è per tutti i gusti, e alcuni veramente utili.

Link: http://www.javascript-fx.com/index.php?page=scripts
Leggi tutto...

ContextualAdv con eDintorni

0 commenti
* Tratto dal sito http://www.desmm.com/contextualadv-con-edintorni-311.html

Ho trovato questo articolo molto interessante, per cui ve lo ripropongo quasi integralmente:

"
Da qualche tempo sto testando una nuova affiliazione. Questa forma di pubblicità ha la possibilità di risiedere direttamente tra le parole degli articoli da voi scritti. Il grande vantaggio di questo formato, è la sua immediata visibilità, in quanto visivamente presente dove il visitatore è interessato dall’articolo. Passando col mouse sopra le parole che il sistema ha ritenuto sponsorizzabili, e quindi ben marcate, comparirà sotto forma di layer fluttuante il messaggio pubblicitario, che darà al visitatore l’immediata certezza che si tratti di uno spot prima di essere cliccato…

eDintorni ContextualAdv

Chi volesse implementarlo, deve subito rendersi conto che lo spider, al quale dovrà essere consentito il transito, analizzerà tutte le parole presenti nella pagina e farà la scelta che più si addice ai testi presenti, tenendo conto delle parole ricorrenti. A tal proposito è opportuno intervenire con degli appositi TAG da inserire nelle parti di testo (tipo testata, footer, barre laterali…) al quale noi non desideriamo mostrare questa forma di pubblicità.

Iscriversi a eDintorni è semplice, ed oltre al servizio sopracitato potreste scegliere anche il classico ContextAdv con gli annunci posizionabili, simil AdSense. Il vostro sito che iscriverete, dovrà avere dei validi contenuti e verrà esaminato per poter essere ritenuto valido, per quindi poter iniziare ad usufruire dei loro servizi grazie ad un vostro codice ID personale.

Per iscriversi: http://registrazione.edintorni.net/contextadv.asp
Per maggiori dettagli o qualsiasi dubbio, potrete contare sulle varie informazioni presenti sul sito o direttamente dalla valida e cortese assistenza di eDintorni, come io stesso ho fatto."


* Tratto dal sito http://www.desmm.com/contextualadv-con-edintorni-311.html

Leggi tutto...

PHP: Impedire che un utente inserisca dati doppi nel db

0 commenti
Può succedere che effettuando un refresh della pagina, o tornando indietro di una schermata con l'apposito tasto del browser, il nostro sbadato utente possa erroneamente inviare due o più volte lo stesso form, con gli stessi identici dati, creando degli scomodi doppioni nel nostro database.
Una semplice soluzione ce la fornisce questa PILLOLA del forum di html.it, scritta dal bravissimo piero.mac.
E' sufficiente utilizzare il codice che ci propone per ovviare a questo fastidioso problema!

Link: http://forum.html.it/forum/showthread.php?postid=7161564
Leggi tutto...

martedì 20 novembre 2007

10 Consigli per un Form Migliore

0 commenti
Come ben sanno i web designer, creare un buon form e renderlo accessibile al 100% non è un'impresa facile. Spesso un form mal disegnato o mal programmato spinge il possibile utente a non utilizzarlo, eludendo completamente lo scopo per il quale era stato creato.
In questo fantastico articolo, uno dei migliori che abbia mai letto sull'argomento, vengono spiegati in dettaglio tutti gli aspetti fondamentali di un form, con consigli mirati e link a risorse online.
Veramente utilissimo per qualsiasi programmatore degno di questo nome.

Link: http://www.gdesign.it/pages/howto/articoli/bform/bform.php
Leggi tutto...

Creare un semplice sistema di ricerca in PHP e MYSQL

0 commenti
In questo tutorial pubblicato da sastgroup.com, vediamo come sia possibile realizzare un form per la ricerca di dati, ad esempio articoli, in una o più tabelle di un database. La traduzione dall'inglese non è completa, e il link originale non è più attivo, ma il codice è comunque chiaro e comprensibile.

Link: http://www.sastgroup.com/tutorials/creare-una-semplice-sistema-di-ricerca-in-php
Leggi tutto...

Realizzare un sondaggio con PHP e MYSQL

0 commenti
Vi segnalo questo interessante tutorial di giorgiotave.it, che spiega come realizzare e pubblicare nel proprio sito un sondaggio in PHP e MYSQL.
Link: http://www.giorgiotave.it/tutorial/sondaggio.php
Leggi tutto...

CSS: i bug dei browser spiegati in dettaglio

0 commenti
Quanti di voi programmatori hanno dovuto inventarsi chissà quale compromesso, o rinunciare a qualche fantastico effetto, perchè il relativo comando CSS non era pienamente supportato da qualcuno dei browser attualmente in circolazione? Molti di voi, credo!

Ho trovato questo interessante sito, che spiega in dettaglio i vari hack e le possibili soluzioni per evitare tutti questi fastidiosissimi contrattempi.

Bugs di Internet Explorer 5 e successivi: http://www.positioniseverything.net/explorer.html

Bugs di Opera 6 e precedenti: http://www.positioniseverything.net/op-omnibus.html

E molti altri interessanti articoli!



Articolo originale su: http://www.positioniseverything.net/
Leggi tutto...

Calendario eventi in PHP

0 commenti
Calendario in PHPIn giro per i vari forum di PHP, ho visto che spesso uno degli aiuti più richiesti è "come creare un calendario dinamico". Questo tutorial ci viene proprio a puntino.
Ben scritto e perfettamente funzionante, spiega passo passo come realizzare un semplice calendario sempre aggiornato.
Molto utile!

Link: http://www.yappy.it/calendario_eventi_php.php
Leggi tutto...

Templates per siti web (free e non)

0 commenti
Leggi tutto...

Photoshop: disegnamo un pavimento

0 commenti

Ecco un nuovo interessante tutorial per effettuare un fotoritocco sul pavimento della vostra camera! Nell'articolo viene spiegato passo per passo come ottenere un pavimento assolutamente realistico con il solo Photoshop.

Link: http://www.rbird.com/movabletype/aboutdesign/archives/000254.php
Leggi tutto...

Ancora sul controllo dei form con javascript

0 commenti
Un'altro interessante tutorial su come effettuare un controllo dei dati inseriti in un form con javascript. In questo caso si tratta però di Unobstrusive Javascript, ovvero un javascript completamente distinto dal codice html, che come sempre è la scelta migliore.
Questo semplice codice permette di far apparire una piccola icona di errore a fianco dei campi che contengono valori errati.
Ricordo che in ogni caso è sempre meglio effettuare dei controlli sui campi sia prima dell'invio tramite javascript, sia dopo l'invio, con php o asp.

Link: http://onlinetools.org/articles/unobtrusivejavascript/chapter5.html
Leggi tutto...

Photo Widgets in Flash

0 commenti
Goodwidgets
Un amico mi ha segnalato questo interessante sito, che contiene una raccolta di photo widgets e slideshows completamente in flash. Gli effetti sono molto carini, e ce ne sono di diversi tipi. Inoltre, è possibile avere sia una versione free, sia una versione pro a pagamento.
Quel tocco grafico in più per il proprio sito, anche per chi non ha nessuna dimestichezza con Flash.

Link: http://www.goodwidgets.com/
Leggi tutto...

Form grafico con i CSS

0 commenti
E' il solito annoso problema. Il nostro grafico ci ha passato un file .psd con la grafica del sito da realizzare, ma, ahimè, il form è completamente grafico!!! Come fare per renderlo uguale con il solo uso dei CSS??? La soluzione c'è, e ce la fornisce come sempre css.html.it in questo utilissimo articolo. Assolutamente da non perdere!
Link: http://css.html.it/articoli/leggi/1999/form-grafico-con-i-css/
Leggi tutto...

Come formattare i tag cloud con i CSS

0 commenti
In questo interessante articolo pubblicato su css.html.it, l'autore ci spiega come formattare al meglio un tag cloud usando i css. Molto utile.

Link: http://css.html.it/articoli/leggi/2096/tag-cloud-con-i-css/
Leggi tutto...

Brilliant Button Maker

0 commenti
E' con molto piacere che vi segnalo questo straordinario sito, ideato e realizzato da Luca Zappa, dove senza alcuna perdita di tempo o particolare conoscenza grafica, potete creare in pochi click i vostri mini-bottoni personalizzati.
Per chi ancora non avesse capito cosa sono i mini-bottoni:

What are the "80x15 brilliant buttons"?
The "80x15 brilliant buttons", also known as "antipixel buttons" or "badges", are the very popular buttons especially used by bloggers, some examples:

example example example example example example example example example example example example example example

Ricordo il link completo: http://www.lucazappa.com/brilliantMaker/buttonImage.php
Leggi tutto...

Mini bottoni con i CSS

0 commenti
In questo semplice tutorial a cura di Alessandro Fulciniti, pubblicato su css.html.it, l'autore ci spiega come realizzare i simpatici mini-bottoni che troviamo sempre più spesso nei siti web. Di solito i mini bottoni contengono informazioni tipo "W3C Valid" o "XHTML 1.0 Valid", e sono molto usati dai web designer.
Link: http://css.html.it/articoli/leggi/1989/minibottoni-con-i-css/
Leggi tutto...

Photoshop: Disegniamo pulsanti Web 2.0

0 commenti

Questo interessante tutorial in lingua inglese vi spiega come disegnare i widgets per il vostro iPhone. La medesima tecnica può essere utilizzata per creare dei simpatici bottoni in stile Web 2.0 per il vostro sito.
Leggi tutto...

Aqua-Style con Illustrator

2 commenti
* Tratto dal sito http://bartelme.at/, in tedesco

Da quando Mac OS X ha introdotto l'Aqua-Style, questa tecnica è sulla bocca di tutti. In molti sono rimasti affascinati da questo stile e hanno provato a riprodurlo. Nel tutorial seguente, vi mostreremo come sia possibile creare con Illustrator un simbolo in perfetto Aqua-Style, in pochi semplici passaggi.


PRIMO STEP - IL CERCHIO SFUMATO

Apriamo Illustrator, clicchiamo sullo "Strumento Rettangolo" nella finestra "Strumenti". Tenendo premuto il pulsante del mouse per più di un secondo, apparirà un menu a tendina con svariate altre forme: scegliamo lo "Strumento Ellisse". Spostiamoci sullo stage. Tenendo premuto il tasto SHIFT della tastiera, disegniamo un cerchio perfetto della grandezza che preferiamo.

Ora probabilmente il cerchio sarà bianco con il contorno o "traccia" di colore nero.
Torniamo sulla finestra "Strumenti". Nella parte più bassa della finestra sono rappresentati due quadrati sovrapposti, uno intero e uno "bucato". Il quadrato intero indica il colore di riempimento, mentre il quadrato bucato indica il colore del contorno o "traccia".
Selezioniamo il quadrato "bucato", che si porterà così in primo piano, e facciamo doppio clic su di esso. Si aprirà così la finestra "Selettore colore". Scegliamo un colore blu, ad esempio #000099.
Ora il nostro cerchio sarà bianco con il bordo blu.

NOTA BENE! Per poter cambiare la colorazione del cerchio, questo deve sempre essere selezionato! Per vedere se è selezionato, dobbiamo verificare che sia circondato da un tracciato blu chiaro. Se il nostro cerchio non è più selezionato, è sufficiente usare lo "Strumento Selezione" (la freccia nera) della finestra Strumenti. Clicchiamo sulla freccia, e clicchiamo sul nostro cerchio. Ed eccolo magicamente selezionato!!!

Per dare l'idea della profondità, dobbiamo applicare una sfumatura radiale.
Clicchiamo sul quadrato "intero" per portarlo in primo piano.
Ora dal menu principale selezioniamo "Finestra" e quindi "Campioni". Si aprirà così una finestra laterale che contiene diversi riempimenti. Selezioniamo la "Sfumatura radiale viola" (un cerchio grigio/viola sfocato in campo viola).

A questo punto il nostro cerchio avrà una sfumatura radiale, ma del colore sbagliato. Come possiamo modificare il colori della sfumatura? E' molto semplice!
Dal menu principale scegliamo "Finestra" e quindi "Sfumatura". Si aprirà una finestra laterale con diverse linguette, tra cui quella relativa alla "Sfumatura". Clicchiamo sulla linguetta e, tenendo premuto il pulsante del mouse, trasciniamo la finestra "Sfumatura" sullo stage. Clicchiamo più volte sulla doppia freccia che appare accanto alla dicitura "Sfumatura", fino a che non appare una barra colorata dal bianco al viola.
Facciamo doppio click sul quadratino bianco posto all'inizio della barra, e automaticamente si aprirà la finestra laterale "Colore". I valori presenti saranno R 255 G 255 B 255, poichè il centro della sfumatura è bianco. Modifichiamo questi valori, e quelli degli altri due quadratini, come da immagine sottostante, e otteremo una splendida sfumatura blu.

Primo step Colori


Per creare un effetto più realistico, dobbiamo applicare il gradiente appena creato un po' più in basso della metà. Per fare ciò, selezioniamo lo "Strumento Sfumatura" dalla finestra Strumenti (il rettangolo sfumato), e quindi clicchiamo sulla parte più bassa del nostro cerchio, e, tenendo premuto il mouse, tracciamo una linea leggermente inclinata verso l'alto. Dovremmo ottenere questo risultato:

Primo step



SECONDO STEP - IL RIFLESSO

Ora selezioniamo di nuovo lo "Strumento Ellisse" dalla finestra "Strumenti", e disegniamo una ellisse, posizionandola come nell'immagine sottostante:

Secondo step

L'ellisse da noi creata, però, sarà probabilmente sfumata come il primo cerchio, e non bianca. Per farla diventare bianca, modifichiamo i colori di riempimento e di traccia. Selezioniamo il quadrato "intero", facciamo doppio clic, e nel "Selettore colore" scegliamo il bianco. Ora selezioniamo il quadrato "bucato", e clicchiamo sul quadratino bianco con un segno rosso, posizionato proprio sotto ai due quadrati sovrapposti. In questo modo decidiamo che il nostro oggetto non ha una "traccia".

Dal menu principale selezioniamo "Finestra" e quindi "Trasparenza". Settiamo l'opacità di questo secondo cerchio al 40%.


TERZO STEP - MASCHERA DI OPACITA'

Per rendere l'effetto un po' più soft, usiamo la "maschera di opacità". Selezioniamo il cerchio, apriamo la finestra "Trasparenza", clicchiamo sulla freccetta che va verso il basso e scegliamo la voce "Crea maschera di opacità".

Il nostro secondo cerchio è sparito! Nessuna paura: clicchiamo sul quadrato nero (la maschera) e deselezioniamo la voce "Ritaglia". A questo punto il nostro secondo cerchio sarà identico a prima.
Ora selezioniamo lo "Strumento Rettangolo" dal menu "Strumenti", e disegniamo un rettangolo attorno alla nostra piccola ellisse. Ora selezioniamo il colore di riempimento, e dalla finestra "Campioni" (oppure dalla barra in alto, accanto alla dicitura "Tracciato"), selezioniamo il colore "Sfumatura lineare 1". A questo punto selezioniamo lo "Strumento Sfumatura" dalla finestra Strumenti, clicchiamo nel punto più alto della nostra ellisse, e tracciamo una retta verso il basso.

Ecco applicata una maschera di opacità ("opacity mask") sfumata al nostro riflesso!!!

Maschera


Finito! abbiamo ottenuto un bellissimo simbolo Aqua-Style!

Questo tutorial in lingua originale, esempi e download su http://bartelme.at/journal/archive/aqua_style_mit_illustrator/.
Leggi tutto...

Photoshop: Fontana della Giovinezza

0 commenti
Ringiovanire un volto
Chiunque farebbe carte false pur di cancellare i segni del tempo dal proprio volto... Ebbene, da oggi si può, e tutto in pochi minuti!!! Sì, avete capito bene, peccato che questa straordinaria tecnica funziona solo sulle vostre foto, e non su voi stessi!
In questo fantastico tutorial per Photoshop, pubblicato su www.richgentlemenhide.com, l'autore vi spiega passo passo come cancellare ogno traccia di vecchiaia da una normalissima foto. Assolutamente da provare!
Leggi tutto...

Photoshop: Matte Painting

0 commenti

La tecnica Matte Painting è utilizzata moltissimo nella cinematografia. I colossal dei giorni nostri abusano di questa tecnica, che praticamente non è altro che l’inserimento di effetti speciali successivi alle riprese sostituendo fondi o aggiungendo elementi. Sul sito www.desmm.com trovate tutte le informazioni e le risorse in rete su questa affascinante tecnica, che possiamo realizzare anche con il nostro amato photoshop.
Leggi tutto...

Layout con i CSS

0 commenti
Layout CSS
La cosa più difficile per chi si appresta ad usare per la prima volta i CSS è creare il layout. Ma da oggi ci pensa Code Sucks! Qui trovate 42 fantastici layout già belli pronti da scaricare. Voi ci dovete solo mettere i vostri colori e la vostra fantasia, il resto è già fatto!!! Buon lavoro!
Leggi tutto...

Photoshop: Creare un badge in stile Web 2.0

0 commenti

Sul sito www.ajaxlessons.com ho trovato questo interessante tutorial, che spiega passo passo come realizzare con photoshop un badge in perfetto stile Web 2.0. Da vedere!
Leggi tutto...

Photoshop: Web 2.0 Design Kit

1 commenti

Oggi vi voglio segnalare questo interessante tutorial, dal sito www.photoshoplab.com.
Il tutorial spiega come realizzare un pattern a linee diagonali, che sempre più spesso viene usato come sfondo nei siti web, e come creare forme dagli angoli arrotondati, il tutto ovviamente con photoshop.
Leggi tutto...