Oggi vi presento Froglivery, un simpatico gioco in Flash. In questo gioco, come nel classico Frogger, protagonista è una rana che dovrete guidare in giro per la città a consegnare pacchi. Frecce direzionali per muoversi e barra spaziatrice per saltare da un edificio all’altro.

Per i nostalgici di Frogger, eccone uno realizzato in Flash: Frog crossroad

Articolo di: Emanuele Calì per EmaWebDesign :: Web Programming / Web Design

Come ogni settimana ecco i posts più interessanti:

01) Vacanze 2.0: I Social Network Per Pianificare Il Tuo Viaggio

02) Guida di apprendimento di Flash Video

03) I Migliori Plugin Jquery Con Effetto Lightbox

04) Cos’è la risoluzione di un’immagine

05) Una Raccolta di SEO Tools Sempre Utili

06) Come vendere pubblicità tramite le concessionarie pubblicitarie online

07) Pubblicità su Facebook: come fare

08) La longevità dei social network

09) Alcuni Grandi Fraintendimenti nella SEO

Articolo di: Emanuele Calì per EmaWebDesign :: Web Programming / Web Design

In questo breve tutorial vedremo come inserire il widget di un calendario nel proprio sito web utilizzando un plugin jQuery.

Per prima cosa, scarichiamo il plugin dalla pagina ufficiale: dynDateTime: calendar date and time picker

Scompattiamo l’archivio ZIP nella cartella del nostro sito e includiamo i files del plugin e di jQuery:

<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js”></script>
<script type=”text/javascript” src=”jquery.dynDateTime.js”></script>
<script type=”text/javascript” src=”lang/calendar-en.js”></script>
<link rel=”stylesheet” type=”text/css” media=”all” href=”css/calendar-blue.css”  />

Inseriamo nella pagina un DIV con ID univoco contenente un campo di testo e un button. Subito prima del div incolliamo il codice jQuery associandolo al div che in questo esempio ha id uguale a “timePicker“:

<script type=”text/javascript”>
jQuery(document).ready(function() {
jQuery(”#timePicker input“).dynDateTime({
button: “.next()” //next sibling
});
});
</script>

Abbiamo finito

Ecco il widget in azione: timePicker

Nella cartella CSS ci sono diverse skin da utilizzare per il calendario, se non ci piacciono possiamo sempre realizzarcela da soli

Articolo di: Emanuele Calì per EmaWebDesign :: Web Programming / Web Design

Oggi aguzziamo l’ingegno (che per un programmatore è cosa buona e giusta) e vediamo come accedere a un elemento di una pagina web utilizzando PHP invece del DOM (getElementsByTagName).

Realizziamo un file HTML contenente un numero definito di DIV che non hanno un id univoco ma una stessa classe CSS:

<div class=”list”>Elemento 1</div>
<div class=”list”>Elemento 2</div>
<div class=”list”>Elemento 3</div>
<div class=”list”>Elemento N</div>

Per ogni DIV ci sarà un button che richiamerà una funzione javascript passando il numero del div, stampato dinamicamente grazie a PHP con un ciclo FOR:

<input type=”button” value=”Seleziona” onclick=”javascript:seleziona(<?php echo($i); ?>)” />

La funzione JS stampa con un alert (o il DOM se preferite ) l’elemento selezionato.

Ecco lo script in azione

download: DOM Alternativo in PHP (720B) added: 07/07/2009 clicks: 11 description: Accedere a un elemento della pagina web utilizzando PHP invece del DOM (getElementsByTagName)

Articolo di: Emanuele Calì per EmaWebDesign :: Web Programming / Web Design

Di seguito i posts più interessanti della settimana:

01) 10 Interesting fonts for web designers

02) 5 Concetti da non trascurare per un progetto Web 2.0

03) Mostrare i Commenti Recenti in Wordpress

04) La funzione body_class() di Wordpress 2.8

05) Come scrivere un post da 32.000 visitatori

06) Flickr integra Twitter

07) Il significato del logo e del nome di Firefox

08) Google Web Search e Google Blog Search: c’è una grossa differenza…

09) WordPress: creare Loop con query personalizzate

10) Microblogging war o sfida finale sulla Search?

Articolo di: Emanuele Calì per EmaWebDesign :: Web Programming / Web Design

Nel post “Implementare un sistema tipo Google Suggest con jQuery” vi illustrai come implementare, tramite un plugin per jQuery, un sistema di completamento automatico tipo Google Suggest.

Tutzone ci segnala ben 15 tecniche per implementare un sistema del genere, alcune sono davvero accattivanti dal punto di vista grafico.

Ecco il link all’articolo: 15 Best Techniques For Implementing Autosuggest With AJAX Into Your Site

Articolo di: Emanuele Calì per EmaWebDesign :: Web Programming / Web Design

Il meta tag più conosciuto e utilizzato è il “keywords“, quello che permette di specificare una serie di parole chiave che possano aiutare una pagina web in chiave SEO.

In realtà, il meta tag più importante che non và assolutamente trascurato e, che invece viene spesso ignorato, è il description. Il meta tag description serve a specificare una breve descrizione dei contenuti della pagina web a cui appartiene informando quindi l’utente sul contenuto della pagina che sta per visualizzare.

Perchè è importante il meta tag description?

Come appena detto, è utile al lettore per capire quale contenuto sta per visualizzare ma è importante anche in chiave SEO. Se nel tag description si ripetono le parole chiave già presenti nel tag title e nel corpo della pagina si può ottenere un beneficio per quanto riguarda l’indicizzazione.

Inoltre, i motori di ricerca, lo prendono come riferimento per fornire una descrizione delle pagine web elencate nelle SERP. Non dotare una propria pagina del tag description indurrà il motore ad estrapolare una parte del testo (detto snippet) che può risultare la meno efficace a convincere l’utente a visualizzare la nostra pagina/articolo.

Quindi come mi devo comportare?

01) Scrivi, per ogni pagina/articolo, descrizioni in maniera accurata ma sintetica ed includi le parole chiave più rilevanti.

02) Differenzia le descrizioni da pagina a pagina.

03) Se cambi il contenuto di una pagina/articolo ricorda di modificare il meta tag description in modo da renderlo coerente con il contenuto.

Se vuoi dire la tua o fare una domanda lascia un commento

Articolo di: Emanuele Calì per EmaWebDesign :: Web Programming / Web Design

Di seguito i posts più interessanti di questa settimana:

01) Nuove procedure per la registrazione di domini .it

02) 6 fantastici trucchi per Facebook!

03) Alcuni Buoni Consigli per Progettare un Buon Layout

04) Come creare un widget in WordPress 2.8?

05) Protocollo Https: cos’è e perchè usarlo

06) Futurebox: Lightbox Senza Javascript!

07) Tutorial Flash AS3: Caricare un filmato SWF Esterno

08) Super simple way to work with Twitter API (PHP + CSS)

09) Cosa Ho Imparato nel Disegnare il Mio Background per Twitter

10) Creare una pagina di lavori in corso (sito in manutenzione) in Wordpress

Articolo di: Emanuele Calì per EmaWebDesign :: Web Programming / Web Design

Quando scriviamo un articolo per il nostro blog evidenziamo i termini più importanti e/o che meritano l’attenzione del lettore tramite l’utilizzo del grassetto. Nei contenuti testuali di siti e blog sono presenti parole chiave (keywords) importanti dal punto di vista SEO e, anche queste sono evidenziate in grassetto (forse non è così per i siti non ottimizzati SEO).

Il grassetto si può ottenere con due tag, il tag b e il tag strong. Il tag b è deprecato dal W3C che al suo posto ha introdotto il tag strong ma, ancora oggi, molti web designer ne fanno uso ben sapendo che dal punto di vista “visivo” i due tag producono il medesimo risultato.

Il tag strong, in realtà, ha un valore semantico che comunica un’enfasi maggiore sulle keywords a cui è attribuito ed è bene utilizzarlo abbandonando il tag b. Questo vuol dire che strong trasmette al lettore (ma anche ai motori di ricerca) un’importanza significativa rispetto al resto del contenuto testuale per questo và utilizzato in modo oculato per agevolare la lettura del contenuto e aiutando il lettore ad “indirizzarsi” su quello che conta particolarmente.

Evidenziare termini poco significativi con il tag strong non aiuterà dal punto di vista SEO e farà perdere di vista al lettore le cose importanti, magari, convincendolo ad abbandonare la pagina web in questione. Un buon uso del tag strong non permetterà a nessuno di scalare le SERP con certezza assoluta e finire in prima pagina ma, evidenziando le keywords più importanti che poi sono le stesse ripetute nei meta tag title e description e nelle intestazioni (h1,h2 ecc.), questo porterà indubbiamente benefici sul posizionamento della pagina.

Qual’è la tua esperienza personale, hai abbandonato il tag b in favore del tag strong? Hai notato miglioramenti in chiave SEO?

Articolo di: Emanuele Calì per EmaWebDesign :: Web Programming / Web Design

Un vero peccato, l’applicazione sembra davvero eccellente, potete vederla in azione nel seguente video:

Articolo di: Emanuele Calì per EmaWebDesign :: Web Programming / Web Design