gp

Icon

A molti pensieri seguano poche parole.

WordPress.com Cheat Sheet

Qualche tempo fa scrissi un post dove elencavo tutte le emoticons presenti sulla piattaforma di wordpress.com ed il modo per usufruirne. Per quanto uno le usi alla fine capita sempre che il codicillo che le tira fuori cada nel dimenticatoio, stessa cosa per il codice che permette di inserire i filmati flash in un post, ad esempio non ricordo mai se mettere le virgolette (“”) o no. Insomma per farla breve ho realizzato una pagine con all’interno riassunte tutte le modalità di scrittura dei vari contenuti che wordpress.com mette a disposizione.

WordPress.com Cheat Sheet

Anteprima

la pagina è studiata per andare ad infilarsi nella sidebar di Firefox, quindi come al solito le istruzioni sono: salvate la pagina nel BookMark, nella Barra dei Segnalibri

Pannello

rintracciate il link salvato, clik con il tasto destro e Proprietà a questo punto spuntate la solita “carica nella Barra Laterale”, io ho aggiunto anche wp smile

Pannello

All’interno della pagina sono riportate tutte le Emoticons e relativi codici, le Shortcuts per la scrittura veloce nell’editor (che palle quel pop up), i codici esempio per l’inserimento dei video di You Tube, Google Video e Daily Motion, i codici esempio per le Slideshow, quelli per l’inserimento dello streaming di mp3, e quello per il contact-form. Di fianco troverete anche un tasto “info” che rimanda ai vari post ufficiali di wordpress.com.

Per abbellire il tutto l’ho reso personalizzabile con vari temi colorati, selezionabili dalla barra in alto. I colori a disposizione per il momento sono Verde, Blu, Arancio, Grigio e Bianco :

La pagina è depositata su un dominio si altervita, non dovrebbero esserci problemi, almeno credo, le icone sono quelle del mio dominio di wordpress.com. Il consiglio finale è quello di non duplicare la pagina, in modo che l’originale possa essere modificata e aggiornata nell’eventualità che worppress.com rilasci nuove features. Il risultato finale è questo:

Tutti i colori delle WP CS

Spero possa esservi utile ;)

Archiviato in:Accessori, CSS, Code, Firefox, Fun, Html, Productivity, Tech, Tips, Utility, WWW, Web, WordPress

Il mio Desktop (i miei)

Giovy oggi lancia una bella proposta: Desktop in mosta!, in pratica ha invitato i suoi lettori a commentare il posto con uno screenshot del desktop dei loro PC/Mac ecc. ecc. Su Twitter Giovy ha tenuto a precisare che non è un meme (però…) cmq sia personalmente amo queste cose, non i meme, vedere come gli altri organizzano i propri desktop (infatti la settimana scorsa provai a fare una cosa simile, ma con poco succeso); ecco i miei:

Mac Pro (casa) schermo 1:
Desktop

Mac Pro (casa) schermo 2:
Desktop

è un desktop allargato :) , nel senso che è esteso su due monitor lcd da 19″ con risoluzione settata a 1280×1024 (nativa). Su quello principale ho tolto l’icona dell’HD, mai usata, ho sei cartelle, tutte alias di altre cartelle che si trovano in Documenti. Lavori e Risorse, la prima è autoesplicativa, l’archivio dei lavori, che prima o poi passeranno si DVD, le risorse sono file grafici, codice, icone e materiale di facile riutilizzo, poi ho la cartella Lavori in Corso, dove mano a mano inserisco gli alias delle cartelle presenti in Lavori, così ho sempre la situazione sotto controllo, poi ci sono le cartelle Temp, Appunti e Idee, la prima è l’immondezzaio della mia scrivania, la seconda è una cartella dove inserisco solitamente file di testo, doc e pdf per progetti e per cose personali, appunti insomma, la terza Idee è il contenitore di immagini e file di testo, composizioni grafiche, progetti e cavoli vari che non si sa che fine faranno. Sul secondo schermo piazzo le applicazioni di comunicazione e intrattenimento, quindi chat, twitter, mail, iTunes, Quicktime ecc. ecc., qualche volta anche Finder come finestra d’appoggio.

Al lavoro:

desktop

lavoro con un PC, lo schermo è un LCD da 1400×900px, il descktop è organizzato con pochissime cartelle e con sfondo sempre scuro, ci sono le solite cartelle di Win, il tema è impostato su Win98, con la sola modifica del font di sistema settato su Calibri (ottimo su Win!). Ci sono tre collegamenti al server principale (PC Xeon), uno all’archivio dei lavori, uno alla mia cartella principale (Giuseppe) e uno a quello della mia collega (Assunta), sul desktop aggiungo man a mano gli alias delle carelle dei lavori in corso, poi c’è la cartella Dev dove ci sono tutti i files di lavorazione, una sorta di archivio personale dei lavori e infine un collegamento (alias) all’archivio fotografico (Foto) archiviato su un Maxtor da 1TB collegato al MacPro dell’artdirector.

Technorati Tags: , , , ,

Archiviato in:Apple, Autoreferenzialità, Blog, CSS, Design, Flickr, Fun, Graphics, OS, Photo, Productivity, Tech, Tips, Twitter, Web, Web-design

List 05.04

Archiviato in:Blog, CSS, Design, Fun, Graphics, List, Photo, Photography, Photoshop, Productivity, SEO, Tips, WWW, Web, Web-design

MacThemes 2

Mactheme 2e alla fine venne fuori.

E’ on-line la nuova versione di MacThemes: potete andare qui per poi essere ridirezionati su macthemes2.net. Naturalmente il giudizio è positivissimo, che poi ci sia qualche pecca del CSS e in qualche elemento grafico non diciamolo a nessuno, di sicuro verranno adeguati :P (cmq vi assicuro che è vizio, poi faccio un post pure su questo).

Scherzi a parte, attendevo il redesign non so da quanto tempo… noto che utilizzano WordPress 2.1, quindi quel bel layout potrebbe benissimo essere un tema utilizzabile da tutti, ce lo faranno questo regalo? Speriamo di si :D
macthemes2

Intanto tra le segnalazioni troviamo un post-intervista dedicato a Enhanced Labs ed ai suoi designer, naturalmente imperdibile… poi vorrei annotare l’uscita della nuova versione di Crystal Clear, non perché mi piaccia, ma solo per ricordarmi di provarla… sinceramente la roba tipo Vista non mi va giù :/

Archiviato in:Apple, Art, Blog, CSS, Code, Design, Fun, Graphics, Html, Mac, Web, Web-design

List 05.03

Technorati Tags: , , ,

Archiviato in:Adobe, Apple, Blog, CSS, Code, Design, Firefox, Free, Fun, Graphics, Html, List, Mac, Marketing, Photo, Photography, Photoshop, Tips, WWW, Wallpaper, Web, Web-design, WordPress

Link 05.01

§ – Celebrazione di un blogger: I facts di Andrea Beggi

§ – Hicks aggiorna il suo tema per gReader, risolvendo qualche problemino e abbellendo ulteriormente il tutto: Google Reader Theme update
– lo sto provando, ma ancora mi risulta difficile rinunciare al classico :/ stiamo a vedere

§ – Via MacApper qualche consiglio su come far convivere amorevolmente Wii con Mac: How To: Control your Mac with a Wii Remote

Archiviato in:Accessori, Blog, Browser, CSS, Code, Design, Firefox, Google, Html, Link, Script, Tech, Tips, WWW, Web, Web-design, Wii

Rapid Weaver gratis!

Leggo or ora su melamorsicata della splendida iniziativa di RealMac Software, e come non partecipare… :) dovete solo inviare il vostro nome e indirizzo email da questo form e vi regaleranno una licenza per Rapid Weaver.

Leggendo meglio…

L’iniziativa fa riferimento alla versione 3.5 e non alla 3.5.1. La prima risulta compatibile con OSX 10.3.9, la seconda, naturalmente con maggiori (e migliori) caratteristiche richiede 10.4. Non resta che provare. Vedremo… Intanto mi è appena arrivato il numero di serie :D

Prova sul campo…

e invece funziona perfettamente con la 3.5.1. Wow!

Archiviato in:Apple, Blog, CSS, Code, Design, Free, Fun, Graphics, Html, Mac, Productivity, Script, WWW, Web, Web-design

iGoogle.com

Quella di sotto la mia personalizzazione di iGoogle. L’interfaccia funziona benissimo, c’è tutto quello che serve , la possibilità di vedere gli ultimi feed da gReader e le ultime mail di gMail, lo spazio per il calendario e quello per il Blocco Note, possono essere aggiunti nuovi widgets. Il servizio è disponibile da tempo, oggi anche attraverso il dominio iGoogle.com

iGoogle

Archiviato in:CSS, Gmail, Google, Graphics, Html, Tips, WWW, Web, Web-design

Cosa sto facendo…

Qualche tempo fa (2 o 3 anni) girava questo di meme … erano quasi tutti web-designer che postavano uno screenshot di quello che stavano facendo in quel momento, del progetto che stavano portando avanti.

Io come ogni santo giorno sono alle prese con Photoshop, Dreamweaver, Html e CSS.

Voi che state facendo? ( fate uno screenshot di qualche cosa a cui state lavorando e postatela da qualche parte… sono curioso :D )

Note.

Archiviato in:Autoreferenzialità, Browser, CSS, Graphics, Html, Photoshop, Web, Web-design

Temi WordPress fai da te

Avendo una pur minima conoscenza di Html e CSS (JS, PHP) si riesce agevolmente a modificare un tema e renderlo personalizzato. Se poi uno di Html e CSS non ne capisce proprio niente può ricorrere a questa simpatica applicazione: WordPress Theme Generator.

Il sistema è semplice, intuitivo e chiaro, una volta sistemati tutti i parametri è possibile salvare e scaricare in nostro tema in formato zip o in singole pagine e file (php, js, png ecc. ecc.), pronto per essere messo on-line. ;)

Technorati Tags: , ,

Archiviato in:Blog, CSS, Code, Design, Free, Fun, Graphics, Html, Tips, WWW, Web, Web-design, WordPress

CSS Slicing Guide

CSS Slicing Guide è una guida composta da 9 pagine, che illustrano velocemente (ma non manca niente) come ottenere un buon layout utilizzando un qualsiasi programma di grafica ed un editor. Ottima come guida veloce.

Learn how to slice your templates into fully standards compliant XHTML and CSS!

via Digg

Archiviato in:CSS, Code, Design, Digg, Html, WWW, Web, Web-design

Qualche link (qualche cosa di bello e di utile)

Archiviato in:Blog, Blogroll, CSS, Code, Design, Extension, Firefox, Free, Fun, Google, Html, Tech, Tips, WWW, Web, Web-design

Triplo post da A List Apart

Archiviato in:Blog, Browser, CSS, Code, Design, Html, Tips, WWW, Web, Web-design

Coda

Gustomela ci ha dato l’anteprima della notizia del rilascio di un’applicazine misteriosa da parte di Panic. Bene, in giornata, prontamente è arrivata! Coda, un bel (diciamo bellissimo) programmino che viene descritto così dal sottotitolo della pagina web di presentazione “Text editor + Transmit + CSS editor + Terminal + Books + More = Whoah. Che dire ancora… accattatevillo! :D

Per una esauriente spiegazione invito tutti a leggere l’ottima recensione di Delymyth

Archiviato in:Apple, Blog, Browser, CSS, Code, Html, Mac, WWW, Web, Web-design

Dark Theme per WordPress – Bartelme Design


C’è poco da dire, io ho commentato la presentazione del tema con un “Perfetto!” ;) (Sia benedetto Wolfgang Bartelme)
Tra le varie caratteristiche c’è il supporto per flickrRSS, Gravatar, Ultimate Tag Warrior, WP-PageNavi.

Chiarimenti e screenshot:

Quello reso disponibile da Bartelme non è altro che il tema utilizzato dal suo blog fino a qualche tempo fa. Ora che è passato a “Deep Blue” sempre suo, ha reso disponibile, con l’aiuto di iLemon quello vecchi. Per un’anteprima basta andare sul sito di iLemon (il tema è quello utilizzato dallo stesso) oppure eccovi qualche screenshot direttamente dall’account Flickr di Bartelme.

Update (simpatica):

… e non finisco di scrivere il post che mi arriva un referrer da qui :D , ora bisognerebbe chiedere a Matt se ce lo mette in wordpress.com :D

Archiviato in:Blog, Browser, CSS, Code, Design, Flickr, Free, Fun, Graphics, Html, Icons, Illustrator, Tips, WWW, Web, Web-design, WordPress

35 x 5

Sarà un fatto psicologico… non saprei… questo articolo, ho paura di perderlo, di dimenticarlo, di non leggerlo più. L’ho bookmarkato da tutte le parti, su del.icio.us su Google Bookmark su tumblr non so più dove fissarlo, mancava il blog… quindi eccolo qua, mi è rimasto solo di stamparlo e attaccarlo dietro il monitor :/ ci penserò, intanto

35 Designers x 5 Questions | Smashing Magazine

Archiviato in:Blog, CSS, Code, Design, Flash, Font, Graphics, Html, Icons, Illustrator, Libri, Productivity, Script, Tips, Web, Web-design

Link nascosti

Matt Cutts nel suo blog dedicato ai Gadgets, a Google ed al mondo SEO scrive un tutorial sui link nascosti, o meglio, come nascondere un link e fare in modo che la sua rappresentazione visuale assomigli in tutto e per tutto a quella di un testo semplice.
Niente di complicato, quello che si deve modificare per far si che ciò avvenga e il messaggio della status bar (JavaScript), e lo stile (CSS). Matt Cutts da un esempio:

<a href="link.htm" onMouseOver="window.satus=' ';return true;" style="coursor:text;color:#000;text-decoration:none;">Link</a>

a questo, nella parte dello stile aggiungerei anche:

outline:none;

che serve a togliere quel fastidiosissimo bordo dotted da 1 pixel (puntinato) che appare in IE quando un elemento come un link o un filmato flash è in stato di focus.

A cosa serve questa roba.

Questa roba non serve a niente! Conosco persone che andrebbero a nozze con queste cavolate. Spesso ho messo mano su pagine con testo bianco su sfondo bianco, quindi all’apparenza invisibile, e chi ha pensato di farlo e poi lo ha fatto ha anche giustificato la tecnica… maddai :lol:

Cosa ne rimane

Se davvero volete riciclare qualche cosa di quello che ho scritto allora riciclate outline:none; sui filati in Flash, visto che quel bordo puntinato di IE fa proprio schifo

Archiviato in:Blog, Browser, CSS, Code, Flash, Html, SEO, WWW, Web, Web-design

20 Image Galleries & Slideshows (Gratis) – SlideShowPro ($)

Se come me mi trovate in continuazione a dover creare gallerie di immagini e impazzite a trovare sistemi semplici e veloci per farlo allora vi consiglio questo post di dhtml site che raccoglie 20 utilissime image galleries e sistemi per slideshows da utilizzare sui nostri siti o progetti, di seguito elenco le risorse segnalate:

…ma il mio prefetiro è…

Trattandosi di Gallerie Immagine e SlidesShow non posso fare a meno di menzionare il mio preferito che rimane l’ottimo SlideShowPro un componente per Falsh che permette la realizzazione di gallerie fotografiche gestite tramite XML e due semplici cartelle una per le miniature, una per le foto grandi. Se poi avete Mac allora a disposizione c’è un Plugin per iPhoto, che automatizza tutto il processo di creazione degli album e dei file XML, uno spettacolo! SlideShowPro costa 25$, vi assicuro che sono soldi ben spesi! (Non venitemi a dire che c’è roba identica on-line a gratis, lo so, ho provato e vi assicuro che non reggono il paragone)

Technorati Tags: , , , ,

Archiviato in:Art, Blog, CSS, Code, Design, Flash, Free, Graphics, Html, Mac, Photo, Photography, Photoshop, Tech, Tips, WWW, Web, Web-design, iLife, iPhoto

T-Shirt per l’estate

La decisione l’ho presa l’estate scorsa dicendomi “l’anno prossimo le compro solo su internet” e questo è il momento di cominciare a pensarci. Durante l’inverno mi sono preoccupato di salvare vari link da cui attingere, cercherò di pubblicarli.

La prima segnalazione: Le T-Shirt di A List Apart. Costano 18$, con 10$ di spedizione, il tutto al cambio fa 20€ (per il momento)

alst.gif

La scelta ricade sul modello -9999px :D , celeberrima tecnica di replacement che sfrutta la proprietà text-indent dei css per sostituire immagini a caratteri.

Archiviato in:CSS, Design, Fun, T-Shirt

Questo post lo scrivo da Google Doc

Questo post lo scrivo da Google Doc. Vorrei solo provare il servizio come strumento alternativo per postare. La piattaforma offre tante piccone cosucce che potrebbero tornare utili, e voglio vedere come il contenuto viene traghettato da lì a qui. Il particolare sono curioso di vedere come si comporta con i tag bold (o meglio strong), italic (o melgio em), poi con le liste:

  1. quelle ordinate
  2. quelle ordinate
  • e quelle non ordinate
  • non ordinate

ma anche con il blockquote

e poi con il le parola da cancellare.
Tra le cose importati da ricordare c’é che Google Doc offre anche la funzionalità di correzione ortografica, che sembra funzionare molto bene

Ora da WordPress
Vediamo come è successo nel trasferimento del post da Google Doc a WordPress… sembra sia tutto a posto, le cose da segnalare sono che tutti i tag di formattazione del testo sono stati sotituiti da tag span a cui è stato poi applicato uno stile in linea che riprende lo stile visuale dei tag di formattazione quindi ci ritroveremo con roba del tipo <span style="font-style: italic">.

Ho provveduto, visto che se ne offre la possibilità, a salvare la pagina in formato Html, il codice che ne esce fuori non è certo dei migliori, ma per molti sarà un servizio utilissimo, l’Html riporta la seguente intestazione :

<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<head>

… nessuna Doctype, quindi nessuna conformità (per i profani “ va comunque benissimo, meglio questo che niente ;) “. Per quanto riguarda il CSS usato anche qui niente di conforme a niente, un po di codice:

BODY, P, DIV, ADDRESS, OL, UL, LI, TITLE, TD, OPTION, SELECT
{
font-size: 10.0pt;
margin-top:0pt;
margin-bottom:0pt;
}

Da notate l’unità di misura utilizzata per i font espressa in punti, quelle degli elementi di blocco in pixel.

è da lodare il fatto che comunque si sia pensato anche ad uno stile personalizzato per altri media:

@media screen {
.pb { border-top: 1px dashed #C0C0C0; border-bottom: 1px dashed #C0C0C0 }
.writely-comment { font-size: 9pt; line-height: 1.4em; padding: 1px; border: 1px dashed #C0C0C0 }
}
@media print {
.pb { border-top: 0px; border-bottom: 0px }
.writely-comment { display: none }
}
@media screen,print {
.pb { height: 1px }
}

Per le considerazioni finali potrei dire che il servizio è utilissimo per un non purista del codice, ma per chi ci tiene non c’è niente da fare, pecca in molte cose, naturalmente  un “esperto” sa come rimediare a certi difettucci quindi il servizio se usato in un certo moto potrebbe essere utilissimo anche agli “esperti”. Personalmente ho un po abbandonato la via del “codice perfetto”, per ritenendo che in certe situazioni sia d’obbligo ma sinceramente non capisco perché nel 2007 mostri come Google debbano ancora usare tecniche e codice risalenti alla preistoria, mi riferisco all’Html utilizzato :(

Archiviato in:Blog, Browser, CSS, Code, Font, Google, Html, Tech, WWW, Web, Web-design, WordPress

K2208 on del.icio.us