Roue chromatique | Modèles de couleurs. 69% des sites mobiles en responsive design sont longs à se charger. De nombreuses marques utilisent le responsive design pour créer des sites qui favorisent une bonne expérience utilisateur quelle que soit la plateforme et quel que soit l'appareil utilisé. Et pourtant, une étude vient nous apprendre que le poids des images dans les sites mobiles en responsive design pénalise lourdement le temps de chargement qui est alors inacceptable. En analysant le poids des pages, des images et les temps de chargement de 155 sites web en responsive design, incluant des sites tels que Starbucks.com, Engadget.com ou BoldandNoble.com, la société Tribilis qui a réalisé cette étude révèle que 69% de ces sites prennent 4 secondes ou plus pour se charger sur un smartphone.
Selon cette étude, il n'y aurait qu'un site sur cing (20%) parmi les sites analysés qui ont un bon délai de chargement. A contrario, 31% des sites en responsive design étudiés auraient un temps de chargement compris entre 8 et 48 secondes. La faute au poids des images. La photo, ce n’est pas que de l’image… La photo et l’image en général ont toujours été une composante essentielle des sites internet et de la construction d’une image de marque.
Avec la croissance exponentielle des débits et le taux de pénétration particulièrement important du haut débit en France, comme dans l’ensemble des sociétés occidentales, leur importance n’a fait que croître et leur utilisation s’est faite de plus en plus systématique. Que ce soit en fond de page, en diaporama, en illustration produit, à des fins éditoriales, animée ou fixe, la photo est dorénavant un élément incontournable de toute communication digitale. Nous avons assisté depuis deux ans à une émergence significative des visuels plein écran et des photos haute définition sur les sites internet (pour écran Retina, AMOLED à 350 dpi et autres AH-IPS). Des visuels plus qualitatifs mais aussi plus gourmand en bande passante. Une photo porte en son sein un nombre important de messages. La photo “éditoriale” 1. 2. La photo comme élément de séduction 1. 2. Pourquoi est-il indispensable d'avoir des photos de qualité pour vos chambres d'hôtes ?
Nous invitons aujourd’hui un photographe professionnel spécialisé dans les hôtels et les chambres d’hôtes de caractère. Je suis ainsi ravi d’accueillir Yoan Chevojon sur notre blog le temps d’un article qui soulignera l’importance d’afficher des photos de très grande qualité sur vos supports marketing. L’internet est depuis quelques années devenu l’outil incontournable pour la recherche d’une chambre d’hote, d’un gite ou encore d’un hotel. L’amélioration des réseaux de télécommunication corrélée à l’évolution des supports de recherche (ordinateurs portables, smartphones, tablettes…) permettent aujourd’hui d’accéder n’importe quand et n’importe où à une série de résultats.
Et la première chose que les internautes vont voir, que ce soit sur des Agences de Voyages en Ligne telle que Booking, des sites d’avis tel que Tripadvisor, des annuaires ou directement sur votre site, ce sont … Vos photographies. Le Manoir d’Astrée © Yoan Chevojon Cap de Castel © Yoan Chevojon. Les 5 problèmes du Responsive Web Design. Face à l’explosion de la diversité des supports mobiles et de leur utilisation, le Responsive Web Design apparaît aujourd’hui comme l’une des grandes modes du web. Le Responsive Web Design (en français : Site Web Adaptatif) est une approche visant à adapter un site internet aux supports sur lesquels il est consulté, ce en redimensionnant l’organisation des contenus (basée sur une grille).
Cette solution ne présente techniquement rien de révolutionnaire (elle existait déjà en 1999 ;) ), mais se répand de plus en plus, au point de devenir un véritable standard… Le RWD serait-il donc LA solution parfaite aux problèmes liés à la grande diversité des supports de lecture ? Ma réponse est claire : Non ! Problème 1 : Des besoins différents Tout d’abord, il est inconcevable de proposer le même contenu pour des internautes dans des situations différentes, et avec des besoins radicalement différents. Au-delà de la facilité de lecture, c’est donc l’efficacité du RWD « brut » que je remets en cause. Parallaxe et Webdesign : 10 exemples de sites. Avez vous déjà vu un site utilisant l’effet parallaxe (aussi appelé urling) ? Cette technique permet de donner une illusion de mouvement lorsque l’internaute scrolle. On voit ainsi les éléments de la page s’animer et donner une illusion de profondeur.
De ces sites se dégagent une réelle originalité et une expérience de navigation marquante pour l’internaute. Je vous propose de découvrir 10 exemples dans la suite de cet article… L’effet de profondeur peut être activer soit en scrollant soit en bougeant la souris en fonction des sites, allez voir ces 10 exemples pour mieux vous rendre compte. Milwaukee Police News Mario Kart Wii Nike JumpMan Activate drinks JanPloch Webdesigner Resolutionnim : agence digitale Digital Hands : Online brand communication Iutopi Egopop Ok Studio Si vous aussi, vous souhaitez créer un , sachez qu’il existe un plugin WordPress permettant d’avoir recours à cette technique sur le slider de votre blog (Plus d’info ici : Utiliser l’effet Parallax avec WordPress ). L'eXperience Utilisateur au cœur de la création des sites web | TahitiClic. Webmastering - Conception du système de navigation. Septembre 2015 Conception du système de navigation La structure d'un site web doit être le reflet d'une stratégie.
Des scénarios de navigation doivent être élaborés afin de pousser l'utilisateur à suivre un chemin dans le site web. Néanmoins il ne faut pas emprisonner le visiteur et le laisser libre de s'en aller ou de changer de rubrique à tout moment. Parcours visuel Des études ont montré que l'oeil de l'internaute moyen parcourt généralement la page web selon un cheminement global en « zigzag » commençant à l'angle supérieur gauche, jusqu'à l'angle inférieur droit.
La zone centrale supérieure représente ainsi un endroit particulièrement stratégique pour placer des informations. Structuration du site web La structuration du site web consiste à bâtir l'architecture globale du site web en organisant les différentes informations. Les classiques Certaines caractéristiques se retrouvent généralement d'un site web à l'autre : Logo du site web en haut à gauche.
Eléments de navigation Fil d'ariane. Boutons Call to action : 20 conseils. Incitations à l'action, ou "Call To Action" En naviguant sur le net, vous en rencontrez partout, tous les jours, tout le temps. Et pourtant, vous ne savez pas forcément tous de quoi je veux parler ! La suite, dans cet article ! Inciter, c’est gagner ! Pas forcément à tous les coups je vous l’accorde, mais tout de même, qui ne tente rien n’a rien. Les incitations à l’action sont généralement visibles sous forme de boutons du type « Acheter », ou encore « Ajouter au panier », pour ne parler que des plus courants.
Bien mis en évidence et pertinents, ces boutons permettent de convertir plus rapidement et d’inciter plus facilement les internautes de passer à l’action. . « Nos produits vous achèterez » Les « Call to action » peuvent être de deux natures : principales ou secondaires. Les incitations à l’action principales sont certainement les plus connues et que l’on rencontre le plus souvent en tant qu’internaute digne de ce nom ! Call to Action : Suivez le guide ! A chaque page son incitation Soyez clair. 7 points clés pour optimiser l'ergonomie web de votre site avant Noël. Il est à noter qu’en matière d’ergonomie web, les repères pour les internautes sont primordiaux.
Pour faciliter la navigation des internautes, il s’agit de leur fournir un fil d’Ariane ou bien un aperçu du site. Le plus souvent, les individus quittent les sites à cause d’une navigation peu intuitive et difficile.Pensez donc à rendre l’orientation sur votre site facile et agréable pour ne pas que l’internaute se perde. Il n’est agréable pour personne de ne pas trouver les informations recherchées rapidement. Une stratégie de contenu doit également être mis en place.La solution donc ?
Des repères pour l’internaute, un fil d’Ariane, des liens, des boutons de retour, des menus, des moteurs de recherche intrinsèques, des images…Il faut également savoir que l’ergonomie d’un site web aide à son référencement naturel de manière indirecte.Voilà dans cet article l’ergonomie web expliqué en 7 points clés… 1. 2. 3. 4. 5. 6. Qu’est ce qu’un moteur de recherche sur un site web? 7. 5 règles d'ergonomie, web design et e-merchansing internet. Un constat fréquent est que les sites Internet sont conçus par des chefs de projet marketing surfers hardcore du web (qui aiment se faire plaisir, avouons le aussi) pour des utilisateurs « normaux ».
Les bonnes idées se révèlent souvent être de gros flops car technologiquement discriminantes/trop avancées ou non adaptées à la cible (ex : la redoute lance la cabine d’essayage virtuelle 3D en 2008, la fonctionnalité fait rapidement plouf et est retirée du site). Sur Internet on a le souci du client, on se présente en « customer evangelist » et on est customer obsessed… C’est d’autant plus facile que la technologie permet d’atteindre un niveau de personnalisation et une interactivité exceptionnelle avec ses clients pour un coût limité. L’ergonomie web peut se définir comme l’ensemble des actions contribuant à améliorer l’expérience d’un utilisateur sur un site internet ou une application web en les rendant plus intuitifs, agréables, efficaces et pertinents. Trucs et astuces pour améliorer son taux de conversion. Comment faire un site Internet rassurant ? Ergonomie web : les mythes et légendes ont la vie dure... Malgré le travail acharné de grands ergonomes Web reconnus (Amélie Boucher et Jean-François Nogier chez nous, ou Steve Krug et Jakob Nielsen aux USA, pour ne citer qu’eux), des mythes perdurent en donnant des réponses à l’apparence facile et pratique aux profanes, tout en dépréciant notre démarche au passage.
Grâce aux ouvrages de Steve et Amélie dont je me suis inspiré pour cet article, et en y ajoutant mon expérience personnelle, je vous livre ici une courte liste de 12 légendes qui sont encore colportées régulièrement sur l’Ergonomie Web… 1. La règle des 3 clics Ergonomie web : la règle des trois clics Vous avez déjà tous entendu cette phrase : “Pour que ton site web soit facile à utiliser, l’internaute doit trouver ce qu’il veut en moins de 3 clics, sinon il se barre” ou du style… C’est l’exemple typique d’un argument vrai sur le fond mais complètement idiot sur la forme. 2. « Les clients sont stupides » Ergonomie web : “les clients sont stupides” 3.
“Round One, Fight !”