J'ai choisi de créer un site mobile dédié...
EN DIRECT DE LA MAISON JAUNE, maintenant optimisé pour les utilisateurs d'iOS (iPhone, iPod), Android (Samsung Galaxy), Windows mobile et Blackberry http://tv.versatiles.biz/mobile
J'ai horreur qu'on m'impose la mise en page "appareils portables" lorsque je visionne mes sites web préférés sur mon iMac...
… la vignette d'un vidéo étirée au maximum de la dimension du navigateur qui embrouille ou pixelise l'image ! Qui sait comme je suis pointilleux concernant le bon rendu croustillant des photos mis sur le net. Si vous ne me croyez pas, imaginez le temps que j'ai perdu à figurer comment rendre nette la photo de couverture de mon article Pulse qui cherchait à s'étirer sur un ratio bâtard de 1.86 ! Mais c'est pourtant le contraire que j'ai fais pour mon site dédié aux appareils mobiles mais ceci pour pallier à un problème qui a priorité sur la qualité de l'image : la visibilité réduites des écrans.
SITE MOBILE DÉDIÉ : spécifiquement pour l'écran réduit des téléphones portables
RESPONSIVE DESIGN : S'adapte à la taille d'écran selon le type d'appareil utilisé
Autre chose agaçante du responsive design, sont les polices de caractère énorme sur un desktop comme si on me qualifiait déjà de presbyte ! Ça me rappelle mes anciens sites web d'il y a quelques années. Donc j'étais moderne sans le savoir, c'est ça ? 😆
Au lieu de modifier mon site actuel dont j'aime bien l'apparence originale, j'ai choisi d'en concevoir un autre pour les appareils mobiles en excluant toutefois de l'équation les tablettes qui fonctionnaient très bien sur l'ancien site.
Mais pourquoi au juste ai-je voulu dupliquer mon site ?
C'est en partie à cause du pauvre résultat d'analyse de la console Google dans l'onglet "Ergonomie mobile" qui détectait :
- des éléments cliquables trop rapprochés
- du texte illisible, car trop petit
C'est pourquoi maintenant tout est lisible et bien espacé entre les liens cliquables : illustration aux texte clair dans la fenêtre vidéo plein écran, bouton J'aime et icones de partage plus grandes. En essayant d'épurer le design de ma page de sujet tout en gardant l'essentiel, soit le Facebook Comments Plugin supprimant mes commentaires maison (tables MySQL) ainsi que mon menu Carousel, j'ai pu gagner un peu sur le temps de chargement qui affiche un score d'efficacité de 73/100 et avoir une moyenne de 88/100 (incluant le menu accordéon) pour l'expérience de navigation user-friendly.
Quand dans un autre article LinkedIn on mentionne le problème de doublure de site créant des doublons de même contenu qui ne sont pas aimé par le système le référencement Google, je réglais ce problème avant même de le connaître en choisissant volontairement de ne pas référencer les 71 pages de sujets (en mettant noindex dans les métadonnées des pages pour mobiles) étant donné qu'elle étaient déjà indexé sur le net via mon site traditionnelle. Je fais aussi une économie d'espace disque et de travail de manutention en pointant vers le site mobile les images de pages couverture (854x480) déjà existantes sur mon site traditionnel correspondant à ces 71 pages par sujet.
Je ne condamne pas les gens à utiliser ce nouveau site jumeau car en tapant dans google sur un mobile l'url original ( tv.versatiles.biz ) ceux-ci seront immédiatement redirigés vers une page où ils pourront eux-mêmes choisir entre le site web traditionnel ou sa version adaptée au mobiles; traditionnel ou crémeuse ! 😆
La seule chose que j'impose est le mode paysage (en forçant la rotation de son téléphone de 90˚) afin d'emplir en plein écran ce qui arrivera par la suite : une vidéo de présentation qui … ne jouera pas, NON. Car la fonction de lecture automatique est IMPOSSIBLE sur un système iOS, un choix que les fabricant Apple ont fait afin de faire économiser de la bande passante à leurs clients. Même chose avec le Samsung Galaxy où c'est pire encore : on ne verra même pas de bouton PLAY ! Je vous le dis tout de suite d'avance : lorsque vous verrez la vignette du vidéo, appuyer n'importe où sur sur l'écran tactile 😰 si vous voulez que la vidéo commencera à jouer… Ouf !
Moi qui voulais faire jouer automatiquement mon petit générique d'intro de 3 secondes au moment du chargement de la page d'accueil 😩
Pour continuer ce qui a de plus en plus l'air d'une visite guidée, ma vidéo d'entrée (non automatique !) fera place à une réelle page d'accueil sous forme d'un menu accordéon (CSS3 & jQuery) idéal et pratique pour accéder à plusieurs items dans un espace réduit tout en rendant les caractères bien lisible. Ci-dessous on peut voir les catégories de classement générales en ordres alphabétiques de sujets s'ouvrant sur des sous-menus qui sont nuls autres que les sujets eux-mêmes des émissions de ma web télé.
Venez faire un tour sur ma Web TV ! ou REVISITEZ en format mobile ce talk show estivale mensuelle aux sujets inédits présentés sur un plateau de type télé en plein air.