WalterWeb.net

Qui voglio illustrare un metodo CSS per la realizzazione di siti web con un rollover delle immaginisui link. Non si basa sul semplice preload della seconda immagine che si carica al passaggio del mouse, ma si combinano i due stati del link ( a:link e a:hover )  in un’unica immagine e si agisce sulla sua posizione ottenendo così un rollover istantaneo senza la necessità di caricare immagini aggiuntive. Questo metodo è molto interessante perchè riesce ad ovviare il bug che si presenta soprattutto con internet explorer 6 che lascia un vuoto per qualche secondo nell’immagine rollover, in attesa di caricamento al passaggio del mouse.

Tutto viene fatto con unà proprietà CSS, molto conosciuta dai webdesigner : background-position.

Infatti il rollover istantaneo viene ottenuto variando le coordinate dell’immagine stessa, in questo modo :

a.prova{
display:block;
width: 250px;
height: 55px;
background: url(logo.png) no-repeat 0px 0px;
}
a.prova:hover{
background-position: 0px -55px;
}

Questa semplice regola CSS permette di effettuare quindi un rollover di un immagine in maniera istantanea senza Read more…

Una semplice guida su come implementare ombre su immagini, testo e textbox usando la proprietà filter: shadow(); con i CSS senza l’uso di immagini che vanno ad “appesantire” la pagine condizionando il tempo di caricamento.
Questo metodo è supportato solo da INTERNET EXPLORER di Microsoft.
Nel primo esempio viene visualizzato un textbox con ombra in basso a sinistra, semplicemente attribuendo le proprietà color, strenght e direction in questo modo

filter: shadow(color:#CCCCCC, strenght:2, direction:220);

Possiamo giocare con le proprietà css a nostro piacimento, secondo le esigenze di design del vostro sitoweb.
Nel secondo esempio abbiamo del semplice testo con un ombra applicata nella parte bassa semplicemente cosi

filter: shadow(color:#CCCCCC, strenght:10, direction:180);

Nel terzo esempio viene inserita un’ombra in basso a destra di un’immagine, in questo modo

filter: shadow(color:#CCCCCC, strenght:10, direction:135);

Il sito web www.tuttowebmaster.it offre una serie di funzionalità per ottimizzare al meglio il vostro sito web. Nella sezione Strumenti SEO troviamo alcuni strumenti di controllo per tenere sotto controllo i propri Tag META , controllare le parole chiave, la presenza di link errati e il calcolo del tempo di caricamento di una pagina web. Inoltre offre anche un servizio di ottimizzazione delle immagini e generatori automatici di tag META da inserire direttamente nel tag <title> di una pagina web.

Nella sezione Guide SEO ci sono consigli su indicizzazione, ottimizzazione, e per un migliore posizionamento nei motori di ricerca. Presenta anche una sezione di Directory dove poter segnalare il proprio URL nelle varie categorie presentate.