Repository 32bit  Forum
Repository 64bit  Wiki

Immagini e spaziatura in CSS

Forum dedicato alla programmazione.

Moderatore: Staff

Regole del forum
1) Citare in modo preciso il linguaggio di programmazione usato.
2) Se possibile portare un esempio del risultato atteso.
3) Leggere attentamente le risposte ricevute.
4) Scrivere i messaggi con il colore di default, evitare altri colori.
5) Scrivere in Italiano o in Inglese, se possibile grammaticalmente corretto, evitate stili di scrittura poco chiari, quindi nessuna abbreviazione tipo telegramma o scrittura stile SMS o CHAT.
6) Appena registrati è consigliato presentarsi nel forum dedicato.

La non osservanza delle regole porta a provvedimenti di vari tipo da parte dello staff, in particolare la non osservanza della regola 5 porta alla cancellazione del post e alla segnalazione dell'utente. In caso di recidività l'utente rischia il ban temporaneo.

Re: Immagini e spaziatura in CSS

Messaggioda danix » ven mar 13, 2009 9:06

hi hi... :badgrin: +1 per me ;)


ovviamente scherzo... :lol:
Avatar utente
danix
Staff
Staff
 
Messaggi: 3280
Iscritto il: ven ott 27, 2006 18:32
Località: Siderno (RC)
Nome Cognome: Danilo M.
Slackware: 64 14.0
Kernel: 3.2.29
Desktop: fluxbox

Re: Immagini e spaziatura in CSS

Messaggioda conraid » ven mar 13, 2009 9:51

samiel ha scritto:comunque continuo a non capire perché con 100% dava quel brutto effetto
e solo in un caso.

@ conraid
va a capo dopo il float:left del menù a sinistra

Cioè dovrei mettere:
Codice: Seleziona tutto
#leftmenu{float:left;
width:160px; padding:40px 30px 0; line-height:2}

Ma che funzione ha l'a capo?

M.


no mauro, non devi mettere niente, ti stavo dicendo perché si comportava così, lo so mi esprimo male, avrei dovuto dire "si comporta così perché va a capo dopo il float:left del menù a sinistra" :-)

quella era la causa, la soluzione è il seguito, cioè di togliere 100% e provare, se proprio vuoi, 99%

Questo credo che lo faccia per questioni di bordi, se metti 100% hai pur sempre una dimensione maggiore del 100% per via dei bordi

Comunque hanno ragione Danix e Aschenaz, in xhtml 1.1 si può mettere dimensione direttamente in xhtml (http://www.w3.org/TR/2006/WD-xhtml-modu ... dule_Image), nel css va il layout non la dimensione dell'immagine.
Le immagini non necessarie (sfondi, abbellimenti, etc...) vanno invece "direttamente" in css, come background di un div
Avatar utente
conraid
Staff
Staff
 
Messaggi: 12022
Iscritto il: mer lug 13, 2005 23:00
Località: Livorno
Nome Cognome: Corrado Franco
Slackware: current

Re: Immagini e spaziatura in CSS

Messaggioda targzeta » ven mar 13, 2009 10:08

aschenaz ha scritto:...
Non solo gli attributi width e height sono consentiti in XHTML 1.1
( http://www.w3.org/TR/xhtml-modularizati ... magemodule ),
ma sono anche spesso consigliati per ragioni di accessibilità, in particolare perché
i reader (che non leggono i css) possano anche dare l'idea delle dimensioni
(anzi, per la verità, almeno fino ad un po' di tempo fa, alcuni validatori ne
segnalavano l'assenza come errore); non trovo molte fonti, comunque un articolo
abbastanza interessante è questo:
http://www.nolimit.it/home/page.asp?nca ... che&ID=164

Se hai un browser che non legge i css sei messo male a prescindere dalle immagini, tutti i flottanti, tutti i margini i padding le dimensioni dei font, i colori, etc..., etc...

Però è vero che esplicitando nel tag anche width e heigth il browser si riseva lo spazio nella pagina in attesa di ricevere l'immagine....ma i fogli di stile fanno anche questo :). Ovviamente alt e longdesc fanno parte di quello che vuoi presentare e quindi vanno giustamente inseriti.

Poi ripeto, la mia è solo un opinione personale, l'importante come sempre è sapere ciò che si sta facendo!

Spina
Linux Registered User #454438
Se pensi di essere troppo piccolo per fare la differenza, prova a dormire con una zanzara -- Dalai Lama
20/04/2013 - Io volevo Rodotà
Avatar utente
targzeta
Iper Master
Iper Master
 
Messaggi: 6185
Iscritto il: gio nov 03, 2005 14:05
Località: Carpignano Sal. (LE) <-> Pisa
Nome Cognome: Emanuele Tomasi
Slackware: current
Kernel: latest stable
Desktop: IceWM

Re: Immagini e spaziatura in CSS

Messaggioda conraid » ven mar 13, 2009 10:33

spina ha scritto:Se hai un browser che non legge i css sei messo male a prescindere dalle immagini, tutti i flottanti, tutti i margini i padding le dimensioni dei font, i colori, etc..., etc...


Ma i css come dici sono stati fatti appunto per separare il contenuto dal layout, ma alcune immagini sono "contenuto", altre layout. Uno sfondo, una icona, un logo, un header, etc... vanno direttamente nel css (anche la sorgente, non solo larghezza ed altezza, così da evitare lavoro inutile agli screen reader o simili, anche se secondo le WAG2.0 per le immagini di "abbellimento" si può usare la tecnica dell'annullamento tramite ALT
http://www.w3.org/TR/WCAG20-TECHS/H67.html), ma se vuoi mettere una foto, un qualcosa che spiega il contenuto, allora va in html. E browser che non leggono css ce ne sono eccome, da un banale lynx agli screen reader citati da Aschenaz, ma questi non scaricano nemmeno le immagini, ma "scrivono o descrivono" l'attributo ALT e/o longdesc.
Quindi la questione di larghezza ed altezza è arbitraria e personale, ma se hai tante immagini della stessa dimensione conviene fare una classe unica, pensa agli album fotografici, ma se sono di dimensione diversa conviene settarlo nell'html. Solamente una questione di ottimizzazione secondo me.

Comunque le cose stanno per cambiare, soprattutto per xhtml2
http://www.w3.org/TR/xhtml2/mod-image.h ... magemodule
mentre per html5 sarà simile ad adesso
http://dev.w3.org/html5/spec/Overview.h ... mg-element
con ancora width e height

Ma chissà quando usciranno le specifiche definitive, e soprattutto chissà quando i browser si adegueranno
Avatar utente
conraid
Staff
Staff
 
Messaggi: 12022
Iscritto il: mer lug 13, 2005 23:00
Località: Livorno
Nome Cognome: Corrado Franco
Slackware: current

Re: Immagini e spaziatura in CSS

Messaggioda targzeta » ven mar 13, 2009 10:38

Considerato che:
  • siete almeno in tre a pensarla così
  • vi stimo tutti e tre
  • il mio senso autocritico mi dice che io sbaglio sempre
per quanto mi riguarda d'oggi in poi specificherò sempre height e width all'interno del tag <img>.

Stavo per scrivere:
"Se però un giorno uscirà un nuovo linguaggio a markup che non permetterà di fare questo, vi picchio a tutti e tre :D"

Poi ho letto il tuo ultimo post conraid, visto le nuove specifiche XHTML2, cosa devo fare? A questo punto il mio senso di autocritica sta per venire meno in favore di un:"lo sapevo" :)

Spina
Linux Registered User #454438
Se pensi di essere troppo piccolo per fare la differenza, prova a dormire con una zanzara -- Dalai Lama
20/04/2013 - Io volevo Rodotà
Avatar utente
targzeta
Iper Master
Iper Master
 
Messaggi: 6185
Iscritto il: gio nov 03, 2005 14:05
Località: Carpignano Sal. (LE) <-> Pisa
Nome Cognome: Emanuele Tomasi
Slackware: current
Kernel: latest stable
Desktop: IceWM

Re: Immagini e spaziatura in CSS

Messaggioda aschenaz » ven mar 13, 2009 10:39

spina ha scritto:Se hai un browser che non legge i css sei messo male...

Mi riferivo ai lettori vocali...
pensieriemotivi.aschenaz.eu - music-blog
Avatar utente
aschenaz
Staff
Staff
 
Messaggi: 4433
Iscritto il: mar lug 27, 2004 23:00
Località: Reggio Calabria
Nome Cognome: Nino
Slackware: current 64bit
Kernel: 3.14.18
Desktop: KDE 4.10.5

Re: Immagini e spaziatura in CSS

Messaggioda targzeta » ven mar 13, 2009 10:42

aschenaz ha scritto:
spina ha scritto:Se hai un browser che non legge i css sei messo male...

Mi riferivo ai lettori vocali...

Questa battuta è cattivissima ma mi è venuta subito in mente quando ho letto il post :):"Ed io che ti avevo detto, sei messo male!"

Battutaccia a parte, tutti questi reader (links e lynx compresi) non hanno bisogno delle informazioni riguardo larghezza o altezza di un immagine, dato che semplicemente non la scaricano :)

Spina
Linux Registered User #454438
Se pensi di essere troppo piccolo per fare la differenza, prova a dormire con una zanzara -- Dalai Lama
20/04/2013 - Io volevo Rodotà
Avatar utente
targzeta
Iper Master
Iper Master
 
Messaggi: 6185
Iscritto il: gio nov 03, 2005 14:05
Località: Carpignano Sal. (LE) <-> Pisa
Nome Cognome: Emanuele Tomasi
Slackware: current
Kernel: latest stable
Desktop: IceWM

Re: Immagini e spaziatura in CSS

Messaggioda conraid » ven mar 13, 2009 10:49

spina ha scritto:Poi ho letto il tuo ultimo post conraid, visto le nuove specifiche XHTML2, cosa devo fare? A questo punto il mio senso di autocritica sta per venire meno in favore di un:"lo sapevo" :)


Sembra, e dico sembra, che il futuro standard per le pagine web sarà html5 e non xhtml2, che sarà usato per altre cose. Ma questo dipenderà più dalla strada che prenderanno i browser che non altro. Gli strumenti di sviluppo invece (da dreamweaver in testa) hanno richiesto "loro" html5.

Per adesso però... io lo metto, tranne come ho detto i casi dove ho immagini ripetitive della stessa dimensione ed una classe è più conveniente
Avatar utente
conraid
Staff
Staff
 
Messaggi: 12022
Iscritto il: mer lug 13, 2005 23:00
Località: Livorno
Nome Cognome: Corrado Franco
Slackware: current

Re: Immagini e spaziatura in CSS

Messaggioda danix » ven mar 13, 2009 10:54

conraid ha scritto:Per adesso però... io lo metto, tranne come ho detto i casi dove ho immagini ripetitive della stessa dimensione ed una classe è più conveniente


quoto...
Avatar utente
danix
Staff
Staff
 
Messaggi: 3280
Iscritto il: ven ott 27, 2006 18:32
Località: Siderno (RC)
Nome Cognome: Danilo M.
Slackware: 64 14.0
Kernel: 3.2.29
Desktop: fluxbox

Precedente

Torna a Programmazione

Chi c’è in linea

Visitano il forum: Nessuno e 1 ospite

cron