{"id":2493,"date":"2013-08-28T19:57:13","date_gmt":"2013-08-28T17:57:13","guid":{"rendered":"http:\/\/www.alphak.net\/news\/?p=2493"},"modified":"2013-08-30T22:24:04","modified_gmt":"2013-08-30T20:24:04","slug":"alphak-net-goes-mobile","status":"publish","type":"post","link":"https:\/\/www.alphak.net\/news\/2013\/08\/alphak-net-goes-mobile\/","title":{"rendered":"AlphaK.net goes mobile"},"content":{"rendered":"<p>Un des mes amis lecteurs m&rsquo;a r\u00e9cemment\u00a0fait remarquer que mon site ne proposait pas d&rsquo;interface de navigation adapt\u00e9e pour une consultation sur un \u00e9cran de t\u00e9l\u00e9phone mobile.<\/p>\n<p>J&rsquo;\u00e9tais <strong>stup\u00e9fait<\/strong>. J&rsquo;ignorais que j&rsquo;avais des lecteurs mobiles. D&rsquo;ailleurs, j&rsquo;ignorais que j&rsquo;avais des lecteurs tout court O_o&rsquo;<\/p>\n<p>Mais le verdict des stats de Google Analytics est sans appel. Alors que sur une p\u00e9riode d&rsquo;un an, l&rsquo;augmentation des visiteurs desktop atteint 50% (<em>\u00e7a peut paraitre beaucoup, mais quand on d\u00e9marre proche de 0, on atteint vachement vite +50%<\/em>), l&rsquo;augmentation des visiteurs mobiles + tablettes s&rsquo;\u00e9tablit quant \u00e0 elle \u00e0 200% sur la m\u00eame p\u00e9riode (<em>m\u00eame remarque sur la proximit\u00e9 initiale avec 0, restons les pieds sur terre<\/em>).<!--more--><\/p>\n<p>Bien qu&rsquo;il soit facile de manipuler les chiffres pour les pr\u00e9senter selon ma convenance, il faut avouer que les smartphones actuels deviennent enfin, si on prend le temps de les recharger chaque jour, un moyen acceptable de visualiser du contenu web. Vous noterez que j&rsquo;ai volontairement employ\u00e9 le terme \u00ab\u00a0acceptable\u00a0\u00bb, et non pas \u00ab\u00a0confortable\u00a0\u00bb. La mobilit\u00e9 c&rsquo;est bien beau, mais quand on utilise au quotidien un \u00e9cran 24 pouces, on a des id\u00e9es bien arr\u00eat\u00e9es sur la notion de confort visuel.<\/p>\n<p>Quoi qu&rsquo;il en soit, les mobiles et tablettes deviennent <strong>de plus en plus pr\u00e9sents<\/strong> dans notre quotidien, et ind\u00e9pendamment de toutes les critiques sur le confort visuel que je pourrais bien leur adresser, leur aspect pratique est certainement l&rsquo;une des raisons principales qui les pousse \u00e0 cette forte croissance. Une autre raison \u00e9tant selon moi la baisse fulgurante des tarifs des communications voix et data sur ce type de support au cours des 24 derniers mois, merci Xavier.<\/p>\n<p>Je ne pouvais donc pas rester les bras crois\u00e9s. J&rsquo;avais en t\u00eate ce changement depuis longtemps, mais je l&rsquo;avais toujours consid\u00e9r\u00e9 comme peu prioritaire, et donc remis \u00e0 plus tard un nombre de fois que je n&rsquo;ose plus comptabiliser. Il faut dire que j&rsquo;ai un peu souffert par le pass\u00e9 avec l&rsquo;exp\u00e9rience du mobile sur le net.<\/p>\n<p>Montons dans une DeLorean pouss\u00e9e a 88 miles \u00e0 l&rsquo;heure et revenons en arri\u00e8re avec un peu d&rsquo;histoire :<\/p>\n<p>Jadis, en ces temps recul\u00e9s, \u00e0 l&rsquo;\u00e8re lointaine du <strong>Web 1.0<\/strong>, le monde traversait une p\u00e9riode glaciaire o\u00f9 les d\u00e9bits \u00e9taient <strong>tellement bas<\/strong> que l&rsquo;on pouvait compter pendant une nuit enti\u00e8re les octets sortant du modem 28K sur les doigts d&rsquo;une seule main. Lors de cette p\u00e9riode sombre et trouble de l&rsquo;histoire d&rsquo;internet, AlphaK.net, qui ne portait m\u00eame pas ce nom \u00e0 l&rsquo;\u00e9poque, connut une pouss\u00e9e avant-gardiste, en proposant ouvertement un portail WAP accompagn\u00e9 peu apr\u00e8s par son \u00e9quivalent i-mode (ne rigolez pas, merci). Ces deux portails ont, d&rsquo;apr\u00e8s mes archives personnelles, \u00e9t\u00e9 ferm\u00e9s en 2009, apr\u00e8s avoir constat\u00e9 qu&rsquo;ils <del>\u00e9taient devenus<\/del> <ins>avaient toujours \u00e9t\u00e9<\/ins> compl\u00e8tement inutiles et infr\u00e9quent\u00e9s. La faute \u00e0 des \u00e9crans mobiles minuscules, des forfaits data \u00e0 des prix r\u00e9dhibitoires, et, il faut bien l&rsquo;avouer, du manque de contenu aussi. Bless\u00e9 en mon fort int\u00e9rieur par le go\u00fbt amer des efforts r\u00e9duits \u00e0 n\u00e9ant, j&rsquo;ai par la suite ignor\u00e9 pendant longtemps la consid\u00e9ration des appareils mobiles dans l&rsquo;\u00e9laboration de la maquette de mes sites web.<\/p>\n<p>Mais aujourd&rsquo;hui, <strong>le monde a chang\u00e9<\/strong>.<\/p>\n<p>Les navigateurs mobiles d&rsquo;aujourd&rsquo;hui ont, enfin, l&rsquo;avantage de pouvoir acc\u00e9der aux m\u00eames contenus qu&rsquo;un navigateur de bureau, la seule diff\u00e9rence r\u00e9sidant dans la taille de leur l&rsquo;\u00e9cran, et donc, du point de vue du designer web, dans les changements \u00e0 appliquer \u00e0 la <strong>pr\u00e9sentation<\/strong> des pages web afin de fournir une visualisation adapt\u00e9e sur un \u00e9cran de r\u00e9solution moins importante que celles des visiteurs dits \u00ab\u00a0classiques\u00a0\u00bb.<\/p>\n<p>D&rsquo;autre part, les technologies web ont \u00e9galement connu des <strong>avanc\u00e9es significatives<\/strong> dans ce domaine, en permettant au designer web d&rsquo;int\u00e9grer au m\u00eame endroit et de la m\u00eame mani\u00e8re les informations de pr\u00e9sentation pour les diff\u00e9rents types d&rsquo;\u00e9crans, sans avoir \u00e0 s&rsquo;infliger la torture du d\u00e9veloppement de scripts qui pour telle r\u00e9solution appliqueront tel formatage, tout en prenant en compte la d\u00e9tection des interactions avec l&rsquo;utilisateur comme par exemple le redimensionnement d&rsquo;une fen\u00eatre (en desktop) ou la rotation de l&rsquo;\u00e9cran \u00e0 90\u00b0 (en mobile). Ces technologies qui permettent de s&rsquo;affranchir de tous ces cauchemars sont regroup\u00e9es et connues sous le\u00a0 nom de <a href=\"http:\/\/fr.wikipedia.org\/wiki\/Responsive_Web_Design\" target=\"_blank\">Responsive Web Design<\/a> (RWD).<\/p>\n<div id=\"attachment_2508\" style=\"width: 220px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/cdn.alphak.net\/news\/wp-content\/uploads\/sites\/2\/2013\/08\/responsive_web_design.jpg\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-2508\" class=\"size-medium wp-image-2508\" alt=\"Preuve par l'image\" src=\"http:\/\/cdn.alphak.net\/news\/wp-content\/uploads\/sites\/2\/2013\/08\/responsive_web_design-210x300.jpg\" width=\"210\" height=\"300\" \/><\/a><p id=\"caption-attachment-2508\" class=\"wp-caption-text\">Preuve par l&rsquo;image<\/p><\/div>\n<p>Les temps ont chang\u00e9, mes erreurs pass\u00e9es sont d\u00e9sormais r\u00e9par\u00e9es. Gr\u00e2ce au RWD int\u00e9gr\u00e9 \u00e0 ce blog, les articles sont maintenant affichables sur les \u00e9crans des mobiles et tablettes de mani\u00e8re lisible et sans que cela contraigne l&rsquo;utilisateur \u00e0 scroller dans tous les sens.<\/p>\n<p>Aussi, maintenant, plus d&rsquo;excuse. Utilisateurs mobiles, l\u00e2chez-vous, il vous reste encore 136 articles \u00e0 lire (ainsi que 26 torchons du <a title=\"The dark side of the web\" href=\"http:\/\/www.alphak.net\/darkside\/\">Darkside<\/a> et 12 aventures issues du spin-off <a title=\"Ceci n'est pas un blog\" href=\"http:\/\/www.alphak.net\/seasons\/\">Seasons<\/a>). Faites p\u00e9ter les stats. Interro \u00e9crite demain. Bonne chance.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Un des mes amis lecteurs m&rsquo;a r\u00e9cemment\u00a0fait remarquer que mon site ne proposait pas d&rsquo;interface de navigation adapt\u00e9e pour une consultation sur un \u00e9cran de t\u00e9l\u00e9phone mobile.<\/p>\n<p>J&rsquo;\u00e9tais <strong>stup\u00e9fait<\/strong>. J&rsquo;ignorais que j&rsquo;avais des lecteurs mobiles. D&rsquo;ailleurs, j&rsquo;ignorais que j&rsquo;avais des lecteurs tout court O_o&rsquo;<\/p>\n<p>Mais le verdict des stats de Google Analytics est sans appel. Alors que sur une p\u00e9riode d&rsquo;un an, l&rsquo;augmentation des visiteurs desktop atteint 50% (<em>\u00e7a peut paraitre beaucoup, mais quand on d\u00e9marre proche de 0, on atteint vachement vite +50%<\/em>), l&rsquo;augmentation des visiteurs mobiles + tablettes s&rsquo;\u00e9tablit quant \u00e0 elle \u00e0 200% sur la m\u00eame p\u00e9riode (<em>m\u00eame remarque sur la proximit\u00e9 initiale avec 0, restons les pieds sur terre<\/em>).<\/p>\n\t<div class=\"post-teaser-block\">\r\n\t\t<div class=\"teaserHellip\">\r\n\t\t\t<span class=\"teaserLeft\">[<\/span><span class=\"teaserCenter\">&hellip;<\/span><span class=\"teaserRight\">]<\/span>\r\n\t\t<\/div>\r\n\t\t<div class=\"teaserText\">\r\n\t\t\t<a href=\"https:\/\/www.alphak.net\/news\/2013\/08\/alphak-net-goes-mobile\/\" title=\"AlphaK.net goes mobile\" rel=\"bookmark\"><span class=\"teaserlink\">Lire la suite de l'article&nbsp;<i class=\"fa fa-chevron-right\"><\/i><\/span><\/a>\r\n\t\t<\/div>\r\n\t\t<a class=\"teaserLink\" href=\"https:\/\/www.alphak.net\/news\/2013\/08\/alphak-net-goes-mobile\/\" title=\"AlphaK.net goes mobile\" rel=\"bookmark\"><\/a>\r\n\t<\/div>\r\n","protected":false},"author":1,"featured_media":2508,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18],"tags":[75,296,294,295,297,298],"class_list":["post-2493","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-projet-web","tag-css","tag-mobiles","tag-responsive-design","tag-rwd","tag-tablettes","tag-web-1-0"],"_links":{"self":[{"href":"https:\/\/www.alphak.net\/news\/wp-json\/wp\/v2\/posts\/2493"}],"collection":[{"href":"https:\/\/www.alphak.net\/news\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.alphak.net\/news\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.alphak.net\/news\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.alphak.net\/news\/wp-json\/wp\/v2\/comments?post=2493"}],"version-history":[{"count":17,"href":"https:\/\/www.alphak.net\/news\/wp-json\/wp\/v2\/posts\/2493\/revisions"}],"predecessor-version":[{"id":2515,"href":"https:\/\/www.alphak.net\/news\/wp-json\/wp\/v2\/posts\/2493\/revisions\/2515"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.alphak.net\/news\/wp-json\/wp\/v2\/media\/2508"}],"wp:attachment":[{"href":"https:\/\/www.alphak.net\/news\/wp-json\/wp\/v2\/media?parent=2493"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.alphak.net\/news\/wp-json\/wp\/v2\/categories?post=2493"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.alphak.net\/news\/wp-json\/wp\/v2\/tags?post=2493"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}