Consigli Design e Struttura Pagine

[Aires]

Ciao a tutti, non so se sia la sezione giusta, però non è una richiesta proprio grafica.
Allora vi spiego la situazione, io programmo in php e a livello di codice non ho grossi problemi, diciamo che di fronte ad un progetto, a livello di programmazione php non ci sono problemi, la cosa che però mi rallenta è la strutturazione della pagina, ad esempio come impostarla, magari ho anche in mente un layout che voglio dargli e riesco anche a realizzarlo ma ci metto abbastanza e non uso molto i div, quindi penso che per risolvere questo problema la cosa migliore sia studiarsi il css.

Detto questo volevo chiedere consigli sugli argomenti che ritenete sia meglio approfondire, sia come guide online, sia nel caso libri da acquistare che non siano troppo complicati per un neofita a livello di css, in quanto è vero che lo uso e riesco diciamo a cavarmela ma non lo conosco troppo bene.

Anche altre guide sono ben accette, anche a livello di HTML ed XHTML nel caso, in costruzione layout. Diciamo che non sono proprio a zero, ma purtroppo è proprio la messa a video che mi fa perdere piu tempo.

Grazie a tutti

[RupiWebDesigner]

Per riuscire a editare una buona grafica di un sito web, secondo me sono indispendsabili i fogli di stile CSS. Ci sono molte funzioni che non potresti usare con un semplice XHTML, ed inoltre i fogli di stile rendono molto pratica la realizzazione della grafica di un sito.
Come funzioni utili per donare qualità grafica al sito potresti giocare ad esempio sulla trasparenza dei blocchi, bordi arrotondati, slideshow javascript, ecc... Magari ti può essere utlie guardare anche qualche esempio.
Questo è ad esempio il mio blog che sto costruendo:
http://rupiwebdesign.altervista.org/blog/index.php
Questo è un sito che ho sempre realizzato io e che gioca molto sulla trasparenza:
http://neveabruzzo.altervista.org/
Spero di averti dato qualche buono spunto.

[Aires]

Originariamente inviato da RupiWebDesigner
Per riuscire a editare una buona grafica di un sito web, secondo me sono indispendsabili i fogli di stile CSS. Ci sono molte funzioni che non potresti usare con un semplice XHTML, ed inoltre i fogli di stile rendono molto pratica la realizzazione della grafica di un sito.
Come funzioni utili per donare qualità grafica al sito potresti giocare ad esempio sulla trasparenza dei blocchi, bordi arrotondati, slideshow javascript, ecc... Magari ti può essere utlie guardare anche qualche esempio.
Questo è ad esempio il mio blog che sto costruendo:
http://rupiwebdesign.altervista.org/blog/index.php
Questo è un sito che ho sempre realizzato io e che gioca molto sulla trasparenza:
http://neveabruzzo.altervista.org/
Spero di averti dato qualche buono spunto.

Ah si specifico attualmente vengono gia usati i fogli CSS. In realtà io li uso già e ne sfrutto classi e componenti, intendo magari per layout particolari. Ottimi esempi comunque, attualmente comunque uso i css, ma penso che crearli da capo, cosi completi come li trovo potrebbe costituire un po un problema, o al limite potrebbe esser lunga come cosa.

Ciò che comunque mi interessa è imparare anche attributi css da donare a div e a blocchi che mi permetta di sistemare un layout come voglio io

[RupiWebDesigner]

Originariamente inviato da Aires
Ah si specifico attualmente vengono gia usati i fogli CSS. In realtà io li uso già e ne sfrutto classi e componenti, intendo magari per layout particolari. Ottimi esempi comunque, attualmente comunque uso i css, ma penso che crearli da capo, cosi completi come li trovo potrebbe costituire un po un problema, o al limite potrebbe esser lunga come cosa.

Ciò che comunque mi interessa è imparare anche attributi css da donare a div e a blocchi che mi permetta di sistemare un layout come voglio io

Ah ho capito, quindi intendi sistemare un layout particolare come vuoi tu tramite dei determinati attributi CSS! Ho capito.
Beh, non ci sono problemi! Credo che in quel caso si debba giocare molto sugli atributi position e z-index . Con un corretto uso di queste funzioni, puoi posizionare tutti i div che vuoi, e al codice html i basterà soltanto richiamare i vari div.
La cosa più da tenere i considerazione saranno appunto i valori position: fixed; position: absolute; position: relative; a seconda se vuoi che il contenuto segui l'allineamento della pagina. Poi ad esempio se vuoi che un div non segui il contenuto della pagina, ma allo stesso tempo non vuoi fissarlo, basta che lo "elevi" di livello con un z-index: 2, ecc...
E' questo che intendevi giusto?

[mucu]

Originariamente inviato da RupiWebDesigner
Beh, non ci sono problemi! Credo che in quel caso si debba giocare molto sugli atributi position e z-index

in realtà sono gli attributi più delicati;
da evitare quando non si padroneggia abbastanza bene il resto
come succede nel tuo sito abruzzo neve
dove i css sono mischiati esterni e inline,
si vede una brutta barra orizzontale
e alcuni elementi non sono allineati

[RupiWebDesigner]

Originariamente inviato da mucu
in realtà sono gli attributi più delicati;
da evitare quando non si padroneggia abbastanza bene il resto
come succede nel tuo sito abruzzo neve
dove i css sono mischiati esterni e inline,
si vede una brutta barra orizzontale
e alcuni elementi non sono allineati

Strano, a me si vede perfettamente con Mozilla Firefox, per caso usi Explorer?
Comunque grazie del consiglio.
Comunque in quel sito: si ho fatto più o meno quello che intendeva Aires, ovvero posizionare i div direttamente dal CSS e richiamarli semplicemente nel foglio HTML, giocando con la trasperenza e sugli z-index, devo dire però che il codice mi è venuto abbastanza disordinato Sto facendo pratica anch'io

[mucu]

è impossibile che lo vedi bene
id=title ha width 100% e margin-left 200px
su qualunque browser conosco dovrebbe provocare la barra orizzontale
basterebbe togliere la dimensione
id=layout ha position relative quando tutto il resto ha una position absolute
a meno che non sia un effetto voluto, per evitare lo svolazzamento dello sfondo a seconda della dimensione della finestra
basterebbe mettergli position absolute e invece del margin left mettere un bel left=177px

sarà comunque sbagliato visto che mi sembra di capire che volevi una pagina centrata,
ma a questo punto la pagina avrà un risultato omogeneo

[RupiWebDesigner]

Originariamente inviato da mucu
è impossibile che lo vedi bene
id=title ha width 100% e margin-left 200px
su qualunque browser conosco dovrebbe provocare la barra orizzontale
basterebbe togliere la dimensione
id=layout ha position relative quando tutto il resto ha una position absolute
a meno che non sia un effetto voluto, per evitare lo svolazzamento dello sfondo a seconda della dimensione della finestra
basterebbe mettergli position absolute e invece del margin left mettere un bel left=177px

sarà comunque sbagliato visto che mi sembra di capire che volevi una pagina centrata,
ma a questo punto la pagina avrà un risultato omogeneo

Per quanto riguarda la barra orizzontale semi-trasparente, quella si è un effetto voluto. Ho però come hai detto tu il problema dello svolazzamento dello sfondo, che mi fa apparire lo scroll orizzontale. Seguo il tuo consiglio, quindi, imposto absolute anche al layout. Ti ringrazio molto per l'aiuto!

P.S: Scusaci dell'OT Aires

[mucu]

@Aires questo sito ha delle buone risorse per iniziare
le trovi nei link utili
sia guide che esempi