Benvenuto su game space
Benvenuto su game space
link mobile: http://m.wix.com/wiljamp/game-space-1
invitiamo chiunque voglia collaborare alla costruzione del sito a contattare l'amministatore alla seguente mail Questo indirizzo email è protetto dagli spambots. È necessario abilitare JavaScript per vederlo. o Questo indirizzo email è protetto dagli spambots. È necessario abilitare JavaScript per vederlo. (ATTENZIONE!!! sono stati riscontrati problemi con questa mail chiediamo scusa per i possibili disagi e vi invitiamo a usare solo la prima) e nell l'area contatti o dal bottone qui sotto contact me
grazie e cordiali saluti da admin
vi invitamo inoltre a visitare la nostra pagina facebook
vi invitamo inoltre a visitare anche la nostra pagina su google+
4 - I tag l'identazione del codice, i commenti (all interno del codice) ecc...
4 - I tag l'identazione del codice, i commenti (all interno del codice) ecc...
Ciao benvenuti nel quarto topic della nostra guida html oggi parleremo dei tag del identazione del codice per una lettura più fluida i commenti ecc...Struttura di un tag
All’interno di ogni pagina sono presenti dei marcatori detti TAG (come gia detto nell primo topic i tag possono descrivere la funzione, il colore, le dimensioni, il link, sulla posizione delle immagini all’interno della pagina, su come far scorrere il testo, e altre caratteristiche di questo genere),
a cui viene affidata la visualizzazione e che hanno differenti nomi a seconda della loro funzione.
I tag vanno inseriti tra parentesi angolari (
Il contenuto va inserito tra l’apertura e la chiusura del tag medesimo, secondo questa forma:
| Codice: |
<TAG attributi>contenuto</TAG> |
Ecco un esempio di codice che dispone un testo giustificato a destra:
| Codice: |
<P align="right">testo</P> |
ecco come viene visualizzato
---------------------------------------------------------------------------------------
testo
---------------------------------------------------------------------------------------
dall’esempio è evidente che la struttura di un attributo è: attributo="valore". Quindi in definita la struttura di un tag sarà:
| Codice: |
<TAG attributo_1="valore1" attributo_2="valore2" ... >contenuto</TAG> |
Alcuni particolari tag non hanno contenuto – perché ad esempio indicano la posizione di alcuni elementi (come il tag delle immagini) -, di conseguenza questi tag non hanno neanche chiusura. La loro forma sarà dunque:
| Codice: |
<TAG attributi> |
Ecco un esempio codice per inserire un’immagine:
| Codice: |
<IMG widht="20" height="20" src="http://icons.iconarchive.com/icons/graphics-vibe/developer/128/html-icon.png" alt="alt"> |
ecco come viene visualizzato:
---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------
vi diro ora molto brevemente il significato degli atributi utilizzati widht e height sono atributi di grandezza mentre src indica l'url dell'immagine.
come ptete vedere il tag non viene chiuso. Questo tipo di tag viene detto “empty”, cioè “vuoto”
indentazione e annidamento del codice
Una caratteristica importante del codice HTML è che i tag possono essere annidati l’uno dentro l’altro.
Anzi molto spesso è necessario farlo.
| Codice: |
<TAG1 attributi> contenuto 1 <TAG2>contenuto 2</TAG2> </TAG1> |
potremo ad esempio:
| Codice: |
Potremmo quindi avere ad esempio: <DIV align="right"> testo 1 <P align="left">testo 2</P> </DIV> |
ecco come si visualizzerebbe
---------------------------------------------------------------------------------------
testo 1
testo 2
---------------------------------------------------------------------------------------
quindi l’annidamento ci permette di attribuire formattazioni successive al testo che stiamo inserendo.
Come abbiamo gia visto nell’esempio, è una buona norma utilizzare dei caratteri di tabulazione per far rientrare il testo ogni volta che ci troviamo in presenza di un annidamento e man mano che entriamo più in profondità nel documento.
In pratica apertura e chiusura del tag si trovano allo stesso livello, mentre il contenuto viene spostato verso destra di un tab (non si tratta solo di un fattore visivo, ma l’allineamento di apertura e chiusura tag viene mantenuto anche se scorriamo in verticale il documento con il cursore).
Questa procedura si chiama indentazione, e grazie ad essa il codice HTML risulta più leggibile.
Possiamo ad esempio conforontare questi due codici:
| Codice: |
<DIV align="right">testo 1<P align="left"> testo 2 </P></DIV> |
| Codice: |
<DIV align="right"> testo 1 <P align="left"> testo 2 </P> </DIV> |
per il browser i due esempi sono identici, ma per l’utente è evidente che la differenza è notevole: pensate leggere un intera pagina di un sito su un unica stringa (sarebbe del tutto illeggibile!).
I commenti
Un’altra modo molto importante, per rendere il nostro codice più leggibile è quello di inserire dei “commenti” in punti particolari: si tratta di indicazioni significative per il webmaster, ma invisibili al browser.
Inserendo i commenti in punti specifici del documento ci permette di mantenere l’orientamento anche in file molto complessi e lunghi.
Il codice è il seguente:
| Codice: |
<!– questo è un commento –> |
e ci permette di “commentare” i vari punti della pagina.
Ad esempio:
| Codice: |
<!- menu di sinistra -> <!- barra in alto -> <!- barra X BEGIN -> <!- barra X END -> <!- BEGIN -> <!- END -> <!- ecc... -> |
aprofondimento:
-Maiuscolo o minuscolo
L’HTML è “case unsensitive“, cioè indipendente dal formato. Questo significa che è del tutto indifferente se scrivere i tag in maiuscolo o in minuscolo.
| Codice: |
<P ALIGN=”RIGHT”> |
e
| Codice: |
<p align=”right”> |
vengono letti allo stesso modo dal browser.
Fino all entrata del XHTML, per aumentare la leggibilità del codice, si scriva in maiuscolo il nome del tag (es:
) e in minuscolo gli attributi (es: align=”right”).
Quindi:
| Codice: |
<P align=”right”> |
Tuttavia oggi, per analogia con l’XHTML che è figlio dell’XML e dell’HTML ed è “case sensitive”,cioè sensibile a maiuscole/minuscole, è consigliabile scrivere tutto in minuscolo, per abituarsi già al linguaggio che verrà.
Maiuscolo e minuscolo, in ogni caso non costituiscono errore.
Fino ad ora per rendere più chiare le differenze abbiamo utilizzato quasi sempre usato la vecchia abitudine di scrivere in maiuscolo i tag e in minuscolo gli attributi, d’ora in poi invece tutto il codice HTML della guida sarà in minuscolo.
bene qui finisce questo topic quindi
ciao a tutti e ci vediamo al prossimo topic.
3 - cosa ci serve, le estensioni ecc...
ciao benvenuti nel terza lezione della nostra guida html
Per iniziare a scrivere pagine web avete bisogno di:
potrete scaricare notpad++ dal sito qui il link
da li saricate o l'exe di installazione o l'eseguibile in formato compresso.
- L’estensione del file
A questo punto avviate il programma che avrete scelto per scrivere il vostro codice e salvate il file in estensione html sul vostro pc, ad esempio "Primapagina.html" .
aprofodimento (curiosità) :
Fino a qualche tempo fa si era soliti attribuire ai file l’estensione htm, ma questo avveniva perché il dos e poi Windows 3.1 non erano in grado di gestire i file con nomi di grandezza superiore a 8 caratteri ed estensione superiore alle 3 lettere. Dunque .html era diventato .htm, così come .jpeg era diventato .jpg.
una volta salvato provate a scriverci questa stringa:
allora ri salva il file e aprilo col tasto destro apri con e selezionate il vostro browser
ora dovreste riuscrire a visualizzare la vostra prima stringa di html
se cosi non fosse contattatemi e vedremo di capire qual è il problema
ciao a tutti e ci vediamo al prossima lezione dove parleremo dei tag del identazione del codice per una lettura più fluida i commenti ecc...
Per iniziare a scrivere pagine web avete bisogno di:
- uno o più browser per visualizzare le pagine, io personalmente vi consiglio di utilizarne piu di uno in modo da poter vedere come gli utenti vedranno il vostro sito da diversi browser perche alcuni potrebbero non visualizzare la pagina come vorreste (anche se allinizio dovrebbe bastarvene uno solo io vi consiglio Mozilla o chrome).
- un eitor testuale per scrivere il codice HTML potete usare il blocco note di Windows (notpad), o altri editor testuali, io vi consiglio notpad++ .
potrete scaricare notpad++ dal sito qui il link
da li saricate o l'exe di installazione o l'eseguibile in formato compresso.
- L’estensione del file
A questo punto avviate il programma che avrete scelto per scrivere il vostro codice e salvate il file in estensione html sul vostro pc, ad esempio "Primapagina.html" .
aprofodimento (curiosità) :
Fino a qualche tempo fa si era soliti attribuire ai file l’estensione htm, ma questo avveniva perché il dos e poi Windows 3.1 non erano in grado di gestire i file con nomi di grandezza superiore a 8 caratteri ed estensione superiore alle 3 lettere. Dunque .html era diventato .htm, così come .jpeg era diventato .jpg.
una volta salvato provate a scriverci questa stringa:
| Codice: |
<p> se mi leggi allora puoi proseguire </p> |
allora ri salva il file e aprilo col tasto destro apri con e selezionate il vostro browser
ora dovreste riuscrire a visualizzare la vostra prima stringa di html
se cosi non fosse contattatemi e vedremo di capire qual è il problema
ciao a tutti e ci vediamo al prossima lezione dove parleremo dei tag del identazione del codice per una lettura più fluida i commenti ecc...
-
-
-