support@gozil.ma +212 8 09 89 31 12
7 astuces pour améliorer votre site m-commerce
23 Avr 2020

7 astuces pour améliorer votre site m-commerce

Les appareils mobiles ont changé la façon dont les consommateurs font leurs achats et jouent actuellement un rôle important dans le processus d’achat. En effet, vos utilisateurs s’attendent à ce que votre site de commerce électronique soit optimisée et réactif en offrant la meilleure expérience d’achat sinon ils vont simplement à quitter votre site web pour celui du concurrent.
Pour éviter que cela ne se produise, voici 7 astuces pour améliorer la convivialité de votre site m-commerce »

 

1. Soyez réactif

 

C’est un must absolu de nos jours. Une conception réactive ou un reponsive design signifie simplement que votre contenu pourra s’adapter à n’importe quel appareil, navigateur ou système d’exploitation. En effet, une page Web réactive est capable de détecter la taille et l’orientation de l’écran de votre visiteur afin que la mise en page puisse changer en conséquence.

Grâce au responsive design, l’époque de la création d’un site séparé adapté aux mobiles est révolue. Cela signifie qu’il y a moins de travail pour les développeurs et vous ne risquez pas d’être pénalisé par Google pour avoir du contenu en double, car vous n’aurez pas le même contenu sur deux sites différents

 

2. Offrez une expérience d’achat omnicanal

 

Une expérience omnicanal est tout simplement une expérience d’achat unifiée. Cela signifie que si un client a reçu un code de réduction par e-mail et place des articles dans son panier tout en utilisant son PC au travail, il pourra terminer le processus de paiement sur son smartphone ou sa tablette à son retour.

 

3. Positionnez correctement vos CTA

 

Pour augmenter l’engagement et les ventes sur votre site de e-commerce, vous devez disposer d’appels à l’action clairement visibles, en particulier d’un bouton « Ajouter au panier » bien visible. Dans la plupart des cas, ces CTA seraient placés au-dessus du pli, à savoir avant et centre.

Cependant, un article de Kissmetrics affirme que les taux de conversion les plus élevés se produisent lorsque le bouton est en dessous de la bonne quantité de copie.

Voici ce que l’article a conclu, il y’ a trois types de prospects :

  •  Les prospects pré-vendus qui veulent déjà ce que vous proposez à leur arrivée.
    Les spécificités de votre offre ne sont pas pertinentes ici – appelez immédiatement les prospects à l’action afin qu’ils puissent continuer sur leur lancée!
  • Les prospects incertains qui cherchent une offre simple et claire
    Ces prospects n’auront besoin que d’un contenu court, fort et très clair pour les convaincre de frapper cette CTA. Comme peu de contenu sera nécessaire, votre bouton devra être plus haut sur la page, comme par hasard au-dessus du pli.
  •  Les prospects incertains qui cherche une offre de valeur
    Ces prospects auront besoin d’une quantité raisonnable de contenu non seulement claires, mais aussi très bien écrit pour garder leur intérêt tout au long du CTA. Le quantité du contenu dont vous avez besoin dépendra de ce que votre prospect sait déjà, de la complexité de votre offre, de son coût, etc

 

4. Simplifiez la navigation

 

Contrairement à votre site Web, vous n’avez pas l’espace pour inclure les menus qui répertorient toutes les catégories, sections et promotions de vos magasins. Vous devrez condenser votre navigation pour la rendre plus propre et plus facile à utiliser pour les utilisateurs mobiles.
La façon la plus pratique de procéder consiste à inclure une seule icône de menu qui ouvre un menu déroulant chaque fois que vous appuyez dessus. Assurez-vous que cela est positionné de manière cohérente sur l’ensemble de votre site afin que les utilisateurs sachent toujours où il se trouve

 

5. Gardez le contenu court et doux

 

De toute évidence, les écrans des appareils mobiles sont plus petits que les PC. Pour cette raison, vous n’avez pas beaucoup d’espace pour accéder à de longues descriptions de produits, à des articles de blog verbeux ou à des centaines d’images encombrées sur votre page d’accueil.

Fournissez uniquement du contenu essentiel afin qu’il soit propre et épuré pour vos visiteurs.

 

6. Optimisez vos images.

 

Vos clients veulent pouvoir voir des images limpides de vos produits. Ils s’attendent également à ce que ces images se chargent rapidement. Pour atteindre ces deux objectifs, assurez-vous que vous utilisez des images haute résolution qui ont été recadrées et redimensionnées afin qu’elles s’adaptent à l’écran de l’appareil mobile.
Dans la plupart des cas, les tailles d’image varient de 240 x 320 à 2560 x 1440. Voici notre guide pratique qui fournit une explication plus détaillée sur comment optimiser vos images

 

7. Simplifiez vos formulaires d’inscription et d’achat

 

Nous parlons beaucoup de rendre vos formulaires d’inscription et d’achat aussi simples et rapides que possible. C’est un élément clé de votre stratégie de Design UX. C’est également la cause pour laquelle les sites de commerce électronique perdent jusqu’à 60% des conversions en compliquant les choses. S’il a déjà commencé le processus, le client est déjà convaincu. La seule façon de perdre la vente ou l’inscription est de rendre les choses trop compliqués.
Essayez alors de limiter la quantité de frappe nécessaire ; Utilisez des champs prédictifs et activez les options de remplissage automatique. Par exemple : vous pouvez ajouter des outils de défilement pour que les utilisateurs choisissent les options de date de naissance, et un système de numérotation pour montrer aux utilisateurs les étapes restantes du processus.

 

Partager
Comment optimiser les images pour le Web :
27 Mar 2020

Comment optimiser les images pour le Web :

Les images donnent vie à votre site et le mettent en valeur. Mais si elles sont si importantes, c’est aussi et surtout parce qu’elles se retiennent mieux et sont plus susceptibles de convaincre et « convertir » vos visiteurs. Cependant, des images mal choisies, trop lourdes ou mal optimisées, peuvent vous faire perdre des visiteurs.

L’optimisation des images consiste à réduire autant que possible la taille de fichier de vos images sans sacrifier la qualité, de sorte que les temps de chargement de vos pages restent court avec un design attirant et un  meilleur référencement.

Voici alors 6 astuces sur la façon d’optimiser les images pour le web ainsi que quelques autres techniques pour en tirer le meilleur profit.

 

1. Choisissez le bon format de fichier

 

Avant de commencer à modifier vos images, assurez-vous d’avoir choisi le meilleur type de fichier. Il existe plusieurs types de fichiers que vous pouvez utiliser

  • Le format JPEG (.jpg) :Les images JPEG peuvent être considérablement compressées, ce qui permet d’obtenir des images de qualité avec des fichiers de petite taille. L’inconvénient est que le format jpg ne gère pas la transparence. Il est conseillé d’utiliser le format png pour des images avec transparence.
  •  Les images GIF (.gif) sont de qualité inférieure aux images JPEG et sont utilisées pour des images plus simples, telles que des icônes et des images décoratives. Les GIF prennent également en charge l’animation.
    Pour les images et les photos complexes, les GIF ne sont pas toujours aussi attrayants. Cela est particulièrement vrai pour les grandes images.
  •  Les images PNG sont très populaires en tant qu’alternative aux GIF. Les fichiers PNG prennent en charge beaucoup plus de couleurs que les fichiers GIF et ne se dégradent pas avec le temps lors des ré-enregistrements, contrairement au format JPEG. L’inconvénient des images png est le poids des fichiers qui peut être supérieur aux .jpg.

En résumé, utilisez le .jpg pour les images de type photo, le png lorsque vous devez intégrer des photos avec de la transparence et du gif si vous voulez une image animée.

 

2. Compressez vos photos

 

La question qu’on peut légitimement se poser, c’est : quel est le poids idéal d’une image web ? La réponse dépend bien sûr de toute une série de facteurs :

  • Quel est l’objectif de votre site (si vous êtes photographe ou architecte, vous n’aurez pas les mêmes exigences qu’un consultant ou un avocat)
  •  Combien d’images voulez-vous insérer sur votre page et pour quelle utilisation (photo plein écran, plusieurs photos pour un site parallax, etc.).

Quoi qu’il en soit, même si tout est relatif, voici quelques indications :

  •  Un logo ne devrait pas peser plus de quelques ko.
  •  une image à l’intérieur d’un article de blog ne devrait pas dépasser 50-100 ko
    et plus vous ajoutez d’images à votre page, plus vous devrez veiller à ne pas l’alourdir inutilement
  •  Une image en pleine page (2000 px) atteint vite 200 ko et plus, tout dépend de vos objectifs.

L’essentiel est que la page reste agréable à regarder et se charge en moins de 5 secondes.

 

3. Nommez bien vos images

 

Nous restons toujours dans le même sujet : optimiser les images, mais là il ne s’agit d’avoir un bon rapport qualité poids d’une image, mais optimiser l’image pour qu’elle nous ramène du trafic à notre site. L’optimisation de nos images va donc optimiser automatiquement notre SEO.
Il est important d’utiliser des mots-clés pour aider Google à référencer votre page web. L’idée est donc d’utiliser des mots-clés dans le titre de l’image pour décrire l’image et pour que le robot des moteurs de recherches puisse comprendre de quoi il s’agit et d’afficher entre autres votre image dans la liste de recherche.
Et même si cette étape peut sembler fastidieuse, prenez le temps de renommer chaque fichier AVANT de le télécharger sur votre site. Après, ce ne sera plus possible.
Renommer chaque fichier vous donnera un petit avantage sur vos concurrents. Voici pourquoi :

  •  Si Google comprend vos images, il pourra les interpréter et les référencer. Vous serez donc visible sur Google Image également.
  •  Si le nom et la description de votre image sont explicites, les internautes pourront arriver sur votre site à partir d’une recherche d’image
  •  Si vous faites attention à l’usage correct des espaces, accents, etc. dans votre nom de fichier, vous évitez les erreurs 404 ou les url illisibles

 

4.  Complétez les balises et la description de vos images

 

Pour référencer correctement vos images, Voici quelques techniques SEO qui ont fait leur preuve. il convient de compléter 3 ou 4 éléments liés à chaque image.

  1.  La balise Title ou titre de la photo : C’est le seul élément obligatoire pour les CMS. Par défaut, elle reprend le nom de votre fichier image( Imaginez comme titre : dsc15968.jpg !) si vous n’avez pas changé l’url de ce fichier vous avez donc tout intérêt à créer un titre descriptif, court et pertinent  qui  les mots clés de votre page (comme l’url).
  2. La balise Alt  :fournit un texte alternatif à l’image. si l’utilisateur ne peut pas voir votre image (pour cause de connexion trop lente, d’erreur technique, ou d’utilisation d’un lecteur d’écran) cette balise est essentielle pour l’accessibilité de votre site. Elle rend l’ensemble de votre page accessible à tous (y compris aux malvoyants) en toutes circonstances.
  3.  La balise description vous permet de fournir des informations plus détaillées sur le contenu ou le contexte de l’image. Il vous permet même d’inclure un appel à l’action, comme « Acheter maintenant notre produit X pour xx Dh ».
  4.  La légende est le texte qui s’affiche sous l’image. Choisir de remplir cet élément dépend avant tout de votre parti pris graphique. La légende permet de répéter un élément clé du message, de préciser un contexte ou d’attribuer la photo.

 

5. Gérez les images “décoratives”

 

Les sites Web proposent souvent leur lot d’images décoratives, telles que des images d’arrière-plan, des boutons et des bordures. Tout ce qui n’est pas lié au produit peut probablement être considéré comme une image décorative.
Les images décoratives peuvent entraîner une taille de fichier importante et des temps de chargement lents. Par conséquent, vous devriez examiner de près vos images décoratives afin qu’elles ne compromettent pas la capacité de votre site Web à convertir les visiteurs en clients.
Voici quelques conseils pour réduire la taille des fichiers de vos images décoratives:

  • Pour les images qui forment des bordures ou des motifs simples, créez-les au format PNG-8. Vous pouvez créer de belles images d’une taille de quelques centaines d’octets seulement.
  •  Si possible, utilisez le CSS pour créer des zones colorées au lieu d’utiliser des images. Utilisez autant que possible les styles CSS pour remplacer les images décoratives.
  •  Prêtez une attention particulière aux images d’arrière-plan. Réduisez-les autant que possible en veillant à la qualité de l’image

 

6. Utilisez des sitemaps image

 

Si votre site utilise des galeries Javascript, des images pop-up ou autre, les sitemaps image vous aideront à référencer vos images sur Google.
Les crawler Web ne peuvent pas analyser les images qui ne sont pas appelées spécifiquement dans le code source de la page. Par conséquent, pour que les robots d’exploration soient informés des images non identifiées, vous devez répertorier leur emplacement dans un sitemap pour images.
Vous pouvez insérer une ligne dans votre fichier robots.txt, en indiquant le chemin d’accès à votre sitemap ou vous pouvez également envoyer le plan du site à Google à l’aide de la search console.
Google a de nombreuses recommandations pour la publication d’images , qui peuvent aider votre site Web à obtenir un meilleur classement sur les SERP (Résultats de recherche Google, Bing, etc…). En outre, vous pouvez utiliser les sitemaps de Google pour donner à Google davantage d’informations sur les images de votre site Web, ce qui peut aider Google à trouver davantage d’images que vous ne le feriez par vous-même.

 

Bonus : Quelques Outils et programmes d’optimisation d’image

 

Il existe beaucoup d’outils et de programmes, à la fois premium et gratuits, que vous pouvez utiliser pour optimiser vos images. Certains vous donnent les outils pour effectuer vos propres optimisations et d’autres font carrément le travail pour vous. Voici quelques uns :

 

Vous connaissez désormais la base de l’optimisation des images pour un bon référencement sur le web, mais il reste encore de nombreux points qui n’ont pas été abordés dans cet article. Comment optimiser ses images pour un rendu optimum sur mobile ? Votre site est-il bien responsive ?

Partager
what is caching ? and how does it work ?
05 Mar 2020

what is caching ? and how does it work ?

Your website’s performance is incredibly important. A fast site is key for providing an excellent user experience, while a slow site is often a factor in a loss of traffic. So what is Web Caching? And how can you use to improve performance and decrease loading times

 

What is web caching?

 

Web caching is storing data for in a server for future reuse, such as a copy of a web page served by a web server.
data is cached or stored the first time a user visits a page on your website and the next time a user requests the same page, a cache will serve the copy, which helps keep the origin server from getting overloaded

 

But what if my content changes?

 

 

A caching system doesn’t just consist of storing prepared HTML files, it also has a way to empty the cache (and then regenerate it) when specific conditions (such as the publishing of new content) are met.
A cache configured for WordPress would delete the cached version of the homepage and archive pages when a single post was published. It would leave all other pages — such as the about page and other posts — untouched since those would not be changed.

 

Is caching really effective?

 

We believe that an effective cache setup is the number-one thing websites can do to serve content to visitors as quickly as possible, improve both front-end and back-end load times, and reduce stress on the website’s origin server.
But a well-coded website may already load in as little as two seconds. Isn’t that fast enough? Is caching really worth it? The answer is yes. By using both browser and server caching, you can still save a lot of load times, and, when it comes to loading speed, it pays to make things as fast as possible!
Also worth keeping in mind is that, by implementing caching, you aren’t just making your website faster, you’re also making it perform better — and equipping it to bear the burden of any sudden traffic spikes more efficiently.
Just how effective is caching? According to a recent study by YUI, browser caching can increase speeds by as much as 300%!

 

Types of Web Caching

 

There are two types of web-caching: server-side caching and browser-side caching.

 

  • Browser-side caching :

 

When a web browser displays your webpage it has to load several things like your logo, your CSS file, and other resources.
What browser caching does is « remember » the resources that the browser has already loaded. When a visitor goes to another page on your website your logo, CSS files, etc. do not need to be loaded again, because the browser has them « remembered » (saved). This is the reason that the first view of a web page takes longer than repeat visits.

 

  • Server-side caching

 

Server-side caching has a similar concept to browser-side caching. The difference that we have is that the server becomes the temporary storage.
Instead of processing every request, the server takes the results of these requests and stores them. It then serves these saved results instead — making everything much faster.
You may have come across the terms ‘object cache’ and ‘full page cache’. These are both server caching methods — the full page cache is what we’ve been talking about so far.
Object caches store only bits and pieces of data, as opposed to a full page. This can be useful within your code, and when storing the result of complex operations such as the generation of a navigation menu.

 

What Type of Content Can Be Cached?

 

Although many websites cache primarily to store static objects such as images, modern solutions allow you to cash dynamic content: partially dynamic pages, and even HTML documents, which are the first pieces of information a browser must receive to begin building a web page. Below are three categories of content in relation to caching:

 

 

1. Items that are frequently cached:

 

  •  Static images
  •  Logos and brand assets
  • Stylesheets
  •  Javascript that doesn’t change often (for example, Google tracking)2Items that can be cached but are often not

 

 2.Items that can be cached but are often not:

 

  • HTML documents
  •  Javascript or other code that changes more frequently
  •  API Calls

 

3. Files that should not be cached:

 

  • User-specific data such as order history and account information
  •  Any sensitive data

 

Of the above, it is the second category which can provide the most improvement in terms of website performance. Caching images and other static objects will certainly speed up page load time, but caching items such as full HTML documents is what can supercharge a website.
HTML documents are especially important, but downloading them can create a blocker for the rest of the pages.

Keeping your website running fast is a key to success – it’s right up there with creating quality content and ensuring airtight security. Fortunately, this isn’t a difficult task if you know what techniques to use.
So If you aren’t already caching your web pages, get to it!

Partager

© 2023 Gozil. Tous les droits réservés