Il progetto
La grafica non è altro che la parte che mostrate al visitatore, poichè il codice
è nascosto e non si vede. Ma se volete vederlo quando siete collegati e avete
aperte le finestre di IE dal menu: Visualizza >clic su HTML e vedrete tutto il
codice di cui è composta la pagina che state visitando, anche se non è la
vostra.
Quindi per progettare come deve essere la vostra pagina, prima si
pensa ad una intestazione che può essere una immagine, un logos (marchio), uno
slogans (nome). Qualcosa che distingue la pagina e tutto il sito in quanto si
può ripetere per tutte le pagine. Se avete in mente una immagine grafica, un
disegno una foto, allora consultate questi
manuali e vedrete come semplice può essere
disegnare un sito.
Prima di tutto: Il titolo
1) Il titolo (testata) può essere anche una immagine,foto o disegno, larghezza
(width) e altezza (height) espresse in px, (pixel) se avete scelto cosa
inserire. Oppure potete mettere una banda del colore che vi piace, da ripetere
anche sotto, alla fine della pagina (fondo). Queste grandezze cosi come il
colore dei bordi, si lascia ai fogli di style e serve anche a scegliere il
colore del carattere (font) e la sua grandezza. Si inserisce tra <head> e
</head>. E lo fate direttamente con il codice.
Pensate alle scatole cinesi. Contenitori dentro altri contenitori. Si chiamano:
<div>. Il tag di chiusura </div> questi si devono inserire tra <body> e </body>.
Per colorare i bordi le grandezze di queste scatole useremo il linguaggio di
supporto (.CSS Cascading Style Sheets) o nello stesso foglio (pagina
vedi codice incorporato il quale va inserito tra <head> e </head>).
Qui un
esempio visuale come si vedrà.
Oppure ricopiare il testo .css in un foglio esterno se troppo lungo, da
richiamare con il suo indirizzo (url). Vedremo questo dopo.
2) Una serie di link (collegamenti) alle altre pagine . Può essere anche un elemento decorativo. Si ripete anche nelle altre pagine per collegarle tra loro. Anche questo si scrive con il codice.
3) Quanto testo si dovrà inserire per calcolare come dividere la pagina. Una o due colonne. Eventuali foto o disegni da inserire. Altezza e larghezza delle immagini da inserire. Tutto deve essere progettato e disegnato magari su un foglio di carta. Poi nella costruzione delle pagine verificato se l'idea era giusta. Per avere una idea di come procedere iniziate da una cosa semplice poi con la pratica si possono inserire dei blocchi di codice che aggiungono utilità alla veste grafica. Senza mai appesantire troppo la pagina che diventerebbe troppo lenta.