Bonjour, Habr!
Le code ne tolère pas la négligence, qu'il s'agisse d'algorithmes complexes de traitement des données ou de composition de newsletters par e-mail.
Après avoir reçu une lettre de l'un des grands détaillants, notre chef du service d'agencement a constaté que certains éléments étaient inégaux. L'instinct professionnel ne nous a pas permis de simplement passer, et, comme le magasin ne fait pas partie de nos clients, il a décidé de le vérifier selon notre processus de contrôle qualité de l'aménagement. Ilya Kasterin
ikasterin , chef du département de mise en page de Retail Rocket, raconte les résultats et comment voir les problèmes d'affichage au stade de développement de la newsletter.

Pour qui et pourquoi c'est important
L'affichage des lettres est important pour les boutiques en ligne, car beaucoup d'entre eux communiquent avec les clients principalement par courrier électronique. Moins la newsletter est attractive, plus il y a de désabonnements et moins de commandes.
Vous pouvez dire: «Si un magasin vend des produits de qualité à un prix abordable, les envois postaux ne sont pas si importants.» Oui c'est vrai. Cependant, les prix des postes les plus populaires sont les mêmes partout, plus ou moins, et les produits eux-mêmes sont souvent achetés auprès d'un seul fabricant. Cela est particulièrement vrai pour les hypermarchés en ligne et en partie pour un assortiment de marchés. Il s'avère donc que décide de la qualité du service, un excellent travail dans les communications par e-mail et le marketing en général. Et si quelqu'un ne se soucie pas que le texte soit tordu ou que l'espacement des lignes ne soit pas le même, un autre acheteur pensera que de telles lacunes peuvent être dans le service du magasin ou la qualité du produit, et changera d'avis du magasin pour le pire.
Comment organiser le processus de travail pour minimiser les erreurs?
Retail Rocket est une plate-forme de personnalisation pour les magasins en ligne qui aide les détaillants à établir des communications personnelles avec chaque client sur le site et dans le canal de messagerie. La plateforme de marketing par e-mail personnalisée comprend des envois de tout type et de toute complexité: des e-mails déclencheurs à la formation de campagnes automatisées intelligentes avec un contenu dynamique.
De nombreux détaillants choisissent notre plate-forme en raison du haut niveau de service et d'assistance que nous fournissons grâce à un processus de travail clairement calibré. Pour le moment, le service d'agencement a atteint (et ne va pas s'arrêter) les indicateurs suivants:
- En une journée de travail, les spécialistes effectuent en moyenne 18,1 tâches. Cela inclut à la fois le raffinement des mailings existants et l'imposition à partir de zéro de quelques dizaines de campagnes de déclenchement ou de blocs avec une logique complexe et de nombreux scénarios d'affichage pour différents segments d'utilisateurs;
- Le délai moyen pour terminer une tâche est inférieur à deux jours ouvrables (dans la plupart des cas, tout sera prêt le jour où la tâche est définie);
- La probabilité d'affichage incorrect des lettres de nos clients est pratiquement nulle.
Ce résultat a été obtenu notamment grâce à un processus de travail rationalisé pour lequel Retail Rocket utilise des tableaux kanban à Trello:
L'un des conseils du département de mise en pageAvec l'aide de tableaux kanban, toute l'équipe contrôle la tâche et voit les difficultés si elles apparaissent. L'ensemble du processus de mise en page est le suivant:
- Collecte d'informations: mises en page, textes, liens, bannières et autres informations du magasin. Il est nécessaire d'obtenir autant d'introduction que possible afin que certaines modifications n'apparaissent pas aux étapes de la mise en page et des tests, car là-bas, quelque chose changera davantage en termes de ressources.
- Disposition La base est un modèle de base universel, qui comprend toutes les réalisations et les "puces" de l'entreprise, qui peuvent être utilisées dans la conception de lettres (à leur sujet, hélas, pas aujourd'hui);
- Test. En utilisant des outils spécialisés, les lettres sont vérifiées sur presque tous les clients de messagerie, parfois nous vérifions même certains points sur de vrais appareils avec Android et iOS;
- Tester à nouveau. Vérification supplémentaire de l'affichage et du code de toutes les lettres personnellement par le chef du service de mise en page et le chef de projet de toutes les lettres;
- La tâche est terminée. Des lettres prêtes sont envoyées au gestionnaire de tâches.
Lettre d'audit
Avant de montrer quels problèmes peuvent survenir lors de la mise en page, je tiens à souligner qu'aucune solution concrète ne sera indiquée, sauf pour une chose: refaire la lettre à partir de zéro. Si vous avez plusieurs étapes avec un examen, il sera facile de trouver et de corriger les erreurs. Voici quelques conseils supplémentaires pour vous aider à améliorer votre travail:
- Planification d'un processus pour contrôler la qualité de la mise en page. Faites un remue-méninges avec vos collègues et, en fonction de votre expérience, établissez une méthodologie de test et de mise en page qui sera complétée. Cela facilitera grandement le travail à l'avenir, en particulier avec les nouveaux employés;
- En train de tester chaque lettre. Essayez de diviser la tâche en blocs, où à chaque étape il y aura un contrôle de la qualité;
- Remarque: pour que la lettre soit agréable à l'œil, il est nécessaire de surveiller le rapport entre les tailles de police, les images, ainsi que les intervalles et la césure. Cela semble simple, mais ci-dessous, vous verrez qu'un affichage incorrect n'est pas toujours évident;
- Soutenez l'innovation. Essayez d'introduire de nouvelles puces dans le travail. Jusqu'à récemment, mes collègues et moi avons ri des demandes d'insertion d'un curseur dans une lettre, mais AMP est apparu et bientôt de telles astuces deviendront un must have.
Revenons à l'audit. Nous avons testé la lettre reçue sur plusieurs clients de messagerie après avoir passé une commande pour un grand détaillant selon les normes Retail Rocket.
Commençons par regarder l'affichage des lettres sur le bureau. Essayez de trouver vous-même des erreurs de mise en page:

À première vue, la lettre est assez bien présentée, mais c'est parce que les principales erreurs sont visibles lorsque vous ouvrez la lettre sur des appareils mobiles. Bien qu'ici, vous puissiez voir plusieurs défauts.
De nombreux détaillants se limitent à vérifier sur le bureau et sont satisfaits des résultats. Mais plus de la moitié des lettres s'ouvrent sur mobile. C'est pourquoi le processus de test sur autant d'appareils et de clients de messagerie différents est si important.
Examinez plus en détail les erreurs et les inconvénients de la mise en page.
Défaut général dans toutes les lettres
Absolument tous les clients de messagerie n'affichent pas correctement les blocs de texte avec le prix, la quantité et les propriétés du produit, comme une césure incorrecte ou une police disproportionnée par rapport à l'image, mais le plus souvent, il y a des problèmes d'indentation.

Cela peut être clairement vu dans l'exemple ci-dessous: dans une carte de produit, l'affichage est correct, et dans celle ci-dessous, le texte est à différents niveaux:

Affichage sur iPhone 6 et iPhone 6+
L'image du produit est trop petite par rapport au texte et sur ce fond, la police semble énorme. Le symbole du rouble est également transféré, ce qui n'est pas très beau.
Il convient de noter: le prix et le nom du produit sont à des niveaux différents, le même problème avec les paramètres du produit sous le nom.

Affichage sur iPhone X et Pixel
L'affichage du prix ne pose aucun problème, mais, comme dans l'exemple précédent, l'image et le texte du produit sont respectivement trop petits et grands. Le prix et le nom varient également en hauteur, il en va de même pour les paramètres.
Ces problèmes se reproduisent dans Gmail sur l'iPhone 7 iPhone 7+ et iPhone SE.

Afficher sur Samsung Mail
La lettre ne s'adapte pas à la taille de l'écran, sans approximation il sera difficile de considérer les détails de la commande.

Mappage sur Lotus Notes 8.5 et Outlook 2003
Oui, certains acheteurs utilisent toujours ces expéditeurs et ne peuvent donc pas être ignorés. Dans notre cas, à la fois dans Lotus Notes 8.5 et dans Outlook 2003, la lettre s'est effondrée en raison de la taille gigantesque des images.
Toutes les images de la lettre doivent être de la taille maximale. Dans ce cas particulier, il mesure 90 pixels de haut et de large.

Résumé
Les acheteurs ne sont pas toujours conscients qu'il y a des problèmes d'espacement ou de rapport de police dans le bulletin d'information, mais cela affecte certainement la façon dont le message est perçu dans son ensemble. Malheureusement, tous les détaillants n'en tiennent pas compte. La lettre ressemblerait à quelque chose comme ça si elle passait par notre processus de mise en page:

Notre mission est d'augmenter les ventes des boutiques en ligne, nous partageons donc ouvertement nos méthodes de travail et montrons comment éviter les erreurs. Des tests minutieux pourraient identifier tous les problèmes d'affichage et les résoudre à temps.
Peut-être que la lettre après avoir passé la commande n'est pas la plus remarquable, mais s'il y a tant d'inconvénients dans une structure aussi simple, alors quelle est la probabilité que les envois de masse avec divers éléments de conception soient parfaitement constitués?
Qu'en pensez-vous? Nous attendons vos réponses et discuterons avec plaisir du sujet.