Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
Scarica il documento per vederlo tutto.
vuoi
o PayPal
tutte le volte che vuoi
Il linguaggio HTML
È il linguaggio per realizzare le pagine web. HTML sta per Hypertextual Markup Language – quindi non si tratta di un linguaggio di programmazione, ma di un linguaggio di Markup che serve a comunicare al computer dove deve collocare le varie componenti che caratterizzano la nostra pagina web.
Questo è un semplice editor di testo, se avete Windows può essere un blocco note, o un texpad comunque app anche per dispositivo mobile con cui scrivete del testo senza formattazione. Va bene tutto tranne Word e simili, cioè quei software che vi permettono di scrivere del testo formattato.
Ci serve il così detto plain text con il quale realizzeremo alcune paginette HTML molto semplici per capire quali sono le caratteristiche di questo linguaggio e vedremo che cosa accade andando banalmente in un file che andremo a...
PRIMA PAGINA HTML:
La prima cosa che scriviamo è una cosa fissa della versione HTML 5 che è quella attuale.
Bisogna scrivere <!DOCTYPE html> per dire che il documento in questione è un documento che fa riferimento all'HTML 5, quest'ultima versione di questo linguaggio. Dopodiché iniziamo a scrivere il nostro documento.
È un linguaggio a tag, significa che qualsiasi cosa che andiamo a scrivere va racchiusa tra due tag analoghi che differiscono solo per la presenza dello Slash.
L'idea è che tutto quello che io vado a scrivere, tutti i blocchi di testo, immagini, qualunque cosa voglio far apparire nella mia pagina web, vada racchiuso tra tag di apertura e tag di chiusura per delimitare questo blocco, quindi il tag principale che racchiude
l'utente ha fornito il testo in formato HTML, quindi non è necessario formattarlo ulteriormente.visualizzare la pagina web. Ecco come potrebbe essere formattato il testo utilizzando i tag HTML:Riguarda la visualizzazione di informazioni sulla pagina web main. Informazioni generali, per esempio, se devo includere file esterni, se devo fare riferimento a degli strumenti presenti proprio sul web perché in realtà quello che facciamo noi normalmente non si fa nel senso che non si scrive il codice HTML partendo da zero ma si vanno a prendere dei componenti o degli strumenti per organizzare la pagina stessa, già presenti sul web.
La <head> è la parte di intestazione del documento dove, qualora avessimo l'esigenza di ricorrere a degli strumenti esterni, andremmo qui a collocare le eventuali richieste.
Tra i vari tag che devo utilizzare all'interno della <head> c'è uno assolutamente obbligatorio che è il tag <title>. È il titolo della finestra in cui visualizzo la mia pagina HTML, quindi l'informazione che io vado a scrivere qui dentro è quello che compare, la stringa che compare nella finestra del browser in cui vado a visualizzare la pagina web.
visualizzare la pagina. Questa sarà la stringa che verrà visualizzata sulla finestra del browser in cui andremo ad aprire la nostra pagina HTML. Oltre alla Head c'è un'altra porzione del documento HTML che è fondamentale e che è il body, il corpo della pagina HTML. Questo ha a che fare con la pagina web vera e propria, quello che andate a scrivere è quanto viene visualizzato sulla vostra pagina web. Questi file HTML vengono poi caricati sui server che li rendono disponibili ai client che vanno a richiedere di visualizzare quelle pagine web, come vedremo avremo una architettura per cui questi file fisicamente andranno a risiedere sui server in modo che siano sistematicamente consultabili dagli utenti. Facendo una prova ecco quello che visualizziamo. Adesso andiamo avanti ed andiamo ad aggiungere qualche ulteriore Tag per vedere che altro si può fare. Allora ciò che si può fare è definire delle questioni grafiche, non ci
Ciao
Header 2
Header 3
Header 4
Header 5
Header 6
Cosa possiamo inserire all'interno di una pagina HTML facciamo il primo salto verso la multimedialità andiamo ad inserire non
solodel testo ma anche delle immagini. Eliminiamo Ciao e dove c'è mascherina andiamo ad inserire il tag per inserire un immagine il tag in questione si chiama img (che non ha il tag di apertura e di chiusura) sta ad indicare che in quella porzione di documento colloca questa immagine quella il cui nome di file è specificato da un altro attributo che si chiama source. Questo tag molto banalmente va ad inserire in quel punto della pagina l'immagine contenuta nel file specificato come argomento di questa proprietà source. Vediamo che cosa visualizziamo: Ovviamente possiamo anche giocare sulle dimensioni. Adesso è stata inserita la mascherina nella dimensione e nella risoluzione del file. Possiamo specificare ad esempio una certa larghezza: width="200" Adesso abbiamo qualcosa che va verso il multimediale. Possiamo certamente mettere del testo tra l'H2 e l'H3 possiamo ad esempio organizzare il testo in paragrafi, il tag in questioneè il tag P che organizza blocchi di codice: Vado a salvare il file e vedo cosa visualizzo.
Qui vediamo chiaramente i due paragrafi ed anche altre cose che non tornano. Va bene usare questi font standard ma non sarebbe male evidenziare alcune parti del testo mettendole in grassetto piuttosto che in italico o simili e poi notate che la parola università è uscita scritta male.
Vediamo come risolvere il problema: Abbiamo quella scritta perché il carattere accentato del sorgente non è stato interpretato correttamente. In questi casi si scrive direttamente il richiamo al codice ASCII della lettera accentata. Ciò che dobbiamo fare è scrivere una codifica &la lettera che vogliamo accentare e scrivere il tipo di accento.
Il browser me lo va a colorare in modo diverso proprio per evidenziare che rispetto al testo standard questo richiederà una certa interpretazione da parte del browser che non visualizzerà questa & ecc. ma andrà a
prendere il suocodice asci corrispondente e la leggerà come a accentata con l’accento grave.
L’altra esigenza: evidenziare alcune parole chiave nel tempo si risolve in questo modo:
Per fare questo si usa il tag b che sta per bold o si può mettere una parte del testo in corsivo, in questo caso il tag è I (Italico).
Andiamo a visualizzare la pagina:
Un modo ragionevole per organizzare il contenuto è quello di usare il formato tabellare, se avessi voluto organizzare la mia pagina su due colonne avrei potuto inserire una tabella – il tag è table:
All’interno della quale posso decidere di organizzare il mio contenuto e fare una riga con due colonne, per farlo uso il tag TR e all’interno della stessa riga vado a mettere due colonne con il tag TD.
Anche indicando dimensioni differenti, tag = width30% e nell’altra = width 70%.
Ci possiamo mettere un sottotitolo h2.
È possibile colorare una porzione di testo, questo si fa attraverso...
il tag font che ha lo scopo di modificare le caratteristiche del font ovviamente per il testo compreso tra il font di apertura e quello di chiusura: Non è necessario che tutto il materiale della pagina web sia organizzato in un'unica cartella in cui è contenuto tutto, avendo a disposizione più file avrebbe avuto più senso creare una cartella solo con immagini piuttosto che con altre informazioni, per organizzare meglio le informazioni. Cosa accade dopo questo alla pagina web? C'è un playsolder che sta indicare che lì c'è un'immagine con il documento strappato a testimonianza del fatto che lì c'è un'immagine ma l'immagine non si trova perché ho cambiato l'organizzazione del materiale e ora le immagini si trovano in una cartella. Quando cambiamo l'organizzazione dobbiamo tenerne conto quando facciamo riferimento alle immagini. Devo modificare la source - indico che devocercare il file all'interno della cartella di lavoro immagini. I siti web però non sono fatti da una singola pagina HTML, consultare delle pagine web non è equivalente a leggere un libro e non solo perché il libro non è multimediale perché come abbiamo visto ci sono anche dei libri multimediali, ciò che crea la differenza netta tra le pagine web e il libro è la lettura. La lettura del libro è sequenziale, non ha senso che io saltelli da una pagina dell'libro all'altra mentre le pagine web e la HTML interviene proprio in questo senso permette di effettuare delle consultazioni personalizzate. Ciò che caratterizza le pagine web sono i link ipertestuali quelli che permettono di saltare, arrivati anche ad un certo punto di consultazione parziale, di consultare un'altra risorsa e l'altra risorsa è un'altra pagina HTML. L'ultimo tag è A che è
Accedi a tutti gli appunti
Tutor AI: studia meglio e in meno tempo
