Web 3.0 Notes

Quando il cliente non paga…

nemoprincess — Thu, 18 Feb 2010 08:54:40 +0000

Anche con tutte le accortezze necessarie, capita sempre, almeno una volta, prima o poi, di non essere pagati per un lavoro perfetto, completato, che magari ci ha anche portato via più tempo del necessario. A volte sono proprio quei clienti così attenti al dettaglio, fin troppo attenti e pignoli, che poi spariscono o con le scuse più fantasiose prolungano il pagamento all’ infinito. E purtroppo spesso capita che a cercare di fare causa ci si rimette quasi sicuramente. Ma allora cosa fare? Rassegnarsi ad aver lavorato per la gloria?

Beh qualcosa magari riusciamo a farla. In realtà quando capitano queste cose non si vorrebbe fare nient’ altro che far sparire tutto il proprio lavoro, oscurare il sito, ma è anche vero che, purtroppo quando ci si rende conto di cosa è avvenuto, che non si vedranno mai i soldi che invece ci spettavano, è anche troppo tardi, ormai le password sono state cambiate e non riusciamo più ad accedere al nostro lavoro in alcun modo.

Esiste in realtà qualche modo per tutelarci o almeno per rendere il semplice lavoro di “ladri di codice” un pò più duro.

CSS per oscurare un sito da remoto

CssKillswitch è l’ ultimo arrivato in questo gruppo di script che ci permettono di oscurare un sito anche da remoto. Utilizzarlo è molto semplice, basta registrarsi ed è possibile gestire l’ oscuramento con la creazione di un id per ogni sito.

Ajax per oscurare un sito da remoto

Ajax Kill Switch è giunto invece alla seconda versione, un pò più complessa e più difficile da rintracciare. Nel caso vogliate utilizzare è bene però mostrare al cliente la demo del sito su un dominio di test, se infatti il sito venisse rubato e quindi spostato su un altro dominio, riuscite facilmente ad oscurarlo.

Php per oscurare un sito da remoto

Infine esiste una versione in php per ottenere gli stessi risultati. Remote Kill Switch.

Gli ultimi due script hanno entrambi bisogno di un server di appoggio, mentre il primo lo offre con la registrazione. Io penso che valga la pena di prendere simili accorgimenti. Se non vuoi pagare va bene, ma restituisci anche il lavoro!

Segnala presso:

Analisi Seo: due nuovi tool gratuiti

nemoprincess — Thu, 18 Feb 2010 08:33:59 +0000

Avere una seconda opinione riguardo ad un’ analisi seo è sempre utile, magari ci è sfuggito qualcosa.

Se poi il parere è gratis allora meglio ancora. Website Grader e SEO Site Checkup sono due nuovi tool che analizzano ogni aspetto seo del vostro sito. Utilizzati insieme forniscono un gran numero di dati e un’ ottima base da cui partire per pianificare un’ ottimizzazione seo.

Non mancate di testarli!

Segnala presso:

Angoli arrotondati senza Css

nemoprincess — Wed, 17 Feb 2010 08:10:14 +0000

swfIR è una semplice ed efficace alternativa per arrotondare gli angoli delle immagini senza utilizzare CSS3. La soluzione swfIR combina jQuery e Flash per fornire una serie di effetti come angoli arrotondati, ombre, bordi e rotazione.

Utilizzarlo è davvero molto semplice:

Scaricate swfIR
Caricate swfir.js e swfir.swf sul vostro server nella stessa directory
Includete la libreria swfIR nel tag :

scegliete quale caratteristica applicare a quali immagini:


var borders = new swfir();
borders.specify("border-radius", "15");
borders.swap("#content img");

Ovviamente potete integrare lo script anche in Wordpress:

scaricate lo script, uploadate i file e includete la libreria come descritto prima
aggiungete questo codice nel file footer.php prima della chiusura del tag

Assicuratevi che le immagini non siano organizzate per mese e giorno (Impostazioni->Miscellanea) e aggiungete questo codice da qualche parte nel loop:

ID, ’rounded_img’, true) ) {
$postimg = get_post_meta($post->ID, ’rounded_img’, $single = true);
if((stristr($postimg,’http’)===FALSE) && (stristr($postimg,’wp-content’)===FALSE)) {
$postimg = get_bloginfo(’siteurl’).”/wp-content/uploads/”.$postimg;
} ?>

” rel=”bookmark” title=”Permanent Link to ”>
” alt=”" width=”140″  />

Quando inserite un’ immagine in un post, copiatene il link dopo l’ upload, create un campo personalizzato chiamato rounded_img e assegnate il link come valore.

I Pro

swfIR è una libreria cross-browser, non avete quindi il problema che ancora si riscontra con CSS3.
se avete bisogno di proteggere le immagini, disabilita il click con il tasto destro

I Contro:

Non è compatibile con Prototype e Mootools
Si perde il tag alt dopo la sostituzione

Qualcuno l’ ha provato? Cosa ne pensate?

Segnala presso:

Il Seo “sociale” – I motori di ricerca e i social network

djtwenty — Mon, 08 Feb 2010 08:44:23 +0000

Sempre di più il destino della popolarità di un sito, almeno per quanto riguarda i “netizen” più smaliziati, è legato a doppio filo con la sua interazione con i Social Network. Nei mesi passati abbiamo assistito a delle scelte per certi versi epocali, che sono scivolate in sordina nella nostra quotidianità di utenti delle “reti sociali” senza quasi essercene accorti.

Il primo grande passo l’ha mosso Bing (il motore di ricerca di proprietà Microsoft) che ha stretto una partnership con Facebook e Twitter per l’aggiornamento nelle proprie Serp dei contenuti pubblicati dagli utenti, rendendoli in pratica ricercabili anche al di fuori dello stesso social network.

Google addirittura, in pochi giorni, prima afferma di voler ridurre drasticamente la quantità di news gratuite da mettere a disposizione dei propri utenti, poi converte le risorse prima dedicate alle news “standard” per l’indicizzazione “real time” di Twitter e Facebook.

Il problema principale, per chi decide di creare “traffico” sul proprio sito o blog, tramite un account social come Twitter è il flusso dei contenuti, nessuno vi seguirà mai se non producete contenuti interessanti e con frequenza!

Per nessuno intendo anche i motori di ricerca, ad esempio l’ultima versione del motore di indicizzazione di Google, denominata “Caffeine” presta molta attenzione alla frequenza degli aggiornamenti e pare sia uno degli indici principali per accaparrarsi posizioni importanti nelle Serp, a discapito di siti magari mastodontici, ma poco dinamici nell’aggiornare i propri contenuti.

Se il vostro sito ha la possibilità di esportare un flusso Xml (Feed Rss sono ottimi!) create un account Twitter ad hoc e popolatelo con tool online free come “Twitterfeed” e fate parlare di voi, quanto più possibile…

Come sfruttare il potenziale di Twitter per canalizzare traffico su di voi? Questo ve lo spiego la prossima volta!

Segnala presso:

Vintage Market – Free Template PSD

nemoprincess — Sun, 31 Jan 2010 17:54:01 +0000

Vintage Market è un template in PSD per un sito Vintage. Realizzato con Photoshop CS4. Il font utilizzato è Curlz, il file non è incluso nel pacchetto. Il PSD potete scaricarlo e utilizzarlo liberamente, è rilasciato sotto licenza CC.

Download Vintage Market - Free Psd Template

Vintage Market by nemoprincess is licensed under a Creative Commons Attribuzione-Non commerciale-Condividi allo stesso modo 2.5 Italia License.
Based on a work at www.nemoprincess.it.
Permissions beyond the scope of this license may be available at http://www.nemoprincess.it.

Segnala presso:

Il duro lavoro degli “Spider”

djtwenty — Sun, 31 Jan 2010 14:26:39 +0000

Molte volte vi sarete domandati come i vari motori di ricerca possano, in un lasso di tempo relativamente breve, inserire ed aggiornare la moltitudine di siti e pagine che affollano il Web.

Ovviamente è un lavoro costante e continuativo che comporta l’utilizzo di risorse informatiche ed infrastrutturali spesso al di sopra di quanto possiamo immaginare, il Web è un ambiente in continua evoluzione ed i Social Network hanno dato un impulso notevole nel renderlo dinamico, con non poche complicazioni dal lato indicizzazione!

Ovviamente sarebbe umanamente impossibile ed impensabile allocare delle “risorse umane” per trascrivere a mano, ogni mese, TUTTE le pagine dei vari siti che compongono la websfera, questo lavoro viene quindi affidato a dei “ragni”.

Gli Spider (noti anche come Bot o Crawler) non sono ovviamente gli aracnidi che tutti conosciamo, ma sono dei programmi che “scavano” il web trascrivendo i contenuti trovati, in formato testuale, all’interno dei database dei vari motori di ricerca. Prima ho detto “ogni mese” perché ad esempio Google, il più importante motore di ricerca e portale al mondo (fonte Alexa: http://www.alexa.com/topsites) effettua con una cadenza quasi mensile la cosiddetta “Deep Search” nella quale ripercorre tutto il Web ricreando indici e pagerank. A seguito di questa grande scansione globale, per un periodo di 6-8 giorni, si verifica quella che tra gli addetti ai lavori è conosciuta come la “Google Dance” poiché in questi giorni i risultati delle Serp (ricerche organiche) cambiano continuamente, in base allo stato di avanzamento della creazione dei nuovi indici.

Google (e con lui anche gli altri principali motori di ricerca) effettuano anche una “Fresh Search” fatta quasi quotidianamente, nella quale aggiornano i contenuti già presenti nei loro indici.

Gli Spider accedendo al nostro sito, per prima cosa vanno a cercare il file Robots.txt che si trova (o dove dovrebbe trovarsi!) nella directory root , per controllare se esistono delle sezioni del nostro sito che NON vogliamo che vengano indicizzate.

Una volta istruiti i “ragni” intraprendono il loro infaticabile lavoro aggiornando i loro database e segnalando eventuali nuovi hyperlink al grande calderone delle pagine da visitare.

I file robots rappresentato un importante strumento da parte di un Webmaster per posizionarsi correttamente nelle Serp, facendo svolgere una ricerca selettiva e “proficua” ai motori di ricerca.

Di seguito gli spider più importanti:

Di fatto i file Robots sono dei semplicissimi file di testo, se il vostro sito è stato creato con dei Cms come Joomla o Wordpress verrà generato automaticamente per presevare le aree interdette agli Spider.

E’ un sito fai da te? Nessun problema, la compilazione è semplicissima, ecco un esempio:

User-agent: *

Disallow: /personale/

In questo caso asterisco “ * ” sta per tutti gli Spiders, altrimenti potete inserire i nomi della tabella che ho segnalato precedentemente (es. googlebot) per limitare l’accesso a determinate aree solo ad alcuni Crawler.

Ricordatevi, il primo presupposto per apparire nelle Serp di un motore di ricerca è che lui vi trovi e che possa indicizzare i vostri contenuti più importanti…

La seconda è che il vostro sito sia linkato dal maggior numero di siti possibili…linkate gente…linkate….

Segnala presso:

Trasferire Wordpress con le funzioni Importa/Esporta

nemoprincess — Fri, 29 Jan 2010 15:40:33 +0000

Oggi che Wordpress si è così evoluto possiamo facilmente trasferirlo da un host all’ altro con le funzioni Importa/Esporta.

Importa ed Esporta sono due utilissimi strumenti che ci permettono di trasferire tutti i dati (commenti, post e autori) della nostra installazione. Sappiamo bene che un’ installazione di Wordpress dura solo 5 minuti, quindi anzichè trasferire tutti i file (installazione, temi, plugin, updates) manualmente, trasferire il database (accedendo a phpmyadmin e facendo il giusto backup) e quindi ricompilare il file wp-config.php con i nuovi parametri, a volte conviene fare una nuova installazione, installare i plugin che ormai una volta trovati si autoinstallano e importare i dati che avete precedentemente esportato.

Ecco come fare esattamente:

Accedendo al pannello di controllo del vosto vecchio blog, in Strumenti trovate Esporta, l’ unica opzione disponibile è di esportare i post di uno specifico autore oppure di tutti. Sempre meglio scegliere Tutti gli autori; potete decidere in un secondo momento se eliminare alcuni post o alcuni autori. Clicchiamo su Scarica file di esportazione ed è fatta. Abbiamo salvato tutti i dati!
Nel caso in cui state cambiando hosting e trasferendo il dominio, è bene che salviate tutti i file nella cartella upload. Il vostro dominio sul nuovo hosting sarà disponibile solo quando non sarà più attivo il vecchio. Il file che avete scaricato con l’ esportazione contiene post, autori e commenti e ovviamente i link a tutti gli upload (se il dominio resta lo stesso saranno gli stessi anche i link).
Una volta installato Wordpress sul nuovo provider non vi resta altro che selezionare Importa dal menù Strumenti, scegliere il file che avete salvato e importare il tutto.
Se avete trasferito anche il dominio non dovrete fare altro che caricare la cartella upload sul nuovo server!

Se invece dovete trasferire un’ installazione abbastanza complessa, con tanti plugin e tante impostazioni da settare allora forse è meglio metterci più tempo e trasferire separatamente file e database come descritto qui.

Segnala presso:

Realizzare una corda realistica con Photoshop

Shorty — Fri, 29 Jan 2010 11:07:48 +0000

Molto spesso ci accingiamo a cercare affannosamente sul web degli elementi che possano servire per i nostri lavori e ahimè senza buoni risultati. Perchè quindi non imparare a realizzare qualcosa con le nostre “mani” e la nostra fantasia?
In questo tutorial vi insegnerò come realizzare una corda realistica con Photoshop senza dover usare alcun plugin o pennello esterno …
Create un nuovo documento 500×500 pixel con sfondo bianco (se doveste dimenticare di aprirlo con sfondo bianco potete sempre colorare lo sfondo successivamente).
Rendete livello il documento appena creato (Livello > Nuovo > Livello da sfondo)
Impostate il colore di primo piano su nero premendo D sulla tastiera e andate su filtri.
Scegliete Schizzo > Pattern mezzetine con dimensione 3 e contrasto 47 (le opzioni possono variare in base alla grandezza del documento).
Scegliete adesso l’opzione trasformazione libera (ctrl+t da tastiera oppure modifica > trasformazione libera da menu).
Ruotate l’immagine in senso antiorario per 1/4 del documento in modo da ottenere questo risultato:

Scegliete quindi lo strumento Selezione rettangolare e selezionate una porzione nè troppo grande nè troppo piccola dell’immagine in senso orizzontale, possibilmente nella parte in cui prende da un’estremità all’altra del documento (per tutta la larghezza del documento per intenderci, senza selezionare la parte vuota).
Fate quindi ctrl+c e ctrl+v per copiare ed incollare su un nuovo livello questa porzione di immagine selezionata.
Oscurate quindi l’intera immagine che avete ruotato in precedenza (cliccando sull’occhio del suo livello) e, tenendo selezionato il nuovo livello appena creato, fate Modifica > trasforma > ruota a 90° … orario o antiorario in questo caso non ha importanza.
Posizionate per bene la vostra “quasi” corda e scegliete da filtro > distorsione > distorsione curvilinea.
Nella finestra che vi compare, segnate i punti più o meno come ho fatto io nell’esempio:

e date l’ok … ovviamente la distorsione è soggettiva, voi potreste volerla piegare dall’altro lato ad esempio.
Come potete notare, la corda è troppo scura. Usiamo dunque l’opzione livelli che si trova nel menu immagine > regolazioni per schiarirla un pò.
Nella finestra che compare, spostate la casella 0 dei livelli in output fino ad arrivare ad 80 (lasciando invariati gli altri valori).
Dovremmo ottenere questo risultato:

Ora, per cominciare a rendere la corda più realistica, diamo l’effetto granuloso scegliendo il filtro disturbo > aggiungi disturbo con quantità pari a 8.
Vediamo che la corda comincia a prendere consistenza ma non del tutto.
Applichiamo ora lo smusso ed effetto rilievo da livello > stile livello (o facendo doppio clic sul livello nella palette livelli).
Ora, abbiamo due alternative:
La prima ha queste impostazioni (e rende la corda simil plastica … tipo quella che si usa per il bucato):

La seconda ipotesi:

Ipotizzando di scegliere la seconda, dobbiamo dare il tocco finale alla nostra corda ossia il colore!
Andate quindi nella palette dei livelli e scegliete il pulsante per creare un nuovo livello di riempimento o regolazione (rappresentato da un pallino bianco/nero) e scegliete l’opzione tonalità/saturazione.
Nella palette regolazioni, che compare in alto a quella dei livelli, scegliete il colore che più vi piace (senza esagerare) ed ecco la vostra corda!
Potete ovviamente aggiungervi degli elementi come ad esempio questo nodo che ho realizzato semplicemente copiando dei pezzi di corda già esistenti e adattandoli alla corda stessa per rendere il nodo il più reale possibile (anche se al momento fatto con un pò di fretta):

Segnala presso:

300 bandiere del mondo ad alta risoluzione

nemoprincess — Thu, 28 Jan 2010 16:31:58 +0000

Possono sempre essere utili, una collezione da tenere nel nostro database di immagini: sono 300 le bandiere del mondo in formato jpg che trovate in questa raccolta.Tutte ad altissima risoluzione: 5000×3000 px!

Download da Rapidshare (95Mb) : Bandiere del mondo in jpg

Download da Megaupload (95Mb) : Bandiere del mondo in jpg

Download da MediaFire (95Mb) : Bandiere del mondo in jpg

Segnala presso:

Photoshop: bordo tratteggiato sulle immagini

Shorty — Thu, 28 Jan 2010 13:19:02 +0000

Un simpatico effetto potrebbe essere quello di inserire intorno alle nostre foto o blend o banner o qualsiasi altra immagine si voglia creare, un bordo tratteggiato. Per ovvi motivi non possiamo metterci a disegnare trattino per trattino e ci viene quindi in soccorso questo tutorial.
Create un nuovo documento 8×8 px con risoluzione 72 e contenuto sfondo trasparente.
Ingrandite il docuemnto più che potete (perchè come potete notare è impossibile lavorarci a grandezza naturale).
Scegliete la matita, impostate come diametro 4 e disegnate due quadratini in obliquo come in questo esempio:

A questo punto dobbiamo salvarlo come pattern quindi: modifica > definisci pattern … date un nome al vostro pattern e salvate.
Aprite quindi, questa immagine in Photoshop:

Come sempre rendetela livello (livello > nuovo > livello dallo sfondo).
Tenendo premuto il tasto ctrl, cliccate sulla miniatura dell’immagine ossia sul livello 0 per selezionare l’intera immagine.
Fatto questo, andate su Selezione > trasforma selezione (Presente nella versione cS4 … Per quelle precedenti andare su modifica > contrai) e riducete di un pixel o due al massimo la selezione corrente trascinando le manigliette.
Trucco: per ridurre la selezione tutta insieme, tenete premuta la combinazione di tasti shift+alt mentre trascinate uno degli angoli laterali.
Dopo aver dato l’invio per apportare la modifica della riduzione della selezione, fate selezione > inversa per ottenere la selezione da riempire.
Create un nuovo livello: Livello > nuovo > livello … ci servirà per riempire la selezione e può essere utile in caso di errore (il livello può essere cancellato senza dover apportare alcuna modifica alla foto).
Scegliete dunque lo strumento secchiello e nella sua palette delle opzioni scegliete pattern invece che primo piano dal menu a tendina. Come potete notare, a fianco al menù a tendina, il selettore pattern è diventato attivo. Cliccate dunque sulla freccetta laterale posta nel selettore, e scegliete il pattern che avete appena salvato.

Tornate al documento e, con il nuovo livello selezionato, riempite la selezione.
Deselezionate (ctrl+d) ed ecco il risultato:

Ovviamente, se invece del tratteggio voleste realizzare un puntinato, vi basterà creare il pattern con dei quadrati meno regolari o con dei punti veri e propri … o magari realizzare dei bordi con altre forme.

Segnala presso: