ProtoFluid d’Optic Swerve : développez de vrais sites pour mobile


BlogBang

Il n’est pas toujours aisé de tester son site Web sur le média mobile.

Prenons en exemple m.lafrance-den-bas.deplaine.eu qui est le site mobile de La France d’en bas

La plupart des émulateurs en ligne se contentent malheureusement de redimensionner la page sans tenir compte des spécificités inhérentes à chaque terminal : iphonetester.com, l’extension Webdeveloper, viewlike.us. Même mobile pack pour WordPress, qui est pourtant un vrai thème pour mobile affiche un résultat médiocre. dans le navigateur de l’iPhone ou du Moto millestone sous androïd c’est beurk.

En dehors de l’installation des divers SDK des constructeurs ou de l’excellente version d’Opera Mobile installable, point de salut pour visualiser ses pages dans un réel environnement de production.

ProtoFluid est une application en ligne permettant véritablement d’émuler l’affichage de votre site Web – ou d’une url locale – sur divers terminaux mobiles et pas uniquement de modifier sa taille.

Le principe est simple : il suffit de renseigner l’URL à visionner ainsi que le téléphone mobile désiré, sa résolution si vous souhaitez la modifier.

Le résultat apparaît dans une fenêtre modale (lightbox).

Il vous est ensuite possible de modifier l’orientation (portrait ou paysage) puis de rafraîchir votre résultat.

La version actuelle de ProtoFluid est capable d’émuler le rendu des téléphones suivants : iPhone3, iPhone4, iPad, Motorola Droïd et Google Nexus One.

Tout en proposant des largeurs modifiables dans le cas où vous auriez fixé volontairement la valeur du Viewport.

En parfait clone du navigateur, ProtoFluid reconnaît les spécifications HTML5 et CSS3 très récentes, y compris le modèle de boite flexible, les coins arrondis, les préfixes vendeurs (-webkit, -moz, -o), etc.

En tout cas, si vous testez sur un navigateur lui-même conforme.

Il est possible de définir la résolution du terminal à l’aide du meta tag viewport reconnu par Safari, Webkit et Opera à l’heure actuelle.

ProtoFluid prend en compte les informations véhiculées via ce meta tag.

ProtoFluid supporte très bien les Media Queries accompagnées des propriétés width, max-width, max-device-width ainsi que orientation (portrait ou landscape).

@media only screen and (max-device-width:640px), only screen and (max-width:640px)

{    body  {width: auto}

L’équipe de développement de ProtoFluid, Optic Swerve, est en train de plancher sur une nouvelle version (1.1) de leur outil, vous pouvez suivre l’évolution du projet sur Twitter.

Fanch

ringtonefun.biz logo

[Source Reuters][Source AFP][Source lemonde.fr][Source La Tribune][Source Les Echos][Source service-public.fr][Source Leparisien] [Source macplus.net][Source planet-sansfil.com][Source geeek.org][Source branchez-vous.com][Source securiteoff.blogspot.com][Source spyworld-actu.com][Source ZDNet France][Source silicon.fr][Source PCINpact][Source maxiapple.com][Source generation-nt.com][Source numerama][Source Blogs Yahoo ! Music][Source LesInfos.com][Source Rue89][Source zataz.com][Source 03.ibm.com][Source culturebox.france3.fr][Source spyworld-actu.com][Source le.cos.free.fr][Source events.apple.com.edgesuite.net]

No related posts.

Les commentaires sont fermés.