È questo il periodo dell’anno che dedico parte del tempo al pensiero creativo in cui cerco strategie diverse per migliorare il mio lavoro.
Ho deciso di riprendere la tradizione incominciata qualche tempo fa di scrivere gli articoli non solo per i miei studenti, ma anche per me 🙂 in modo che possa conservare in maniera ordinata informazioni che posso riprendere per la mia formazione e organizzazione.
Nella lunghissima lista dei ToDo trovo la nota: “imparare ad usare il Markdown per velocizzare la scrittura di documenti su internet“.
Procedo… seduto all’ombra di un albero con l’iPad sulle gambe.
Estraggo l’elemento dal ToDo e ne costruisco una mappa mentale che mi consente di progettare e pensare a “a ruota libera“.
Ma cos’è il Markdown?
Tutto nasce dall’esigenza di poter scrivere in ogni luogo con qualsiasi strumento, in modo rapido, senza vincoli tecnologici legati allo strumetto hardware o software, in breve concentrarsi sul contenuto.
Markdown è un linguaggio di markup creato da John Gruber e Aaron Swartz che consente a blogger e scrittori di ogni tipo di scrivere testi in maniera veloce utilizzando una sintassi estremamente semplice ed efficace permettendo poi di convertire i testi in (X)HTML immediatamente fruibile senza la paura di dimenticare la chiusura di tag HTML o fare errori di scrittura di tag.
Se questo motivo non vi bastano vi rimando alla brillante e rapidissima spiegazione di Brett Terpstra che con il suo articolo: “Why Markdown? A two-minute explanation” ci illustra i suoi motivi, che condivido pienamente:
- è semplice;
- è veloce;
- è pulito;
- è mobile;
- è flessibile;
- si adatta ad ogni flusso di lavoro.
Ma come imparare ad usare Markdown?
Basta andare alla fonte, sul blog Daring Fireball (di John Gruber), troverete le basi per imparare in 10 minuti tutto e nella sezione Syntax la sintassi completa.
Come ho scritto questo post? Usando la notazione Markdown 🙂
Di seguito il tutorial tratto dal sito Daring Fireball.
Tutorial
Markdown:
Primo livello di intestazione ============================= Secondo livello di intestazione ------------------------------- Laoreet accumsan, ullamcorper iriure suscipit commodo dolore iusto ea blandit accumsan illum amet nostrud autem ipsum tincidunt at blandit. Vulputate, nulla enim dolore nostrud qui eu nisl tation facilisi minim lorem, ut commodo qui. Luptatum augue magna aliquip nonummy dolore quis eu, ut molestie eum nostrud. ### Header 3 > Questa è una blockquote. > > Questo è il secondo paragrafo nel blockquote. > > # # Questo è un H2 in un blockquote
Risultato:
<h1>Primo livello di intestazione</h1> <h2>Secondo livello di intestazione</h2> <p>Laoreet accumsan, ullamcorper iriure suscipit commodo dolore iusto ea blandit accumsan illum amet nostrud autem ipsum tincidunt at blandit. </p> <p>Vulputate, nulla enim dolore nostrud qui eu nisl tation facilisi minim lorem, ut commodo qui. Luptatum augue magna aliquip nonummy dolore quis eu, ut molestie eum nostrud.</p> <h3>Header 3</h3> <blockquote> <p>questo è un blockquote.</p> <p>Questo è il secondo paragrafo del blockquote.</p> <h2>Questo è un H2 nel blockquote.</h2> </blockquote>
Enfatizzare
Markdown usa asterischi e sottolineato per enfatizzare il testo
Markdown:
Alcune di queste parole *sono enfatizzate*. Anche queste parole _sono enfatizzate_.
Usa due asterischi per **scrivere in grassetto**. o se preferisci, __usa due underscore__.
Risultato:
<p>Alcune di queste parole <em>sono enfatizzate</em>. Anche queste parole <em>sono enfatizzate</em>.</p> <p>Usa due asterischi per <strong>scrivere in grassetto</strong>. o se preferisci, <strong>usa due underscore</strong>.</p>
Liste
Per realizzare le liste non ordinate (liste puntate) usa asterischi, segno + o trattino (*, + e -) come marker. Questi tre simboli sono interscambiabili:
* Candy. * Gum. * Booze.
Oppure:
+ Candy. + Gum. + Booze.
Oppure:
- Candy. - Gum. - Booze.
Tutti producono lo stesso risultato:
<ul> <li>Candy.</li> <li>Gum.</li> <li>Booze.</li> </ul>
Le liste ordinate (ordinate) usano come marker numeri seguiti da un punto:
1. Red 2. Green 3. Blue
Risultato:
<ol> <li>Red</li> <li>Green</li> <li>Blue</li> </ol>
Se inserite righe vuote tra gli elementi inserirete un paragrafo <p> tra gli elementi. E’ possibile creare un lista di paragrafi identando con 4 spazio oppure un tab ogni singolo elemento della lista
* un elemento della lista. Con più paragrafi. * un altro elemento della lista.
Risultato:
<ul> <li><p>un elemento della lista.</p> <p>Con più paragrafi.</p></li> <li><p>un altro elemento della lista.</p></li> </ul>
Markdown supporta due stili per la creazione di link: inline e reference. Con entrambi gli stili, è possibile utilizzare le parentesi quadre per delimitare il testo che si desidera trasformare in un link.
Lo stile inline dei link usa le parentesi immediatamente dopo il testo del link.
Esempio:
Questo è un [esempio di link](http://example.com/).
Risultato:
<p>Questo è un <a href="http://example.com/"> esempio di link</a>.</p>
Opzionalmente, potete includere l’attributo title tra le parentesi tonde dopo il link:
Questo è un [esempio di link](http://example.com/ "Con un titolo").
Risultato:
<p>Questo è un <a href="http://example.com/" title="Con un titolo"> esempio di link</a>.</p>
Lo stile reference dei link consente di fare riferimento al link con dei nomi definiti in un altro punto del documento:
Fai la tua sceltra tra: [Google][1], [Yahoo][2] o [MSN][3]. [1]: http://google.com/ "Google" [2]: http://search.yahoo.com/ "Yahoo Search" [3]: http://search.msn.com/ "MSN Search"
Risultato:
<p>Fai la tua sceltra tra: <a href="http://google.com/" title="Google">Google</a>, <a href="http://search.yahoo.com/" title="Yahoo Search">Yahoo</a> o <a href="http://search.msn.com/" title="MSN Search">MSN</a>.</p>
L’attributo “title” è facoltativo. I nomi dei collegamenti possono contenere lettere, numeri e spazi, ma non sono case sensitive:
Incomincio la mia giornata con una tazza di caffè e il [The New York Times][NY Times]. [ny times]: http://www.nytimes.com/
Risultato:
<p>Incomincio la mia giornata con una tazza di caffè e il <a href="http://www.nytimes.com/">The New York Times</a>.</p>
Immagini
La sintassi per le immagini è molto simile a quella dei link.
Inline (i titoli sono opzionali):
Reference-style:
![alt text][id] [id]: /path/to/img.jpg "Titolo"
Entrambi gli esempi di cui sopra producono lo stesso output:
<img src="/path/to/img.jpg" alt="alt text" title="Titolo" />
CODE
In un paragrafo normale, è possibile creare una sezione codice includendo il testo tra virgolette inverse. E commerciali (&) e le parentesi angolari (<o>) saranno automaticamente tradotte in entità HTML. Ciò facilita la scrittura di codice HTML in Markdown ad esempio:
Consiglio vivamente l'uso dei tag `<blink>`. Usare la notazione `—` invece che quella decimale: `—`.
Risultato:
<p>Consiglio vivamente l'uso dei tag <code><blink></code>.</p> <p>Usare la notazione <code>&mdash;</code> iinvece che quella decimale: <code>&#8212;</code>.</p>
Per specificare un intero blocco di codice pre-formattato, rientrate per ogni riga di 4 spazi o 1 tab.
Markdown:
Se desiderate che la vostra pagina sia valida in XHTML 1.0 Strict,
inserite il blocco paragrafo nel blocco blockquote.
<blockquote>
<p>Per esempio.</p>
</blockquote>
Risultato:
<p>Se si desidera che la vostra pagina sia valida in XHTML 1.0 Strict,
inserite il blocco paragrafo nel blocco blockquote.</p>
<pre><code><blockquote>
<p>Per esempio.</p>
</blockquote>
</code></pre>
Cosa uso?
- Per Mac, iPad, iPhone: byword
- Plug-In per WordPress: WP-Markdown
- On-line: Dingus