Conformité, conception, qualité du code et inscription au marketplace des ressources de HubSpot

Les fournisseurs de ressources du marketplace doivent respecter les normes suivantes définies par HubSpot lorsqu'ils proposent des thèmes (ainsi que les modèles et modules du thème). Ces normes s'appliquent à toutes les ressources présentes sur le marketplace. 

Les fournisseurs du marketplace doivent toujours tenir à jour leurs informations de fournisseur. HubSpot se réserve le droit de supprimer ou de désapprouver toute liste de ressources lorsque les informations de fournisseur (telles que l'e-mail ou le site Web) sont inexactes, manquantes ou ne fonctionnent plus.

Pour le moment, vous pouvez uniquement soumettre des thèmes dans le marketplace des ressources. Les modèles et les modules ne peuvent être soumis que dans le cadre d'un thème. Les thèmes ne peuvent pas utiliser de fonctionnalités telles que HubDB et les fonctions sans serveur. Découvrez-en davantage sur les limites relatives aux thèmes.

Les fichiers de ressources tiers doivent être chargés sur le CDN HubSpot sauf s'ils proviennent d'une source réputée telle que JSDelivr, Google Hosted Libraries ou CDNJS. Ces ressources peuvent être ajoutées à la feuille de style à l'aide de la fonction @import.

Remarque : Si vous incluez des fichiers dans un module, vous devez utiliser les paramètres css_assets et js_assets dans votre fichier meta.json (section Fichiers liés dans Outils de conception).

Les fournisseurs du marketplace des ressources peuvent proposer jusqu'à 20 thèmes gratuits (hors thèmes soumis dans le cadre du programme Accélérateur de thème)

Toutes les ressources doivent contenir une structure de dossier appropriée et être regroupées sous un dossier « parent », qui doit décrire le listing de vos produits. Par exemple, si vous créez un thème nommé « SuperGénial » pour le marketplace, votre structure doit ressembler à l'image ci-dessous.

Lors de la création d'une URL de prévisualisation, vous devez utiliser votre propre nom de domaine. Vous ne pouvez pas utiliser le domaine fourni par HubSpot, qui a la structure suivante :
[AccountID].hs-sites.com

Voici les exigences qui doivent être respectées lors de la conception de ressources.

Vos ressources doivent s'afficher correctement aux résolutions/largeurs habituelles des téléphones portables et des ordinateurs de bureau. Cela signifie que les ressources doivent s'afficher correctement lorsqu'elles sont affichées sur les écrans mobiles et de bureau. Votre ressource ne doit pas exiger que les utilisateurs doivent faire défiler hors page (sauf si c'est le comportement prévu de la ressource) ou provoquer des résultats inattendus selon le navigateur.

 Il est recommandé de mener des tests à l'aide d'appareils physiques et via différents navigateurs, mais vous pouvez également utiliser des services tiers, tels que :

• BrowserStack
• Responsinator
• Sauce Labs

Toutes les ressources doivent être prises en charge par les navigateurs permis par HubSpot. Pour voir une liste complète, veuillez consulter cet article de la base de connaissances.

Le design doit présenter une haute qualité esthétique et être visuellement attrayant. Voici quelques exemples de mauvaise esthétique de design qui invalideraient une soumission au marketplace des ressources :

• Les designs sont trop semblables aux éléments existants : votre design ressemble énormément à un listing existant ; il pourrait être difficile de les différencier.
• Espacement, marge intérieure ou extérieure ou hauteur de ligne incohérents sur les éléments : votre design présente un espacement incohérent entre les éléments, ce qui empêche les utilisateurs de distinguer les sections ou les groupes de textes.
• Utilisation d'images inappropriées, filigranées, pixelisées ou non autorisées : votre design doit utiliser des images appropriées. Les images trouvées par le biais d'une recherche « image » dans le moteur de recherche ne sont pas concédées sous licence à des fins d'utilisation publique. Si vous cherchez des images gratuites, nous vous recommandons de lire notre article de blog sur les sites d'images gratuites.
• Utilisation de couleurs qui ne sont pas complémentaires : votre design doit contenir un jeu de couleurs esthétiquement agréable. Lorsque vous choisissez des jeux de couleurs, nous vous encourageons fortement à penser à des normes d'accessibilité afin de créer un design inclusif.
• Éléments mal alignés ou placés de façon incohérente : votre design doit avoir un flux visuel logique et ne pas causer d'encombrement visuel. Cela inclut par exemple les zones de texte flottantes qui se chevauchent involontairement dans les zones où le texte ne devrait pas être placé.

Vous devez utiliser des conventions de dénomination descriptives lors du nommage de vos ressources. Par exemple, si vous créez un module qui permet aux utilisateurs d'afficher des images dans un format de liste de galerie avec filtres :

• Bonne dénomination : galerie d'images avec filtres
• Mauvaise dénomination : galerie

Lors de la création de modèles, reportez-vous à la documentation relative à l'annotation des modèles. Vous devez utiliser l'annotation label qui contrôle le libellé que les créateurs de contenu voient lorsqu'ils choisissent un modèle de page dans le flux de création de page.

Les libellés de module, de modèle et de section ne doivent pas inclure le nom de la ressource. Par exemple, si votre thème est intitulé « Gizmo », le libellé ne peut pas contenir le nom du thème, comme « Gizmo-Slider ». 

Découvrez-en davantage sur les exigences en matière de contenu de module.

Tous les textes, images, éléments multimédias et contenus par défaut utilisés dans la ressource doivent correspondre à ce qui est annoncé sur la page de listing de ressource et sur le site de démonstration.

Par exemple, si votre listing de thème est orienté vers l'immobilier avec une démonstration de fonctionnement, l'utilisateur final doit recevoir ce thème. Si lors de l'achat, l'utilisateur final reçoit un thème axé sur la forme physique, cela serait considéré comme un abus de confiance, ce qui est inacceptable.

Il n'est pas permis de soumettre des ressources présentant différentes variantes des éléments suivants :

• Variations de couleur : les ressources identiques avec des schémas de couleur différents ne seront pas comptabilisées comme ressources uniques. Par exemple, vous ne pouvez pas soumettre une ressource avec un thème de couleur bleue, puis soumettre une version rouge de cette même ressource.  
• Mises en page de modèle : soumettre une ressource telle que « Page d'accueil avec barre à droite » et « Page d'accueil avec barre à gauche », dans laquelle la barre latérale est simplement déplacée ne justifie pas l'existence de deux instances distinctes de la même ressource.
• Variante de contenu : soumettre une ressource dont le contenu est axé sur l'éducation et soumettre la même ressource dont le contenu est axé sur l'immobilier ne justifie pas l'existence de deux instances distinctes de la même ressource.

Les ressources ne doivent pas utiliser des éléments d'un listing existant du marketplace des ressources. Toute ressource qui a été achetée/téléchargée ou qui est une version clonée d'une ressource achetée/téléchargée sur le marketplace des ressources sera rejetée. 

Lorsque vous incluez des feuilles de style ou des fichiers JavaScript dans vos thèmes, il est recommandé d'utiliser la fonction require_css et la fonction require_js. Il est recommandé de charger le JavaScript qui empêche le rendu dans le pied de page pour améliorer les performances.

Lorsque vous incluez des feuilles de style ou des fichiers JavaScript dans le module d'un thème, nous vous recommandons fortement de lier ces dépendances de fichiers au module. Découvrez-en davantage sur les exigences en matière de qualité du code des modules.

Lorsque vous appliquez des ID et des classes, vous devez utiliser des noms appropriés et suivre une convention de dénomination cohérente. Il existe de nombreuses méthodologies de convention de dénomination sur le Web. Voici quelques exemples :

• BEM : https://en.bem.info/methodology/naming-convention/
• ABEM : https://css-tricks.com/abem-useful-adaptation-bem/
• ITCSS : https://www.xfive.co/blog/itcss-scalable-maintainable-css-architecture/
  • https://www.creativebloq.com/web-design/manage-large-css-projects-itcss-101517528

Il est recommandé de ne jamais styliser votre contenu en fonction des classes générées par défaut, qui font partie de votre cadre structurel de site. Cela comprend, sans s'y limiter, la liste suivante des classes et ID générés par HubSpot sur les modèles et les modules :

Les classes générées par défaut par HubSpot sont toujours susceptibles d'évoluer. Nous vous recommandons d'utiliser des classes personnalisées, qui sont attribuées soit via les outils de conception dans les champs de classe désignés, soit via le développement local en ajoutant une classe personnalisée à vos balises d'élément.

N'incluez pas de classes ou d'ID personnalisés dans le contenu de l'éditeur de texte enrichi via l'option « Code source ». Les classes ou identifiants ajoutés via cette option sont susceptibles d'être facilement remplacés (directement ou indirectement), causant des problèmes avec votre ressource.

Votre ressource ne doit pas inclure de code ou d'éléments qui ne sont pas nécessaires à son fonctionnement. Cela comprend, sans s'y limiter :

• feuilles de style ou scripts non utilisés 
• code mis en commentaire 
• code non utilisé

Il faut distinguer le code mis en code mis en commentaire et les commentaires dans le code. Si vous fournissez un contexte dans votre code à des fins de clarification, utilisez le délimiteur de commentaires, ce qui vous permettra de commenter votre code tout en évitant que ces commentaires apparaissent dans les vues « Afficher la source » ou « Inspecter » d'une page. Voir ci-dessous pour un exemple.

Dans votre thème, tous les modules par défaut de HubSpot doivent être stylisés et doivent s'afficher correctement sur tous les modèles soumis.

Un thème, avec ses modèles et modules, ne doit pas afficher d'erreurs dans les outils de conception ou dans la console du navigateur. Voici un exemple d'erreurs à l'intérieur des outils de conception :

S'il emploie des ressources tierces, votre listing doit être chargé par HTTPS pour assurer une sécurité appropriée. De même, tout le code doit être correctement rendu lorsqu'il est visualisé sur HTTPS. Cela permet d'éviter les avertissements de contenu mitigé dans la console du navigateur et de s'assurer que tout le contenu s'affiche correctement.

Les conditions suivantes s'appliquent lorsque vous soumettez votre ressource sur le marketplace des ressources. HubSpot se réserve le droit de modifier les informations de votre soumission de listing de ressources afin qu'elles soient conformes aux exigences suivantes.

Lorsque vous nommez votre ressource, assurez-vous d'utiliser un nom unique qui l'aidera à se démarquer. Les éléments suivants ne seront pas autorisés lors du nommage de votre ressource :

• utilisation du mot « thème », « module » ou « section » pour identifier le type de ressource. Cela n'est pas nécessaire, car nous veillons à classer les ressources selon leur type. 
  • Exemple : « Exemple de thème », « Module d'accordéon simple », « Envoi d'e-mail unique »
• Le nom de votre entreprise. Les listings de ressources indiquent déjà le nom et les informations du fournisseur de ressources sur la page du listing. 
  • Exemple : « Croissance par HubSpot », « Diaporama | HubSpot », « E-mail très simple de HubSpot »
• Numéros de version. Notre marketplace utilise son propre système de gestion des versions pour les ressources publiées, qui est indiqué sur le listing de ressources. 
  • Exemple : « Croissance - 1.21 », « Croissance v2 », « Croissance 2-1 »

Découvrez-en davantage sur la dénomination des modules et les autres exigences en matière de contenu.

Les descriptions doivent résumer votre ressource et inclure les principaux arguments de vente ainsi que la façon dont votre ressource peut aider les acheteurs à atteindre leur objectif. Lorsque vous rédigez des descriptions de thèmes, vous n'avez pas besoin d'inclure une liste des modules ou modèles inclus dans le thème, car nous les listons déjà pour vous sur la page de listing de ressources.

Les images de votre ressource doivent la mettre en valeur en tant que principal sujet de l'image. Au moins 75 % du contenu d'une image devrait mettre en valeur votre ressource.

Vos images ne doivent contenir aucun des éléments suivants ci-dessous. Si c'est le cas, nous les retirerons à notre seule discrétion.

• Verbiage/slogans de marketing excessif, texte ou image de marque
  • Exemple : « Plus de 100 fonctionnalités plus une assistance !!! » ou la superposition de texte/image de marque sur l'image de votre ressource.
• Images de personnes (réelles ou fictives) posant, pointant ou tenant des éléments.
  • Exemple : utilisation d'une image d'archives d'une personne tenant un ordinateur avec votre ressource à l'écran.
• Badges et/ou bannières contenant des informations relatives aux avis et aux installations de vos ressources, aux niveaux de partenariat HubSpot ou aux badges (le cas échéant), ou à la notation des performances des sites Web. Ces types de données peuvent fluctuer et induire autrui en erreur. Si vous êtes un partenaire HubSpot et souhaitez afficher votre niveau de partenaire et/ou votre badge, assurez-vous qu'il s'agit de la version la plus récente.

Veillez à utiliser des images taille réelle de votre ressource pour montrer son apparence et son fonctionnement. Les dimensions d'image suivantes sont fortement recommandées pour la meilleure expérience de visualisation de votre listing de ressources. 

• Image vignette :
  • Taille : minimum 480 px × 360 px (rapport 4:3)
  • Formats : JPG, JPEG, PNG
• Images du thème :
  • Largeur minimale : 1 160 px
  • Formats : JPG, JPEG, PNG
• Images des fonctionnalités : 
  • Taille : minimum 480 px × 360 px (rapport 4:3)
  • Formats : JPG, JPEG, PNG
• Exemples de clients :
  • Taille : minimum 480 px × 360 px (rapport 4:3)
  • Formats : JPG, JPEG, PNG

Votre vidéo de démonstration doit présenter votre ressource en cours de fonctionnement et transmettre les cas d'utilisation appropriés. Les vidéos doivent être au format mp4. Nous recommandons d'utiliser un ratio 4:3 ou 16:9 pour une visualisation optimale.

Les titres des fonctionnalités sont affichés dans la liste du marketplace des ressources et sont l'une des premières choses que vos clients potentiels voient.

Utilisez la section des fonctionnalités pour mettre en évidence les fonctionnalités clés de votre ressource. Vous devez également expliquer comment votre ressource peut aider à résoudre certains problèmes ou cas d'utilisation pour des acheteurs potentiels. À l'intérieur de la section des fonctionnalités, vous pouvez utiliser des images de marketing pour présenter des ensembles de fonctionnalités. Par exemple, en utilisant un collage d'images présentant des styles de boutons.

HubSpot fournit un ensemble de balises par défaut à attribuer à votre thème. Si une balise particulière n'est pas disponible, vous pouvez l'ajouter.

Lorsque vous choisissez des balises de recherche pour vos ressources :

• Utilisez des balises qui reflètent avec précision la ressource listée.
• Vous ne pouvez pas utiliser des balises qui contiennent les éléments suivants :
  • Des noms d'entreprise tels que HubSpot ou Exemple d'entreprise.
  • Termes relatifs tels que « top du classement », « meilleur » ou « numéro un ».
  • Les balises qui décrivent le type de ressource comme « theme », « module » ou « e-mail », car elles sont implicites en fonction du type de ressource visualisé.
  • Tout langage grossier ou péjoratif.

Les exemples de clients (sites Web fonctionnels de vos clients) sont importants pour les clients, car ils permettent de voir comment les autres entreprises utilisent votre ressource. Cela permet aux acheteurs potentiels de se faire une idée de la façon d'utiliser votre ressource et de voir comment elle peut être personnalisée. Il est fortement recommandé de vous assurer que vos clients vous autorisent par écrit à créer un lien vers leur site Web. Si vous en faites la demande, veuillez mettre la permission écrite de votre client à disposition pour vérification.

HubSpot se réserve le droit de rejeter les ressources pour des raisons non mentionnées ci-dessus. Dans tous les cas, en cas de rejet, un ingénieur de l'assurance qualité (QA) de HubSpot fournira un feedback par e-mail.

Les ressources doivent être approuvées sous trois nouvelles soumissions ou elles seront automatiquement rejetées. 

Nos ingénieurs QA élaborent une file d'attente des ressources soumises. Les ressources qui ne respectent pas les critères de QA seront déplacées au bas de la file d'attente lorsqu'elles sont soumises à nouveau. Nous ne sommes pas non plus en mesure de fournir des informations sur la position ou le calendrier d'examen de vos ressources dans la file d'attente, en raison du volume fluctuant des ressources soumises. Suivre nos instructions pour soumettre vos ressources vous aidera à vous assurer que votre ressource soit jugée conforme à notre processus d'assurance qualité dès son premier passage. 

Les fournisseurs sont responsables de tous les codes et fichiers téléchargés. Ils doivent fournir une assistance pour leur travail pendant la durée du listing sur le marketplace s'il y a des problèmes avec leur code ou leurs fichiers.

Les fournisseurs du marketplace des ressources et leur équipe (y compris les autres membres de leur entreprise qui n'ont peut-être pas travaillé sur leur ressource) ne sont pas autorisés à évaluer leurs listings.

Les fournisseurs doivent être en mesure de fournir un reçu détaillé sur demande comportant :

• Nom du listing de ressources
• Description du listing de ressources
• Date de l'achat de la ressource
• Prix de la ressource
• Informations fiscales de TVA (le cas échéant)
• Informations sur l'entreprise du fournisseur du marketplace des ressources

HubSpot se réserve le droit de supprimer les listings de marketplace pour des raisons comprenant, sans s'y limiter :

• des bugs présents dans la ressource
• ressources tierces dans la soumission
• la ressource n'est pas compatible avec les navigateurs pris en charge par HubSpot (Section 2.1.2)
• utilisation de contenu protégé par des droits d'auteur, comme des images, des icônes, des polices, des fichiers audio et des vidéos non concédés sous licence
• des ressources qui suivent les utilisateurs sans leur consentement éclairé et explicite
• des ressources (y compris le lien vers le contenu du marketplace des ressources ou de votre démo des ressources) qui comprennent :
  • la promotion ou l'engagement à des activités illégales
  • du contenu péjoratif, dénigrant et/ou malveillant 
  • des revendications malhonnêtes ou fausses
  • du contenu offensant sur la race, la religion, l'âge, le sexe ou l'orientation sexuelle
• Les modules seront supprimés s'ils affectent d'autres éléments de la page/e-mail (voir nos exigences de modules, section 5 concernant la qualité du code)

HubSpot respecte les droits de propriété intellectuelle des tiers, et demande à ses fournisseurs de ressources de faire de même. HubSpot peut, à sa seule discrétion, suspendre l'accès ou résilier les comptes des fournisseurs de ressources qui enfreignent les droits de propriété intellectuelle d'autres personnes. Veuillez ne soumettre aucune ressource (c'est-à-dire thèmes, modèles et modules) basée sur la ressource d'un tiers, à moins que vous ayez l'autorisation d'utiliser cette ressource par le titulaire du droit d'auteur. En outre, veuillez ne pas soumettre de ressource qui incorpore les logos d'autres sociétés, à moins d'obtenir leur autorisation. Si vous achetez des ressources (individuellement ou dans le cadre d'un autre produit) via des marchés tiers et que vous les modifiez pour qu'ils fonctionnent avec les produits HubSpot, assurez-vous que vous êtes le propriétaire des droits d'auteur de la ressource ou que vous disposez d'une licence sous-jacente qui permet à la ressource d'être vendue et/ou distribuée sur des marchés tiers comme le nôtre. Dans le cas contraire, nous sommes susceptibles de ne pas approuver cette ressource. Si vous estimez que votre œuvre a été copiée d'une manière qui constitue une violation du droit d'auteur sur notre marketplace des ressources, veuillez suivre les étapes décrites dans la section Réclamations de violation du droit d'auteur sur notre page Conditions d'utilisation du site Web.

Les ressources ne doivent pas inclure d'images provenant de l'intégration de HubSpot Shutterstock.

HubSpot propose deux options de passerelle de paiement qui peuvent être connectées à votre compte fournisseur marketplace des ressources. Il s'agit de Stripe et de PayPal. HubSpot encourage fortement les fournisseurs du marketplace des ressources à utiliser la passerelle de paiement Stripe si elle est disponible dans leur pays. Si Stripe n'est pas disponible dans votre pays, nous recommandons l'utilisation de la passerelle de paiement PayPal.