HTML LE PAGINE WEB COME SI SA, INTERNET E UN SISTEMA MONDIALE DI RETI DI COMPUTER CHE PERMETTE DI UTILIZZARE UN SISTEMA DI CONNESSIONE TRA COMPUTER.

Slides:



Advertisements
Presentazioni simili
CSS (Cscading Style Sheet Fogli di stile a cascata)
Advertisements

Laboratorio digitale I a.a. 2010/2011 Dott.ssa Maria Giuseppa Aloia.
Introduzione all’HTML
Il linguaggio HTML I documenti HTML vanno racchiusi dentro una coppia di TAG (marcatori): apertura e chiusura. ……………………………… …………………………… ……………….
Lezione 1 Primi passi in HtML SCRIVERE TESTI di Sergio Capone
MODULO 3 – ELABORAZIONE TESTI
Informatica Modulo 2 – Office Word.
HYPER TEXT MARK-UP LANGUAGE
HTML Hyper Text Mark-Up Language. HTML Hyper Text Mark-Up Language Linguaggio di marcatura per ipertesti E un linguaggio di formattazione usato per descrivere.
HTML.
HTML LE PAGINE WEB COME SI SA, INTERNET E UN SISTEMA MONDIALE DI RETI DI COMPUTER CHE PERMETTE DI UTILIZZARE UN SISTEMA DI CONNESSIONE TRA COMPUTER.
Il linguaggio HTML.
1 Scoprire e capire HTML Creare semplici pagine WEB Maria Laura Alessandroni.
HTML e CSS Concetti base Comunicazione Multimediale.
Microsoft Word (oppure, OpenOffice Writer)‏
1 Università della Tuscia - Facoltà di Scienze Politiche.Informatica 2 - a.a Prof. Francesco Donini Richiami sul modello Client/Server (per.
Laboratorio di Applicazioni Informatiche II mod. A
1 HTML - I Frame Laboratorio di Applicazioni Informatiche II mod. A.
LHTML è un linguaggio per computer comprensibile da parte dei browser Web Le pagine Web sono scritte in HTML LHTML è necessario sul Web per formattare.
Esercitazioni di Informatica Grafica per Edile - Architettura
Un’introduzione a HTML (I)
Unintroduzione a HTML (II). 4-2 Includere figure con i tag immagine Le immagini possono essere usate come link utilizzando i tag àncora Formato del tag.
Ovvero lo stile di Internet TC-WEB Torino, 5 settembre 2012.
HTML HyperText Markup Language
Linguaggi per il Web Linguaggi di markup: CSS. Cascading Style Sheets (CSS) servono per facilitare la creazione di pagine HTML con un aspetto uniforme.
1 HTML L’HTML è un linguaggio di markup: le istruzioni vengono date attraverso comandi denominati tag e racchiusi tra i segni di maggiore e minore ().
Il linguaggio HTML - Parte 2
Sommario Allineamento ( ) Immagini ( ) Link ( ). Allineamenti Oltre a posso usare per allineare testo ed immagini un altro tag: align = center o left.
HyperText Markup Language 17-23/6/08 Informatica applicata B Cristina Bosco.
CSS : Cascading Style Sheet
2a Lezione: Martedì 6 Febbraio – HTML Comandi base
Prof. Antonio Scarvaglieri - Liceo "F. De Sanctis" - Paternò
HTML Lezione 5 Immagini. URL Un Uniform Resource Locator o URL (Localizzatore di risorsa uniforme) è una sequenza di caratteri che identifica univocamente.
Paragrafi e allineamenti
HTML per iniziare Gianpaolo Cecere. 29 aprile Sintassi HTML I tag HTML sono direttive per i browser I tag sono contenitori per porzioni di documento.
HTML Lezione 3 Stili.
Il linguaggio HTML Le pagine web sono file di testo scritte utilizzando il linguaggio HTML. I documenti HTML vanno racchiusi dentro una coppia di TAG.
Tabelle HTML Le tabelle in HTML permettono di formattare del testo, delle immagini, altre tabelle … in righe e colonne. Per poter affiancare due immagini.
Il Linguaggio HTML “Profe, ma io a casa l’HTML non ce l’ho!“
HTML HyperText Markup Language Linguaggio per marcare un’Ipertesto
Prof. Reale Nicola Studentessa Parcesepe Federica
HTML Gli elementi principali di una pagina Web. Titolo: 2  Attribuisce un titolo alla pagina  Il titolo è visibile nella “barra del titolo” del browser.
Corso Web CSV – Andiamo on-line 1 Andiamo on-line Corso di formazione Elementi base per la costruzione di un sito web.
TAG e CSS Ricalcare la grgilia di impaginazione. UNA STRUTTURA PER I CONTENUTI Oltre a caratterizzare i contenuti (titoli, paragrafi, liste, collegamenti),
HTML I tag HTML (parte 1). I tag HTML  I comandi che il browser interpreta  Etichette per marcare l’inizio e la fine di un elemento HTML  Formato e.
Note sull’esame L’esame è composto da due parti:
Tabelle in HTML Le tabelle permettono di creare una struttura matriciale (un foglio con tanti quadretti) Vengono utilizzate non solo per presentare dei.
FONDAMENTI DI INFORMATICA
CORSO Di WEB DESIGN prof. Leonardo Moriello
Creazione di pagine per Internet Brevi note a cura di Emanuele Lana
Linguaggio HTML & realizzazione di pagine su Web server Caratteristiche di un sito Web: fasi di realizzazione e linguaggio HTML.
Tag TABLE. Oltre ad avere la funzione di rappresentare dati di ogni genere allineati in righe e colonne, le tabelle in HTML si utilizzano per costruire.
GUIDA BASE PER L’HTML Indice:
Internet e HTML Diffusione di informazioni mediante la rete Internet.
HTML 4.01 Apogeo. I tag di base Capitolo 1 I tag SintassiEsempi:
Tag FRAMESET. I frame sono un particolare tipo di struttura HTML, che consente di suddividere la finestra del browser in diversi riquadri distinti. Un'insieme.
HTML e CSS C. Gena, C. Picardi, J. Sproston HTML e CSS.
Tag IMG Per inserire un'immagine in una pagina HTML basta inserire il tag: ; questo tag non ha bisogno di chiusura. Affinché l'immagine venga visualizzata.
HTML – Le Tabelle Laboratorio di Applicazioni Informatiche II mod. A.
PROGETTO… Internet Providers, registrazione del dominio Costruire una home page … e renderla visibile sul Web.
Fondamenti di Markup Languages: Richiami di HTML © 2005 Stefano Clemente Stefano Clemente
ELABORAZIONE TESTI MICROSOFT WORD EM 09.
Master in Telemedicina HTML per iniziare Maria Simi, dicembre 2004 [da un tutorial di Rigget]
Introduzione al linguaggio HTML
Creazione di pagine per Internet Brevi note a cura di Emanuele Lana
Esercitazione 1 Scaricare il file prova.doc dalla pagina
HTML HTML Sistema di contrassegno riconosciuto dai Browser come (Firefox, Chrome, Internet Explorer) Hyper Text Markup Language.
Il linguaggio HTML Introduzione Formattazione Multimedialità.
HTML. Pagina HTML Struttura Titolo Hello World! Paragrafo apre il documento html contiene informazioni come il titolo della pagina, i meta tags, la codifica.
Il linguaggio HTML Liste ordinate e non ordinate Tabelle.
Transcript della presentazione:

HTML

LE PAGINE WEB COME SI SA, INTERNET E UN SISTEMA MONDIALE DI RETI DI COMPUTER CHE PERMETTE DI UTILIZZARE UN SISTEMA DI CONNESSIONE TRA COMPUTER. SCOPO DI QUESTO CORSO E QUELLO IMPARARE LE TECNICHE PER IL DISEGNO E LA STRUTTURAZIONE DI UN DOCUMENTO IN INTERNET. I DOCUMENTI CHE SI POSSONO CONSULTARE SU INTERNET PRESENTANO: SFONDO COLORATO O FORMATO DA IMMAGINI CARATTERI CON COLORI E DIMENSIONI DIVERSIFICATE IMMAGINI POSSIBILITA DI COLLEGARSI E APRIRE ALTRI DOCUMENTI CORRELATI ECC

UN DOCUMENTO PUBBLICATO SU INTERNET PRENDE IL NOME DI PAGINA WEB. LO STRUMENTO UTILIZZATO PER LA CREAZIONE DI PAGINE WEB E IL LINGUAGGIO HTML. HTML, E ACRONIMO DI HYPERTEXT MARKUP LANGUAGE OVVERO LINGUAGGIO DI CONTRASSEGNI PER IPERTESTI.PER IPERTESTO SI INTENDE UN INSIEME DI UNITA DI INFORMAZIONI CONNESSE TRA DI LORO ATTRAVERSO ASSOCIAZIONI DISPONIBILI PER LA SCELTA DELLUTENTE.

HTML E UN LINGUAGGIO COMPOSTO DA CONTRASSEGNI CHE PERMETTONO DI COSTRUIRE PAGINE WEB CONTROLLANDO LA PRESENZA, LA DISPOSIZIONE E LASPETTO DI TUTTO CIO CHE IN TALE PAGINA PUO COMPARIRE: TESTO FORMATTATO, IMMAGINI, COLLEGAMENTI AD ALTRI DOCUMENTI, ECC.. QUINDI HTML NON E UN LINGUAGGIO DI PROGRAMMAZIONE MA DI DEFINIZIONE E DI DISEGNO DELLASPETTO DI UN DOCUMENTO.

UN FILE HTML E UN FILE DI TIPO TESTO E VIENE SCRITTO CON UN COMUNE PROGRAMMA DI EDITOR TIPO BLOCCO NOTE, IL FILE VA SALVATO CON ESTENSIONE.HTM. PER PASSARE DAL TESTO A QUANTO COMPARE SUL MONITOR OCCORRE UN PROGRAMMA DI VISUALIZZAZIONE DETTO BROWSER. TALE PROGRAMMA LEGGE IN INPUT I DATI DEL FILE HTML E PRODUCE IN OUTPUT SUL VIDEO LA VISUALIZZAZIONE DELLA PAGINA WEB.

IL FILE HTML CONTIENE NON SOLO OGGETTI CHE SARANNO VISTI DA CHI CONSULTA LA PAGINA WEB, MA ANCHE I COMANDI UTILI PER LA PRESENTAZIONE DEL CONTENUTO DELLA PAGINA. QUESTI COMANDI PRENDONO IL NOME DI TAG (ETICHETTA). I TAG, CHE NON FANNO PARTE DEL TESTO E CHE NON DEVONO ESSERE VISTI DALLUTENTE SONO RACCHIUSI TRA PARENTESI ANGOLARI:.

IL PRIMO TAG E. IL DOCUMENTO SI SUDDIVIDE IN DUE PARTI: LINTESTAZIONE E IL CORPO. LINTESTAZIONE E CONTRADDISTINTA DAI TAG E, MENTRE IL CORPO E RACCHIUSO DA E. LINTESTAZIONE CONTIENE IL TITOLO DELLA PAGINA. LA PARTE PRINCIPALE E IL BODY E QUI SI TROVA IL VERO CONTENUTO DELLA PAGINA. VEDI ESEMPIO1 ESEMPIO1

FORMATTAZIONE DEL TESTO SI INTENDONO TUTTE QUELLE SPECIFICHE CHE PERMETTONO DI DEFINIRE LA FORMA, LA GRANDEZZA, LO STILE E IL COLORE DEI CARATTERI ED INOLTRE LA POSIZIONE DEL TESTO ALLINTERNO DELLA PAGINA E LA SUA SUDDIVISIONE IN PARAGRAFI. IL TAG VA A CAPO E NON VUOLE IL TAG DI FINE IL TAG RAGGRUPPA LE RIGHE IN UN PARAGRAFO IL TAG DI FINE E OPZIONALE ESEMPIO

ATTRIBUTI UN ATTRIBUTO E UNA PROPRIETA ASSOCIATA AL TAG. PERMETTE DI SPECIFICARE UNA FUNZIONE AGGIUNTIVA RISPETTO A QUELLA DI BASE DEL TAG. ALLATTRIBUTO DEVE ESSERE ASSEGNATO UN VALORE. SPECIFICHE DI ALLINEAMENTO DEL TESTO PER IL TAG ALIGN =LEFT ALLINEAMENTO A SINISTRA =RIGHT ALLINEAMENTO A DESTRA =CENTER ALLINEAMENTO AL CENTRO =JUSTIFY ALLINEAMENTO GIUSTIFICATO ESEMPIO

INTESTAZIONE UN TITOLO E LELEMENTO CHE DEVE DISTINGUERSI DAL TESTO. SONO PREVISTI 6 LIVELLI DI TITOLI. VA DA AD ESEMPIO ANCHE PER IL TAG E POSSIBILE SPECIFICARE LATTRIBUTO ALIGN. ESEMPIO LO STILE DEI CARATTERI LO STILE DEL CARATTERE INDICA LA MODALITA CON CUI SI PRESENTANO LE LETTERE E SONO NORMALMENTE QUATTRO: GRASSETTO TAG CORSIVO TAG SOTTOLINEATO TAG BARRATO TAG ESEMPIO

I FONT E LA DIMENSIONE DEL CARATTERE LASPETTO E IL DISEGNO DEFINISCONO LA FORMBASE (TYPEFACE) DEI CARATTERI. ESISTONO UNA GRANDE QUANTITA DI CARATTERI. I PIU USATI SONO: TYPEFACE ARIAL TIME NEW ROMAN COURIER-NEW COMIC

UN ALTRO ELEMENTO CHE CONTRADDISTINGUE I CARATTERI E LA DIMENSIONE. IL TYPEFACE, LO STILE E LA DIMENSIONE FORMANO IL FONT DI UN CARATTERE. IL LINGUAGGIO HTML PERMETTE DI SPECIFICARE IL FONT DEL TESTO DA VISUALIZZARE. ALLO SCOPO VIENE UTILIZZATO IL TAG. POICHE IL FONT E DEFINITO DA TRE ELEMENTI TYPEFACE, STILE E DIMENSIONE E POICHE LO STILE E DEFINITO ATTRAVERSO ALTRI TAG SPECIFICI (,, ECC.) AL TAG FONT SONO ASSOCIATI SOLTANTO DUE ATTRIBUTI: FACE PER DEFINIRE LASPETTO E LA FORMA DEI CARATTERI E SIZE PER DEFINIRE LA DIMENSIONE. PER LATTRIBUTO FACE I VALORI AMMESSI SONO I NOMI DI UN TYPEFACE. SE NON SPECIFICATO PER DEFAULT ASSUME TIME NEW ROMAN LATTRIBUTO SIZE INDICA IL VALORE DELLA DIMENSIONE DEL CARATTERE E VA DA 1 A 7. SE NON SPECIFICATO ASSUME IL VALORE 3. ESEMPIO

COLORI HTML CI PERMETTE DI MODIFICARE SIA LO SFONDO DELLA PAGINA CHE IL COLORE DEL TESTO. I COLORI RACCOMANDATI DAL WWW CONSORTIUM SONO SEDICI E POSSONO ESSERE IDENTIFICATI CON IL NOME O CON UN NUMERO ESADECIMALE. LA DEFINIZIONE DEI COLORI IN HTML E ORGANIZZATA ATTRAVERSO GLI DEL TAG E DEL TAG E POSSIBILE DEFINIRE IL COLORE DELLO SFONDO E IL COLORE DEL TESTO PER LINTERO CORPO USANDO GLI ATTRIBUTI BGCOLOR E TEXT ASSOCIATI AL TAG SE SI VUOLE MODIFICARE IL COLORE SOLTANTO DI UNA PARTE DEL TESTO, SI USARE LATTRIBUTO COLOR ASSOCIATO AL TAG ESEMPIO

LA DISPOSIZIONE DEL TESTO ELENCHI PUNTATI E NUMERATI HTML PERMETTE DI CREARE LISTE EVIDENZIATE CON SIMBOLI DI VARIO GENERE O DI NUMERARE GLI ELENCHI IN SEQUENZA. SONO PREVISTE TRE MODALITA DIVERSE DI CREAZIONE DI ELENCHI: LA LISTA DISORDINATA CHE CONSISTE IN ELENCO DI VOCI, CIASCUNO PRECEDUTO DA UN CARATTERE PARTICOLARE LA LISTA ORDINATA DOVE OGNI VOCE E PRECEDUTA DA UN NUMERO O DA UNA LETTERA CHE INDICA LA POSIZIONE DELLA VOCE ALLINTERNO DELLA LISTA LA LISTA DI DEFINIZIONE IN CUI OGNI ELEMENTO IN CUI OGNI ELEMENTO E COMPOSTO DA DUE PARTI: UNA CHE INDICA IL TERMINE DA DEFINIRE E UNA CHE INDICA IL TESTO DELLA DEFINIZIONE

PER I PRIMI DUE TIPI DI ELENCHI, SI UTILIZZANO DUE TAG CHE SEGNALANO LINIZIO DELLELENCO, E, E OGNI VOCE VOCE DELLA LISTA E RACCHIUSA TRA I TAG E. LISTA CASUALE LISTA ORDINATA VOCE O ELEMENTO DELLA LISTA SIA PER CHE PER E POSSIBILE SPECIFICARE IL TIPO DI CONTRASSEGNO, LATTRIBUTO PER CAMBIARE IL CONTRASSEGNO E TYPE. IN PARTICOLARE PER I VALORI AMMESSI SONO: DISC DISCO O CERCHIO CIRCLE CIRCONFERENZA VUOTA SQUARE QUADRATO

MENTRE PER LATTRIBUTO I VALORI AMMESSI SONO: A, a, I, i, L ( PER DEFAULT ) PER IL TERZO ELENCO,LA LISTA DI DEFINIZIONE SI USA IL TAG CHE INTRODUCE UNA LISTA IN CUI OGNI VOCE E COMPOSTA DA DUE PARTI: LA PRIMA SPECIFICA I TERMINI DI DEFINIZIONE, LA SECONDA PRESENTA LA DEFINIZIONE: LISTA DI DEFINIZIONE TERMINE DA DEFINIRE DEFINIZIONE ESEMPIO

LINEA ORIZZONTALE E POSSIBILE INSERIRE UNA LINEA ORIZZONTALE. IL TAG APPOSITO E. GLI ATTRIBUTI SONO: ALIGN =LEFT ALLINEAMENTO A SINISTRA =RIGHT ALLINEAMENTO A DESTRA =CENTER ALLINEAMENTO AL CENTRO WIDTH =NUMERO LARGHEZZA IN PIXEL =N% LARGHEZZA % RISPETTO ALLA PAGINA SIZE =NUMERO SPESSORE IN PIXEL ESEMPIO

LE TABELLE LE TABELLE SONO UNO DEGLI ELEMENTI PIU SEMPLICI PER ORGANIZZARE LA DISPOSIZIONE DEGLI OGGETTI DELLA PAGINA. UNA TABELLA E FORMATA DA RIGHE E COLONNE, LINTERSEZIONE DI UNA RIGA CON UNA COLONNA SI CHIAMA CELLA. PER DEFINIRE UNA TABELLA IN HTML SONO PREVISTE NOVE TAG: IL PRIMO E ALLINTERNO DELLA COPPIA VANNO DEFINITE LE RIGHE CHE COMPONGONO LA TABELLA CON IL TAG E LINTERNO DI CISCUNA RIGA SI DEFINISCONO LE CELLE DI DATI CON IL TAG ESEMPIO

LE INTESTAZIONI E POSSIBILE DEFINIRE UNA RIGA DI INIZIALE CHE CONTENGA IL NOME DI OGNI COLONNA, LE CELLE DELLA RIGA DI INTESTAZIONE SI DISTINGUONO PERCHE SONO DEFINITE DAL TAG IN LUOGO DEL. IL COTENUTO VIENE PRESENTATO DIRETTAMENTE IN GRASSETTO. BORDI E COLORI PER MIGLIORARE LA TABELLA SI PUO DEFINIRE,UN BORDO, LA SPAZIATURA TRA LE CELLE E LASCIARE SPAZIO TRA IL CONTENUTO DI UNA CELLA E IL BORDO DELLA STESSA. BORDER N° DI PIXEL AMPIEZZA DEL BORDO CELLSPACING N° DI PIXEL SPAZIO TRA CELLE CELLPADDING N° DI PIXEL SPAZIO TRA BORDO E CELLE ESEMPIO

SI POSSONO AGGIUNGERE DEGLI EFFETTI CROM5ATICI UTILIZZANDO LATTRIBUTO BGCOLOR=COLORE CHE SPECIFICA IL COLORE DELLO SFONDO, BORDERCOLOR=COLORE CHE SPECIFICA IL COLORE DEL BORDO. STRUTTURA E DIMENSIONE DI UNA TABELLA PER COMPLETARE LA LISTA DEGLI ATTRIBUTI POSSIBILI NEL TAG, SI DEVONO CITARE ANCHE ALIGN E WIDTH CHE SPECIFICANO RISPETTIVAMENTE LA POSIZIONE DELLA TABELLA ALLINTERNO DELLA PAGINA E LA SUA LARGHEZZA. ALIGN LEFT TABELLA A SINISTRA RIGHT TABELLA A DESTRA CENTER TABELLA AL CENTRO WIDTH N° PIXEL LARGHEZZA IN PIXEL N% LARGHEZZA IN % ESEMPIO

LE IMMAGINI PER INSERIRE UNA FIGURA ALLINTERNO DI UNA PAGINA WEB E POSSIBILE UTILIZZARE DUE TAG, E ; IN PARTICOLARE IL SECONDO SERVE PER INSERIRE UN OGGETTO DI QUALSIASI NATURA NON NECESSARIAMENTE UN IMMAGINE. IL TAG NON NECESSITA DEL TAG DI CHIUSURA. GLI ATTRIBUTI SONO: SRC =URL POSIZIONE DEL FILE ALT = BREVE TESTO TESTO ALTERNATIVO ALLA FIGURA ALIGN= TOP TESTO ALLINEATO IN ALTO =MIDDLE TESTO ALLINEATO IN CENTRO =BOTTOM TESTO ALLINEATO IN BASSO ESEMPIO

ATTRIBUTI PER LA PRESENTAZIONE DELLE IMMAGINI PER CIASCUNA IMMAGINE E SOLITAMENTE DEFINITO IL SUO INGOMBRO ESPRESSO COME NUMERO DI PIXELIN ORIZZONTALE E IN VERTICALE, QUESTO NUMERO PERO PUO ESSERE MODIFICATO ALLINTERNO DEL FILE HTML. HEIGHT= N° PIXEL ALTEZZA WIDTH = N° PIXEL LARGHEZZA PER DISTANZIARE LIMMAGINE DAL RESTO DEL TESTO O DA ALTRE IMMAGINI : HSPACE= N° PIXEL SPAZIATURA ORIZZONTALE VSPACE = N° PIXEL SPAZIATURA VERTICALE BORDER = N° PIXEL LARGHEZZA BORDO PROVATE A FARE DELLE PROVE CON UNA STESSA IMMAGINE.

IL SUONO DI SOTTOFONDO CE LA POSSIBILITA DI ASSOCIARE UN BRANO MUSICALE A UNA PAGINA WEB UTILIZZANDO IL TAG, CHE VA INSERITO ALLINTERNO DELLA SEZIONE. DEVE ESSERE ACCOMPAGNATO DALLATTRIBUTO SRC CHE RICHIEDE COME VALORE IL RIFERIMENTO AL FILE MUSICALE DA INSERIRE. ESEMPIO