problemi di usabilita sui dispositivi mobili

[mauriborzi]

Ciao a tutti, ho un piccolo problema con il mio sito, che non so come risolvere, in quanto non so dove mettere le mani sul template in questione.
Google mi dice che il sito non è ottimizzato per i dispositivi mobili e mi dice le seguenti cose:


 

			Elementi selezionabili troppo vicini tra loro,22
		Area visibile non impostata,22
		Testo troppo piccolo da leggere,20
			Contenuti più grandi rispetto allo schermo,4 www.artinbox.it

[marine]

O sei un super mago dei css o fai prima a cambiare template

[danielecr]

Ciao,
se guardo l'homepage gli elementi selezionabili troppo vicini potrebbero essere le immagini della galleria (14 elementi) e le icone dei social nel footer (5 elementi) e sempre nel footer il link che hai sulla parola webmaster (1 elemento), che risulta troppo attaccato alle icone social.
Per gli altri due elementi forse il link a Accademia Carrara, Bergamo  con l'immagine appena sotto.
Per quanto riguarda l'area visibile dovresti inserire il tag meta name=viewport nell'index del template e dovresti risolvere:
https://developers.google.com/speed/docs/insights/ConfigureViewport?hl=it

Testo troppo piccolo non saprei, forse le didascalie in alto dello slideshow.

Nulla di impossibile da sistemare ma come dice marine devi conoscere il css.

[mauriborzi]

nel css responsive del template ho queste impostazioni, cosa consigliate?





/* All except large Screens */
@media (max-width: 1220px) {


}


/* Only Phones and Tablets (Portrait) */
@media (max-width: 959px) {


}


/* Only Tablets (Portrait) */
@media (min-width: 768px) and (max-width: 959px) {


}


/* Only Tablets (Portrait) and Phones (Landscape) */
@media (min-width: 480px) and (max-width: 959px) {


   /* Layout */
   #search { display: none; }


}


/* Only Phones */
@media (max-width: 767px) {


   /* Layout */
   #toolbar,
   #headerbar,
   #menubar,
   #breadcrumbs,
   #totop-scroller { display: none; }


}


/* Only Phones (Landscape) */
@media (min-width: 480px) and (max-width: 767px) {


}


/* Only Phones (Portrait) */
@media (max-width: 479px) {


   /* System */
   #system .items .item,
   #system .items .item:first-child {
      margin-top: 12px;
      padding-top: 18px;
      border-top-width: 1px;
   }


   #system .items :first-child .item:first-child {
      margin-top: 0;
      padding-top: 0;
      border-width: 0;
   }


   #system .items .leading .item {
      margin-bottom: 0;
      padding-bottom: 0;
      border-width: 0;
   }


}

[danielecr]

Ciao,
quelle istruzioni non centrano nulla con i problemi evidenziati. Dovresti aggiungere nuove regole css, a seconda di cosa vuoi fare, per sistemare quanto elencato.

[mauriborzi]

aiutooo che cavolo debbo fare?
non ho idea, mi sa che chiedo a chi mi ha fornito il template.....che dici è una buona idea?


grazie ancora per il feedback

[danielecr]

Ok non sei un "mago", ma nemmeno un "maghino" del css
Secondo me se chiedi aiuto al fornitore del template non ne caverai fuori nulla.
Invece con un minimo di studio di css e un po' di applicazione secondo me qualcosa lo metti a posto!

[mauriborzi]

intanto vediamo cosa mi rispondono, nel caso mi mandino a quel paese, mi tengo il sito cosi com'è, non ho voglia di impazzire cn i css, con il rischio di incasinare tutto.


grazie ciao

[marine]

intanto vediamo cosa mi rispondono, nel caso mi mandino a quel paese, mi tengo il sito cosi com'è, non ho voglia di impazzire cn i css, con il rischio di incasinare tutto.

Perchè invece non sfruttare l'occasione per imparare qualcosa di nuovo e crescere professionalmente?

La conoscenza base del CSS sta alla base di ogni webmaster degno di questo nome.

[mauriborzi]

hai assolutamente ragione, ma io lo faccio per me e i miei amici, non per professione.
resta il fatto che imparare è sempre molto stimolante, pero opterei per sapere dove intervenire da chi ha realizzato il template, il che mi farebbe risparmiare tempo che oggi giorno è molto poco per far tutto.


grazie mille
ciao