HOW TO SULLA PUBBLICAZIONE DIRETTA SUL SITO DELL'ABRUZZO SOCIAL FORUM

(A cura di William del Gruppo Informatico ASF)

COME INSERIRE APPUNTAMENTI SUL SITO ASF 

1)Andare sulla home page del sito dell’Abruzzo Social Forum – www.abruzzosocialforum.org (come in figura)

2)Cliccare sulla voce “Pubblica appuntamenti” che trovate all’indirizzo: http://www.abruzzosocialforum.org/appuntamenti/pubblica-appuntamento.htm, si aprirà la seguente pagina:

3)  Inserire i dati richiesti:

-          data;

-          titolo dell’appuntamento;

-          testo dell’apppuntamento, che puo’ essere messo in testo semplice o formattato con l’html (a questo proposito vedi pagine seguenti);

-          eventuali immagini, o file da allegare – tipo un file .pdf o altro(fig. 3);

-          descrizione dell’eventuale immagine inserita;

-          eventuale nome dell’autore dell’inserimento news;

-          login e password.

 Per quanto riguarda l’inserimento delle immagini, cliccando sul tasto “Browse” o “Sfoglia”, si aprira’ una finestra che permettera’ di selezionare dall’interno del vostro computer un file di immagine. Cosi’ facendo verranno date al sistema le istruzioni circa il percorso dove e’ collocata l’immagine sul vostro computer. E’ molto importante non spostare il file di immagine in questo arco di tempo, altrimenti il sistema non la troverebbe e sul sito verrebbe pubblicata una “x” rossa su sfondo bianco, segno dell’impossibilita’ di reperire l’immagine al momento della pubblicazione dell’appuntamento

4)    Come specificato nella pagina, se si dispone di una propria login e password – che puo’ essere richiesta al gruppo comunicazione del sito asf, e’ possibile pubblicare direttamente l’appuntamento.

Viceversa, e’ possibile lasciare come nome utente “guest” e comne password quella memorizzata per inviare un’email al webmaster il quale, dopo aver controllato la veridicita’ dell’appuntamento, provvedera’ ad approvare l’inserimento del nuovo appuntamento, rimandandovi ad una pagina simile a quella che vedete nella figura successiva.

5) L’appuntamento pubblicato verra’ messo in cima alla lista secondo il tipo di data che e’ stato fornito. Il sistema provvede infatti a selezionare l’ordine degli appuntamenti secondo un criterio cronologico.

COME INSERIRE ARTICOLI SUL SITO ASF 

A ciascun foro territoriale o tematico dell’Abruzzo Social Forum e’ data la possibilita’ di inserire articoli nel proprio aspazio interno al sito . 

Gli articoli che vengono pubblicati sono disponibili all’interno di ciascun foro tematico, inoltre gli ultimi 5 articoli (per il momento si è deciso per 5) inseriti temporalmente e rispetto a tutti i forum locali/tematici vengono automaticamente visualizzati in home page (questo per darne una maggiore visibilità).

Ecco la procedura standard da seguire: 

1)          Cliccare sul forum tematico in cui si vogliono pubblicare articoli (in questo caso ad esempio prendiamo il Forum Acqua – www.abruzzosocialforum.org/forum-acqua/  (fig. 5).

2)      In alto della pagina (sotto il banner del forum), c’e’ un collegamento “Inserisci articolo”. Cliccandoci si accedera’ alla seguente pagina www.abruzzosocialforum.rgo/forum-acqua/inserisci-articolo.htm (fig. 6):

3)    Anche in questo caso, come visot in precedenza per la pubblicazione degli appuntamenti, e’ necessario inserire alcune informazioni, mentre altre sono opzionali: 

-          Titolo dell’articolo (obbligatorio e piu’ chiaro possibile, dato che apparira’ nella pagina principale;

-          testo dell’articolo (eventualmente in html, si rimanda alle pagine seguenti)

-          eventuale immagine;

-          descrizione dell’immagine;

-          eventuale nome dell’autore dell’inserimento dell’articolo;

-          login e password (questa volta obbligatoriamente si deve inserire un nome utente e una password validi (fig. 7).

Il sistema avvertira’ dell’incompletezza di eventuali campi o di errori di digitazione di nome utente o password (fig. 8).

COME INSERIRE NEWS SULLE PAGINE DEI FORUM TEMATICI/TERRITORIALI 

Oltre alla possibilita’ di inserire articoli nelle proprie pagine, ogni forum territoriale o tematico può  inserire news che verranno pubblicate sia sulla colonna di destra delle pagine del forum competente, sia sulla colonna di sinistra della home page del sito dell’Abruzzo Social Forum (acquistando cosi’ maggiore visibilita’). La visualizzazione in home page per il momento ha il seguente meccanismo: l'ultima news di un forum locale rimane visualizzata per 30 gg, la penultima news per 15 gg, la terzultima per 7 gg.

A questo proposito e’ opportuno precisare che:

a)    le news hanno carattere di informazione circa eventi o notizie dell’ultima ora;

b)    gli articoli di ciascun forum hanno carattere di approfondimento, riflessioni, eccetera. 

Ecco i passi da seguire per l’inserimento di una news (anche in questo caso si prende come riferimento il forum acqua): 

1)    Sulla colonna di destra della pagina principale del forum acqua troviamo questa tabella:

2)  Clicchiamo su “Pubblica News”. Avremo questa pagina:

3)  Anche in questo caso sara’ necessario seguire la solita procedura per l’inserimento dei campi destinati a diventare parte integrante della news, con nome utente e password finali. Anche in questo caso, come per gli articoli, per pubblicare e’ necessario essere in possesso della password per il forum territoriale/tematico di competenza. Non si riportano i passaggi per brevita’. E’ possibile controllare i passaggi eseguiti per la pubblicazione degli articoli nelle pagine dedicate ai singoli forum. 

4)   La News pubblicata finira’, come gia’ detto, oltre che nella colonmna di destra del forum tematico/territoriale, anche nella colonna di sinistra della home page del sito dell’ASF, come riportato in figura 11:

APPENDICE: IL CODICE HTML 

Si riportano qui di seguito alcune utili informazioni per la formattazione in HTML del testo. Questa procedura puo’ essere utili quando si vogliono inserire nell’articolo, nell’appuntamento o nella news eventuali effetti al testo (sottolineature, grassetti corsivi eccetera). 

Il materiale qui riprodotto e’ stato tratto dalla Rete Internet.

Per eventuali dubbi contattare il gruppo informatico   a  uno dei seguenti indirizzi: 

willone73@hotmail.com 

isazi@olografix.org

eziolotta@virgilio.it

NOTA IMPORTANTE: Il sistema di pubblicazione delle informazioni sul sito ASF e’ stato strutturato per rendere piu’ agevole la creazione di pagine formattate con il linguaggio html. A tal fine, quando si andra’ ad utilizzare l’html come linguaggio di formattazione, non si devono inserire i “tag” introduttivi classici per la formattazione della pagine (<HTML></HTML>, <HEAD></HEAD>, <BODY></BODY>). Si deve in pratica considerare come se si stesse gia’ scrivendo all’interno di un contenitore formattato per supportare tale linguaggio. 

INTRODUZIONE ALL’HTML (tratto da www.html.it)  

Questa breve introduzione all'html non vuole essere un manuale d'uso, ma, dato che si rivolge a chi non ha mai usato lo HTML per creare pagine web, vuole essere solo un'introduzione per il web designer. Chi volesse approfondire può far riferiemento alla Guida HTML

Lo HTML (Hyper Text Mark-up Language) nasce come linguaggio per la descrizione di testi strutturati. Devi sapere che lo HTML non è come un linguaggio di programmazione ma un semplice sistema di contrassegno, i cui TAG vengono riconosciuti ed interpretati dai browser web. Le peculiarità dello HTML fanno si che tu puoi avvicinarti al web publishing senza avere alcuna conoscenza tecnica preesistente.

Per chi comincia da zero è consigliabile utilizzare il notepad di windows per scrivere il codice html delle pagine che si andranno a realizzare. Esistono tuttavia appositi editor visuali che permettono di operare con maggiore semplicità (frontpage, dreamweaver ecc...).

Un Po' Di Storia

Le specifiche del linguaggio HTML sono state pubblicate dal World Wide Web Consortium (W3C). Questo organismo internazionale, fondato nell'ottobre 1994, è composto da università e aziende private (tra cui IBM, Microsoft, Netscape Communications Corporation, Novell Softquad, Spyglass e Sun Microsystems) e coordinato da LCS (Laboratory for Computer Science). Esso ha lo scopo di guidare lo sviluppo del Web e di definirne gli standard.

HTML 3.2

I browser di terza generazione (in pratica anche i più vecchi ancor oggi utilizzati) comprendono lo HTML3.2. Questo è caratterizzato da TAG (tipicamente inseriti in coppie) che possono venire ulteriormente specificati con attributi. Quando i designer "sbarcano" su internet decidono di voler usare lo HTML, che come abbiamo detto all'inizio è nato per descrivere TESTI strutturati, per creare pagine eleganti con l'inserimento di grafica. In poche parole una forzatura. L'unico strumento che questi designer hanno a loro disposizione per l'impaginazione delle immagini erano (e sono tuttora) le tabelle dello HTML, che da questo momento in poi diventano uno strumento usato e abusato! Lo HTML 3.2 permette di regolare gli allineamenti delle celle della tabella al punto, ed è l'unico contesto in cui gli allineamenti si assegnano per pixel. Lo HTML 3.2 permette anche di allargare una cella per occupare le colonne limitrofe o le righe limitrofe.

HTML 4.0

Nasce nel 1999 con l'intento di:

1. Ridurre la differenza tra lo HTML compreso dai browser e lo HTML ufficiale. Per esempio, standardizza i frame;
2. Separare contenitore da contenuto;
3. Aggiungere supporto per alcune nuove tecnologie;
4. Migliorare l'accesso al web per i portatori di handicap;
5. Abbracciare Unicode 2.0.

CONCETTI DI BASE DELL’HTML

1. Un file HTML è, in origine, un semplice documento di testo non formattato (di tipo ASCII,con estensione .txt, come quelli che si possono creare con il Blocco note di Windows).
2. Cosa vuol dire formattare un testo? Semplicemente assegnare a un testo un formato, o meglio una serie di attributi. Facciamo un esempio: assegnare le parti in grassetto, corsivo, un colore a un testo o un determinato font, dimensioni e così via. Quando invece vuoi formattare un intero documento vuol dire definire la collocazione e il tipo di visualizzazione (il layout) di tutti gli elementi presenti nel documento stesso.
3. All'interno del documento devi inserire non solo il testo che vuoi far apparire nella pagina Web ma anche alcune istruzioni specifiche (TAG o marcatori) del linguaggio HTML.
4. Ricorda che per i nomi dei file e per le estensioni degli stessi si usano sempre i caratteri in minuscolo: .html o .htm
5. I parametri o TAG (Markup TAGs = marcatori), attraverso i quali forniamo allo HTML le indicazioni per la formattazione al documento oltre che all'inserimento di immagini e altri elementi multimediali, non sono altro che parole chiave contenute all'interno dei simboli "<" (maggiore) e ">" (minore), chiamati anche parentesi uncinate.
6. Tutti gli elementi ed il contenuto di un documento HTML sono compresi all'interno dei marcatori <html> e </html>. Il simbolo "/" (slash) indica la fine del TAG.
7. Per scrivere codice HTML puoi utilizzare qualsiasi editor HTML testuale, ma anche solo il Blocco Notes di Windows.
8. Abbiamo già detto, ma è bene ripeterlo, i siti Web, prima della pubblicazione, vanno creati in locale, cioè sul tuo hard disk. Solo in un secondo momento vengono trasferiti nei server attraverso (in genere) programmi di FTP (= File Transfer Protocol) mediante passord e UserID, per cui nessuno oltre te dovrebbe poter modificare le tue pagine.
9. Esistono anche dei TAG che non hanno bisogno di chiusura, perché la loro funzione non è quella di marcare un elemento, ma di fornire informazioni di diverso tipo.
10. ATTRIBUTI E VALORI: le istruzioni inserite all'interno dei TAG possono contenere oltre ai nomi, anche gli attributi e i valori del comando dato. In generale, lo schema previsto dalla sintassi HTML è il seguente: <TAG ATTRIBUTO=VALORE>…</TAG>
11. All'interno della pagina HTML puoi inserire: testo, immagini, tabelle, suoni, liste, moduli, altre pagine, effetti particolari e collegamenti ipertestuali (link).
12. Puoi inserire il testo direttamente all'interno del documento HTML, insieme ai TAG necessari.
13. I materiali multimediali devi considerarli come file esterni, richiamati nella pagina in fase di visualizzazione mediante i rispettivi TAG presenti nel file HTML.
14. I collegamenti ipertestuali possono essere associati in modi diversi (mediante appositi TAG, sempre inseriti nel file HTML di base) a singole parole, intere frasi o immagini, facendo clic sulle quali il tuo utente può passare ad altri punti dello stesso documento (link interni), o ad altri documenti o indirizzi di posta elettronica (link esterni).

ANATOMIA DI UNA PAGINA WEB

I Tag Principali

Il codice HTML si caratterizza sempre per la presenza al suo interno di tre TAG fondamentali: <HTML>, <HEAD> e <BODY>. La struttura di base di ogni documento HTML è quindi articolata in questo modo: <HTML> <HEAD> </HEAD> <BODY> </BODY> </HTML>

Il browser sa che deve leggere tutto ciò che è contenuto entro i TAG <HTML>…</HTML> come codice HTML ed è in grado di riconoscere il punto di inizio e quello di chiusura rispettivamente della testa e del corpo del documento.

Come avrai già capito, quindi, un documento HTML si divide in due parti fondamentali: l'intestazione e il corpo del documento.

<head> = intestazione

Gli elementi <head> e </head> sono posti immediatamente dopo l'apertura del TAG <html> e racchiudono l'intestazione vera e propria del documento. In questa parte del codice devi mettere tutte le informazioni necessarie al browser per una corretta interpretazione del documento, ma che l'utente non visualizza sulla schermo, a meno che non apra la finestra del browser che fa visualizzare il codice sorgente.

L'intestazione fornisce: il titolo della pagina e le parole chiave per i motori di ricerca. Le parole chiave altro non sono che delle informazioni che vengono passate al browser tramite dei TAG specifici, e che servono ai motori di ricerca per comprendere il contenuto del tuo sito.

Vedremo più da vicino nella lezione relativa ai motori di ricerca.

<html>   <head>     <title>titolo del documento</title>   </head>   <body>   </body> </html>

<body> = corpo del documento

Contiene tutti gli elementi della pagina che verranno effettivamente visualizzati a video: il testo, le immagini, gli applet Java, il codice Javascript, e tutti quei contenuti multimediali che vengono mostrati sullo schermo. Il TAG <body>, può essere utilizzato in forma semplice oppure se ne possono specificare alcuni attributi e i relativi valori.

Se lasci questo TAG privo di attributi, lascerai gran parte dei criteri di visualizzazione della tua pagina alle impostazioni predefinite del browser di ciascun visitatore: il colore dello sfondo, il colore dei testi, quello dei collegamenti ipertestuali attivi e visitati.

Viceversa, specificando nel codice HTML gli opportuni attributi del TAG <body> puoi definire indicazioni specifiche circa la visualizzazione di questi elementi, esattamente come tu li hai progettati.

IL COLORE ED I COMMENTI IN HTML

Anche se abbiamo già trattato questo argomento nella sezione relativa al colore nel web, è utile rivedere insieme alcuni concetti chiave che non dovrai mai dare per scontati, ma che una volta acquisiti saranno per te molto spontanei.

La definizione del tipo di colore viene espressa mediante caratteri esadecimali preceduti dal simbolo "#" (cancelletto): essi possono comprendere i numeri da 0 a 9 e le lettere da "A" a "F". I primi due caratteri si riferiscono alla quantità di rosso presente nella gamma RGB (Red Green Blue), i due successivi determinano la quantità di verde, mentre gli ultimi due si riferiscono alla componente blu. L'intera gamma di colore è compresa tra "#FFFFFF" (bianco) e "#000000" (nero). In Internet non puoi utilizzare tutti i colori esistenti nello spettro cromatico, ma è consigliabile operare una scelta attraverso quelli disponibili nella "palette web" (una raccolta di 216 colori comuni a sistemi operativi differenti), altrimenti i browser potrebbero sostituire il colore che tu hai scelto, ma che non è supportato con un altro simile a quello ma non esattamente identico, vanificando i tuoi sforzi di progettazione grafica.

I Commenti

Ricordati che a volte può essere utile "commentare il codice HTML, soprattutto quando usi determinate funzioni di javascript. I commenti non sono visualizzati dal browser, ma ti saranno sicuramente utili quando dovrai "rimettere le mani nel codice" per cambiarlo, o semplicemente per usarlo in altre occasioni. La creazione di un commento genera il seguente codice HTML: <!-- Testo commento-->

I TAG PIU’ COMUNI DELL’HTML (da usare nella pubblicazione sul sito ASF)

Raccolta tag html

Nota: Per problemi di rappresentazione ho scritto i tag html con gli spazi tra la parola racchiusa ed i simboli < e >.

Per essere utilizzati efficacemente nel codice html i due spazi vanno omessi.

Indice tabelle (tratto da http://www.lilik.it/~matteo/tag.php)

• Tabella tag del primo ordine
• Tabella tag del secondo ordine
• Tabella tag per file multimediali
• Tabella tag per le tabelle

Tabella tag del primo ordine

Tabella tag del secondo ordine

Tabella tag per file multimediali

Tabella tag per le tabelle