davidbgk
/
larlet-fr-david
보기 1
좋아요 0
포크 0
코드 릴리즈 0 Activity
Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
327 커밋
1 브렌치
트리: 37b88ee0e4
브랜치 태그
${ item.name }
Create branch ${ searchTerm }
from '37b88ee0e4'
${ noResults }
larlet-fr-david/david/biologeek/archives/20080723-ipheedsorg-une-ver.../index.html

index.html 39KB
Raw Blame 히스토리

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655 
  1. <!doctype html>

  2. <html lang=fr>

  3. <head>

  4.   <!-- Always define the charset before the title -->

  5.   <meta charset=utf-8>

  6.   <title>★ iPheeds.org, une version iPhone pour votre blog — Biologeek — David Larlet</title>

  7.   <!-- Define a viewport to mobile devices to use - telling the browser to assume that the page is as wide as the device (width=device-width) and setting the initial page zoom level to be 1 (initial-scale=1.0) -->

  8.   <meta name="viewport" content="width=device-width, initial-scale=1"/>

  9.   <!-- Fake favicon, to avoid extra request to the server -->

  10.   <link rel="icon" href="data:;base64,iVBORw0KGgo=">

  11.   <link type="application/atom+xml" rel="alternate" title="Feed" href="/david/log/" />

  12.   <link rel="manifest" href="/manifest.json">

  13.   

  14.   <link rel="stylesheet" href="/static/david/css/larlet-david-_J6Rv.css" data-instant-track />

  15.   

  16.   <noscript>

  17.     <style type="text/css">

  18.       /* Otherwise fonts are loaded by JS for faster initial rendering. See scripts at the bottom. */

  19.       body {

  20.         font-family: 'EquityTextB', serif;

  21.       }

  22.       h1, h2, h3, h4, h5, h6, time, nav a, nav a:link, nav a:visited {

  23.         font-family: 'EquityCapsB', sans-serif;

  24.         font-variant: normal;

  25.       }

  26.     </style>

  27.   </noscript>

  28.   

  29.   <!-- Canonical URL for SEO purposes -->

  30.   <link rel="canonical" href="https://larlet.fr/david/biologeek/archives/20080723-ipheedsorg-une-version-iphone-pour-votre-blog">

  31. 

  32. </head>

  33. <body>

  34.   <div>

  35.     

  36.     <header>

  37.       <nav>

  38.         <p>

  39.           <small>

  40.             Je suis <a href="/david/" title="Profil public">David Larlet</a>, <a href="/david/pro/" title="Activité professionnelle">artisan</a> du web qui vous <a href="/david/pro/accompagnement/" title="Activité d’accompagnement">accompagne</a><span class="more-infos"> dans l’acquisition de savoirs pour concevoir des <a href="/david/pro/produits-essentiels/" title="Qu’est-ce qu’un produit essentiel ?">produits essentiels</a></span>. <span class="more-more-infos">Discutons ensemble d’une <a href="/david/pro/devis/" title="En savoir plus">non-demande de devis</a>.</span> Je partage ici mes <a href="/david/blog/" title="Expériences bienveillantes">réflexions</a> et <a href="/david/correspondances/2017/" title="Lettres hebdomadaires">correspondances</a>.

  41.           </small>

  42.         </p>

  43.       </nav>

  44.     </header>

  45.     

  46.     

  47.   <section>

  48.     <h1 property="schema:name">★ iPheeds.org, une version iPhone pour votre blog</h1>

  49.     <article typeof="schema:BlogPosting">

  50.       <div property="schema:articleBody">

  51.         <img src="/static/david/biologeek/images/logos/ipheeds.png" alt="vignette" style="float:left; margin: 0.5em 1em;" property="schema:thumbnailUrl" />

  52.         <p>Je m'intéresse au web mobile depuis un moment et hier soir j'ai enfin pris le temps de regarder la conférence de Dominique Hazaël‑Massieux : <a href="http://2007.paris-web.fr/Presentations-des-intervenants">Bonnes pratiques du Web mobile</a> donnée lors de Paris Web l'année dernière. J'avais prévu de faire une version iPhone de ce site mais ça allait à l'encontre du <a href="http://www.w3.org/2007/02/mwbp_flip_cards#design_for_one_web">One Web</a>, j'ai donc réfléchi un moment et je suis arrivé à la conclusion qu'il ne m'était pas nécessaire d'avoir un site entier dédié à l'iPhone mais qu'une représentation des derniers billets serait suffisante.</p>

  53. <h2>Service</h2>

  54. <p>De là est née l'idée de créer un site qui permette juste d'afficher un flux de syndication (RSS ou Atom). Il y a des montagnes d'agrégateurs mais je n'ai trouvé aucun site proposant ce service tout simple.</p>

  55. <p>J'ai sorti ma boîte à outils et j'ai commencé à mettre les mains dans le cambouis, et plus j'avançais, plus j'étais persuadé qu'un tel service devait exister mais impossible de mettre la main dessus. Au final je suis arrivé à une solution assez élégante qui permet à ce blog de rediriger les utilisateurs munis d'un iPhone (qui arrivent sur l'accueil ou sur le journal) s'ils le souhaitent.</p>

  56. <p>Mais la bonne nouvelle pour vous c'est que <strong>n'importe quel blog peut maintenant avoir la même représentation de son contenu « compatible iPhone »</strong> !</p>

  57. <h2>Utilisation</h2>

  58. <p>Le site d'iPheeds est tout simple : un champ URL permettant de soumettre le flux pour créer votre URL iPhone qui va permettre d'afficher les derniers billets de votre site.</p>

  59. <p>Ce qui donne par exemple pour ce blog :</p>

  60. <ul>

  61. <li>http://ipheeds.org/?ipheed=http://www.biologeek.com/data/atom/</li>

  62. </ul>

  63. <p>Mais l'avantage c'est que vous pouvez iPhoniser n'importe quel flux, allant de votre service préféré aux torrents de vos séries TV (pas de lien mais vous aurez compris le principe).</p>

  64. <h2>Promotion</h2>

  65. <p>Une fois en possession de cette URL, vous avez plusieurs moyens d'en faire la promotion pour vos visiteurs, plus ou moins intrusives.</p>

  66. <h3>Simple lien avec détection</h3>

  67. <p>C'est la méthode la plus douce, elle permet d'afficher un message sur vos pages lorsqu'un iPhone est détecté, laissant le choix à l'utilisateur de suivre ou non le lien proposé. Si vous souhaitez la mettre en place sur votre site, il faut suivre les étapes suivantes :</p>

  68. <p>Déclarer un container prêt à accueillir votre bannière spéciale :</p>

  69. <pre><code>&lt;div id="icontainer"&gt;&lt;/div&gt;

  70. </code></pre>

  71. <p>Ajouter un bout de JavaScript qui vérifie s'il s'agit d'un iPhone ou pas :</p>

  72. <pre><code>&lt;script type="text/javascript"&gt;

  73. if(/iPhone|iPod/i.test(navigator.userAgent)){

  74.     document.addEventListener("DOMContentLoaded", function() {

  75.         document.getElementById('icontainer').innerHTML="message + lien iPheeds";

  76.     }, true)

  77. }

  78. &lt;/script&gt;

  79. </code></pre>

  80. <p>À vous d'adapter pour que ça soit visible, c'est souvent fait dans un h1 ou en tout cas bien visible et en haut de page.</p>

  81. <h3>Popup iPhone</h3>

  82. <p>Cette méthode consiste à afficher une popup iPhone à l'utilisateur, c'est la méthode que j'ai retenu ici car elle est intermédiaire et même si elle est relativement intrusive je trouve normal de poser explicitement la question à l'utilisateur.</p>

  83. <p>Cette fois plus besoin de préparer un container mais il faut tout de même un bout de JavaScript :</p>

  84. <pre><code>&lt;script type="text/javascript"&gt;

  85. (function () {

  86.     if(/iPhone|iPod/i.test(navigator.userAgent)){

  87.         var question = confirm("Voulez-vous consulter la version iPhone de ce site ?")

  88.         if (question){

  89.             window.location = "http://ipheeds.org/?ipheed=http://www.biologeek.com/data/atom/";

  90.         }

  91.     }

  92. }());

  93. &lt;/script&gt;

  94. </code></pre>

  95. <p>Vous devriez alors avoir une popup de cet ordre là :</p>

  96. <p>

  97.     <img

  98.         src="/static/david/biologeek/images/biologeek_iphone.jpg"

  99.         alt="Biologeek iPhonized"

  100.         style="margin: 0pt auto; display: block;"/>

  101. </p>

  102. 

  103. <p>Qui vous redirige vers iPheeds si vous acceptez.</p>

  104. <h3>Redirection directe</h3>

  105. <p>Je déconseille vivement cette méthode qui ne permet pas d'interagir avec le site original ce qui serait problématique dans le cas d'iPheeds vu le manque d'interactions possibles dans la version actuelle. Tiens pour la peine je la donne pas.</p>

  106. <h2>Outils</h2>

  107. <p>Je ne sais pas encore si je vais ouvrir le code mais je ne peux pas terminer sans parler de plusieurs outils que j'ai utilisé. Tout d'abord <a href="http://code.google.com/p/iui/">iUI</a> qui est la bibliothèque à ne pas manquer lorsqu'on veut faire une interface web pour l'iPhone qui respecte les standards Apple.</p>

  108. <p>Au niveau du backend, c'est propulsé avec Django mais <a href="http://pypi.python.org/pypi/shove">shove</a> et <a href="http://www.doughellmann.com/projects/feedcache/">feedcache</a> font tout le travail, et le font bien. Bon après ça dépend bien sûr de la popularité du service, si le serveur ça commence à trop chauffer j'aviserais.</p>

  109. <p>Enfin j'ai découvert <strong>deux « astuces » iPhone</strong> ce soir (après 6 mois d'utilisation quand même...), la première grâce à <a href="http://hanblog.info/blog/">Rik</a> consiste à rester appuyé sur la touche .com pour afficher d'autres extensions. La seconde, je l'ai trouvé en fouillant les paramètres, il s'agit de double taper sur la barre d'espace pour afficher ". " (point suivi d'un espace), ce qui s'avère très pratique pour tout ce qui est mails et sms.</p>

  110. <p>Bon avec tout ça j'ai pas terminé d'intégrer le super design que j'ai dans les cartons... je crois que je suis de moins en moins fan des CSS :-(.</p>

  111. <p>En tout cas, j'espère que vous apprécierez le service, les suggestions sont les bienvenues comme toujours.</p>

  112. <p><strong>[edit du 25]</strong> : le flux est maintenant <a href="http://diveintomark.org/archives/2002/05/31/rss_autodiscovery_in_python">auto-détecté</a> si vous soumettez directement l'URL de votre site.</p>

  113. <p><strong>[edit du 5 août]</strong> : nouvelle version, plus stable, j'ai finalement mis une base de données derrière.</p>

  114.       </div>

  115.     </article>

  116.     <footer>

  117.       <h6 property="schema:datePublished">— 23/07/2008</h6>

  118.     </footer>

  119.   </section>

  120.   <section>

  121.     <div>

  122.       <h3>Articles peut-être en rapport</h3>

  123.       <ul>

  124.         <li><a href="/david/biologeek/archives/20090221-son-propre-tinyurl-en-python-et-html5-avec-webpy/" title="Accès à Son propre TinyURL en Python et HTML5 avec webpy">Son propre TinyURL en Python et HTML5 avec webpy</a></li>

  125.         <li><a href="/david/biologeek/archives/20080829-enfin-un-design-pour-biologeek/" title="Accès à Enfin un design pour biologeek !">Enfin un design pour biologeek !</a></li>

  126.         <li><a href="/david/biologeek/archives/20080227-mieux-que-gratuit-le-business-model-reinvente/" title="Accès à ★ Mieux que gratuit : le business model réinventé">★ Mieux que gratuit : le business model réinventé</a></li>

  127.       </ul>

  128.     </div>

  129.   </section>

  130.   <section>

  131.     <div id="comments">

  132.       <h3>Commentaires</h3>

  133.       

  134. <div class="comment" typeof="schema:UserComments">

  135.     <p class="comment-meta">

  136.         <span class="comment-author" property="schema:creator">Kévin</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  137.     </p>

  138.     <div class="comment-content" property="schema:commentText">

  139.         <p>Vraiment intéressant le site, merci.</p>

  140.     </div>

  141. </div>

  142. <div class="comment" typeof="schema:UserComments">

  143.     <p class="comment-meta">

  144.         <span class="comment-author" property="schema:creator">Nath</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  145.     </p>

  146.     <div class="comment-content" property="schema:commentText">

  147.         <p>Bien joué !</p>

  148. 

  149. <p>Par contre, j&#39;ai relevé une petite coquille : dans la partie &quot;Lisez&quot;, le lien de retour vers la liste s&#39;appelle &quot;choisisse&quot;. :/</p>

  150.     </div>

  151. </div>

  152. <div class="comment" typeof="schema:UserComments">

  153.     <p class="comment-meta">

  154.         <span class="comment-author" property="schema:creator">michel v</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  155.     </p>

  156.     <div class="comment-content" property="schema:commentText">

  157.         <p>Sympa l&#39;idée de détecter le navigateur, mais voilà une idée supplémentaire assez triviale à implémenter : fournir un bookmarklet qui, pour n&#39;importe quelle page qui a un flux détectable, lancerait la page dans iPheeds.</p>

  158. 

  159. <p>Comme ça, tout pourrait être lu par ce biais, pas juste les pages de ceux qui en parlent à leurs visiteurs. :)</p>

  160.     </div>

  161. </div>

  162. <div class="comment" typeof="schema:UserComments">

  163.     <p class="comment-meta">

  164.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  165.     </p>

  166.     <div class="comment-content" property="schema:commentText">

  167.         <p>@Nath : Oui c&#39;est la css de iUI qui tronque, ça le fait à d&#39;autres endroits aussi. Je suis pas sûr de la bonne solution à adopter à ce sujet (la version anglaise passe mieux ;p)</p>

  168.     </div>

  169. </div>

  170. <div class="comment" typeof="schema:UserComments">

  171.     <p class="comment-meta">

  172.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  173.     </p>

  174.     <div class="comment-content" property="schema:commentText">

  175.         <p>@michel v : excellente idée, il faudrait que je m&#39;occupe de la détection automatique du flux en fonction du domaine aussi.</p>

  176.     </div>

  177. </div>

  178. <div class="comment" typeof="schema:UserComments">

  179.     <p class="comment-meta">

  180.         <span class="comment-author" property="schema:creator">Thomas</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  181.     </p>

  182.     <div class="comment-content" property="schema:commentText">

  183.         <p>&quot;consulter la version iPhone de ce site&quot; est un peu &quot;faciel&quot; sachant qu&#39;on peut juste voir ce qui est disponible sous forme de flux RSS, c&#39;est à dire les news seulement en général et que les dernières !</p>

  184. 

  185. <p>&quot;Bon avec tout ça j&#39;ai pas terminé d&#39;intégrer le super design que j&#39;ai dans les cartons... je crois que je suis de moins en moins fan des CSS :-(.&quot;</p>

  186. 

  187. <p>Un design pourquoi ? Biologeek ? :) Pourquoi moins fan des CSS, qu&#39;elle serait l&#39;alternative ?</p>

  188. 

  189. <p>Oui, je suis curieux.</p>

  190.     </div>

  191. </div>

  192. <div class="comment" typeof="schema:UserComments">

  193.     <p class="comment-meta">

  194.         <span class="comment-author" property="schema:creator">Neovov</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  195.     </p>

  196.     <div class="comment-content" property="schema:commentText">

  197.         <p>Pas mal du tout ! Bravo !</p>

  198. 

  199. <p>Bon pas terrible le nom de domaine par contre mais bon :P</p>

  200. 

  201. <p>PS : Une petite astuce iPhone (pour le firmware 2.0) : taper deux fois sur la barre de statut (en haut de l&#39;écran) pour scroller tout en haut d&#39;une page.</p>

  202.     </div>

  203. </div>

  204. <div class="comment" typeof="schema:UserComments">

  205.     <p class="comment-meta">

  206.         <span class="comment-author" property="schema:creator">NiKo</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  207.     </p>

  208.     <div class="comment-content" property="schema:commentText">

  209.         <p>Simple. Rapide. Efficace. J&#39;adore.</p>

  210. 

  211. <p>Seul reproche a priori, l&#39;absence de version anglophone (i18n enabled) du site ?</p>

  212.     </div>

  213. </div>

  214. <div class="comment" typeof="schema:UserComments">

  215.     <p class="comment-meta">

  216.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  217.     </p>

  218.     <div class="comment-content" property="schema:commentText">

  219.         <p>@Thomas : c&#39;est en effet une version allégée du site mais en même temps je lis rarement des pages et des pages sur un iPhone alors ça me semble un bon compromis. Peut-être reformuler la phrase en effet.</p>

  220. 

  221. <p>Sinon concernant les CSS j&#39;ai pas trouvé mieux mais je suis davantage attiré par le code en ce moment.</p>

  222. 

  223. <p>@Neoveov : c&#39;est assez difficile d&#39;avoir un bon .com maintenant... si tu as mieux je suis preneur. Il me fallait .fr et .org (même si finalement je n&#39;ai gardé que le .org, je voulais faire un switch de langage entre les deux mais c&#39;est probablement plus logique de se baser sur la langue de l&#39;iPhone directement).</p>

  224. 

  225. <p>Et pour l&#39;astuce en effet, c&#39;était même là avant non ?</p>

  226. 

  227. <p>@xave (oui j&#39;ai jeté un œil aux logs) : tu as soumis un flux erroné apparemment, ça passe bien en local sur ton flux atom.</p>

  228. 

  229. <p>@Guillaume Bizet (idem) : il faut donner l&#39;adresse de son flux directement, pas de sa home, il n&#39;y a pas encore de détection automatique.</p>

  230. 

  231. <p></p>

  232.     </div>

  233. </div>

  234. <div class="comment" typeof="schema:UserComments">

  235.     <p class="comment-meta">

  236.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  237.     </p>

  238.     <div class="comment-content" property="schema:commentText">

  239.         <p>@NiKo : essaye de changer la locale de ton téléphone ;-)</p>

  240.     </div>

  241. </div>

  242. <div class="comment" typeof="schema:UserComments">

  243.     <p class="comment-meta">

  244.         <span class="comment-author" property="schema:creator">Jean-Sébastien Mansart</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  245.     </p>

  246.     <div class="comment-content" property="schema:commentText">

  247.         <p>Merci David, je viens de le mettre en place, Frédéric m&#39;a servi de testeur et tout marche correctement.</p>

  248. 

  249. <p>Je ferais un billet pour en parler prochainement.</p>

  250.     </div>

  251. </div>

  252. <div class="comment" typeof="schema:UserComments">

  253.     <p class="comment-meta">

  254.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  255.     </p>

  256.     <div class="comment-content" property="schema:commentText">

  257.         <p>@Jean-Sébastien Mansart : je confirme ça marche nickel.</p>

  258.     </div>

  259. </div>

  260. <div class="comment" typeof="schema:UserComments">

  261.     <p class="comment-meta">

  262.         <span class="comment-author" property="schema:creator">Shen</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  263.     </p>

  264.     <div class="comment-content" property="schema:commentText">

  265.         <p>Pourquoi limiter cela aux iPhone et ne pas l&#39;étendre à tous les mobiles ? Et même plus généralement à tous les écrans réduits, en regardant la résolution par exemple, puisque le problème ne vient pas du fait que ce soit un iPhone mais bien du fait que l&#39;écran soit trop petit pour consulter le site &quot;normal&quot;.<br />On parle partout de l&#39;iPhone alors que c&#39;est juste un téléphone parmi tant d&#39;autres, se restreindre à celui là c&#39;est comme si une ville faisait une piste cyclable accessible uniquement avec une marque de vélo et pas avec les autres, alors que tout le monde pourrait en profiter...</p>

  266.     </div>

  267. </div>

  268. <div class="comment" typeof="schema:UserComments">

  269.     <p class="comment-meta">

  270.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  271.     </p>

  272.     <div class="comment-content" property="schema:commentText">

  273.         <p>@Shen : la question allait forcément être posée et j&#39;aurais dû en parler dans le billet. Ce projet était essentiellement un entrainement pour voir ce qu&#39;il était possible de faire avec une version uniquement iPhone (d&#39;où le choix d&#39;iUI).</p>

  274. 

  275. <p>Après je suis d&#39;accord qu&#39;il ne faut pas retomber dans les travers netscape vs. ie qu&#39;on a connu il y a quelques années et c&#39;est pour ça que je me suis attelé à un « bonus » et non à un site complet (qui est par ailleurs parfaitement navigable avec un iPhone).</p>

  276.     </div>

  277. </div>

  278. <div class="comment" typeof="schema:UserComments">

  279.     <p class="comment-meta">

  280.         <span class="comment-author" property="schema:creator">Kevin</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  281.     </p>

  282.     <div class="comment-content" property="schema:commentText">

  283.         <p>Ha ! Merci beaucoup ! Le plug-in iPhone pour Wordpress fonctionne justement très mal sur mon blog !</p>

  284.     </div>

  285. </div>

  286. <div class="comment" typeof="schema:UserComments">

  287.     <p class="comment-meta">

  288.         <span class="comment-author" property="schema:creator">Jean-Sébastien Mansart</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  289.     </p>

  290.     <div class="comment-content" property="schema:commentText">

  291.         <p>@Shen : complètement d&#39;accord avec toi.<br />C&#39;est une très bonne idée, mais il ne faut pas limiter à un seul terminal mobile.</p>

  292. 

  293. <p>Peut être que David implémentera bientôt une version pour d&#39;autres mobiles ;)</p>

  294. 

  295. <p>Sinon xFruits propose un outil pour faire la même chose. A partir d&#39;un flux RSS, il créé une page en XHTML 1.0 pour mobile...</p>

  296.     </div>

  297. </div>

  298. <div class="comment" typeof="schema:UserComments">

  299.     <p class="comment-meta">

  300.         <span class="comment-author" property="schema:creator">Jean-Sébastien Mansart</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  301.     </p>

  302.     <div class="comment-content" property="schema:commentText">

  303.         <p>Pour voir ce que cela donne : <a href="http://xfruits.com/jihaisse/?id=37229">http://xfruits.com/jihaisse/?id=37229</a></p>

  304. 

  305. <p>Je ne sais pas ce que ça donne sur iPhone par contre ou autre smartphone...</p>

  306.     </div>

  307. </div>

  308. <div class="comment" typeof="schema:UserComments">

  309.     <p class="comment-meta">

  310.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">23/07/2008</span> :

  311.     </p>

  312.     <div class="comment-content" property="schema:commentText">

  313.         <p>C&#39;est bien sympa tous vos tests, je pars en vacances la semaine prochaine et je ne vais pas avoir besoin d&#39;un agrégateur mobile, /all/ suffira, merci :-)</p>

  314.     </div>

  315. </div>

  316. <div class="comment" typeof="schema:UserComments">

  317.     <p class="comment-meta">

  318.         <span class="comment-author" property="schema:creator">pickupjojo</span> le <span class="comment-date" property="schema:commentTime">01/08/2008</span> :

  319.     </p>

  320.     <div class="comment-content" property="schema:commentText">

  321.         <p>Super pratique, j&#39;aime beaucoup, bravo ! :)</p>

  322.     </div>

  323. </div>

  324. <div class="comment" typeof="schema:UserComments">

  325.     <p class="comment-meta">

  326.         <span class="comment-author" property="schema:creator">Simon</span> le <span class="comment-date" property="schema:commentTime">03/08/2008</span> :

  327.     </p>

  328.     <div class="comment-content" property="schema:commentText">

  329.         <p>Ah, je me suis pris une petite 500 tiens!</p>

  330.     </div>

  331. </div>

  332. <div class="comment" typeof="schema:UserComments">

  333.     <p class="comment-meta">

  334.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">04/08/2008</span> :

  335.     </p>

  336.     <div class="comment-content" property="schema:commentText">

  337.         <p>@pickupjojo : merci !</p>

  338. 

  339. <p>@Simon : je suis curieux de savoir de quelle page il s&#39;agit.</p>

  340.     </div>

  341. </div>

  342. <div class="comment" typeof="schema:UserComments">

  343.     <p class="comment-meta">

  344.         <span class="comment-author" property="schema:creator">Audiofeeline</span> le <span class="comment-date" property="schema:commentTime">12/08/2008</span> :

  345.     </p>

  346.     <div class="comment-content" property="schema:commentText">

  347.         <p>Un service prometteur.</p>

  348.     </div>

  349. </div>

  350. <div class="comment" typeof="schema:UserComments">

  351.     <p class="comment-meta">

  352.         <span class="comment-author" property="schema:creator">jean-Christophe Courte</span> le <span class="comment-date" property="schema:commentTime">28/08/2008</span> :

  353.     </p>

  354.     <div class="comment-content" property="schema:commentText">

  355.         <p>Smak, smak, smak…!<br />Merci, merci, merci…!!<br />Il semble que mes lecteurs iphonesques sont soulagés… Grâce à vous…!</p>

  356. 

  357. <p></p>

  358.     </div>

  359. </div>

  360. <div class="comment" typeof="schema:UserComments">

  361.     <p class="comment-meta">

  362.         <span class="comment-author" property="schema:creator">Manu</span> le <span class="comment-date" property="schema:commentTime">30/01/2009</span> :

  363.     </p>

  364.     <div class="comment-content" property="schema:commentText">

  365.         <p>Génial !</p>

  366. 

  367. <p>Mais je me pose quand meme une lourde question sur l&#39;audience et la pub.</p>

  368. 

  369. <p>Comment intégrer l&#39;audience réalisée via iphone à l&#39;audience globale de mon site ? Mon audience est controlé par un javascript statcounter en footer de mon blogspot.</p>

  370. 

  371. <p>Comment intégrer mes pubs dans mon flux, et ce uniquement sur iphone ? Sur le site, elles sont en colonne de droite.</p>

  372. 

  373. <p>Par avance merci pour vos idées......</p>

  374. 

  375. <p></p>

  376.     </div>

  377. </div>

  378. <div class="comment" typeof="schema:UserComments">

  379.     <p class="comment-meta">

  380.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">30/01/2009</span> :

  381.     </p>

  382.     <div class="comment-content" property="schema:commentText">

  383.         <p>Quel est le réel intérêt d&#39;avoir ces chiffres ? En fournissant du contenu intéressant, l&#39;audience monte. L&#39;équation est aussi simple que ça.</p>

  384.     </div>

  385. </div>

  386. <div class="comment" typeof="schema:UserComments">

  387.     <p class="comment-meta">

  388.         <span class="comment-author" property="schema:creator">drole</span> le <span class="comment-date" property="schema:commentTime">08/02/2009</span> :

  389.     </p>

  390.     <div class="comment-content" property="schema:commentText">

  391.         <p>Nikel tout ça, exactement ce que je recherchais merci merci beaucoup !</p>

  392.     </div>

  393. </div>

  394. <div class="comment" typeof="schema:UserComments">

  395.     <p class="comment-meta">

  396.         <span class="comment-author" property="schema:creator">gaetan</span> le <span class="comment-date" property="schema:commentTime">09/05/2009</span> :

  397.     </p>

  398.     <div class="comment-content" property="schema:commentText">

  399.         <p>petit script simple et eficace.<br />merci</p>

  400.     </div>

  401. </div>

  402. <div class="comment" typeof="schema:UserComments">

  403.     <p class="comment-meta">

  404.         <span class="comment-author" property="schema:creator">benou</span> le <span class="comment-date" property="schema:commentTime">27/05/2009</span> :

  405.     </p>

  406.     <div class="comment-content" property="schema:commentText">

  407.         <p>Excellent.. simple et rapide..</p>

  408. 

  409. <p>Allez, une V2 avec les miniatures des images. c&#39;est jouable ??</p>

  410. 

  411. <p>Merci</p>

  412.     </div>

  413. </div>

  414. <div class="comment" typeof="schema:UserComments">

  415.     <p class="comment-meta">

  416.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">27/05/2009</span> :

  417.     </p>

  418.     <div class="comment-content" property="schema:commentText">

  419.         <p>Tiens intéressant d&#39;avoir une feature request là-dessus, qu&#39;est-ce que tu entends par images ? Les favicons ? Ou l&#39;image placée dans le feed ?</p>

  420.     </div>

  421. </div>

  422. <div class="comment" typeof="schema:UserComments">

  423.     <p class="comment-meta">

  424.         <span class="comment-author" property="schema:creator">benou</span> le <span class="comment-date" property="schema:commentTime">29/05/2009</span> :

  425.     </p>

  426.     <div class="comment-content" property="schema:commentText">

  427.         <p>En fait je pensais aux images ( 1 ou 2 ) du billet...</p>

  428. 

  429. <p>La favicon, c&#39;est vrai que ça peut être bien... <br />mais tu ne vas pas aller la chercher dans le flux...</p>

  430. 

  431. <p>Sinon, j&#39;ai l&#39;impression que le billet est tronqué certaines fois...(par ex : <a href="http://son-blog.blogspot.com/">http://son-blog.blogspot.com/</a>)</p>

  432.     </div>

  433. </div>

  434. <div class="comment" typeof="schema:UserComments">

  435.     <p class="comment-meta">

  436.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">29/05/2009</span> :

  437.     </p>

  438.     <div class="comment-content" property="schema:commentText">

  439.         <p>Ah mais ça c&#39;est blogspot qui tronque les flux et les photos (cf. <a href="http://son-blog.blogspot.com/feeds/posts/default">http://son-blog.blogspot.com/feeds/posts/default</a>), c&#39;est indépendant de ma volonté... il faut militer auprès de blogspot pour qu&#39;ils proposent des flux complets :)</p>

  440.     </div>

  441. </div>

  442. <div class="comment" typeof="schema:UserComments">

  443.     <p class="comment-meta">

  444.         <span class="comment-author" property="schema:creator">benou</span> le <span class="comment-date" property="schema:commentTime">29/05/2009</span> :

  445.     </p>

  446.     <div class="comment-content" property="schema:commentText">

  447.         <p>OK.. Je comprends mieux..</p>

  448. 

  449. <p>En fait je suis juste un peu con con... J&#39;avais oublié dans ce blog de sélectionner le flux complet...</p>

  450. 

  451. <p>Merci</p>

  452.     </div>

  453. </div>

  454. <div class="comment" typeof="schema:UserComments">

  455.     <p class="comment-meta">

  456.         <span class="comment-author" property="schema:creator">Bobby</span> le <span class="comment-date" property="schema:commentTime">04/07/2009</span> :

  457.     </p>

  458.     <div class="comment-content" property="schema:commentText">

  459.         <p>Merci pour cette article/tuto, malgré qu&#39;il a presque un an je vien seulement de le trouvé et donc de reglé mon site pro.<br />bonne continuation a biologeek.<br />cordiallement<br />Bobby</p>

  460.     </div>

  461. </div>

  462. <div class="comment" typeof="schema:UserComments">

  463.     <p class="comment-meta">

  464.         <span class="comment-author" property="schema:creator">blogs</span> le <span class="comment-date" property="schema:commentTime">11/10/2009</span> :

  465.     </p>

  466.     <div class="comment-content" property="schema:commentText">

  467.         <p>Je ne connaissais pas du tout merci bcp pour ce partage je cours tester ça de suite.</p>

  468.     </div>

  469. </div>

  470. <div class="comment" typeof="schema:UserComments">

  471.     <p class="comment-meta">

  472.         <span class="comment-author" property="schema:creator">christophe</span> le <span class="comment-date" property="schema:commentTime">14/10/2009</span> :

  473.     </p>

  474.     <div class="comment-content" property="schema:commentText">

  475.         <p>Terrible,   j&#39;ai plus qu&#39;a tester. super idée  merci</p>

  476.     </div>

  477. </div>

  478. <div class="comment" typeof="schema:UserComments">

  479.     <p class="comment-meta">

  480.         <span class="comment-author" property="schema:creator">Romy</span> le <span class="comment-date" property="schema:commentTime">05/11/2009</span> :

  481.     </p>

  482.     <div class="comment-content" property="schema:commentText">

  483.         <p>Excellente idée !</p>

  484.     </div>

  485. </div>

  486. <div class="comment" typeof="schema:UserComments">

  487.     <p class="comment-meta">

  488.         <span class="comment-author" property="schema:creator">Natim</span> le <span class="comment-date" property="schema:commentTime">04/01/2010</span> :

  489.     </p>

  490.     <div class="comment-content" property="schema:commentText">

  491.         <p>Super, mais ça ne semble pas fonctionner avec mon flux empirique et fait il y a un moment : http://natim.trunat.fr/flux.php </p>

  492. 

  493. <p>Pourtant feedvalidator dit qu&#39;il est bon.</p>

  494. 

  495. <p>Excellente idée,<br />A bientôt</p>

  496. 

  497. <p>Rémy</p>

  498.     </div>

  499. </div>

  500. <div class="comment" typeof="schema:UserComments">

  501.     <p class="comment-meta">

  502.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">05/01/2010</span> :

  503.     </p>

  504.     <div class="comment-content" property="schema:commentText">

  505.         <p>@Natim : je teste ça dès que j&#39;ai un peu de temps, c&#39;est étonnant.</p>

  506.     </div>

  507. </div>

  508. <div class="comment" typeof="schema:UserComments">

  509.     <p class="comment-meta">

  510.         <span class="comment-author" property="schema:creator">Yann</span> le <span class="comment-date" property="schema:commentTime">04/02/2010</span> :

  511.     </p>

  512.     <div class="comment-content" property="schema:commentText">

  513.         <p>Bonjour,</p>

  514. 

  515. <p>J&#39;ai un petit soucis car j utilise votre script avec Ipheeds. Le principe correspond totalement à ce que je souhaite faire mais cela ne marche pas comme je le voudrais.</p>

  516. 

  517. <p>en effet lorsque le message apparait &quot;voulez vous consulter la version pour iphone&quot; je clique dessus et j&#39;arrive sur la version ipheeds (donc juste avec le flux RSS) mais pas au format iphone, c&#39;est écrit en petit.</p>

  518. 

  519. <p>par contre si je vais directement sur la page <a href="http://ipheeds.org/?ipheed=http://ajph.free.fr/rss/">http://ipheeds.org/?ipheed=http://ajph.free.fr/rss/</a></p>

  520. 

  521. <p>pas de problème le site s&#39;affiche correctement.</p>

  522. 

  523. <p>J&#39;ai testé plusieurs scripts et solution mais toujours le même problème. </p>

  524. 

  525. <p>Auriez vous une solution dans vos cartons ?</p>

  526. 

  527. <p>Merci pour vos réponses</p>

  528.     </div>

  529. </div>

  530. <div class="comment" typeof="schema:UserComments">

  531.     <p class="comment-meta">

  532.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">04/02/2010</span> :

  533.     </p>

  534.     <div class="comment-content" property="schema:commentText">

  535.         <p>@Yann : je n&#39;arrive pas à reproduire ton problème, ton site sur iPheeds marche très bien sur mon iPhone lorsque je viens de ajph.free.fr Est-ce que tu as toujours ce problème ?</p>

  536.     </div>

  537. </div>

  538. <div class="comment" typeof="schema:UserComments">

  539.     <p class="comment-meta">

  540.         <span class="comment-author" property="schema:creator">Yann</span> le <span class="comment-date" property="schema:commentTime">04/02/2010</span> :

  541.     </p>

  542.     <div class="comment-content" property="schema:commentText">

  543.         <p>Merci pour votre réponse,</p>

  544. 

  545. <p>J&#39;ai une petite idée du problème mais pas la solution pour le réparer.</p>

  546. 

  547. <p>En fait, le problème se pose quand on va sur <a href="http://www.ajph.fr">www.ajph.fr</a>, là, le message pour le redirection vers la version iphone s&#39;affiche, ce qui nous renvoie vers <a href="http://ipheeds.org/?ipheed=http://ajph.free.fr/rss/">http://ipheeds.org/?ipheed=http://ajph.free.fr/rss/</a></p>

  548. 

  549. <p>mais dans un format normal et non compatible pour iphone...</p>

  550. 

  551. <p>Car les visiteurs du site ne sont pas taper dans leur navigateur l&#39;adresse en free.fr, plus longue et moins agréable.</p>

  552. 

  553. <p>auriez vous une solution s&#39;il vous plait :)</p>

  554.     </div>

  555. </div>

  556. <div class="comment" typeof="schema:UserComments">

  557.     <p class="comment-meta">

  558.         <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">04/02/2010</span> :

  559.     </p>

  560.     <div class="comment-content" property="schema:commentText">

  561.         <p>En effet, mets plutôt le check js au niveau de ajph.fr et non ajph.free.fr, ça permettra de ne pas rester dans la frame lorsque ça ouvre ipheeds à mon avis. Enfin à vérifier :-)</p>

  562.     </div>

  563. </div>

  564. <div class="comment" typeof="schema:UserComments">

  565.     <p class="comment-meta">

  566.         <span class="comment-author" property="schema:creator">Yann</span> le <span class="comment-date" property="schema:commentTime">04/02/2010</span> :

  567.     </p>

  568.     <div class="comment-content" property="schema:commentText">

  569.         <p>même resultat, j&#39;ai mis le javascript ds le index.html de ajph.fr et supprimer la détection dans le template de ajph.free.fr et l&#39;affichage se fait de la même manière !</p>

  570. 

  571. <p>je désespère...</p>

  572.     </div>

  573. </div>

  574. <div class="comment" typeof="schema:UserComments">

  575.     <p class="comment-meta">

  576.         <span class="comment-author" property="schema:creator">Yann</span> le <span class="comment-date" property="schema:commentTime">04/02/2010</span> :

  577.     </p>

  578.     <div class="comment-content" property="schema:commentText">

  579.         <p>j&#39;ai réussi !!</p>

  580. 

  581. <p>j&#39;ai annulé la redirection en frame su 1&amp;1 et fais la redirection en JS dans le nom de domaine ajph.fr</p>

  582. 

  583. <p>ça me pose encore un petit soucis, que se passe t il si javascript n est pas actif sur le navigateur des clients &amp; la redirection ne se fait plus dans une frame et donc on voit le domaine source ajph.free.fr</p>

  584.     </div>

  585. </div>

  586. <div class="comment" typeof="schema:UserComments">

  587.     <p class="comment-meta">

  588.         <span class="comment-author" property="schema:creator">Maison</span> le <span class="comment-date" property="schema:commentTime">19/05/2010</span> :

  589.     </p>

  590.     <div class="comment-content" property="schema:commentText">

  591.         <p>Bonjour, je vous félicite pour ce service combien utile et toujours d&#39;actualité. Le code fonctionne bien pour mon site en HTML. J&#39;ai bookmarqué cet article du service Ipheeds. Merci</p>

  592.     </div>

  593. </div>

  594. <div class="comment" typeof="schema:UserComments">

  595.     <p class="comment-meta">

  596.         <span class="comment-author" property="schema:creator">live feeds</span> le <span class="comment-date" property="schema:commentTime">08/07/2010</span> :

  597.     </p>

  598.     <div class="comment-content" property="schema:commentText">

  599.         <p>On parle partout de l&#39;iPhone alors que c&#39;est juste un téléphone parmi tant d&#39;autres, se restreindre à celui là c&#39;est comme si une ville faisait une piste cyclable accessible uniquement avec une marque de vélo et pas avec les autres, alors que tout le monde pourrait en profiter...</p>

  600.     </div>

  601. </div>

  602. <div class="comment" typeof="schema:UserComments">

  603.     <p class="comment-meta">

  604.         <span class="comment-author" property="schema:creator">Franck Melka</span> le <span class="comment-date" property="schema:commentTime">24/09/2010</span> :

  605.     </p>

  606.     <div class="comment-content" property="schema:commentText">

  607.         <p>Magnifique travail</p>

  608. 

  609. <p>Une seule question: dans les flux sur blogspot on voit les images du post ( la première ), pourquoi ne les voit on pas avec Ipheeds.</p>

  610. 

  611. <p>Ce n&#39;est qu&#39;une petite suggestion pour que ce soit parfait.</p>

  612. 

  613. <p>Merci encore</p>

  614. 

  615.     </div>

  616. </div>

  617. <div class="comment" typeof="schema:UserComments">

  618.     <p class="comment-meta">

  619.         <span class="comment-author" property="schema:creator">Stéphane</span> le <span class="comment-date" property="schema:commentTime">21/10/2010</span> :

  620.     </p>

  621.     <div class="comment-content" property="schema:commentText">

  622.         <p>Eh bien, moi qui fustigeait parce mon I-phone ne me proposait que le .com, je suis bluffé (eh oui je viens de tester et ca fonctionne). Après un an de bons et loyaux services, j&#39;en découvre encore. La double frappe sur la barre espace... je connaissais pas non plus. Pour le script avec Ipheeds, j&#39;ai testé sur un de mes blogs en construction et je dirais que c&#39;est pas concluant pour le moment, va falloir bidouiller un peu. En tous cas, merci pour toutes ces infos.</p>

  623.     </div>

  624. </div>

  625. <div class="comment" typeof="schema:UserComments">

  626.     <p class="comment-meta">

  627.         <span class="comment-author" property="schema:creator">After Work</span> le <span class="comment-date" property="schema:commentTime">09/12/2010</span> :

  628.     </p>

  629.     <div class="comment-content" property="schema:commentText">

  630.         <p>Excellent ! j&#39;ai testé avec mon flux XML et ca fonctionne c&#39;est une excellente solution pour avoir une version iPhone très facilement... en quelques clics et c&#39;est qd meme plus sympa pour lire sur un iphone<br />mais en effet il faut prévoir pour tous les mobiles <br />merci en tout cas</p>

  631.     </div>

  632. </div>

  633. 

  634.     </div>

  635.   </section>

  636. 

  637.     

  638.     <footer>

  639.       <nav>

  640.         <p>

  641.           <small>

  642.             Je réponds quasiment toujours aux <a href="m&#x61;ilto:d&#x61;vid%40l&#x61;rlet&#46;fr" title="Envoyer un email">emails</a> (<a href="/david/signature/" title="Ma signature actuelle avec possibilité de chiffrement">signés</a>) et vous pouvez me rencontrer à Montréal. <span class="more-infos">N’hésitez pas à <a href="/david/log/" title="Être tenu informé des mises à jour">vous abonner</a> pour être tenu informé des publications récentes.</span>

  643.           </small>

  644.         </p>

  645.       </nav>

  646.     </footer>

  647.     

  648.   </div>

  649.   

  650.   <script src="/static/david/js/larlet-david-3ee43f.js" data-no-instant></script>

  651.   

  652.   <script data-no-instant>InstantClick.init()</script>

  653.   

  654. </body>

  655. </html>