due chiacchiere

Miglioramenti mobili al tema

Da un po’ non mettevo mano al tema di questo blog, probabilmente perché da quando ho lanciato questa terza generazione della veste grafica, la considero alquanto stabile da non essere più toccata 🙂 Ma essendo stato recentemente dotato di iPhone, non potevo non sfruttare l’occasione per dare una limatina ai dettagli estetici visti dal piccolo schermo del telefono tuttofare. Come forse saprai, questo sito non cambia più aspetto a seconda che il dispositivo con cui è acceduto sia fisso o mobile (a meno che non sia un vecchio telefonino con wap, in quel caso si, vedrai una cosa diversa e semplificata). Però ho deciso di eliminare la barra qui a destra, quando il browser è Safari Mobile, per dare più spazio a quello che conta. Che ne pensi?

Commenti

  1. Andrea Pinti
    ha scritto:

    Hai fatto bene 🙂
    E sto lasciando io commento dal mio iPhone

  2. CyberAngel
    ha scritto:

    Decisamente meglio. Confermo.

  3. camu
    ha scritto:

    Grazie cari, siete i miei “mobile testers” di fiducia 🙂 Voi che avete esperienza con l’iTelefono, pensate ci siano altre cose che si potrebbero migliorare? Stavo pensando di rimuovere lo sfondo (giusto per risparmiare qualche kb) e qualche altra immagine qua e la…

  4. Davide Salerno
    ha scritto:

    Anche io concordo nell’apprezzare la miglioria.

    Che tecnica hai utilizzato per farlo? Da CSS o PHP?

  5. kakarothx
    ha scritto:

    Ottimo! adesso dall’interfono i caratteri si vedono + grandi senza la necessità di zoomare. Grande idea Camu. Sono curioso anche io, hai modificato il CSS?

  6. camu
    ha scritto:

    Beh, ho usato un approccio “misto”: con PHP vedo che tipo di browser sta accedendo la pagina, e se è un iPhone “inietto” un po’ di CSS in linea che sovrascrive alcune delle proprietà definite in quello di default che vedono gli altri browser. In pratica un paio di punturine di “iBotox” qua e la nei tag per renderli più confacenti al dispositivo mobile 🙂

    Risposte al commento di camu

    1. Andrea Pinti
      ha scritto:

      @camu: se vai di display:none e simile, non conviene fare un controllo per iPhone e poi sparare solo le classi dove necessario?

      Risposte al commento di Andrea Pinti

      1. camu
        ha scritto:

        Hmmm spiegati meglio 🙂 sono aperto a tutte le migliorie… Una cosa che devo capire e’ se il contenuto di un div con display none viene comunque caricato dal browser (immagini ecc!) Perche’ se cosi’ fosse, non avrei risolto il problema di ridurre I tempi di caricamento e la banda “mobile” consumata

        Risposte al commento di camu
        1. Andrea Pinti
          ha scritto:

          @camu: Ho spizzato ora il sito con l’user agent “iPhone” su Safari per Mac (ma si puo’ fare anche su Windows). Ho visto che in pratica hai spruzzato il classico display:none; su div#sidebar.

          Gia’ che carica lo stesso tutta la sidebar e la nasconde, non ti converrebbe iniettare un class=”hide” e poi andare di ‘#sidebar.hide {display:none;} nello stylesheet? Almeno non usi codice inline.

          O ancora meglio, potresti mettere la chiamata alla sidebar sotto if (vai a scrivere una variabile quando si rileva l’iPhone) e non caricare proprio tutta la parte, dovendo sempre comunque inserire la classe su div#content per aumentare il font. E comunque l’iphone dispone di una roba che auto-modifica la grandezza del font in caso tu sia su dispositivi mobili (webkit). http://css-infos.net/property/-webkit-text-size-adjust

          Risposte al commento di Andrea Pinti
        2. camu
          ha scritto:

          @Andrea Pinti: esatto, ottimo suggerimento 🙂 Farò così…

Rispondi a Andrea Pinti

Torna in cima alla pagina