gestione delle approssimazioni

[ernesto.pic]

Ciao a tutti,

quando si utlizza l'attributo width si dovrebbe avere la possibilità di inserire anche numeri a vorgola mobile. Mi chiedevo fino a che livello di approssimazione riescono a leggere i browser. Nel senso che se scrivo "width:12.6966079212px" come si comporteranno i vari browser?

Grazie,

Ernesto

[Mich_]

Dipende dal contesto.

Se il browser deve visualizzare a video, la sua unita` di misura fondamentale e` il px: cioe` tutte le varie unita` vengono trasformate in px interi prima di essere stampate.
Tecnicamente non so se questo viene fatto dal brwoser stesso o dalla scheda che gestisce la grafica: probabilmente dipende dall'hardware e da come e` implementato il browser su tale hw.

Comunque non esistono misure piu` piccole del px, e non si puo` accendere mezzo pixel.
Quindi anche se usi numeri floating-point (fp) o se altre unita` di misura vengono convertite in numeri fp, alla fine viene arrotondato al pixel.

Come viene arrotondato? Anche questo dipende: in qualche caso viene usato l'intero piu` prossimo, in altri casi la cosa e` diversa. Comunque puo` capitare che due oggetti larghi 50% non ci stiano nello spazio previsto.
Mi spiego con un esempio: supponiamo un blocco largo 401 px, in cui vanno inseriti due blocchi uguali: viene quindi specificato width:50% in ciascuno.
Ma 401 * 50% fa 200.5, che per le regole dell'arrotondamento viene trasformato in 201: 2*201 fa 402, che quindi non ci sta nel blocco da 401.

Diverso e` se viene scritto: width: 49.9%: in tal caso con l'arrotondamento e` facile (ma non sicuro) che ciascun blocco risulti 200px, e quindi ci sta nei 401.

[ernesto.pic]

Grazie,

ora ho un'idea più chiara. Credo, comunque, che l'approssimazione dei px sia gestita dal browser. Ho infatti provato una visualizzazione sia su FireFox che Safari ed Explorer. Nel primo caso ottengo ciò che aspettavo, mentre negli altri due le immagini sono sfalsate come se ci fossero 10px di differenza. Il problema è che a questo punto non potrò unificare la visualizzazione su diversi browsers. Il consiglio che chiedo è: mi conviene arrotondare i px all'intero più prossimo o utilizzare un valore %? Forse il risultato è lo stesso.

Grazie ancora,
Ernesto

[Mich_]

Si stanno sovrapponendo due discorsi diversi.

Da un lato c'e` il problema delle approssimazioni, che puo` portare ad una differenza di 1 o 2 px tra un browser ed un altro. Una differenza maggiore non puo` essere attribuita agli arrotondamenti.

Invece il problema IE potrebbe essere dovuto ad altri bug, tipo il "bug dei tre pixel", oppure al "raddoppio dei margini nei float": se cerchi nel forum (bottone in alto) con quelle parole chiave, dovresti trovare la soluzione. Esistono anche siti specializzati nei bug di IE: uno e` citato nei "link utili", altri li puoi trovare in rete.


Invece il problema di quale unita` usare, lo ho trattato altre volte (lo trovi con una ricerca nel forum): comunque se hai un blocco che contiene prevalentemente immagini (che sono intrinsecamente definite in px) conviene usare i px; se un blocco contiene prevalentemente testo, conviene usare gli em; se invece devi gestire un layout, potrebbe essere piu` utile usare le %.

[ernesto.pic]

Perfetto. Giusto per chiarire le idee in quanto sto impazzendo e non so se riuscirò a risolvere la cosa. Manteniamo la discussione sulle approssimazioni. A tale proposito vorrei invitarvi a visualizzare una pagina che ho creato in automatico da uno script python, localizzata al sito www.pesolelab.it/ernesto/cluster.html.
Sono presenti due oggetti costituiti da rettangoli e linee in successione. Ad ogni rettangolo e linea è assegnato un valore float di px per l'attributo width. Se la pagina viene aperta con FireFox i due oggetti sono perfettamente allineati, mentre se si utilizza Safari o Explorer la cosa è diversa. In Safari ho notato che ci sono 10px di differenza, nel senso che se aggiungo 10px al primo rettangolo rosso del secondo oggetto il tutto ritorna alla normalità. Il punto è come mai FireFox visualizza in modo corretto il tutto mentre gli altri browser no? Probabilmente è la modalità di approssimazione dei float. Se riuscissi a capire dove sta le reale differenza potrei risolvere il problema o eventualmente tentare un'altra strada.

Grazie,
Ernesto

[Mich_]

Ho problemi ad interpretare il codice HTML della pagina di prova postata.

Avrei preferito una cosa senza JS (altrimenti non si puo` capire se il problema e` dato da interferenze con JS).

Avrei preferito non avere tutti quegli stili in linea (soprattutto dato che sono tutti quasi uguali: almeno le cose uguali dovrebbero essere inserite in una classe del CSS).

Avrei preferito una DTD chiara, meglio se XHTML 1.0 Strict, in modo da poter confrontare i vari browser con una cosa comparabile: senza DTD ogni browser interpreta come vuole (secondo il linguaggio prevalente di quando e` uscito).

Avrei preferito non veder blocchi vuoti (che in qualche brwoser vengono ignorati - le specifiche dicono che blocchi vuoti possano venir ignorati)

Avrei preferito, infine, che non venissero usate tabelle per la formattazione (fanno parte del modo di programmare di HTML2, ma sono passati almeno una decina di anni da allora).

[ernesto.pic]

Chiedo scusa per l'inconveniente ma non sono un programmatore. Perdonatemi se ci sono delle incomprensioni o delle porzioni di codice non ottimizzate. Quello che sono riuscito a fare è rimuovere tutti i javascript. La pagina è stata snellita anche se il risultato non cambia.

Ernesto

[Mich_]

Hai tolto i JS, ma sono rimasti tutti gli altri problemi.

Non e` questione di ottimizzazione, ma di usare un linguaggio chiaro sia al programmatore che al browser, e quella pagina non ha nessuna delle due caratteristiche.

Qualsiasi confronto e` quindi, a mio modo di vedere, suscettibile di dubbi sul linguaggio usato, e quindi inservibile dal punto di vista pratico.

[ernesto.pic]

Rispetto la tua opinione in quanto avrai sicuramente più esperienza di me ed il codice sarà pure "crudo" ma non mi sembra impossibile da leggere ed interpretare. Ad ogni modo FireFox si comporta sempre allo stesso modo ovvero visualizza il tutto in modo atteso. Mi farebbe piacere avere un feedback sugli errori presenti in modo che possa migliorare.

Ernesto

[Mich_]

Forse mi sono spiegato male.

Quello che voglio dire e` che non ha senso fare confronti tra browser se non c'e` uniformita` di interpretazione.
FF probabilmente interpreta come se fosse XHTML 1.0 Strict o Tansitional, IE6 credo che interpreti come HTML 4.0 Transitional, altri browser in modo diverso. Occorre anzitutto definire il linguaggio, e questo lo si fa con il DOCTYPE (vedi ad esempio http://www.w3schools.com/tags/default.asp ).

Poi la programmazione moderna non ammette formattazioni realizzate tramite tabelle: sono da sostituire con i <div>

Inoltre c'e` il problema del controllo del codice da parte degli umani: questo si fa facilmente se la pagina e` stata programmata bene, e` molto piu` difficile con il codice sporco, e con cloni ripetuti: chi mi dice che in tutti quei cloni non ci sono errori? Come faccio a controllare?

E chi mi dice che qualcuno di quei blocchi vuoti non viene elimiato dai browser? La specifica HTML+CSS dice espressamente che i tag vuoti possono venir ignorati. Questo e` ancora valido per alcune versioni dei brwoser, sia FF che IE; anche se le ultime versioni hanno preferito mostrare sempre tutto.