Consiglio sul mio sito web

[LorenzoSantiago]

A dicembre mi sono interessato a un corso di php di Mrwebmaster (dal quale deduco che Mrwebmaster sia pure una vera scuola virtuale). Non l'ho mai confermato, vorrei prima dei consigli di persone poco più esperte di me.
Ho fatto un sito web costruito nell'unico linguaggio che io conosca: l'html. Il sito è www.thetourist.biz. Ora a prescindere da tutti gli altri linguaggi il sito è fatto bene oppure male? Nel senso può essere migliorato con il solo html oppure non si può ottenere di più?
Grazie per le risposte.

 

[WpStyle]

Può essere migliorato intanto eliminando le tabelle ed usando i div...magari anche un po la grafica che non è il massimo.
Manca un modulo contatti (magari usando proprio php) e sinceramente tutti quei bannerini non sono il massimo...al limite spostali nel footer.

 

[LorenzoSantiago]

Ok per l'eliminazione o spostamento al footer dei banner, ma migliorarlo graficamente nel senso di renderlo più bello? Per esempio io avrei fatto un'altra bozza: http://thetourist.altervista.org/ristoweb. Una base molto simile, ma non ha i banner (trattandosi di una bozza e niente di operativo). Questo è fatto meglio e devo rivedere altre cose?

 

[Jonn]

Ti vendo uno dei miei template facciamo prima? AHAH

Scherzo, comunque esteticamente la prima cosa è saper posizionare le varie sezioni (o div, chiamali come ti pare)
E vedo che non è male:

Header, Menu a tutta larghezza subito dopo l'header, corpo pagina, footer.

E fino qui secondo me è ok.

I colori, una cosa che spesso molti sbagliano è usare troppi colori come hai fatto tu e soprattutto forti (alludo al celeste di sfondo):

Celeste: Sfondo
Giallo: Header
Blu: Testo Header
Rosso: Link
Bianco: Corpo pagina
Grigio: Footer

Io fossi in te farei qualcosa tipo:

Bianco: Sfondo e corpo pagina con i bordi per delimitare la larghezza del corpo pagina
Celeste tipo: un celestino leggero (i colori forti e netti sono bruttissimi da vedere) quindi un celestino che si intoni bene con il bianco per Header e Footer (Magari metti anche un bel border radius 5px per stondarli.)
Grigio: Chiaro ma che si veda, per il testo, tipo un #666666

Il fatto è che per inserire colori forti ci vogliono delle sfumature, e poi troppi colori forti, diversi tra loro, stancano subito la vista di chi visita il sito e quindi è tentato a non tornarci, mentre un sito con colori più armoniosi tendono a far avere più visite da chi ha già visto il sito.

L'importante è abbinare non più di 3 colori (per il template) poi chiaramente i contenuti ne possono avere anche 16,8 milioni, ma non importa.

Il tema di un template è caratterizzato al 50% dall'abbinamento dei colori e credimi se ti dico che è importante saperli abbinare.

PS. io non li ho mai saputi abbinare comunque, ahah!

Per i contenuti direi che sei apposto, non dà l'idea di vuoto il sito non è dispersivo, anzi a me mi ha incuriosito, quindi lo voglio visitare completamente XD.
Ciau

 

[LorenzoSantiago]

Il template in teoria lo sto già comprando da un altro che mi sta facendo il sito in php, non so se a lungo a dare nè sarà valsa la pena. Cmq grazie lo stesso, vedrò come proseguire.

 

[Jonn]

Se lo dicevi a me, te lo facevo a gratis, ahah!
XD

 

[LorenzoSantiago]

Jon come faccio i bordi?

 

[Jonn]

Se hai usato le DIV fai così:

Inserisci nell'html della pagina:

<div class="contenitore">Contenuto del div</div><!--Io ci ho scritto contenitore ma ci scrivi quello che vuoi, basta che combaci nel CSS-->

Poi crei cartella nella solita dir dell'html e ci metti dentro il file style.css e lo abbini alla pagina inserendolo nell'HEAD con:

<link rel="stylesheet" href="css/style.css?ver=1" />

Nell'HTML, mentre nel css ci scrivi:

.contenitore {border: 1px solid #222222;}

Dove 1px è lo spessore del bordo, solid è l'effetto che applica al bordo se lo fai maggiore di un pixel (lo noti quando lo imposti a 5 o 6px, mentre #222222 è il colore del bordo in esadecimale.



Se hai invece usato le tabelle basta che cerchi il tag di apertura <TABLE> e lo trasformi così:

<table border="5" bordercolor="#00FF00">

dove 5 è lo spessore del bordo della tabella (ricordati che lo spessore del bordo viene applicato solo alla tabella intera mentre le celle interne mantengono sempre lo spessore ad 1px, non so se si possa aumentare anche delle celle ma non credo)
bordercolor come dice il nome è il colore del bordo sempre in esadecimale.

Scusa il macello, spero si capisca la spiegazione ^^

 

[LorenzoSantiago]

Ci proverò, ora però sto cercando di sbordare i bordi e succede una cosa anomala, cmq lo metterò on-line e poi ti farò sapere.

 

[LorenzoSantiago]

Può essere migliorato intanto eliminando le tabelle ed usando i div...magari anche un po la grafica che non è il massimo.
Manca un modulo contatti (magari usando proprio php) e sinceramente tutti quei bannerini non sono il massimo...al limite spostali nel footer.

veramente io avrei usato entrambi, le tabelle stanno per forza dentro i div

 

[Jonn]

Il fatto è questo:
per definizione (e te lo può dire chiunque!) sono fatte per la rappresentazione di dati tabellari.
Ora, io ho dato un'occhiata al volo al tuo sito ma non mi sonomesso a leggere il sorgente per altri motivi.

Una tabella la puoi inserire dentro un DIV senza alcun problema, ma per la struttura di un sito web si usano le DIV perchè hanno una personalizzabilità che con le tabelle te la puoi solo sognare a meno che tu non crei ottocento celle per allineare il tutto.

Poi come nell'esempio sopra, nelle strutture a div oltre che avere un codice più pulito, leggero (quindi anche performante diciamo) e volendo anche dinamico (cosa che le tabelle a stento si riesce a realizzare visto il loro scopo)

Nei miei lavori ho usato le tabelle per cose tipo:
- Listini prezzi
- Orari

Mentre per tutto il resto delle pagine uso le div, questo anche perchè in una struttura a div con un massiccio uso di CSS puoi cambiare colori e parametri in 2 secondi (ovviamente accertandoti che nessun parametro vada in conflitto con altri)

Mentre con le tabelle se hai larghezza fissa appena allarghi una colonna l'altra magari si storge e ti comprime tutto il contenuto.

Non so bene come spiegartelo, ma per la realizzazione delle strutture secondo me le DIV sono migliori non di gran lunga rispetto alle tabelle, ma all'infinito XD

 

[Jonn]

Scusami il doppio messaggio, comunque ti faccio vedere una struttura generica che utilizzo io.
è a 3 colonne, le due classiche NAV laterali, e quella centrale dove ci vanno i contenuti:
chiaramente è una struttura vuota, ho colorato i div per far notare il loro posizionamento.
Comunque scusami, ho riletto adesso:
Le tabelle possono servire si, per certe cose tipo inserire come ho detto prima un listino prezzi, fai prima con una tabella che con i div annidati, ma solo per cose essenzialmente statiche.
PS. non fare caso agli allineamenti che uso nei CSS, è che li faccio un po a modo mio XD
Vedi l'allegato Struttura Base.zip

 

[LorenzoSantiago]

Jon per quanto riguarda i colori per ora ho fatto una pagina con esattamente i colori che mi hai detto tu, poi vedrò come cambiarli, sicuramente in questo caso dovrò seguire altri consigli.
Per ora non riesco a capire un paio di cose ma meglio risolverne uno alla volta.
Ho stondato menù e footer, ma il footer si stonda solo in baso e non in altro, in questa maniera: http://thetourist.altervista.org/thetourist2.
Sapresti dirmi perchè?

 

[Jonn]

Semplicemente perchè non hai messo nel css:

div#footer {float:left;}

Se vuoi ho skype.

 

[LorenzoSantiago]

Domani lavoro, magari potremmo metterci d'accordo martedì.

 

[Jonn]

Diciamo che l'importante è che tu riesca a risolvere le problematiche a livello strutturale, la scelta dei colori, delle forme (se stondarle o meno) è una cosa che passa direttamente in secondo piano, io affinerei di più le tecniche di annidamento e posizionamento dei div per poter lavorare esclusivamente con quelli perchè ho notato che ove non riesci a metterne, usi le tabelle (che secondo me sono sprecate).
Cerchiamo di non uscire da quella che era la domanda iniziale:

- Cerca di strutturare il tutto con le div

E cerca di capire come con (come ho appena detto) annidamenti e posizionamenti vari riesci a fare in 5 minuti quello che magari con le tabelle potresti fare solo dopo 10.

L'importante è provare, provare, provare. ^^

PS. Se vuoi contattarmi in MP non ci sono problemi.

 

[LorenzoSantiago]

Le tabelle o la tabella si trovano esclusivamente nel menù.
Parlando dello stondamento il problema è proprio il contrario, funziona lì dove sta la tabella, ossia nel menù, mentre non funziona bene nel footer.

 

[Jonn]

Te l'ho scritto sopra, il footer non ti ha messo gli angoli superiori stondati perchè non hai floattato il div:

div#footer {float:left;}

Solo ed esclusivamente per questo motivo, gli stili che si applicano dai css sono infallibili a patto che si scriva codice senza errori ovviamente.
Nel 100% dei casi restanti dipende solo dal browser la compatibilità, ma non esistono stili o parametri che funzionino o meno.
^^
ciau.