Mickaël Floc’hlay

 

Adapter un site SPIP à un terminal mobile

Le site vient d’être mis à jour et utilise un thème et un squelette ZPIP pour SPIP qui permet un rendu adapté aux dimensions de l’écran du terminal utilisé pour le consulter.

J’en parlais ici, j’ai mis à jour ce site en utilisant le triple principe de fluid grids, fluid images et media queries.

Pour cela j’ai créé un thème et un squelette ZPIP qui utilisent des outils communs à la plupart des webmasters :
- Feedburner pour le flux RSS
- les derniers tweets d’un compte Twitter pour dynamiser le contenu du site
- Google Analytics pour la mesure d’audience

Pour améliorer le graphisme du site, j’ai aussi utilisé :
- ce set de sketched icons
- cet autre set de sketched icons
- l’application iPhone ShakeItPhoto pour donner un rendu sympa aux icônes

Le même site pour consultation sur iPhone

Ainsi, avec une instance de SPIP et sans configuration Apache, le contenu du site s’adapte automatiquement aux dimensions de l’écran sur lequel il est consulté. Voici par exemple le rendu de la home page sur un iPhone en orientation portrait et en orientation paysage :

A propos de ZPIP

J’utilise donc le plugin ZPIP pour le CMS SPIP pour lequel j’ai créé un thème et un squelette. Je viens de mettre à disposition ces 2 composants, pour le moment destinés à fonctionner ensemble. Vous pouvez donc les utiliser dès maintenant pour votre site ! Pour cela, cliquer ici !

N’hésitez pas à me fournir vos remarques à son sujet sachant que j’ai déjà identifié quelques bugs que je corrigerai bientôt dans une seconde version :
- le formulaire de recherche est absent de la version mobile (ne trouvant pas de façon agréable de l’intégrer, j’ai choisi de ne pas l’afficher pour le moment, ce sera fait bientôt)
- premier espace de taille aléatoire pour les listes quand le texte est justifié
- le zoom n’est plus possible sur Safari pour iOS
- le site désactive le rendu des flux syndiqués dans SPIP

mardi 24 août 2010

Répondre à cet article

255 Messages de forum

Blog

SortMash 2.0 est sortie !

SortMash version 2.0 vient d’être mise à disposition sur l’App Store. Pourquoi déjà une version 2 plutôt qu’une 1.1 ? Même si ça ne se voit pas de l’extérieur, le moteur interne a été complètement réécrit (...)
12/09/2011

ShakinDice 1.2 est sortie !

Petite mise à jour de ShakinDice, dont la version 1.2 vient d’être mise à disposition sur l’App Store. Au rayon des nouveautés : Une version en français à 100%. Une utilisation plus facile. Le pile ou (...)
08/09/2011

Just Show It 1.0 est sortie !

L’application Just Show It, que j’ai développées en collaboration avec Johann Barthel, est publiée sur l’iTunes App Store depuis le 24 juillet. Il s’agit d’un "dictionnaire visuel du voyageur", (...)
15/08/2011

Morning Coffee

Horrible Jeu sur iOS

ou comment défier la loi du marché avec des in-app products médiocres à 100$. iPhone Garbage: Super Monster Bros by Adventure Time Pocket Free Games – YouTube.
30/04/2013

Mon coeur de Brestois est triste

Mon coeur de Brestois est triste, mais il faut aussi voir les choses en face : Brest est la plus faible équipe de L1 et sa relégation est on ne peut plus logique. via PIERROT FOOTBALL BLOG – (...)
29/04/2013

La différence entre James et Durant

J. A. Andade comparant James et Durant : James est une superstar à plein temps. Durant, un basketteur à plein temp (Via L’Equipe.fr Actu Basket)
12/04/2013

Copé et la transparence du patrimoine selon James

Jour 340: (Via Je veux travailler pour le canard enchaîné)
11/04/2013

Quelques principes de design par les développeurs de Polar

4 Surprising App-Design Principles, From The Instagram Of Quick Quizzes | Co.Design: business + innovation + design: Analyse de 4 principes de design de l’application Polar : - Design For (...)
09/04/2013

Tweets