Stylebot è un addon di Chrome per modificare i CSS del blog.

Quando usavo Firefox, l'estensione di elezione per investigare sui CSS di una pagina web era Firebug che permette di trovare facilmente i fogli di stile di un determinato elemento. Ora prevalentemente uso il browser Chrome che trovo migliore sotto molti punti di vista rispetto a Firefox. Internet Explorer non l'ho mai preso in considerazione.

 

In poco tempo il browser di casa Google ha accumulato una quantità di componenti aggiuntivi veramente notevole che facilitano la navigazione e la produttività. Cliccando su una pagina web con il destro del mouse e selezionando Ispeziona Ispeziona elemento si apre una finestra a fondo pagina simile a quella di Firebug su Firefox. Però non ho mai trovato questo tool particolarmente utile.

 

Stylebot è invece un addon di Chrome che è più semplice da utilizzare di Firebug e che può aiutare moltissimo gli utenti di Blogger a modificare l'aspetto dei loro modelli. Dopo l'installazione non occorre riavviare il browser e si visualizzerà l'icona di Stylebot (CSS)alla fine della barra degli indirizzi.

 

Come caricare e modificare file su Google Sites.

Google Sites è uno dei tanti servizi di Google che sono utilissimi per arricchire i contenuti di un sito. Sono disponibili in rete le istruzioni per creare un sito con Google Sites e il regolamento del programma. Lo spazio su Google Sites viene offerto a chiunque abbia un account GMail o anche Google Apps che si ottiene per esempio acquistando un dominio personalizzato per il nostro blog su Blogger. Per iniziare si va su Crea in alto a sinistra.

Scegliendo il nome del sito automaticamente se ne determina anche l'URL. Ci sono a disposizione moltissimi modelli che possono servire per creare dei siti statici utili per certi progetti o usati come supporto a un blog. L'indirizzo del sito creato sarà

Gimphoto alternativa portatile ai costosi programmi di grafica.

Manipolare le immagini è una delle cose più comuni che si fanno con il computer. La maggior parte di queste operazioni non richiede un programma professionale specifico come potrebbe essere Photoshop e si possono agevolmente effettuare con software quali Paint, programma presente in tutti gli OS Windows, oppure con Paint.NET (scarica Paint.NET) che è una versione con più funzioni ma sempre gratuita o ancora con Pixlr (vai a Pixlr) che è probabilmente il miglior strumento online per la grafica.

Se si hanno delle esigenze superiori ma saltuarie tanto da sconsigliarci di spendere soldi per un programma costoso, possiamo installare Gimp (scarica Gimp) che è multipiattaforma (Windows, Mac e Linux), completamente gratuito con un sacco di funzioni che lo pongono quasi al livello di Photoshop.

Come scaricare migliaia di immagini natalizie da Office o crearle con Google Plus.

In questo periodo prenatalizio molte persone vanno alla ricerca di immagini per abbellire i loro blog o per creare delle composizioni particolari con oggetti di Clip Art legati al Natale. Microsoft Office Immagini ti offre la possibilità di scaricare gratis migliaia di immagini, foto, animazioni e suoni. E' presente un selettore in alto per cercare tra tutti gli elementi o per limitarsi per esempio alle immagini.

Si può inserire una parola chiave nel campo sottostante e quindi cliccare su Cerca. Alternativamente si può andare sugli album presentati in primo piano che in questo periodo dell'anno sono Festeggiamenti, Anno Nuovo e Bordi.

Come funziona VirtualDub, software gratuito per modificare i video.

VirtualDub è un programma open source molto apprezzato da chi voglia modificare un video, estrarre dei clip o delle immagini. Si possono fare molti altri interventi tra cui quello di rifletterlo orizzontalmente. L'obiettivo di questo post non è una recensione completa del programma ma solo quello di evidenziare alcuni tra i suoi molteplici utilizzi. Si può scaricare VirtualDub da XNavigation, non c'è bisogno di installazione ma dobbiamo mantenere tutti i file nella stessa cartella dopo aver scompattato lo Zip con 7-Zip o Zip Genius.

Per aprire il programma occorre fare un doppio click su VirtualDub.exe 

Come riflettere orizzontalmente o verticalmente un video.

Dopo aver illustrato come si possa ribaltare in senso verticale e in senso orizzontale una immagine vediamo adesso come si possa fare lo stesso con un video. Chi ha o ha avuto un po' di dimestichezza con le scuole di danza si sarà accorto che le sale sono quasi sempre accessoriate con grandi specchi. Sono importanti per gli insegnanti che così possono controllare gli allievi ma anche per questi ultimi che possono guardare i loro movimenti nel momento stesso in cui li compiono.

Pensate a una ballerina che deve imparare una coreografia guardando un video. Quello che vedrà non sarà speculare ai suoi movimenti. Per facilitarne l'apprendimento può essere utile riflettere il video orizzontalmente in modo tale da far diventare il braccio sinistro quello destro e viceversa. In questo modo si potrà guardare il video come se fosse a uno specchio a riprodurre i movimenti inducendo una memorizzazione molto più semplice.

Ho parlato della danza ma che dire dei numerosi video tutorial presenti in rete che trattano di fitness, di yoga o persino di arti marziali. Poter riflettere orizzontalmente questi video aiuterà senza dubbio a imitare meglio i movimenti che vi sono rappresentati.

Come riflettere una immagine orizzontalmente o verticalmente con Pixlr, Gimp o Photoshop.

Scrivo questo piccolo tutorial perché ho avuto l'esigenza di  ribaltare una icona di una lente dalla parte opposta visto che con quell'aspetto mi sembrava più adatta al tipo di inserimento a cui avevo pensato. In sostanza sono dovuto passare dalla prima alla seconda immagine         . Si tratta di operare una specie di riflessione allo specchio o se si vuole di una riflessione in orizzontale. Per i maghi della grafica sarà certamente una cosa da nulla ma per i non avvezzi non è così banale trovare gli strumenti giusti su Photoshop o su Gimp. Per fortuna c'è Pixlr, il fantastico Editor di immagini online, che ha una opzione per effettuare questa piccola modifica in modo molto semplice.

Dopo aver aperto la pagina di Pixlr Editor si clicca su Apri un'immagine dal computer o Apri un'immagine da un URL per caricare la foto da modificare

Come personalizzare in Blogger l'intestazione (header) dei modelli Dynamic Views o a Visualizzazione Dinamica.

I modelli Dynamic Views appena presentati da Blogger hanno suscitato grande ammirazione per la loro fluidità di navigazione, per la grafica unica e tecnologicamente avanzata ma hanno ricevuto anche numerose critiche per il fatto che siano praticamente impossibili le personalizzazioni riguardo all'inserimento di widget e di sidebar. Vediamo come si possa invece modificare l'Header del blog per renderlo graficamente più riconoscibile.

Adesso tutti i blog a Visualizzazione dinamica hanno il titolo del blog sopra a una barra di navigazione tra i vari modelli

Modificare i video direttamente online con il nuovo Editor di Youtube.

Io non sono un grande produttore di video, ne posto uno ogni tanto per illustrare meglio qualche guida anche con filmati e audio. Tutte le volte che lo faccio sono costretto a usare dei tool quali Windows Live Movie Maker per aggiungere annotazioni, scritte, per tagliare qualche spezzone in eccesso o per aggiungere qualche parte di filmato. E' notizia di poco fa che Youtube ha aggiunto l'opzione per editare il video direttamente online.

Questo può essere fatto anche con i video che sono già stati pubblicati. Il procedimento è semplicissimo. Si accede al nostro account Youtube e si clicca sul nostro video che si vuole modificare. Inizierà a riprodursi. In alto sarà visibile il pulsante Modifica video (Nuove)

 

Come cambiare le espressioni nel footer di Blogger e come modificarne la posizione.

Ho già parlato diffusamente di come si possa configurare l'aspetto degli articoli andando su Design > Elementi pagina > Post sul blog > Modifica. Nella finestra che si apre, si possono mettere le flag agli elementi che vogliamo visualizzare e possiamo anche modificare tutte le espressioni che si visualizzano all'interno dei post. Ecco la schermata con quello che propone Blogger di default

Come modificare le immagini con l'Editor di Blogger e Picnik.

Gli utenti di Blogger sapranno certamente che da qualche settimana è disponibile per tutti la nuova grafica per la Bacheca e l'Editor. Si possono usare accedendo a Blogger in Draft. L'Editor è stato obiettivamente un po' deludente perché ci si aspettava fosse inserita una funzionalità simile al glossario e una opzione in modo da aprire un link in un'altra scheda del browser che per adesso sono una prerogativa solo di Windows Live Writer.

Per le immagini però sono state implementate delle novità davvero interessanti e che non avevo notato a prima vista. Da qualche tempo Picasa è partner di Picnik, un editor di immagini con molte funzionalità di base gratuite. Usando il nuovo Editor di Blogger è possibile modificare e arricchire le immagini proprio utilizzando i molti strumenti di Picnik. Dopo aver caricato la foto, selezionatela e scegliete Modifica immagine

La nuova Bacheca e il nuovo Editor di Blogger disponibili per tutti.

Dopo l'annuncio di modifiche importanti e dopo aver adeguatamente testato queste funzionalità, il Blog ufficiale di Blogger in Draft ha appena annunciato che le nuove interfacce per Bacheca e Editor possono essere già utilizzate da tutti accedendo appunto a Blogger in Draft. Non ero tra coloro che erano stati scelti come "cavie" per questa nuova funzionalità quindi mi trovo ad accedere per la primissima volta. Cercherò di fornire il maggior numero di informazioni a coloro che intendano usufruire di questa nuova grafica per gestire i propri blog con l'impegno a ritornarvi sopra con nuovi articoli più mirati.

Sulla destra è presente l'indirizzo email che è stato inserito nel Profilo con un menù a discesa per accedere all'account di Google e al Profilo di Blogger. Visto che si tratta di due cose diverse, credo quindi che sia sempre possibile impostare il Profilo di Blogger come riservato. Saranno probabilmente solo gli account privati di Google a essere cancellati il 31 Luglio in occasione del lancio in grande stile per tutti gli utenti di Google+. Comunque non me la sentirei di rischiare e se avessi un Profilo Blogger privato, lo renderei disponibile, almeno fino alla fatidica data di fine Luglio. Le persone interessate riceveranno comunque una email prima della cancellazione; mi sento di poterlo affermare con ragionevole certezza. Sempre sulla destra è visibile un quadratino per inserire la flag e fare di Blogger in Draft la nostra Bacheca predefinita. Si tratta comunque sempre di una operazione reversibile.

Change Colors per cambiare i colori di siti o singole pagine web.

Change Colors è una estensione per Google Chrome che consente di modificare i colori di una singola pagina web o di tutte le pagine di un intero dominio. Non so se avete problemi di vista ma anche chi non ne ha o non ha patologie come il daltonismo, si trova a dover consultare delle pagine con scelte di colori molto discutibili che ne impediscono una facile lettura. Con questo componente aggiuntivo si potranno scegliere i colori in cui visualizzare pagine e domini siffatti.

L'icona dell'addon sarà visibile nella parte finale della barra degli indirizzi del browser immediatamente dopo la sua installazione

Come aggiungere il tag Title nel modello di Blogger.

I tag Title e Alt sono in genere usati quando si postano delle immagini. La struttura del codice è questa

<img src="URL_IMMAGINE" title="Titolo immagine" alt="Testo alternativo">

dove il testo in Title viene visualizzato quando si passa sopra all'immagine con il mouse mentre quello in ALT appare nei browser che non riescono a caricare la foto ed è molto importante ai fini SEO. Il tag Title può essere usato anche in un qualsiasi collegamento per mostrare un tooltip con la descrizione della pagina. Per esempio questo codice

<a href="http://www.ideepercomputeredinternet.com/" title="Tutorial per utenti di Blogger">IDEE PER COMPUTER ED INTERNET</a>

produce questo link

Come cambiare lo sfondo del blog al passaggio del mouse.

Qualche mese fa in questo commento mi fu chiesto se fosse possibile creare un sistema che permettesse agli utenti di scegliersi il colore di sfondo che preferivano. Sono riuscito a creare un widget molto carino che consente proprio di fare questa operazione. Per testarlo accedete sulla

• Pagina di Demo dello sfondo che varia al passaggio del mouse -

Spostatevi con il mouse sulla tabella in alto a destra e, passando sopra a un riquadro colorato, si visualizzerà lo stesso background per tutto il blog

Cartoonize per creare un cartone animato da una foto.

Gli appassionati di cartoon sono moltissimi, di tutte le età e con le più svariate formazioni culturali. Non è affatto una prerogativa di ragazzi giovani leggere le strisce di cartoni animati. I collezionisti spesso sono tutt'altro che persone in tenera età. Creare un cartone animato da una foto può quindi essere una cosa carina per generare degli avatar o comunque delle immagini suggestive.

In rete c'è una applicazione gratuita che consente di farlo in modo semplicissimo. Cartoonize Net permette appunto di convertire una foto in un cartone animato. Si può caricare l'immagine dall'hard-disk oppure incollare l'URL se è già presente in rete

FotoFuze per migliorare la qualità delle immagini.

Le foto scattate con i cellulari qualche volta rivaleggiano in qualità con quelle delle camere digitali ma, se si ha un modello vecchio, possono essere bisognose di ritocchi per migliorarne la qualità. FotoFuze è una applicazione online che permette di elevare la qualità delle foto senza usare programmi di grafica sofisticati come Photoshop o Gimp. Dopo una rapida registrazione si può decidere di caricare una normale foto oppure scegliere di cimentarsi nella creazione di una immagine in 3D. Per creare le foto in tre dimensioni ci vogliono una macchina fotografica, un treppiede, una base girevole e occorre scattare venti o trenta foto, ciascuna dopo una rotazione di 15-20 gradi.

Limitandoci alle foto in due dimensioni, si deve solo fare l'upload della immagine che si vuole migliorare. E' un procedimento molto utile se si vuole evidenziare un oggetto rispetto allo sfondo. Dopo aver caricato l'immagine si evidenzia con il mouse la parte della foto da mettere maggiormente in risalto. Con lo strumento gomma invece si cancellano i particolari indesiderati. Sulla destra si vedrà l'anteprima delle modifiche

Come installare i menù anche nei template del Designer Modelli.

Il Designer Modelli ha certamente introdotto delle funzionalità interessantissime per tutti gli utenti di Blogger. Ci sono state però anche alcune difficoltà soprattutto riguardo all'inserimento di menù che tuttora permangono. Il fatto è che molti di quei menù che funzionavano perfettamente con i vecchi modelli adesso non funzionano più con i nuovi template. Il malfunzionamento riguarda soprattutto l'apertura delle sotto-tabelle o delle voci secondarie se si vogliono chiamare così. La ragione è che questi template hanno stili predefiniti in grado di disabilitare qualsiasi menù che si aggiunga sotto l'intestazione del blog.

Vediamo come sia possibile risolvere questo problema in modo da rendere installabile la maggior parte dei vecchi menù che siamo abituati a utilizzare da molti mesi se non da anni. Prima di procedere con questa modifica è opportuno salvare il modello completo per un eventuale backup. Si va su Design > Modifica HTML e si cerca la riga seguente con F3 o con Ctrl+F (CMD+F per Mac)

Come creare e modificare immagini animate in formato GIF.

Agli albori del web non esisteva ancora il formato flash per la riproduzione dei video nel browser. Tutto quello di animato  che c'era online era dovuto alle immagini in formato GIF. Ora sono andate un po' fuori uso perché soppiantate dai filmati che hanno formati molto più leggeri e sono molto più performanti. Non si è però assistito alla morte di queste immagini che sono una semplice raccolta di singoli fotogrammi. Sono infatti ancora utilizzate da molti blogger per banner e altre personalizzazioni che sarebbe complicato fare con i video.

Gli strumenti gratuiti a disposizione per la creazione di questo tipo di immagini sono moltissimi. Non occorre avere grande dimestichezza con tool grafici sofisticati come Photoshop o Gimp per generare delle GIF animate. In articoli passati mi sono già occupato di come creare delle GIF. Ricordo il tool online Make a Gif, molto semplice e intuitivo, GIF Creator un programma gratuito e intuitivo, GIF UP altro tool online che però inserisce un watermark nelle realizzazioni. Con questo post mi ripropongo di arricchire la raccolta di strumenti gratuiti per la gestione delle GIF.

Beneton Movie GIF è un programma freeware che riesce a generare GIF animate arricchendole anche di effetti speciali. Durante l'installazione bisogna cercare di evitare di iscriversi a un sito di sondaggi che funge da sponsor e selezionare solo il programma che si desidera. L'interfaccia è intuitiva

Come personalizzare l'aspetto del nome del commentatore su Blogger.

Dopo aver illustrato come inserire il commento dell'autore del blog in un rettangolo vediamo come sia possibile personalizzare l'aspetto del nickname del commentatore sia esso l'autore o un semplice lettore. Ricordo che andando su Bacheca > Impostazioni > Commenti, si possono scegliere quattro opzioni per l'identità di coloro che possono lasciare il proprio contributo

1. Chiunque
2. Utenti registrati anche OpenID
3. Utenti con un account Google
4. Solo membri del blog

La prima opzione è la più permissiva ma consente anche i commenti anonimi che sono spesso fonte di spam. Fino a qualche mese fa anche in questo blog era stata selezionata l'opzione che chiunque potesse commentare. Poi sono cominciate a arrivare tonnellate di spam da robot situati in Asia e ho dovuto scegliere di ricevere commenti solo da utenti con una identità accettata da Blogger. Questa personalizzazione è dunque possibile solo per i nickname degli utenti registrati. Se si è scelta la prima opzione, i commenti anonimi resteranno invariati mentre muterà l'aspetto degli username degli utenti registrati.

Non cambierà il testo del commento. Ecco un esempio