Video For Everybody è un blocco di codice scritto interamente in HTML, utilizzato per poter inserire contenuti video con il tag <video> nelle pagine, che sfrutta il nuovo standard del codice ipertestuale in oggetto.

La potenzialità di questo blocco di codice risiede nel fatto che è adattabile a diversi browser: Internet Explorer e il nuovo standard HTML5 non vanno d’accordo? Nessun problema. Video For Everybody trasformerà, automaticamente, il video in un contenuto QuickTime e verrà avviato senza ulteriori problemi di compatibilità. Nel caso in cui non dovesse funzionare il plugin per QuickTime o, per altri motivazioni il vostro broswer non lo supporta, verrà avviata la riproduzione previo l’utilizzo di Adobe Flash.

Per una completa affidabilità browser-wide, i video realizzati devono essere codificati in MP4 oppure OGG e, in aggiunta, esso non utilizza alcun tipo di javascript (per selezionare il tipo di broswer), ma si basa sulla tecnologia RSS readers.

Questa è una pagina test, progettata dagli sviluppatori, necessaria a provare la compatibilità su diversi browsers.

Il PageRank è un algoritmo proprietario di Google, in base al quale, il colosso di Mountain View, stabilisce il posizionamento dei siti web nelle pagine di ricerca (SERP). Al giorno d’oggi, per consultare il PageRank si può ricorrere ad alcuni servizi offerti da altri siti, oppure tramite l’installazione di plugin in browser come Firefox e Google Chrome.

Tuttavia è impossibile valutare il PageRank di più siti contemporaneamente effettuandone, magari, un paragone. Chi si trova in una difficoltà del genere può ricorrere a questo praticissimo tool per Mac che vi propongo oggi: PageRank Viewer. In una finestra simile a quella pubblicata in alto, potrete inserire una lista di siti web (fino ad un massimo di 30) ed esso elaborerà i PageRanks per voi. L’ultima versione, l’1.5 è shareware e costa 29,97 €, ma potete scaricare la versione precedente completamente gratuita con la limitazione a 20 siti per volta.

Dovete gestire i vostri contenuti in più schede? Devono essere visualizzate, scheda per scheda, con i rispettivi tasti di collegamento? Ecco il plugin che fa per voi.

Nel web designing moderno è di moda suddividere i contenuti in sezioni, categorie e schede, sia per rendere il sito più fruibile e scorrevole per gli utenti, ma anche per avere sempre sotto controllo la struttura generale. Inoltre, dividere del testo in più schede, consente l’integrazione di più materiale e, contemporaneamente, ne aumenta l’accessibilità.

Sweet Tabs è scritto in AJAX ed è molto affidabile in quanto è ormai alla versione 1.4.

Demo | Downlaod

Oggi vi propongo dei menu navigator in HTML con il layout già prestabilito e installabile “al volo” su un una vostra pagina. Le anteprime le potete osservare nell’immagine in alto e, come avrete notato, vanno dallo stile stravagante con pattern (in alto) a quello semplice ed elegante (quelli più in basso).

Le immagini di base di questi navigator sono fornite nelle cartelle compresse in basso; inoltre, all’interno di questo file, troverete anche la pagina HTML con il navigatore funzionante e il file CSS per la gestione del mouse positioning.

Questo materiale, prelevato dal sito www.psdgraphics.com, è freeware anche a scopo commerciale.

Green stars CSS navigation
Purple CSS navigation
Orange halftone CSS navigation
Blue waves CSS navigation
Rainbow colors CSS navigation
Gray grunge CSS navigation
Yellow abstract CSS navigation
Blue abstract CSS navigation

gMap è un leggerissimo plugin in jQuery per integrare la mappa di Google in qualsiasi sito web.

Esso è semplicemente inserito attraverso il codice HTML con la seguente funzione:

$("#map").gMap();

Può essere, ovviamente, configurato con molti parametri quali la selezione della mappa attraverso latitudine/longitudine, livello di zoom, marcatori di posizione con le classiche finestre pop-up (come in foto), presenza o meno dei controlli sulla sinistra e tanto altro…

Ecco qualche esempio.

Buon embedding!

slideViewerPro è una galleria completamente personalizzabile in jQuery attraverso il CSS, deriva dal plugin slideViewer, ma con altre features.

La galleria è formata da una lista unordered con qualsiasi numero di immagini.

Alcune caratteristiche personalizzabili sono: didascalie, riproduzione casuale, pulsanti di avanzamento, definire l’animazione e il tempo delle slides e molto molto altro.

Quando un Web Designer visita un sito, visualizza un’immagine o qualsiasi altro elemento, spesso, desidera conoscere le dimensioni dei contenuti.

Pixus è un’applicazione open source scritta con il framework AIR di Adobe che, attraverso il drag and drop dei bordi della finestra principale, stampa le dimensioni del contenuto misurato in pixel.

Ti interessa conoscere la dimensione dello spazio vuoto fra due oggetti in una pagina html? Ti serve sapere la dimensione di un determinato banner su un blog? Nessun problema: apri Pixus, trascina la sua interfaccia user-friendly nella posizione desiderata, segna le dimensioni.

Era da tanto tempo che cercavo un’applicazione del genere: davvero semplice, utile ed immediata.

Avete bisogno di ispirazioni per il design di footers? Ecco il sito che fa per voi.

La parte in coda di ogni sito web, attualmente, è largamente utilizzata per fornire al visitatore una buona navigazione e altre informazioni. Footerama è una galleria di footers che può aiutarvi alla scelta dei colori, nello stile del contenuto e negli elementi che lo costituiscono.

I footers mostrati sono disposti in categorie in base ai temi ed i colori e viene aggiornato frequentemente.

MarkerCss è un framework contenente codice open source per poter realizzare siti web con i templates offerti. Esso è composto da una serie semplicissima di fogli di stile CSS che caratterizzano gli elementi del contenuto delle pagine: bordi, sfondi, links, testi, colori e tabelle.

Esso include una serie di references prestabilite, come la classe w10 (che può essere definita da 10 a 1000) che determinerà la larghezza di un elemento in 10px (o altro), o per esempio la classe p5 (definita da 5 a 50) che aggiungerà un padding di 5px all’elemento a cui si riferisce.

C’è una lista di esempi fornita dal sito che lascia intuire meglio tutte le funzionalità di questo interessante, funzionale e pratico framework.

Attraverso i templates di Wordpress è semplicissimo aggiungere blocchi di codice, che siano Google AdSense o altro, attraverso il semplice editing dell’html. Oggi però voglio proporvi un tutorial per poter inserire del codice in ogni post pubblicato dal popolare cms ed utilizzare le funzioni in php.