Dafne: configurazione consigliata del browser sui tablet e personalizzazione dei css

Smartphone: Samsung Galaxy S
Risoluzione display: 480 x 800 (orientamento verticale)
CSS di Dafne (cartella wwwroot): smartphone (480x800).css
Browser utilizzato: Google Chrome (va installato dallo store, è gratuito)

da Impostazioni > Accessibilità > settare:

1) ridimensionamento testo settato > 200%
2) attivazione forzata dello zoom > mettere il segno di spunta

Tablet: Apple iPad 2
Risoluzione display: 768 x 1024 (orientamento verticale)
CSS di Dafne (cartella wwwroot): ipad 2 (768x1024).css
Browser utilizzato: Google Chrome (va installato dallo store, è gratuito)

nessuna impostazione necessaria

Personalizzazione dei file CSS

Nel caso in cui si utilizzino dispositivi con risoluzione diversa, è necessario creare dei css con informazioni di risoluzione e zoom opportune. Si dovrà procedere seguendo le linee guida indicate di seguito, e facendo alcuni tentativi, fino ad arrivare ad un risultato soddisfacente:

1) aprire la cartella wwwroot di Dafne (c:\altastagione\dafne\wwwroot), e creare una copia di uno dei due css in dotazione cambiandogli il nome in modo opportuno (ad esempio "Samsung Galaxy S4.css")

2) aprire il nuovo css con il blocconote di Windows

3) nel paragrafo "body" indicare "zoom: 100%;"

4) nel paragrafo "table" indicare "table { width:650px }" mettendo, al posto di 650, un valore leggermente inferiore alla risoluzione del dispositivo

5) si possono inoltre modificare le dimensioni del testo e degli altri elementi grafici (altezza pulsanti, ecc.) aumentandole o meno - ad esempio sostituire "font-size: 24px;" con "font-size: 20px;" per ridurre le dimensioni dei caratteri.

6) al termine delle modifiche, salvare il css, e assicurarsi che nelle impostazioni dei terminali di Dafne il terminale che si sta usando sia associato al NUOVO css.

7) dal terminale, aprire il browser e digitare nella barra degli indirizzi l'indirizzo del server seguito dalla porta 9999 (ad esempio: 192.168.1.10:9999).

Nel caso in cui il risultato non sia soddisfacente, cambiare opportunamente il valore di zoom, della larghezza delle tabelle, o la dimensione dei caratteri.

N.B. Quando si aggiorna un css, potrebbe darsi che Chrome tenga nella cache il vecchio css. Le modifiche fatte al css potrebbero dunque non risultare sul display del dispositivo, dando l'impressione che nulla sia cambiato. Bisogna quindi svuotare cache e impostazioni, e per farlo ci sono due possibiltià:

dal menù di Chrome > Privacy > Cancella dati di navigazione > mettere la spunta su "svuota la cache" e "cancella cookie/dati siti" > premere quindi "cancella"

oppure

dal menù di Chrome > mettere o togliere la spunta da "richiedi sito desktop"