HTML combines two well-known ideas: hypertext and markup language.

Dimensione: px
Iniziare la visualizzazioe della pagina:

Download "HTML combines two well-known ideas: hypertext and markup language."

Transcript

1 1. Una Premessa Questo materiale è tratto dal sito e successivamente integrato dal docente. Altre citazioni sono tratte dalle lezioni del Dott. Franceschet e del Dott. Bistarelli HTML combines two well-known ideas: hypertext and markup language. Hypertext is a term coined in the 1950s by Ted Nelson that means 'humanreadable information linked together in an unconstrained way'. A markup language formally describes what part of a document is content, what part is markup, and what the markup means. The term markup refers to anything in a document that is not intended to be printed. Vediamo cosa occorre per creare e mettere on-line una pagina Web : Conoscere l'html Sarà lo scopo di questo Tutorial Un editor per scrivere il codice Oggi il mercato propone software del genere in continuazione, ma per scrivere il codice si può fare anche con il notepad di Windows. Ci sono sostanzialmente due tipologie di Editor: - Editor Testuali Sono editor in cui bisogna scrivere manualmente il codice. - Editor WYSIWYG L'acronimo WYSIWYG sta per :what you see is what you get, cioè ciò che si vede è cio che si ottiene in un browser Web. Questi editor permettono di lavorare tramite una interfaccia grafica, non sul codice ma su oggetti con il semplice trascinamento del mouse. Quindi tutto ciò che si fa su questa interfaccia, verrà tradotto automaticamente in html. Questo tipo di editor è di grande aiuto per i principianti, ma hanno di contro che in presenza di errore, difficilmente riescono a risolverlo, inoltre si rischia di creare siti fotocopia. Un FTP File Transfer Protocol, è un programma che permette di trasferire le pagine create, nel proprio sito Web. Se ne trovano diversi e parecchi gratuiti su internet. Uno spazio Web E un'area su un server, che fa capo al nostro nome di dominio, nel quale andremo atrasferire e quindi immagazzinare le pagine del nostro sito Web. Anche in questo caso si trovano diversi provider che offrono spazio Web gratuito, ma con alcune limitazioni, cioè il nome di dominio del tipo ( di terzo livello ) 2. Intestazione del documento <HEAD> Lo scopo dell'html è quello di fornire, attraverso comandi chiamati TAG, una formattazione (si intende: una forma) al testo contenuto documento, oltre all'inserimento di immagini ed altri elementi multimediali (filmati, applet ecc.).

2 Il lavoro che uno sviluppatore Web produce all'interno di un documento HTML è indirizzato a fornire tutte le informazioni necessarie al browser per interpretare correttamente la pagina. Un documento HTML si divide in due parti fondamentali: l'intestazione e il corpo del documento. L'intestazione contiene una serie di informazioni necessarie al browser per una corretta interpretazione del documento, ma non visualizzate all'interno dello stesso. L'intestazione, quindi, ha un ruolo non apparente ma sicuramente fondamentale. Per esempio il titolo della pagina,i termini chiave per alcuni motori di ricerca, HTML HEAD TITLE META Vediamo una descrizione : <HTML> Tutti gli elementi ed il contenuto di un documento HTML sono compresi all'interno dei marcatori <HTML></HTML> i quali hanno il compito di aprire e chiudere il file. I tag <HTML></HTML> indicano al browser che il documento è marcato in HTML. Esistono comunque due ragioni per inserire sempre il tag <HTML></HTML> all'interno del documento: HTML non è l'unico linguaggio di contrassegno presente sul web (si pensi per es. ad XML). Gli utenti che usano vecchi browser rischiamo di visualizzare un documento formattato male. <HEAD> Gli elementi <HEAD></HEAD> sono posti immediatamente dopo l'apertura del tag <HTML> e racchiudono l'intestazione vera e propria del documento; cioè tutte le informazioni necessarie al browser, al Webserver ed ai motori di ricerca. Si tratta del primo elemento letto dal browser e per questo è il luogo migliore per inserire script. All'intero di <HEAD></HEAD> va inserito il titolo del documento e altre informazioni. Ecco la sintassi HTML di un documento con i comandi visti: <HTML> <HEAD></HEAD> </HTML> <TITLE> L'elemento <TITLE></TITLE> è il più utilizzato all'interno del tag <HEAD>, in quanto fornisce il titolo alla pagina. Il titolo viene visualizzato dai browser nell'intestazione di pagina. In caso di salvataggio dell'url con "Aggiungi a preferiti" (per MsIe) e "Aggiungi Segnalibro" (per Netscape) il tag TITLE dà il nome al collegamento, cioè quando si salva l'indirizzo, il browser assegna allo stesso quanto presente all'interno di <TITLE></TITLE>. Il contenuto riportato tra i tag <TITLE></TITLE> è anche utilizzato da alcuni motori di ricerca per indicizzare la pagina e trovare parole chiave. La corretta sintassi per il tag TITLE è la seguente: <TITLE>La mia prima home page </TITLE> <META> Fare un buon sito, non basta, occorre poi che lo stesso sia visitato per ripagare il duro lavoro, per fare questo esistono i motori di ricerca, quali Altavista, Virgilio, Yahoo etc., ne esistono a centinaia, ma non occorre registrarsi a tutti, basta registrare il sito nei 4-5 motori più importanti, questo è possibile farlo tramite i form messi a disposizione sui motori di ricerca : Add Your Site, o Aggiungi un Sito. RIEPILOGO Di seguito riportiamo una pagina HTML impostata con il codice visto in questa lezione. Questa pagina costituirà un punto di riferimento anche per le lezioni successive:

3 <HTML> <HEAD> <META name="keywords" Content="tutorial, html"> <META name="description" content="la mia prima home page con la guida di cirocom.it"> <META name="generator" content="blocco note"> <META name="author" content="nome Cognome"> <TITLE>La mia prima home page </TITLE> </HEAD> </HTML> 3.Impostare il corpo del documento <BODY> Nella precedente lezione abbiamo visto come creare da zero un documento HTML e come impostare il titolo ed i meta tag. L'operazione successiva all'impostazione del documento è la definizione del colore o dell'immagine di sfondo, oltre ai colori dei link attivi e visitati. <BODY> L'elemento <BODY> è posto in posizione immediatamente successiva alla chiusura del tag </HEAD> e comunque all'interno degli elementi <HTML></HTML>; ha un tag di apertura e uno di chiusura, ed all'interno di esso si sviluppa il corpo del documento. Se l'elemento <HEAD> conteneva metadati (cioè non materialmente visualizzati dal browser) la funzione del tag <BODY> è quella di mostrare gli oggetti (testo, immagini, suoni, applet ecc) della pagina. La sintassi corretta per l'elemento <BODY> è la seguente: <BODY> Contenuto del documento </BODY> Il tag <BODY> è utilizzato, oltre che per fornire al browser indicazioni sulla posizione degli oggetti nel documento, anche per impostare vari attributi di visualizzazione per il documento. Di seguito vediamo quali. BGCOLOR L'attributo BGCOLOR imposta un colore unitario di sfondo. La sintassi corretta è la seguente: <BODY BGCOLOR="red"> E' possibile sostituire al nome in inglese, valori esadecimali. Per esempio, il colore rosso (red) si sostiuisce in questo modo: <BODY BGCOLOR="#ff0000"> L'utilità dei colori esadecimali si ha laddove non si vuole un colore standard ma sfumato o con diversa tonalità. I più diffusi editor HTML prevedono palette per la definizione di colori esadecimali, mentre Paint Shop Pro fornisce, oltre al colore, anche il corrispondente valore esadecimale da copiare/incollare. BACKGROUND BACKGROUND ha una funzione simile a BGCOLOR, ma mentre BGCOLOR mostra una tinta unica del colore, BACKGROUND consente di visualizzare sullo sfondo un'immagine in formato grafico. Consideriamo, per esempio, di voler costruire uno sfondo con l'immagine seguente: marchio.gif L'immagine è per ipotesi depositata nella stessa directory del documento. La sintassi corretta per impostare l'immagine come sfondo è:

4 <BODY BACKGROUND="marchio.gif"> Il browser visualizza l'immagine sfondo.gif e la ripete su ogni punto dello schermo disponibile. In altre parole non si limita a visualizzare l'immagine una sola volta, magari al centro della pagina, ma riempie ogni spazio disponibile. Per questa ragione è assolutamente necessario creare uno sfondo che, se ripetuto, non presenti soluzione di continuità, ma un aspetto il più possibile uniforme. E' bene scegliere un'immagine di sfondo che non infastidisca la lettura e che sia il più possibile coerente con il colore del testo. Per esempio, inserire un testo arancione su uno sfondo rosso non renderebbe leggibile il testo. Sempre meglio usare il colore nero per il testo e tinte leggere per lo sfondo. TEXT Se non stabilito diversamente il colore del testo del documento è nero, in quando i browser assegnano quel colore di default. Grazie all'attributo TEXT è possibile assegnare al testo un colore diverso dal nero. Questa la giusta sintassi: <BODY BACKGROUND="marchio.gif" TEXT="white"> Anche in questo caso i colori possono esprimersi in nomi o valori esadecimali. All'interno del documento è possibile marcare parte del testo in colori differenti da quello impostato su TEXT. 4. Formattare il testo Tag FONT Formattare titoli da <H1> ad <H6> Il tag <Hn> (dove n è il numero da 1 a 6 che è possibile assegnare all'elemento) ha la funzione di fornire stili ai titoli di pagina, dando maggiore o minore enfasi a seconda del numero inserito. Come accennato i numeri vanno da 1 a 6, con maggior importanza dei numeri più bassi rispetto agli alti. Visivamente tale diversa importanza si traduce in differente grandezza del testo, come nell'esempio che segue: Titolo con H1 Titolo con H3 Titolo con H5 Oltre a definire gli stile dei titoli, il tag <Hn> inserisce spaziature di paragrafo rispetto agli elementi che seguono. <FONT> Il tag fisico FONT è uno dei più usati. Il tag FONT formatta tipo e grandezza del testo all'interno dei Tag <FONT>qua dentro</font> Mentre, poi, TEXT determina solo il colore del testo, il tag FONT può definire: font utilizzato, grandezza e colore. Ecco la sintassi corretta del tag: <FONT FACE="arial" SIZE=5 COLOR=red>stringa da formattare </FONT> Ecco la stringa formattata FACE="arial" indica il tipo di carattere da richiamare per la visualizzazione.

5 SIZE=5 la grandezza del carattere che può andare da 1 a 7 (con maggiore grandezza dei numeri vicini al 7); COLOR=red indica il colore del testo (esprimibile anche in valori esadecimali). <B>, <I>, <U> <B>, <I>, <U> : sono tre dei più usati tag di formattazione fisica dell'html. Tutti vanno aperti e successivamente richiusi: <B> Testo grassetto </B> Testo grassetto Il testo compreso tra questi tag è trasformato in grassetto (la B sta per BOLD). <I> Testo corsivo </I> Testo corsivo Il testo compreso tra questi tag è formattato in corsivo (la I sta per ITALIC) <U> Testo sottolineato </U> Testo sottolineato Il testo compreso tra questi tag è sottolineato pur non essendo un link (la U sta per UNDERLINE). Esiste anche il tag STRIKE per il testo barrato: <STRIKE> Testo barrato </STRIKE> Testo barrato <SUP> e <SUB> Questi due tag di formattazione fisica creano rispettivamente: apici posti leggermente più in alto del normale testo (SUP) e pedici posti leggermente più in basso (SUB). 5.Paragrafi e Giustificazione Creare paragrafi con <P> Il tag <P> indica al browser un nuovo paragrafo del testo,si passa quindi su una nuova riga, il posizionamento può esser a destra, a sinistra o al centro.per defauult l'allineamento è a sinistra. Ecco i comandi giusti per allineare : <P ALIGN="left"> Definisce un paragrafo e allinea sulla sinistra. <P ALIGN="center"> <P ALIGN="right"> Definisce un paragrafo ed allinea al centro. Definisce un paragrafo e allinea sulla destra. Come andare a capo <BR> <BR> è un tag di interruzione di riga. Ha un funzionamento simile al paragrafo visto in precedenza, ma a differenza di <P> non inizia un nuovo paragrafo. La sua funzione è simile alla pressione del tasto "invio" della tastiera. Va usato singolarmente senza tag di chiusura, e durante la compilazione di una pagina web ricorre spesso! Posizionare il testo con <DIV ALIGN> e <CENTER>

6 L'elemento <DIV> viene utilizzato per allineare il testo in posizione orizzontale a sinistra, destra e centro della pagina. L'attributo ALIGN è fondamentale a questo scopo. <DIV ALIGN="left">Testo e immagini a sinistra</div> Sposta gli elementi contenuti tra i suoi tag sulla sinistra. <DIV ALIGN="right">Testo e immagini a destra</div> Sposta gli elementi sulla destra. <DIV ALIGN="center">Testo e immagini a centro</div> Sposta gli elementi in posizione centrale. Il tag <CENTER> ha un funzionamento del tutto simile a <DIV ALIGN="center"> L'uso di <CENTER> è molto semplice: <CENTER><B>Testo da centrare</b></center> ecco quello che accade : Testo da centrare Linee orizzontali con <HR> Le linee orizzontali sono un ottimo strumento per dividere parti del documento e rendere il testo più leggibile. La sintassi necessaria al loro inserimento in un documento HTML è la seguente: <HR align="center" size="2" width="460" color="red" noshade> eccovi la linea : Il tag HR (horizontal rule) non ha bisogno di chiusure successive. Si compone di diversi attributi: aling="center": definisce la posizione della riga (center, right, left). size="2": definisce l'altezza, in pixel, della riga. width="460": definisce lunghezza orizzontale, in pixel, della linea. Può anche esprimersi in percentuale di spazio disponibile: width=80%. color="red": definisce il colore della linea. noshade: se presente questo attributo elimina l'effetto 3D della linea. 6.Come creare elenchi puntati e numerati Gli elenchi sono comodi per organizzare le informazioni all'interno di pagine Web. Elenchi ordinati (numerati) Gli elenchi ordinati sono costiuiti da un singolo tag di apertura e chiusura <OL></OL> e tanti tag di apertura per quante sono le voci di menu <LI>. Questa è la corretta sintassi per creare elenchi ordinati: <OL> <LI> Quarta voce di menu </OL>

7 1. Prima voce di menu 2. Seconda voce di menu 3. Terza voce di menu 4. Quarta voce di menu Dall'esempio si nota come è possibile omettere il tag <BR> per il ritorno a capo, visto che è automaticamente inserito da <LI>. Indicizzazione alfabetica maiuscola: <OL TYPE=A> </OL> A. Prima voce di menu B. Seconda voce di menu C. Terza voce di menu Indicizzazione alfatabetica minuscola: <OL TYPE=a> </OL> a. Prima voce di menu b. Seconda voce di menu c. Terza voce di menu Indicizzazione con numeri romani maiuscoli: <OL TYPE=I> </OL> I. Prima voce di menu II. Seconda voce di menu III. Terza voce di menu Indicizzazione con numeri romani minuscoli: <OL TYPE=i> </OL> i. Prima voce di menu ii. Seconda voce di menu iii. Terza voce di menu

8 Elenchi NON ordinati (puntati) Gli elenchi non ordinati funzionano in modo simile a quelli ordinati. La differenza di fondo è che le risorse indicizzate non sono legate da stretti rapporti di successione gerarchica, per cui non sono previsti elenchi progressivi quali numeri o lettere. Gli elenchi non ordinati (o puntati) si compongono di un tag unico di apertura e chiusura <UL></UL> e tanti tag di elenco per quante sono le voci da indicizzare?. La corretta sintassi per definire un elenco puntato è la seguente: <UL> </UL> Prima voce di menu Seconda voce di menu Terza voce di menu Se non definito diversamente l'elenco è costituito da una serie di pallini. E' possibile indicare diversi tipi di elenco: I pallini pieni visti in precedenza sono ottenibili con disc: <UL TYPE=disc> </UL> Prima voce di menu Seconda voce di menu Terza voce di menu L'attributo circle imposta pallini vuoti all'interno: <UL TYPE=circle> </UL> o Prima voce di menu o Seconda voce di menu o Terza voce di menu L'attributo square imposta elenchi definiti da quadratini pieni: <UL TYPE=square> </UL> Prima voce di menu Seconda voce di menu Terza voce di menu

9 7. Che cosa è un link? Ci troviamo di fronte un libro, apriamo e diamo uno sguardo all'indice, troviamo un capitolo che ci piace a pagina 120, scorriamo le pagine e raggiungiamo la 120,...buona lettura. Ci troviamo di fronte l'indice della guida di html, il capitolo di nostro interesse è il 10 facciamo un click, si apre la pagina. E' stato capito cosa è un link? La differenza tra un testo ed un ipertesto (le pagine html) è che il testo è un documento sequenziale, per raggiungere il contenuto desiderato bisogna scorrere/leggere tutto il contenuto precedente, mentre l IPERTESTO è un testo NON SOTTOPOSTO al vincolo della sequenzialità: L'elemento <A> (la A sta per Ancora) ha bisogno di un tag di apertura e chiusura e al suo interno è possibile inserire testo, immagini o altri elementi multimediali. Perchè funzioni, l'elmento <A> deve essere associato ad altri attributi. Il più importante di questi è HREF (abbreviazione di Hypertext Reference), contenente l'url o la il contenuto da raggiungere. Ecco la sintassi: <A HREF=" CLEF</A> Nel codice sopracitato cliccando sul testo "materiale CLEF" (compreso tra i tag A in apertura e chiusura) si raggiunge l'url indicato dall'attributo HREF. E' possibile sostituire al testo un'immagine con effetto identico. HREF può contenere sia link a risorse esterne, collegamenti tra pagine dello stesso sito, che a risorse esterne, collegamenti ad altri siti un esempio di collegamento ad un altro sito, c'è un banner che sponsorizza pippo.com, se faccio un click si apre la prima pagina di pippo.com per esempio index.htm : <A HREF=" sito di pippo</a> Un link oltre che verso un sito,può essere fatto verso un file, o verso una casella di posta, vediamo di seguito l'esempio : <A HREF="ftp://ftp.vostro.server/percorso/file.est"> Questo link preleva tramite protocollo ftp il file.est che si trova sul vostro server presso il percorso specificato. <A HREF=" 8.Inserire immagini nel documento<img> Per quanto riguarda l'inserimento di una immagine, è una istruzione semplice, ecco la sintassi : <IMG> Il tag IMG significa che c'è una immagine da caricare e quindi visualizzare, però bisogna specificare la sorgente (cioè dove si trova l'immagine). Ammettiamo che questa si chiami "marchio.gif" e si trova nella cartella immagini, vediamo la sintassi completa : <img src="immagini/marchio.gif"> Ammettiamo adesso, che questa immagine abbia delle dimensioni definite, cioè altezza e larghezza, rispettivamente height e width, l'immagine corrente è 98 X 140, e senza specificare le dimensioni, verrà così visualizzata, adesso occorre rimpicciolirla, allora ecco la sintassi : <IMG SRC="marchio.gif" WIDTH="100" HEIGHT="68"> Quindi questo è tutto. Si incontrerà un'altra esigenza, cioè dove posizionare una immagine, per rispondere a questa, bisogna considerare il contesto. Cioè bisogna considerare la pagina globalmente, e di solito si utilizzano TABELLE per incastonare ordinatamente testi e immagini.

10 Quindi potremo affrontare in modo più completo tale argomento una volta passate in rassegna le tabelle. 9. Creare e gestire Tabelle HTML<TABLE> Una tabella è composta da righe e colonne, quindi creando una tabella occorre specificare una nuova riga con <TR> e poi all'interno di essa le colonne con <TD>, questi sono dei tag che vanno chiusi con </TR> e </TD>. Ma prima di passare alla creazione di righe e colonne, bisogna specificare che si sta per creare una tabella con il tag <TABLE> che va chiuso con </TABLE>, quindi vediamo la sintassi completa : <TABLE>dichiaro la tabella <TR>creo una riga <TD>questa scritta è nella 1 colonna</td>questa è la prima colonna <TD>questa scritta è nella 2 colonna</td>questa è la seconda colonna </TR>chiudo la riga </TABLE>chiudo il tag della tabella Naturalmente, anche per le tabelle esistono altri attributi, che ci permettono di creare tabelle a nostro piacimento, eccoli di seguito elencati : ALIGN : allineamento della tabella o di una cella - center, left, right VALIGN : allineamento di testo o immagini nelle varie celle BACKGROUND : impostare lo sfondo di una cella, è possibile anche con una gif animata BGCOLOR : impostare il colore di fondo di una cella, ed ognuna può essere diversa dall'altra BORDER : dare un bordo alla tabella CELLPADDING e CELLSPACING : lo spazio tra tra le celle di una tabella COLS : HEIGHT : definisce l'altezza sia della tabella che di una riga WIDTH : definisce la larghezza sia della tabella che di una colonna Per esempio <table align=center border=1 height=200 width=400> <tr align=center bgcolor=white> <td align=center height=100 width=200><img src= marchio.gif width=118 height=98></td> <td align=center height=100 width=200 bgcolor=blue><font color=white>questo è il marchio di cirocom.it</font></td> </tr> <tr align=center bgcolor=white> <td align=center height=100 width=200 bgcolor=blue><font color=white>questo è ancora il marchio di cirocom.it</font></td> <td align=center height=100 width=200><img src=marchio.gif width=118 height=98></td> </tr> </table> 10.FRAMES I frames sono delle "sottofinestre" in cui alcune pagine web suddividono la finestra principale del vostro Browser. Naturalmente prima di ricorrere ai frames, è bene fare i conti con carta e penna e righello alla mano, ondevitare di fare premere subito il tasto Indietro ad un visitatore che accede alla pagina, questo perchè un uso esagerato dei frames, rende un aspetto sgradevole ed incromprensibile.

11 Ecco di seguito riportato un esempio di codice : <HTML> <HEAD> <TITLE>Inizio ad usare i Frames </TITLE> </HEAD> <FRAMESET ROWS="25%,*"> <FRAME> <FRAME> </FRAMESET> </HTML> Dove è finito il <BODY>? Non ci vuole, il <FRAMESET> sostituisce a tutti gli effetti il <BODY> Il comando <FRAMESET> indica al Browser che si intende suddividere la finestra nel modo che riteniamo più opportuno. Quando usiamo i Frames, non ci troviamo più a gestire un documento, ma ne dovremo gestire uno per ogni sotto-finestra (frame). Il primo serve solo ed esclusivamente a preparare il Browser ed a fargli caricare i documenti necessari. Quindi se dividiamo la finestra in due Frames, dobbiamo scrivere tre documenti diversi: 1. il file preparatorio o dichiarazione 2. il documento da visualizzare nel primo frame 3. il documento da visualizzare nel secondo frame Il primo ovviamente va a caricare gli altri due. Tornando sull'esempio : Rows : spiega al Browser che la suddivisione è fatta in righe, in questo caso il primo frame andrà ad occupare il 25% dell'altezza dello schermo, la rimanente parte la prenderà il secondo frame. La suddivisione può essere anche fatta in colonne con Cols. Vediamo gli attributi dei FRAME : NAME: dà un nome al frame, in modo che il browser lo possa riconoscere ogni volta che un documento html lo dichiarerà apertamente. SRC : punta ad un file html e lo inserisce nel frame corrente. SCROLL : (yes/no) stabilisce se l'utente può far scorrere il contenuto o no. NORESIZE : nega la possibilità al visitatore di modificare la dimensione della finestrella Bisogna considerare la possibilità che qualcuno avendo un vecchio browser, non riesca a visualizzare i frames, in questo caso occorre il tag : <NOFRAME> Cosa aspetti ad installare un nuovo Browser? </NOFRAME> Nella pagina che riempie un frame, un collegamento ipertestuale <A> avrà bisogno di sapere dove caricare la pagina collegata. Allo scopo, l attributo TARGET può essere valorizzato: Per visualizzare nello stesso Frame, Target="_self" Per visualizzare nel Frame denominato pippo, Target="pippo" Per visualizzare nella finestra madre, Target="_top" Per visualizzare in una nuova finestra, Target="_blank"

12 11. Cosa è un FORM? <FORM> I Form, servono per raccogliere dati, rendendo così un sito interattivo. Per esempio, stiamo immettendo dei dati quali, nome, cognome, età,... tutti questi dati, li stiamo inserendo in un form il quale alla pressione del tasto Invia, che generalmente si trova in basso, li spedisce allo script che provvede al controllo ed alla registrazione. Si capisce dunque che per fare uso dei form, è necessario uno script, comunque sia funziona così. Quindi è possibile creare Form per raccogliere dati di qualsiasi entità, ma occorre conoscere qualche linguaggio di scripting per poter memorizzare i dati su un DataBase. Un linguaggio che possiamo utilizzare è l'asp o il PHP, Quindi la creazione di un modulo consta di due fasi : impostazione dei tag per la creazione del modulo, dei campi e del tasto di spedizione; creazione di uno script che li processa e li archivia 12. I vari tipi di FORM In seguito sono elencati i tag per la creazione di un form: <FORM> qua dentro ci sono i campi dei dati da raccogliere </FORM> Apre e chiude il modulo e raccoglie il contenuto dello stesso. Non è possibile inserire un modulo interno ad un altro, cioè i form non consentono nidificazioni. <FORM method="get/post" action=" Adesso vediamo i tag per i vari campi : INPUT TYPE=TEXT <INPUT TYPE="text" name="cognome" SIZE="19"> Permette di inserire un nome, cognome Il tuo cognome INPUT TYPE=PASSWORD <INPUT type="password" NAME="passw" SIZE="19"> Permette di inserire la password ******** INPUT TYPE=HIDDEN <INPUT type="hidden" NAME="passw" SIZE="19"> Questo è un campo nascosto, nel quale si può memorizzare dati riservati

13 INPUT TYPE=CHECKBOX <INPUT type="checkbox" name="età" value="yes" checked> Viene utilizzato per informazioni del tipo "si/no" e "vero/falso". Crea delle piccole caselle spuntate o da lasciare in bianco. Se la casella è spuntata, input restituisce un valore allo script, altrimenti non restituisce alcun valore. Value impostato su "yes" significa che di defoult la casella è spuntata. Checked controlla lo stato iniziale della casella, all'atto del caricamento della pagina. Sei studente/lavoratore? Yes/No INPUT TYPE=RADIO <input type="radio" name="voto" value="ottimo"> <input type="radio" name="voto" value="buono"> <input type="radio" name="voto" value="sufficiente"> Questo attributo è simile al precedente, ma consente più scelte. Dai un giudizio : Ottimo Buono Sufficiente INPUT TYPE=SUBMIT <input type="submit" value="invia"> E' il classico bottone che invia il Form allo script. La grandezza del bottone dipende dalla dimensione della scritta : Invia INPUT TYPE=RESET <input type="reset" value="cancella"> Con un click si cancellano i dati inseriti nel Form : Cancella

14 INPUT TYPE=IMAGE <input type="image" src="tasto.gif"> Simile a submit, con la differenza che al posto del tasto, si può mettere una immagine SELECT <SELECT size="1" cols=4 Name="giudizio"> <OPTION selected value=nessuna> <OPTION value=nessuna> <OPTION value=ottimo> <OPTION value=buono> <OPTION value=sufficiente> </SELECT> Permette la creazione di elenchi a discesa, con diverse possibilità di scelta. Serve per esempio, per scegliere e dare un giudizio, scegliere una nazione. nessuna TEXTAREA <TEXTAREA cols=40 rows=5 WRAP="physical" name="commento></textarea> E' utilizzata per commenti o campi che prevedono l'inserimento di molto testo. La larcghezza è impostata dalle colonne cols, l'altezza dalle righe rows. E' utilizzata per commenti o campi che prevedono l'inserimento di molto testo.

ESEMPI DI FORM (da www.html.it)

ESEMPI DI FORM (da www.html.it) ESEMPI DI FORM (da www.html.it) Vediamo, nel particolare, tutti i tag che HTML 4.0 prevede per la creazione di form. Questo tag apre e chiude il modulo e raccoglie il contenuto dello stesso,

Dettagli

HTML HTML. HyperText Markup Language. Struttura di un documento. Gli elementi essenziali di un documento HTML sono i seguenti TAG: <HTML>...

HTML HTML. HyperText Markup Language. Struttura di un documento. Gli elementi essenziali di un documento HTML sono i seguenti TAG: <HTML>... HTML HyperText Markup Language Struttura di un documento HTML Gli elementi essenziali di un documento HTML sono i seguenti TAG: ... ... ... Struttura di un documento

Dettagli

Comandi principali del linguaggio HTML (Hyper Text Markup Language)

Comandi principali del linguaggio HTML (Hyper Text Markup Language) Comandi principali del linguaggio HTML (Hyper Text Markup Language) Caratteristiche di HTML HTML è un linguaggio di formattazione (markup) di documenti ed è il linguaggio base per produrre documenti per

Dettagli

Manuale scritto da Fuso Federico 4 A Anno scolastico 2011/2012 Parte 1

Manuale scritto da Fuso Federico 4 A Anno scolastico 2011/2012 Parte 1 Manuale scritto da Fuso Federico 4 A Anno scolastico 2011/2012 Parte 1 Chi può riuscire a creare pagine HTML? La realizzazione di pagine web non eccessivamente sofisticate è alla portata di tutti, basta

Dettagli

Per accedere clicca su START o AVVIO (in basso a sinistra sul tuo schermo), poi su PROGRAMMI, ACCESSORI e infine su BLOCCO NOTE.

Per accedere clicca su START o AVVIO (in basso a sinistra sul tuo schermo), poi su PROGRAMMI, ACCESSORI e infine su BLOCCO NOTE. Cos'è l'html HTML è una sigla che viene da una frase inglese che vuol dire: " Linguaggio di contrassegno di ipertesti" (Hyper Text Markup Language) L'Html non è un vero e proprio linguaggio di programmazione,

Dettagli

WWW.ICTIME.ORG. NVU Manuale d uso. Cimini Simonelli Testa

WWW.ICTIME.ORG. NVU Manuale d uso. Cimini Simonelli Testa WWW.ICTIME.ORG NVU Manuale d uso Cimini Simonelli Testa Cecilia Cimini Angelo Simonelli Francesco Testa NVU Manuale d uso EDIZIONE Gennaio 2008 Questo manuale utilizza la Creative Commons License www.ictime.org

Dettagli

HTML HyperText Markup Language:

HTML HyperText Markup Language: HTML HyperText Markup Language: Linguaggio utilizzato per creare pagine Web 421 Introduzione HTML è l'acronimo di HyperText Markup Language HTML e il linguaggio standard per descrivere e definire il contenuto

Dettagli

LEZIONE NO. 1: INTRODUZIONE, ELEMENTI BASE, <HEAD> DI ATTILIO ABBIEZZI

LEZIONE NO. 1: INTRODUZIONE, ELEMENTI BASE, <HEAD> DI ATTILIO ABBIEZZI HTML BASE LEZIONE NO. 1: INTRODUZIONE, ELEMENTI BASE, DI ATTILIO ABBIEZZI FONTI: HTML.IT 1 Breve Introduzione Che cosa significa linguaggio HTML? HTML = HyperText Markup Language Il primo concetto

Dettagli

LEZIONE NO. 2: <BODY> E TAG DI FORMATTAZIONE DEL TESTO DI ATTILIO ABBIEZZI

LEZIONE NO. 2: <BODY> E TAG DI FORMATTAZIONE DEL TESTO DI ATTILIO ABBIEZZI HTML BASE LEZIONE NO. 2: E TAG DI FORMATTAZIONE DEL TESTO DI ATTILIO ABBIEZZI FONTI: HTML.IT 1 Impostare lo sfondo L'operazione successiva all'impostazione del documento è la definizione

Dettagli

Linguaggio HTML (2) Attributi di <FONT> Per variare lo stile di carattere rispetto al default, si possono utilizzare tre attributi:

Linguaggio HTML (2) Attributi di <FONT> Per variare lo stile di carattere rispetto al default, si possono utilizzare tre attributi: Linguaggio HTML (2) Attributi di Per variare lo stile di carattere rispetto al default, si possono utilizzare tre attributi: SIZE= numero per modificare le dimensioni Es:

Dettagli

Linguaggio HTML. Reti. Il Linguaggio HTML. Il Linguaggio HTML

Linguaggio HTML. Reti. Il Linguaggio HTML. Il Linguaggio HTML Reti Linguaggio HTML 1 HTML = Hypertext Markup Language E il linguaggio usato per descrivere documenti ipertestuali Ipertesto = Testo + elementi di collegamento ad altri testi (link) Linguaggio di markup:

Dettagli

LEZIONI DI HTML. Come costruire il proprio sito con pochi strumenti e tanta creatività...

LEZIONI DI HTML. Come costruire il proprio sito con pochi strumenti e tanta creatività... LEZIONI DI HTML Come costruire il proprio sito con pochi strumenti e tanta creatività... FORMATTARE IL CARATTERE Per formattare titoli interni del documento web possiamo utilizzare i tag , ,...,

Dettagli

Prof. Rocco Ciurleo 1

Prof. Rocco Ciurleo 1 Istituto Tecnico Industriale Statale Conte Michele Maria Milano Polistena Classi: 2 E 2 G - a. s. 2012/2013 H T M L Guida base al linguaggio Prof. Rocco Ciurleo 1 Cos è l HTML HTML è l'acronimo di Hypertext

Dettagli

Tutorial di HTML basato su HTML 4.0 e CSS 2

Tutorial di HTML basato su HTML 4.0 e CSS 2 Claudia Picardi Tutorial di HTML basato su HTML 4.0 e CSS 2 Informatica II per Scienze e Turismo Alpino Docenti: Viviana Patti e Claudia Picardi 4 Tabelle 4.1 La struttura di una tabella Elementi principali

Dettagli

[Dimensionare la pagina-creare le tabelle-formattare le tabelle-formattare la pagina

[Dimensionare la pagina-creare le tabelle-formattare le tabelle-formattare la pagina [Dimensionare la pagina-creare le tabelle-formattare le tabelle-formattare la pagina Creare cartelle per salvare il lavoro] Per iniziare dobbiamo imparare a gestire quello spazio bianco che diverrà la

Dettagli

Esercizi. Introduzione all HTML. Il WWW

Esercizi. Introduzione all HTML. Il WWW Politecnico di Milano Esercizi Introduzione all HTML Il WWW Il World Wide Web: una rete di pagine connesse tra loro e distribuite su diverse macchine Il server Web contiene le pagine Web da visualizzare

Dettagli

Il linguaggio HTML - Parte 4

Il linguaggio HTML - Parte 4 Corso IFTS Informatica, Modulo 3 Progettazione pagine web statiche (50 ore) Il linguaggio HTML - Parte 4 Dott. Chiara Braghin braghin@dti.unimi.it HTML - I Riferimenti Ipertestuali Il piatto forte di tutto

Dettagli

Introduzione. Le pagine web sono scritte in HTML un semplice linguaggio di scrittura. HTML è la forma abbreviata di HyperText Markup Language

Introduzione. Le pagine web sono scritte in HTML un semplice linguaggio di scrittura. HTML è la forma abbreviata di HyperText Markup Language HTML 05/04/2012 1 Introduzione Le pagine web sono scritte in HTML un semplice linguaggio di scrittura. HTML è la forma abbreviata di HyperText Markup Language L'ipertesto è semplicemente un testo che funziona

Dettagli

lo 2 2-1 - PERSONALIZZARE LA FINESTRA DI WORD 2000

lo 2 2-1 - PERSONALIZZARE LA FINESTRA DI WORD 2000 Capittol lo 2 Visualizzazione 2-1 - PERSONALIZZARE LA FINESTRA DI WORD 2000 Nel primo capitolo sono state analizzate le diverse componenti della finestra di Word 2000: barra del titolo, barra dei menu,

Dettagli

Cimini Simonelli - Testa

Cimini Simonelli - Testa WWW.ICTIME.ORG HTML Manuale introduttivo al linguaggio HTML Cimini Simonelli - Testa v.2-11/01/2008 Sommario Introduzione... 3 Formattazione della pagina... 4 Inserire un colore di sfondo... 4 Inserire

Dettagli

Login. Gestione contenuto. www.sitofaidate.it

Login. Gestione contenuto. www.sitofaidate.it www.sitofaidate.it Questa guida è stata scritta per utenti di basso/medio livello, guida pratica per chi vede per la prima volta l editor di testo jce i cui riferimenti delle icone sono visibili cliccando

Dettagli

Primi passi con HTML. Il documento HTML

Primi passi con HTML. Il documento HTML Primi passi con HTML. Il documento HTML La mia prima pagina in HTML Questo è il corpo del documento che stiamo realizzando. Questa non è una nuova riga.

Dettagli

MS Word per la TESI. Barra degli strumenti. Rientri. Formattare un paragrafo. Cos è? Barra degli strumenti

MS Word per la TESI. Barra degli strumenti. Rientri. Formattare un paragrafo. Cos è? Barra degli strumenti MS Word per la TESI Barra degli strumenti Cos è? Barra degli strumenti Formattazione di un paragrafo Formattazione dei caratteri Gli stili Tabelle, figure, formule Intestazione e piè di pagina Indice e

Dettagli

HTML, XHTML, CSS. cosa c è dietro al web. Informatica Applicata Prof.Emanuela Zilio

HTML, XHTML, CSS. cosa c è dietro al web. Informatica Applicata Prof.Emanuela Zilio HTML, XHTML, CSS cosa c è dietro al web 1 HTML cos è NON è un linguaggio di programmazione ma un linguaggio di contrassegno (o 'di marcatura'), che permette di indicare come disporre gli elementi all'interno

Dettagli

LA CORRISPONDENZA COMMERCIALE

LA CORRISPONDENZA COMMERCIALE LA CORRISPONDENZA COMMERCIALE GLI ELEMENTI ESSENZIALI DELLA LETTERA COMMERCIALE Intestazione Individua il nome e il cognome o la ragione sociale di chi scrive; contiene inoltre l indirizzo e i recapiti

Dettagli

Guida all uso di Java Diagrammi ER

Guida all uso di Java Diagrammi ER Guida all uso di Java Diagrammi ER Ver. 1.1 Alessandro Ballini 16/5/2004 Questa guida ha lo scopo di mostrare gli aspetti fondamentali dell utilizzo dell applicazione Java Diagrammi ER. Inizieremo con

Dettagli

Capitolo 3. L applicazione Java Diagrammi ER. 3.1 La finestra iniziale, il menu e la barra pulsanti

Capitolo 3. L applicazione Java Diagrammi ER. 3.1 La finestra iniziale, il menu e la barra pulsanti Capitolo 3 L applicazione Java Diagrammi ER Dopo le fasi di analisi, progettazione ed implementazione il software è stato compilato ed ora è pronto all uso; in questo capitolo mostreremo passo passo tutta

Dettagli

On-line Corsi d Informatica sul web

On-line Corsi d Informatica sul web On-line Corsi d Informatica sul web Corso base di FrontPage Università degli Studi della Repubblica di San Marino Capitolo1 CREARE UN NUOVO SITO INTERNET Aprire Microsoft FrontPage facendo clic su Start/Avvio

Dettagli

Introduzione al linguaggio HTML. A. Lorenzi - Università di Bergamo - Facoltà di Economia 1

Introduzione al linguaggio HTML. A. Lorenzi - Università di Bergamo - Facoltà di Economia 1 Introduzione al linguaggio HTML A. Lorenzi - Università di Bergamo - Facoltà di Economia 1 Richiami introduttivi (1) sito Internet o sito Web o sito WWW: insieme delle pagine che si riferiscono ad uno

Dettagli

Word è un elaboratore di testi in grado di combinare il testo con immagini, fogli di lavoro e

Word è un elaboratore di testi in grado di combinare il testo con immagini, fogli di lavoro e Word è un elaboratore di testi in grado di combinare il testo con immagini, fogli di lavoro e grafici, tutto nello stesso file di documento. Durante il lavoro testo e illustrazioni appaiono sullo schermo

Dettagli

Hyper Text Markup Language HTML

Hyper Text Markup Language HTML Operatore informatico giuridico A.A 2003/2004 I Semestre Hyper Text Markup Language HTML Dr. Raffaella Brighi HTML HTML è un linguaggio di marcatura (markup) per la creazione di ipertesti Le sezioni di

Dettagli

GUIDA ALL HTML. Creato da SUPREMO KING

GUIDA ALL HTML. Creato da SUPREMO KING GUIDA ALL HTML Creato da SUPREMO_KING 1 PREMESSE L html è il linguaggio fondamentale attraverso il quale è possibile creare delle semplici pagine web. L html non è un linguaggio di programmazione ma un

Dettagli

IMPOSTARE UNA MASCHERA CHE SI APRE AUTOMATICAMENTE

IMPOSTARE UNA MASCHERA CHE SI APRE AUTOMATICAMENTE IMPOSTARE UNA MASCHERA CHE SI APRE AUTOMATICAMENTE Access permette di specificare una maschera che deve essere visualizzata automaticamente all'apertura di un file. Vediamo come creare una maschera di

Dettagli

WORD per WINDOWS95. Un word processor e` come una macchina da scrivere ma. con molte più funzioni. Il testo viene battuto sulla tastiera

WORD per WINDOWS95. Un word processor e` come una macchina da scrivere ma. con molte più funzioni. Il testo viene battuto sulla tastiera WORD per WINDOWS95 1.Introduzione Un word processor e` come una macchina da scrivere ma con molte più funzioni. Il testo viene battuto sulla tastiera ed appare sullo schermo. Per scrivere delle maiuscole

Dettagli

WWW (World Wide Web)!& ( # %% (*0 #,% )0#1( &#"#2

WWW (World Wide Web)!& ( # %% (*0 #,% )0#1( &##2 ! "#$" %% $"$&&"'& $%%& $'&( ) *+&, ) && *+ ( -./ WWW (World Wide Web)!& ( # (&%#(!(&&( %% (*0 #,% )0#1( &#"#2 Siti Web pagine Web: documenti pronti per essere registrati su un server Internet residenza

Dettagli

DURANTE LA NAVIGAZIONE NEI SITI WEB I VISITATORI NON SOLO POSSONO CONSULTARE INFORMAZIONI STATICHE

DURANTE LA NAVIGAZIONE NEI SITI WEB I VISITATORI NON SOLO POSSONO CONSULTARE INFORMAZIONI STATICHE MODULI O FORM DURANTE LA NAVIGAZIONE NEI SITI WEB I VISITATORI NON SOLO POSSONO CONSULTARE INFORMAZIONI STATICHE ADATTE ALLA LETTURA MA POSSONO SVOLGERE UN RUOLO ATTIVO NEI CONFRONTI DI UNA PAGINA WEB

Dettagli

TUTORIAL PER UTILIZZO CATALOGO RICAMBI WEB

TUTORIAL PER UTILIZZO CATALOGO RICAMBI WEB TUTORIAL PER UTILIZZO CATALOGO RICAMBI WEB 1. COME ACCEDERE AL CATALOGO... 2 2. DESCRIZIONE BARRA DEL MENU... 3 2.1 LINGUE... 3 2.2 ACCEDI/RESET... 4 2.3 RICERCA RICAMBI... 4 2.3.1 RICERCA PER DESCRIZIONE...

Dettagli

Figura 54. Visualizza anteprima nel browser

Figura 54. Visualizza anteprima nel browser Per vedere come apparirà il nostro lavoro sul browser, è possibile visualizzarne l anteprima facendo clic sulla scheda Anteprima accanto alla scheda HTML, in basso al foglio. Se la scheda Anteprima non

Dettagli

Esercitazione n. 10: HTML e primo sito web

Esercitazione n. 10: HTML e primo sito web + Strumenti digitali per la comunicazione A.A 0/4 Esercitazione n. 0: HTML e primo sito web Scopo: Creare un semplice sito web con Kompozer. Il sito web è composto da una home page, e da altre due pagine

Dettagli

CMS MUSEO&WEB. Mappe grafiche. Andrea Tempera (OTEBAC) 12 aprile 2010

CMS MUSEO&WEB. Mappe grafiche. Andrea Tempera (OTEBAC) 12 aprile 2010 CMS MUSEO&WEB Mappe grafiche Andrea Tempera (OTEBAC) 12 aprile 2010 Introduzione Grazie ad appositi tag HTML possiamo associare molteplici collegamenti a differenti zone di un'unica immagine; un'immagine

Dettagli

Che cos'è un modulo? pulsanti di opzione caselle di controllo caselle di riepilogo

Che cos'è un modulo? pulsanti di opzione caselle di controllo caselle di riepilogo Creazione di moduli Creazione di moduli Che cos'è un modulo? Un elenco di domande accompagnato da aree in cui è possibile scrivere le risposte, selezionare opzioni. Il modulo di un sito Web viene utilizzato

Dettagli

04/05/2011. Lezione 6: Form

04/05/2011. Lezione 6: Form Lezione 6: Form In alcuni documenti HTML può essere utile creare dei moduli (form) che possono essere riempiti da chi consulta le pagine stesse (es. per registrarsi ad un sito). Le informazioni sono poi

Dettagli

1) Il client(browser utilizzato) invia al server i dati inseriti dall utente. Server

1) Il client(browser utilizzato) invia al server i dati inseriti dall utente. Server 2) Il Server richiama l'interprete PHP il quale esegue i comandi contenuti nel file.php specificato nell'attributo action del tag form creando un file HTML sulla base dei dati inviati dall utente 1) Il

Dettagli

Metodologie Informatiche Applicate al Turismo

Metodologie Informatiche Applicate al Turismo Metodologie Informatiche Applicate al Turismo 9. HTML Parte II Paolo Milazzo Dipartimento di Informatica, Università di Pisa http://www.di.unipi.it/ milazzo milazzo di.unipi.it Corso di Laurea in Scienze

Dettagli

Manuali.net. Nevio Martini

Manuali.net. Nevio Martini Manuali.net Corso base per la gestione di Siti Web Nevio Martini 2009 Il Linguaggio HTML 1 parte Introduzione Internet è un fenomeno in continua espansione e non accenna a rallentare, anzi è in permanente

Dettagli

Guida Joomla. di: Alessandro Rossi, Flavio Copes

Guida Joomla. di: Alessandro Rossi, Flavio Copes Guida Joomla di: Alessandro Rossi, Flavio Copes Grafica e template 1. 15. La grafica e i template Personalizzare l'aspetto del sito aggiungendo nuovi template e customizzandoli 2. 16. Personalizzare il

Dettagli

SICURF@D: istruzioni per l uso

SICURF@D: istruzioni per l uso : istruzioni per l uso : istruzioni per l uso Indice 1. Premessa 2 2. La registrazione 2 3. L accesso all area per utenti registrati 2 4. La consultazione dei manuali 3 5. L utilizzo degli strumenti di

Dettagli

Il linguaggio HTML - Parte 3

Il linguaggio HTML - Parte 3 Corso IFTS Informatica, Modulo 3 Progettazione pagine web statiche (50 ore) Il linguaggio HTML - Parte 3 Dott. Chiara Braghin braghin@dti.unimi.it Addenda Vedi tabella caratteri speciali Vedi file caratteri_speciali.html

Dettagli

INTRODUZIONE AL LINGUAGGIO HTML. Internet + HTML + HTTP = WWW

INTRODUZIONE AL LINGUAGGIO HTML. Internet + HTML + HTTP = WWW 1 INTRODUZIONE AL LINGUAGGIO HTML Internet + HTML + HTTP = WWW Scopo della esercitazione 2 Conoscere i principali tag HTML Realizzare una propria Home Page utilizzando alcuni semplici tag HTML 3 Architettura

Dettagli

Facendo clic su parole, immagini e icone si può passare da un sito all'altro.

Facendo clic su parole, immagini e icone si può passare da un sito all'altro. I browser Introduzione Facendo clic su parole, immagini e icone si può passare da un sito all'altro. Ogni pagina web è un documento ipertestuale, caratterizzato da un proprio indirizzo denominato URL (Uniform

Dettagli

MANUALE D USO DELLA PIATTAFORMA ITCMS

MANUALE D USO DELLA PIATTAFORMA ITCMS MANUALE D USO DELLA PIATTAFORMA ITCMS MANULE D USO INDICE 1. INTRODUZIONE... 2 2. ACCEDERE ALLA GESTIONE DEI CONTENUTI... 3 3. GESTIONE DEI CONTENUTI DI TIPO TESTUALE... 4 3.1 Editor... 4 3.2 Import di

Dettagli

Guida all uso. Esso sarà riportato nell intestazione. Vediamo:

Guida all uso. Esso sarà riportato nell intestazione. Vediamo: faxm@il è un applicazione che permette agli utenti dei sistemi di telefonia IP di inviare, ricevere e gestire fax. Il tradizionale sistema di fax è ormai superato. Con faxm@il non riceviamo né spediamo

Dettagli

Appunti sugli Elaboratori di Testo. Introduzione. D. Gubiani. 19 Luglio 2005

Appunti sugli Elaboratori di Testo. Introduzione. D. Gubiani. 19 Luglio 2005 Appunti sugli Elaboratori di Testo D. Gubiani Università degli Studi G.D Annunzio di Chieti-Pescara 19 Luglio 2005 1 Cos è un elaboratore di testo? 2 3 Cos è un elaboratore di testo? Cos è un elaboratore

Dettagli

MANUALE PARCELLA FACILE PLUS INDICE

MANUALE PARCELLA FACILE PLUS INDICE MANUALE PARCELLA FACILE PLUS INDICE Gestione Archivi 2 Configurazioni iniziali 3 Anagrafiche 4 Creazione prestazioni e distinta base 7 Documenti 9 Agenda lavori 12 Statistiche 13 GESTIONE ARCHIVI Nella

Dettagli

www.filoweb.it STAMPA UNIONE DI WORD

www.filoweb.it STAMPA UNIONE DI WORD STAMPA UNIONE DI WORD Molte volte abbiamo bisogno di stampare più volte lo stesso documento cambiando solo alcuni dati. Potremmo farlo manualmente e perdere un sacco di tempo, oppure possiamo ricorrere

Dettagli

INDICE. Accesso al Portale Pag. 2. Nuovo preventivo - Ricerca articoli. Pag. 4. Nuovo preventivo Ordine. Pag. 6. Modificare il preventivo. Pag.

INDICE. Accesso al Portale Pag. 2. Nuovo preventivo - Ricerca articoli. Pag. 4. Nuovo preventivo Ordine. Pag. 6. Modificare il preventivo. Pag. Gentile Cliente, benvenuto nel Portale on-line dell Elettrica. Attraverso il nostro Portale potrà: consultare la disponibilità dei prodotti nei nostri magazzini, fare ordini, consultare i suoi prezzi personalizzati,

Dettagli

NAVIGARE IN INTERNET (Dal latino inter e dall inglese net = tra la rete )

NAVIGARE IN INTERNET (Dal latino inter e dall inglese net = tra la rete ) NAVIGARE IN INTERNET (Dal latino inter e dall inglese net = tra la rete ) 1.1 SE CONOSCIAMO L'INDIRIZZO - 1. ACCEDERE ALLE PAGINE WEB (Web = rete) APRIRE L' URL (Uniform Resource Locator), cioè l'indirizzo

Dettagli

PULSANTI E PAGINE Sommario PULSANTI E PAGINE...1

PULSANTI E PAGINE Sommario PULSANTI E PAGINE...1 Pagina 1 Sommario...1 Apertura...2 Visualizzazioni...2 Elenco...2 Testo sul pulsante e altre informazioni...3 Comandi...3 Informazioni...4 Flow chart...5 Comandi...6 Pulsanti Principali e Pulsanti Dipendenti...6

Dettagli

Creare un nuovo articolo sul sito Poliste.com

Creare un nuovo articolo sul sito Poliste.com Creare un nuovo articolo sul sito Poliste.com Questa breve guida ti permetterà di creare dei nuovi articoli per la sezione news di Poliste.com. Il sito Poliste.com si basa sulla piattaforma open-souce

Dettagli

Esame di Informatica CHE COS È UN FOGLIO ELETTRONICO CHE COS È UN FOGLIO ELETTRONICO CHE COS È UN FOGLIO ELETTRONICO. Facoltà di Scienze Motorie

Esame di Informatica CHE COS È UN FOGLIO ELETTRONICO CHE COS È UN FOGLIO ELETTRONICO CHE COS È UN FOGLIO ELETTRONICO. Facoltà di Scienze Motorie Facoltà di Scienze Motorie CHE COS È UN FOGLIO ELETTRONICO Una tabella che contiene parole e numeri che possono essere elaborati applicando formule matematiche e funzioni statistiche. Esame di Informatica

Dettagli

NAVIGAORA HOTSPOT. Manuale utente per la configurazione

NAVIGAORA HOTSPOT. Manuale utente per la configurazione NAVIGAORA HOTSPOT Manuale utente per la configurazione NAVIGAORA Hotspot è l innovativo servizio che offre ai suoi clienti accesso ad Internet gratuito, in modo semplice e veloce, grazie al collegamento

Dettagli

Introduzione HTML. Maurizio Palesi. Multimedialità - Maurizio Palesi 1

Introduzione HTML. Maurizio Palesi. Multimedialità - Maurizio Palesi 1 Introduzione HTML Maurizio Palesi Multimedialità - Maurizio Palesi 1 Generalità sull HTML HTML: HyperText Markup Language (linguaggio di marcatura ipertestuale) E il linguaggio che permette di descrivere

Dettagli

Personalizza. Page 1 of 33

Personalizza. Page 1 of 33 Personalizza Aprendo la scheda Personalizza, puoi aggiungere, riposizionare e regolare la grandezza del testo, inserire immagini e forme, creare una stampa unione e molto altro. Page 1 of 33 Clicca su

Dettagli

Lezione nr. 5. Per creare un modulo è necessario avere delle conoscenze di base del linguaggio HTML. Niente di difficile ovviamente!

Lezione nr. 5. Per creare un modulo è necessario avere delle conoscenze di base del linguaggio HTML. Niente di difficile ovviamente! Lezione nr. 5 >> Come creare un modulo Web I moduli web sono delle strutture fondamentali per ogni sito web e la loro conoscenza ti permetterà di risolvere almeno il 60% delle problematiche di gestione

Dettagli

Access. Microsoft Access. Aprire Access. Aprire Access. Aprire un database. Creare un nuovo database

Access. Microsoft Access. Aprire Access. Aprire Access. Aprire un database. Creare un nuovo database Microsoft Access Introduzione alle basi di dati Access E un programma di gestione di database (DBMS) Access offre: un supporto transazionale limitato Meccanismi di sicurezza, protezione di dati e gestione

Dettagli

[FINANZAECOMUNICAZIONE / VADEMECUM]

[FINANZAECOMUNICAZIONE / VADEMECUM] 2011 Finanza e Comunicazione [FINANZAECOMUNICAZIONE / VADEMECUM] [PANNELLO DI CONTROLLO SCRIVERE UN ARTICOLO PUBBLICARE MEDIA CREARE UNA GALLERIA FOTOGRAFICA MODIFICHE SUCCESSIVE CAMBIARE PASSWORD SALVARE,

Dettagli

LEZIONE NO. 4: IMMAGINI E LINK: <IMG> <A HREF> DI ATTILIO ABBIEZZI

LEZIONE NO. 4: IMMAGINI E LINK: <IMG> <A HREF> DI ATTILIO ABBIEZZI HTML BASE LEZIONE NO. 4: IMMAGINI E LINK: DI ATTILIO ABBIEZZI FONTI: HTML.IT 1 inserire immagini Internet, solo negli ultimi 10 anni affermatasi come media di massa, è stato per lunghi

Dettagli

Guida html e css base

Guida html e css base Sommario Guida html e css base...1 Introduzione...1 Formattare il testo...4 Organizzare il testo in paragrafi...5 Creare le sezioni come in un libro...6 Creare gli elenchi...8 Inserire immagini e collegamenti...11

Dettagli

MANUALE EDICOLA 04.05

MANUALE EDICOLA 04.05 MANUALE EDICOLA 04.05 Questo è il video che si presenta avviando il programma di Gestione Edicola. Questo primo video è relativo alle operazioni di carico. CARICO Nello schermo di carico, in alto a sinistra

Dettagli

HTML 6. I frame. Sintassi di base. I frame e DOCTYPE FRAME. ...head... <FRAMESET lista_attributi> <FRAME SRC= URL lista_attributi>

HTML 6. I frame. Sintassi di base. I frame e DOCTYPE FRAME. ...head... <FRAMESET lista_attributi> <FRAME SRC= URL lista_attributi> FRAME HTML 6 I frame Danno la possibilità di creare finestre multiple all'interno della finestra del browser Si riesce a suddividere la pagina in più sezioni indipendenti, ma che si possono influenzare

Dettagli

Laboratorio Progettazione Web PHP e FORMs HTML. Andrea Marchetti IIT-CNR andrea.marchetti@iit.cnr.ita 2013/2014

Laboratorio Progettazione Web PHP e FORMs HTML. Andrea Marchetti IIT-CNR andrea.marchetti@iit.cnr.ita 2013/2014 Laboratorio Progettazione Web PHP e FORMs HTML Andrea Marchetti IIT-CNR andrea.marchetti@iit.cnr.ita 2013/2014 Struttura Applicazioni Web Browser Web HTTP Server Web API Dati Presentation Application Storage

Dettagli

2.2.2.1 Identificare le diverse parti di una finestra: barra del titolo, barra dei menu, barra degli strumenti, barra di stato, barra di scorrimento.

2.2.2.1 Identificare le diverse parti di una finestra: barra del titolo, barra dei menu, barra degli strumenti, barra di stato, barra di scorrimento. Uso del computer e gestione dei file 57 2.2.2.1 Identificare le diverse parti di una finestra: barra del titolo, barra dei menu, barra degli strumenti, barra di stato, barra di scorrimento. All interno

Dettagli

[Tutoriale] Realizzare un cruciverba con Excel

[Tutoriale] Realizzare un cruciverba con Excel [Tutoriale] Realizzare un cruciverba con Excel Aperta in Excel una nuova cartella (un nuovo file), salviamo con nome in una precisa nostra cartella. Cominciamo con la Formattazione del foglio di lavoro.

Dettagli

Dott.ssa Adriana Pietramala

Dott.ssa Adriana Pietramala Corso di Informatica Laurea Triennale - Comunicazione&Dams Dott.ssa Adriana Pietramala a.pietramala@mat.unical.it Riferimenti Sito del corso: Manuale PHP http://www.php.net/download-docs.php Editor di

Dettagli

Integrazione InfiniteCRM - MailUp

Integrazione InfiniteCRM - MailUp Integrazione InfiniteCRM - MailUp La funzionalità della gestione delle campagne marketing di icrm è stata arricchita con la spedizione di email attraverso l integrazione con la piattaforma MailUp. Creando

Dettagli

Il linguaggio HTML - Parte 2

Il linguaggio HTML - Parte 2 Corso IFTS Informatica, Modulo 3 Progettazione pagine web statiche (50 ore) Il linguaggio HTML - Parte 2 Dott. Chiara Braghin braghin@dti.unimi.it Elenchi all interno di Un elenco è una sequenza

Dettagli

I Tag dell html. Parte quarta

I Tag dell html. Parte quarta I Tag dell html Parte quarta Le Form I moduli, o form, rendono interattive le pagine Web. Per creare un elemento modulo si usa il tag:

Dettagli

CREAZIONE DI UN DATABASE E DI TABELLE IN ACCESS

CREAZIONE DI UN DATABASE E DI TABELLE IN ACCESS CONTENUTI: CREAZIONE DI UN DATABASE E DI TABELLE IN ACCESS Creazione database vuoto Creazione tabella Inserimento dati A) Creazione di un database vuoto Avviamo il programma Microsoft Access. Dal menu

Dettagli

A T I C _W E B G U I D A AL L A N A V I G A Z I O N E S U L S I T O D E L G R U P P O. Rev. 2.1

A T I C _W E B G U I D A AL L A N A V I G A Z I O N E S U L S I T O D E L G R U P P O. Rev. 2.1 G U I D A AL L A N A V I G A Z I O N E S U L S I T O D E L G R U P P O A T I C _W E B Rev. 2.1 1 1. ISCRIZIONE Le modalità di iscrizione sono due: Iscrizione volontaria Iscrizione su invito del Moderatore

Dettagli

A destra è delimitata dalla barra di scorrimento verticale, mentre in basso troviamo una riga complessa.

A destra è delimitata dalla barra di scorrimento verticale, mentre in basso troviamo una riga complessa. La finestra di Excel è molto complessa e al primo posto avvio potrebbe disorientare l utente. Analizziamone i componenti dall alto verso il basso. La prima barra è la barra del titolo, dove troviamo indicato

Dettagli

Integrare Flash In Joomla

Integrare Flash In Joomla Integrare Flash In Joomla Guida realizzata e rilasciata dallo staff di Joomlaservice.org L'integrazione di flash con Joomla è un argomento molto richiesto e per il quale non sempre si trovano informazioni

Dettagli

Vi ricordiamo che per qualsiasi problema tecnico o informazione potete contattare info@eduitalia.org oppure Francesco al 3357761103.

Vi ricordiamo che per qualsiasi problema tecnico o informazione potete contattare info@eduitalia.org oppure Francesco al 3357761103. Gentili Associati, in questi ultimi tempi abbiamo lavorato per sviluppare un software capace di far gestire direttamente alle scuole la propria presenza sul sito di Eduitalia. Tramite la registrazione

Dettagli

EXCEL PER WINDOWS95. sfruttare le potenzialità di calcolo dei personal computer. Essi si basano su un area di lavoro, detta foglio di lavoro,

EXCEL PER WINDOWS95. sfruttare le potenzialità di calcolo dei personal computer. Essi si basano su un area di lavoro, detta foglio di lavoro, EXCEL PER WINDOWS95 1.Introduzione ai fogli elettronici I fogli elettronici sono delle applicazioni che permettono di sfruttare le potenzialità di calcolo dei personal computer. Essi si basano su un area

Dettagli

Maria Grazia Ottaviani. informatica, comunicazione e multimedialità

Maria Grazia Ottaviani. informatica, comunicazione e multimedialità Maria Grazia Ottaviani informatica, comunicazione e multimedialità Unità digitale 1 Ambiente HTML Introduzione Oltre ai linguaggi di programmazione esistono anche linguaggi detti markup. Sono linguaggi

Dettagli

Portale tirocini. Manuale utente Per la gestione del Progetto Formativo

Portale tirocini. Manuale utente Per la gestione del Progetto Formativo GESTIONE PROGETTO FORMATIVO Pag. 1 di 38 Portale tirocini Manuale utente Per la gestione del Progetto Formativo GESTIONE PROGETTO FORMATIVO Pag. 2 di 38 INDICE 1. INTRODUZIONE... 3 2. ACCESSO AL SISTEMA...

Dettagli

Settaggio impostazioni tema. Cliccando nuovamente su aspetto e poi su personalizza si avrà modo di configurare la struttura dinamica della template.

Settaggio impostazioni tema. Cliccando nuovamente su aspetto e poi su personalizza si avrà modo di configurare la struttura dinamica della template. I TEMI PREDEFINITI (TEMPLATE) Scelta del tema I temi predefiniti di wordpress sono la base di un sito che usa un utente che per ragioni pratiche o per incapacità non può creare un sito usando solo codice

Dettagli

MANUALE IMMEDIATO DI HTML

MANUALE IMMEDIATO DI HTML MANUALE IMMEDIATO DI HTML Realizzato da NiktorTheNat Iniziato il giorno 9 aprile 2010 - terminato il giorno 22 aprile 2010 email autore: niktorthenat@tiscali.it canale youtube: http://www.youtube.com/user/niktorthenat

Dettagli

File, Modifica, Visualizza, Strumenti, Messaggio

File, Modifica, Visualizza, Strumenti, Messaggio Guida installare account in Outlook Express Introduzione Questa guida riguarda di sicuro uno dei programmi maggiormente usati oggi: il client di posta elettronica. Tutti, ormai, siamo abituati a ricevere

Dettagli

Sistema operativo. Sommario. Sistema operativo...1 Browser...1. Convenzioni adottate

Sistema operativo. Sommario. Sistema operativo...1 Browser...1. Convenzioni adottate MODULO BASE Quanto segue deve essere rispettato se si vuole che le immagini presentate nei vari moduli corrispondano, con buona probabilità, a quanto apparirà nello schermo del proprio computer nel momento

Dettagli

Corso di HTML. Prerequisiti. Modulo L3. 1-Concetti generali. Browser Rete Internet Client e server. M. Malatesta 1-Concetti generali-12 28/07/2013

Corso di HTML. Prerequisiti. Modulo L3. 1-Concetti generali. Browser Rete Internet Client e server. M. Malatesta 1-Concetti generali-12 28/07/2013 Corso di HTML Modulo L3 1-Concetti generali 1 Prerequisiti Browser Rete Internet Client e server 2 1 Introduzione In questa Unità introduciamo alcuni semplici elementi del linguaggio HTML, con il quale

Dettagli

Manuale Utente Albo Pretorio GA

Manuale Utente Albo Pretorio GA Manuale Utente Albo Pretorio GA IDENTIFICATIVO DOCUMENTO MU_ALBOPRETORIO-GA_1.4 Versione 1.4 Data edizione 04.04.2013 1 TABELLA DELLE VERSIONI Versione Data Paragrafo Descrizione delle modifiche apportate

Dettagli

HTML INFORMATICA PER LE APPLICAZIONI ECONOMICHE PROF.SSA BICE CAVALLO

HTML INFORMATICA PER LE APPLICAZIONI ECONOMICHE PROF.SSA BICE CAVALLO HTML INFORMATICA PER LE APPLICAZIONI ECONOMICHE PROF.SSA BICE CAVALLO Introduzione 2 HTML è l'acronimo di Hypertext Markup Language ("Linguaggio di contrassegno per gli Ipertesti") e non è un linguaggio

Dettagli

Collegamenti ipertestuali.

Collegamenti ipertestuali. Collegamenti ipertestuali. Argomenti trattati: - Premessa: Cosa sono e perchè sono l'essenza del Web. - : Come realizzare e personalizzare i vari tipi di link a pagine o risorse. - Il collegamento ipertestuale

Dettagli

Word. Cos è Le funzioni base Gli strumenti. www.vincenzocalabro.it 1

Word. Cos è Le funzioni base Gli strumenti. www.vincenzocalabro.it 1 Word Cos è Le funzioni base Gli strumenti www.vincenzocalabro.it 1 Cos è e come si avvia Word è un programma per scrivere documenti semplici e multimediali Non è presente automaticamente in Windows, occorre

Dettagli

Come creare un manifesto con openoffice draw

Come creare un manifesto con openoffice draw Come creare un manifesto con openoffice draw Questo tutorial è stato realizzato usando lo stesso programma che useremo per realizzare il nostro manifesto. Il programma si chiama Draw, e fa parte della

Dettagli

FONDAMENTI DI INFORMATICA. 3 Elaborazione testi

FONDAMENTI DI INFORMATICA. 3 Elaborazione testi FONDAMENTI DI INFORMATICA 3 Elaborazione testi Microsoft office word Concetti generali Operazioni principali Formattazione Oggetti Stampa unione Preparazione della stampa Schermata iniziale di Word Come

Dettagli

Dipartimento di Ingegneria Civile e Ambientale TYPO 3 MANUALE UTENTE

Dipartimento di Ingegneria Civile e Ambientale TYPO 3 MANUALE UTENTE Dipartimento di Ingegneria Civile e Ambientale TYPO 3 MANUALE UTENTE Sommario 1) Introduzione... 3 2) Come richiedere l autorizzazione alla creazione di pagine personali... 3 3) Frontend e Backend... 3

Dettagli

UTILIZZO DEI CSS. categoria e lente possiamo aggregare le istruzioni inserite ed avere infondo alla colonna stessa un anteprima.

UTILIZZO DEI CSS. categoria e lente possiamo aggregare le istruzioni inserite ed avere infondo alla colonna stessa un anteprima. UTILIZZO DEI CSS FOGLI STILE Il CSS consente di associare regole stilistiche agli elementi del codice HTML come o . Queste regole definiscono l aspetto rappresentativo degli elementi HTML a cui

Dettagli

WORD 97 SCRIVERE UNA TESI DI LAUREA

WORD 97 SCRIVERE UNA TESI DI LAUREA WORD 97 SCRIVERE UNA TESI DI LAUREA PASSO 1 Per prima cosa pensiamo al formato generale della pagina: i margini richiesti da una tesi sono quasi sempre più ampi di quelli di un testo normale. Apriamo ora

Dettagli