Alsacreations.fr en version mobile

(reprise du message précédent)

Raphael a écrit :
Tout simplement avec un contenu généré avec le pseudo élément :after (reconnu par tous le monde sauf IE mobile - forcément - et les trucs proprio comme Nokia, LG ou Ericsson)

Peux tu m'en dire un peu plus, je vois rien dans la source. Il me reste plus que ça à faire. c'est du JS, css, html?

a écrit :
Non ce n'est pas pareil : width : 100% est trop dangereux, il suffit qu'un petit padding ou une border de rien du tout traîne et casse tout puisqu'ils s'ajoutent à la largeur.

Merci pour l'info, je vais relire ta source et faire les modifs, il est vrai que du coup je me suis fais ch*** à passer les padding en %, du genre largeur 96% padding left 2% et right 2%... lol

a écrit :
Je viens de les supprimer il y a environ 10 minutes * (cela créait un bug d'affichage sur Safari en fin de compte).
C'est reconnu par les moteurs Webkit (donc iPhone, iPad, Android) et Fennec, donc plutôt bien répandu.

Au final, tu as trouvé une solution alternative ou tu laisse le contenu dans l'ordre?

Dernière question, j'ai cherché sur google mais je n'ai toujours pas compris, tu appliques des !important partout et je ne sais plus à quoi ils servent...

En tout cas, un très merci à Alsaceration, mon site est ce qu'il est grace à vous!!!!

a écrit :
Peux tu m'en dire un peu plus, je vois rien dans la source. Il me reste plus que ça à faire. c'est du JS, css, html?

C'est du contenu généré en CSS, il est bien présent dans la feuille de style. Il te suffit de faire une recherche sur "mobile" par exemple.

a écrit :
Au final, tu as trouvé une solution alternative ou tu laisse le contenu dans l'ordre?

Je laisse le contenu dans l'ordre, puisque j'avais testé cette "fonction" uniquement pour le fun en fait.
Il existe une autre solution assez simple : afficher les blocs sous forme d'élements tabulaires et de modifier leur ordre : http://www.ie7nomore.com/css2only/table-order/

a écrit :
Dernière question, j'ai cherché sur google mais je n'ai toujours pas compris, tu appliques des !important partout et je ne sais plus à quoi ils servent...

Pour être sûr que mes déclarations CSS mobiles aient assez de poids pour écraser les styles "classiques" screen. Ce n'est pas nécessaire s'il n'y a pas de conflit, mais c'est une habitude que j'ai prise pour être sûr.

a écrit :
En tout cas, un très merci à Alsaceration, mon site est ce qu'il est grace à vous!

AlsacréationS : attention, tu évites de peu le coup de pelle !

Aucun problème de mon côté (iPhone 3GS , iPhone4 et HTC Desire). Par contre il serait de bon ton de mettre en place un lien permettant de desactiver la version mobile, et ce pour une raison très simple: quand je recherche une information précise, j'ai plus de mal avec la version mobile que je connais mal. Donc un tout ch'ti lien "Version normale du site" serait génial

PHPnewb a écrit :
Par contre il serait de bon ton de mettre en place un lien permettant de desactiver la version mobile, et ce pour une raison très simple: quand je recherche une information précise, j'ai plus de mal avec la version mobile que je connais mal. Donc un tout ch'ti lien "Version normale du site" serait génial

Sauf que, pour autant que je sache, il n'y a ni version « normale » ni version « mobile » pour le site en question. Il s'agit d'une seule et même version, quel que soit le support utilisé pour la consultation, et c'est très bien ainsi : après tout, il n'y a qu'un seul Web.

Hello,

En redimensionnant la fenêtre du navigateur sur le site, les médias queries se mettent bien marche.

Par contre en mettant au minimum la largeur puis en repassant au maximum les icones création, accessibilité etc.... se mettent les unes au dessus des autres. ( je suis sous chrome mac ).

Petite chose à méditer, toutes les ressources de la page sont chargées que l'on soit en mode mobile ou non... De nos jours la bande passante est chère, même si bientôt il faudra payer pour avoir accès à certains sites, ne pas charger les ressources inutiles serait un plus, surtout sur mobile où on a pas vos avatars ni icônes affichées

J'avais lu un slideshow super complet sur ce sujet, malheureusement je ne retrouve plus le lien ...

Patidou a écrit :



Ça dépend des navigateurs…

Excellente ressource, merci d'avoir déniché ça !

Patidou a écrit :



Ça dépend des navigateurs…

Et là ce ne sont que les versions desktop, j'espère que les versions mobiles sont plus optimisées.

Justement les test de mon article perdu étaient effectués en mobile et safari mobile/chrome mobile chargeaient la totalité des ressources .

Merci beaucoup pour ta ressource très intéressante

J'ai trouvé un lien que je n'avais pas vu la dernière fois qui contredit mon autre article :
/http://www.cloudfour.com/examples/mediaqueries/image-test
Donc effectivement c'est optimisé ( sur iphone en tous cas ^^ ) dans certains cas