var mysite = {
    'url': "http://www.ajaxweb20.net",
    'author': "Giuseppe Raso",
    'xhtmlValid': true,
    'cssValid': true
}
Home > Blog

Archive for Ottobre, 2007

10 + 1 trucchi riguardanti i CSS che non puoi non conoscere

Lunedì, Ottobre 8th, 2007
  • La scorciatoia font
    Capita spesso di imbattersi in cose del genere: font-size: 1em; line-height: 1.5em; font-weight: bold; font-style: italic; font-variant: small-caps; font-family: verdana,serif; Tale spreco può essere risolto facilmente usando la shortcut font: font: 1em/1.5em bold italic small-caps verdana,serif L’importante è ricordare di specificare sempre font-size e font-family.
  • Due classi insieme
    A differenza della maggior parte degli attributi che possono avere un solo valore, l’attributo class può avere due o più valori, purchè separati da spazio: <span class="test1 test2">text</span>
  • Il valore di default di border
    Il modo ritenuto più veloce per dare un bordo ad un elemento è questo: border:2px solid #000; In realtà l’unico valore veramente richiesto è border-style; ciò vuol dire che se non vogliamo cambiare border-width e border-color possiamo semplicemente scrivere qualcosa del genere: border:solid;
  • Gli hack per IE
    Gli hack permettono di eseguire del codice css solo su IE. Visto che l’argomento è di ampia trattazione vi rimando a questa guida.
  • Image replacement
    Inserire un logo nel nostro sito è molto importante per dargli un tocco di personalità; il lato negativo del logo è, che essndo costituito da un’immagine, viene completamente ignorato dai motori di ricerca. La tecnica dell’image replacement risolve il problema: basta inserire un titolo h1 e assegnargli tale regola: h1 { position:absolute; left:-2000px; } In questo modo si avrà anche un valido sostituito nei browser testuali.
  • Box model hack
    Immaginiamo di avere tali regole assegnate a un div con id test: #test { width:100px; border:5px; padding:20px; } In teoria il box dovrebbe essere lungo 150 px, bordi e spaziatura compresi. Purtroppo con IE5 e IE5.5 i bordi e il padding vengono inseriti all’interno del box, costringendoci perciò a usare il solito hack: #test { width:100px; \width:150px; w\idth:100px; } La prima regola è per tutti quei browser che pur aderenti agli standard non supportano lo slash come carattere di escape. La seconda regola funziona in tutti i browser che supportano i caratteri di escape, compreso IE5. La terza regola infine funziona con Firefox, Opera, IE6 e superiori ma non con IE5.
  • Allineare un box al centro orizzontalmente
    Tentati di usare il solito tag center? Conoscendo questa tecnica non ne avrete più bisogno: width:200px; margin:0 auto; Per IE5 è necessario utilizzare a nostro vantaggio il bug del text-align, il quale posiziona indiscriminatamente element inline e block: body { text.align:center; }
  • Allineare un box al centro verticalmente
    Allineare un box con le tabelle era veramente semplice: bastava usare vertical-align. Peccato che tale tecnica non funzioni con i box… Esiste comunque una soluzione alternativa, ovvero di dare un valore al line-height uguale a quello dell’altezza del box: height:200px; line-height:200px; Ricordiamoci però che con questa tecnica potremo inserire solo testo e per di più al massimo una riga.
  • Posizionare elementi dentro un box con posizione relativa
    Una tecnica molto efficace per meglio posizionare dei blocchi in maniera assoluta è di inserirli dentro un blocco con posizione relativa: <div id="container"><div id="box_absolute"></div> In questo modo i blocchi verranno posizionati non rispetto all’angolo superiore della pagina bensì rispetto all’elemento in cui sono contenuti. #container { position:relative; } #box_absolute { position:absolute; top:2px; left:5px; }
  • Le fake coloumns
    Capita spesso di avere due div affiancati, uno per il contenuto e l’altro per il menù. Supponiamo di voler colorare il div dei menù di verde e quello del contenuto in bianco. Certamente i due box avranno un’altezza diversa, e nessuna regola ci permetterà di risolvere tale problema ( se non usando javascript… ). In parole povere la colonna dei menù, essendo meno lunga, si spezzerà molto prima rispetto a quella del contenuto, creando così una sensazione di discontinuità grafica. L’unica soluzione è creare un’immmagine da dare come background a un div che contiene entrambi i box; quest’immagine deve ovviamente avere come background i colori scelti: #container { background:transparent url(bg.gif) repeat-y; }
  • Inserire png trasparenti anche sulle versioni di IE precedenti la 7
    Anche in questo caso vi rimando ad una guida già bella e scritta.

Fonte: evolt.org

Ecco come un vero Geek dice no alla guerra

Domenica, Ottobre 7th, 2007

Guardate che trovata da geek ha avuto questa ragazza:

Da oggi è possibile accedere a Second Life senza dover scaricare niente, direttamente dal proprio browser.

Domenica, Ottobre 7th, 2007

Chi conosce un minimo Second Life sà che per accedervi è necessario scaricare un client indipendente dal browser.
In questo modo è possibile godersi la grafica della città virtuale, cosa che sarebbe alquanto difficile da realizzare in un browser.
Ma cosa succede se ad esempio il vostro computer non è abbastanza potente per gestire il client oppure siete fuori e volete accedervi da un access point nel quale il client non è installato?
Bene, da oggi è possibile accedere a Second Life anche dal proprio browser: semplicemente andate su Movabe Life e inserite i vostri dati; non preoccupatevi, questi non sono salvati nel server di Movable Life bensì sono mandati direttamente a Second Life.

Dopo aver fatto una prova devo dire che in fondo non è male poichè permette di fare quasi tutte le cose che si possono fare su Second Life. Certo bisogna accontentarsi del fatto che è impossibile visualizzare il proprio avatar  e che i luoghi sono visualizzati con Google Maps…

Guida a come usare packed.it, il nuovissimo servizio che permette in pochi click di comprimere e unire i nostri file js e css.

Sabato, Ottobre 6th, 2007

Giammarchi se ne inventa una più del diavolo. Dopo bytefx, jstone e compagni, Andrea ci riprova con packed.it un servizio completamente online che permette di comprimere in pochissimi kb i propri file js e css.
Esistono già diversi servizi del genere ( il packer di Dean Edwards ad esempio ), ma nessuno arriva alla qualità di quest’utlimo.
Ma in che cosa consistono la novità di packed.it?

  • Unione di tutti i file sia .js che .css in un solo unico file compresso per renderne l’esecuzione e lo scaricamento più veloce.
  • Gestione non solo di codice Javascript, ma anche di codice CSS;
  • Algoritmo di compressione più potente e versatile rispetto ai concorrenti.

La lingua usata nel packed è l’inglese, poco male visto che dopo aver imparato usarlo è veramente semplice.
Prima di tutto andiamo nella pagina iniziale di packed.it e clicchiamo su "create project".
Nella barra laterale potete ora notare tre voci: "Javascript", "CSS" e "Optimise and Download" ( immagino che il loro significato sia scontato ).
A questo punto creiamo un nuovo file cliccando due volte sulla textarea oppure uploadiamone uno già presente nel nostro computer.
Cliccando sul nome di ogni file sarà possibile spostarlo o eliminarlo.
Dopo aver uploadato ed eventualmente modificato tutti i file non ci resta che cliccare su "Optimise and Download".
Nella pagina di Download potremo impostare vari parametri come ad esempio se minimizzare il file oppure di usare o no la compressione lato server.
 Una volta sicuri delle nostre scelte clicchiamo su "Start Optimizzation" e dopo qualche secondo su "Download".
Nello zip scaricato ci saranno file diversi a seconda se abbiamo lasciato il segno di spunta su "use server compression". In caso positivo , per includere il nostro file dovremo immettere il file packed.it.php ( o asp a seconda del linguaggio server side usato ):
<script src="packed.it.php" type="text/javascript"></script> Se vogliamo rendere il codice compatibile con IE5 è anche neccessario includere il file replace.js ( prima di packed.it.php ): <script src="replace.js" type="text/javascript"></script>
<script src="packed.it.php" type="text/javascript"></script>
Ovviamente dovremo copiare nel nostro webserver non solo i suddetti file bensì tutto ciò che c’era nello zip, compresa la cartella packed.it. Se invece abbiamo cacciato il segno di spunta scaricheremo il file .js nudo e crudo.
La differenza tra i due metodi, in parole povere, è che col primo metodo sia ha un’ottimizzazione ancora migliore; oltre a ciò se javascript è disabilitato nel client gli verrà dato in pasto un file css perfettamente leggibile.

Trucco legalissimo per scaricare e installare Internet Explorer 7 anche su versioni non genuine di Windows

Venerdì, Ottobre 5th, 2007

Da poche ore è finalmente possibile scaricare Internet Explorer 7senza dover superare il controllo WGA per riconoscere le versioni non genuine di Windows.
In realtà esisteva già una procedura per fare ciò, non dico come sia perchè ormai non interessa più a nessuno ma soprattutto perchè questa procedura era "leggermente" illegale.
Il link è questo: http://www.microsoft.com/italy/windows/downloads/ie/getitnow.mspx.
Attenzione però, dopo aver selezionato il vostro sistema operativo è necessario usare un piccolo "trucco"…
…semplicemente bisogna scegliere la lingua inglese.
Chiamarlo trucco è forse esagerato, comunque finchè non verrà rilasciata anche la versione italiana senza WGA non possiamo fare altro.

Inserire il bottone postli nel propri blog per segnalare un post a più di 50 social networks ( compresi OKNOtizie e Segnalo )

Giovedì, Ottobre 4th, 2007

La scena è praticamente identica in milioni di blog: alla fine di ogni post sono presenti una miriade di bottoni per segnalare il proprio articolo ai più famosi social network.

La cosa è alquanto scomoda, sia perchè costringe a inserire manualmente tutti i bottoni, sia perchè tutte quelle icone non fanno altro che infastidire e confondere.
Come fare allora a mantenere un compromesso tra la facilità di segnalazione ai vari social network e tra il numero di icone?
La soluzione ce la danno servizi come addThis o Social Poster, peccato che siano entrambi in lingua anglosassone.
Il servizio che vi propongo oggi è invece l’italianissimo Post<li>, il quale oltre a non avere niente da invidiare ai concorrenti permette anche di segnalare un articolo su OKNOtizie e Segnalo, gli equivalenti italiani di Digg e Delicious.

Provando a mettere questo bottone sui miei blog ho però riscontrato un problema: la procedura di installazione del plugin ( è semplice codice html ) descritta nella documentazione ufficiale non è corretta per alcune piattaforme.

Dando per scontato che la procedura sia corretta almeno per Wordpress, vi fornisco qui di seguito una guida per inserire il bottone in Splinder e in Blogger.

Splinder

  1. Andate in "Blog/Templat"e e accedete al codice HTML del vostro blog
  2. Cercate la riga <i><$BlogItemCategories$></i>
  3. Inserite subito dopo la riga cercata il seguente codice, sostituendo a blogmega il nome del vostro blog: <a href="http://postli.com/post?u=http://blogmega.splinder.com<$BlogItemPermalink$>&t=<$BlogItemTitle$>" style='display:block; margin:10px 0px; color:blue; text-decoration:none; font-size:20px' title='Post to Postli'>post<span style='color:orange'><</span><span style='color:red'>li</span> <span style='color:orange'>></span></a>

Blogger

  1. Cliccate su "Modello" e poi su "Modifica HTML".
  2. Mettete un segno di spunta su "Espandi i modelli widget"
  3. Cercate la riga <p class=’post-footer-line post-footer-line-3′/>
  4. Inserite subito dopo la riga cercata il seguente codice: <a expr:href='"http://postli.com/post?u=" + data:post.url + "&amp;t=" + data:post.title' style='color:blue; text-decoration:none; font-size:20px' title='Post to Postli'>post<span style='color:orange'>&lt;</span><span style='color:red'>li</span><span style='color:orange'>&gt;</span></a>

Nonciclopedia, tutto ciò che Wikipedia non dice

Lunedì, Ottobre 1st, 2007

Stanchi del solito Wikipedia, di tutte quelle informazioni correttine che ti danno il voltastomaco?
In questo caso Nonciclopedia è ciò che fa per voi: una enciclopedia universale dove le informazioni fornite sono al limite dell’assurdo. Basta leggere la biografia di Chuck Norris per rendersene conto:

Chuck Norris (Regno dei Cieli, Inizio dei Tempi - immutabile e imperituro) è tutto e niente.
È l’alfa e l’omega. Lo zero e l’infinito (due volte).
È anche il Fondatore e l’Amministratore Supremo di Nonciclopedia.
Attua il Suo volere per mano degli admin.

Non mancano le istruzioni per essere certi di essere bannati da un forum:

Muro contro muro

  • Voto:4/5
  • Tipo:Faticosa
  • Numero di interventi necessari:Alto
  • Probabilità di insuccesso:Basse

Tecnica

Ecco come vi ridurrete tentando l'impresa se capitate su un forum di santi.

Ecco come vi ridurrete tentando l’impresa se capitate su un forum di santi.

  1. Cercate un forum di appassionati di qualcosa o di una qualche minoranza (per esempio Gay) o di qualche partito politico.
  2. Affermate l’esatto contrario di quello che viene affermato nel suddetto forum in modo gentile, e pacato.
  3. Aspettate una risposta…
  4. Analizzate il tipo di risposta per procedere. Vi sono 2 possibili reazioni:
    • Gli utenti del forum cominciano ad insultarvi.
    • Gli utenti del forum sono civili e negano le vostre idee in modo gentile.
  5. Ora: nel primo caso complimenti! Avete dato inizio ad una flamewar! Continuate a rispondere a tono in attesa del ban. Nel secondo caso dite che hanno offeso i vostri sentimenti e cominciate ad insultare.
  6. Se ancora non rispondono a tono continuate ad insultare.
  7. Se non funziona ancora.
  8. E ancora
  9. E ancora…
  10. Va beh a questo punto rinunciate…
  11. Mi spiace. Sono dei santi!

Non mi bannano: cosa è andato storto?