Arrêter le codage denim: 10 conseils pour améliorer la qualité des thèmes et des plugins WordPress

Sécurité sur le chantier. Ici, je vais examiner en détail les implications de chaque méthode, puis donner 10 conseils pour m’assurer que votre code est de haute qualité.
La première règle de tout code conçu pour être utilisé dans un navigateur Web est qu’il devrait répondre à ces critères. Si vous n’êtes pas familier avec les normes Web du W3C, faites – le. Maintenant. Vérifiez que votre code est conforme aux normes et que le Code conforme aux normes du validateur W3C fonctionne correctement dans les navigateurs modernes, y compris les appareils mobiles et les lecteurs d’écran. Il utilisera efficacement le Code couvert par la norme (y compris HTML et CSS, mais pas PHP ou JavaScript), en omettant les balises non recommandées ou hautement expérimentales (ou en fournissant un repli).
Certains des aspects les plus importants d’un Code conforme aux normes sont: l’utilisation du Code sémantique HTML5 (si vous n’avez pas encore utilisé HTML5, il est intéressant de noter qu’il fonctionne bien avec wordpress). Construire correctement les balises, utiliser l’arborescence des documents selon les normes et utiliser correctement les éléments Et . Évitez d’utiliser des classes ou des id inutiles dans la mesure du possible. Utilisez CSS au lieu de HTML pour la représentation (y compris la mise en page sans table). Assurez – vous que les images faisant partie du contenu sont encodées en HTML et que les images décoratives sont encodées en CSS. Compatibilité entre l’appareil et le navigateur. Utilisez correctement l’élément titre: n’améliorez pas le référencement en plaçant les titres dans le mauvais ordre, comme l’un de mes clients l’a essayé! Assurez – vous que votre code est accessible: Nous en discuterons dans un post ultérieur. Si vous expérimentez de nouvelles fonctionnalités HTML et CSS, cela ne devrait pas vous empêcher de le faire, en particulier dans votre projet, mais assurez – vous qu’elles ne sont pas nécessaires pour le flux de page et qu’elles fournissent un retour en arrière. Cependant, si
Ou les codes sont conçus pour être rendus publics et je ne recommande pas leur utilisation.
Pour vérifier que le Code est validé, utilisez les outils de validation HTML et CSS du W3C. En plus de la norme W3C, WordPress a son propre ensemble de normes de codage à respecter et votre code doit être de bonne qualité. Ces normes comprennent les normes PHP, HTML, css et JavaScript. Les normes PHP incluent l’utilisation de balises PHP persistantes (par exemple. Au contraire. ). Utilisez des guillemets simples et doubles. Indents et accolades. Utilisez des espaces après les virgules, mais supprimez – les à la fin de la ligne. Utilisez la fonction pour accéder à la base de données. Spécifiez l’accord. Lisibilité du Code. Les normes de codage WordPress vous aideront à améliorer la qualité de votre code. Il est également important de savoir quelles fonctionnalités, crochets et classes vous devriez utiliser dans votre code et quelles fonctionnalités, crochets et classes ont été dépréciés ou incorrects.
Si vous n’êtes pas sûr que le code utilisé est correct ou approprié, il suffit de vérifier les normes de codage les plus récentes dans Codex. La norme HTML couvre tous les aspects de la norme W3C: Si votre code est conforme à la norme, il devrait être conforme à la norme WordPress HTML. Les normes CSS WordPress incluent: Structure: rendre les feuilles de style lisibles. Sélecteurs: ne les qualifiez plus (par exemple, utilisez.container au lieu de div.container), soulignez avoid et majuscules. Propriétés: combine des propriétés similaires. Syntaxe: utilisez correctement les espaces, les points – virgules et les points – virgules. Requêtes moyennes: utilisez des tirets et groupez – les au bas de la Feuille de style. Enfin, les normes Javascript, y compris:
Pour faciliter la lecture, vous pouvez utiliser librement des espaces, même autour des éléments et des paramètres. La Déclaration d’un objet long doit être divisée en plusieurs lignes. Utilisez toujours un point – virgule. Utilisez des tirets et des sauts de ligne pour améliorer la lisibilité.
N’écrivez pas de code sans détruire le sujet ou le plug – in. Utilisez des crochets dans le thème afin que les utilisateurs puissent ajouter du contenu supplémentaire sans casser le thème. Assurez – vous d’utiliser des sujets de démonstration et des plug – ins de fonctionnalités – Évitez la tentation d’ajouter beaucoup de fonctionnalités à votre sujet. Tim Burners Lee, inventeur du Code d’accessibilité World Network, a souligné l’accessibilité:
La force du réseau réside dans son universalité. L’accès de tous, handicapés ou non, est essentiel. L’accessibilité est l’un des principes fondamentaux de la norme W3C. Si un visiteur utilisant une technologie accessible n’a pas accès à votre code, il n’est pas validé. Si vous souhaitez mieux comprendre comment rendre votre code WordPress accessible, je vous recommande de lire la page d’accessibilité de Codex, ainsi que le blog coolfields de Graham Armfield, un spécialiste de l’accessibilité WordPress. Vous devriez également vous familiariser avec le Guide d’accessibilité du contenu Web (WCAG). Si vous soumettez un thème à la Bibliothèque plug – in WordPress, son accessibilité sera testée: si le thème n’est pas accessible, il sera suspendu du dépôt. Les critères applicables au sujet sont divisés en deux catégories: obligatoire et recommandé. Ceux – ci s’appliquent aux plug – ins et aux thèmes, et vous devriez également les fusionner dans les plug – ins. Les critères requis comprennent l’utilisation correcte de l’en – tête, y compris l’élément H1 utilisé en premier. Utilisation du rôle Aria. Chiffrer correctement le lien: utilisez un texte significatif dans le lien (au lieu de cliquer ici) et assurez – vous que le lien contient un titre. Utilisez le bon élément de contrôle (bouton, entrée ou a). Permet la navigation à l’aide du clavier, pas seulement de la souris. Assurez – vous que le style est contrasté: l’arrière – plan et les gros plans ne doivent pas être combinés avec Alt
RO. Inclure un lien « sauter au contenu » lorsque vous entrez dans la page. Utilisez l’étiquette correcte pour le module et assurez – vous que l’élément étiquette est utilisé pour chaque élément d’entrée. Les images décoratives sont codées en CSS (et non en HTML) et l’attribut ALT est toujours utilisé pour les images contenues dans l’étiquette. Les médias tels que la vidéo, l’audio ou le curseur ne doivent pas être lus automatiquement sans l’entrée de l’utilisateur. La norme recommandée est d’activer le texte extensible et d’éviter d’utiliser le même texte pour les attributs de titre et le texte visible. Internationalisation tout comme l’accessibilité, l’internationalisation (ou i18n) est une question d’inclusivité: En internationalisant votre code, vous pouvez vous assurer que les personnes qui ne parlent pas votre propre langue ne sont pas exclues de l’interaction avec vos sujets et plug – ins. I18n est de permettre la traduction de tout texte encodé dans un sujet et un plug – in que l’utilisateur peut voir et \/ ou interagir. Cela comprend le texte descriptif, le titre et le titre de l’écran de configuration, ainsi que tout champ ou élément d’entrée dans le personnalisateur de configuration ou de sujet. Le W3C fournit un guide d’internationalisation. Si votre code est logique, efficace et bien structuré (c’est – à – dire conforme aux normes de codage W3C et WordPress), cela aidera à le rendre maintenable. Codex contient de nombreuses pages sur l’internationalisation et ce tutoriel vous aidera à le comprendre. Code efficace il n’y a pas de bosses inutiles pour s’assurer que votre code fonctionne efficacement de deux façons: premièrement, il vous facilitera l’utilisation du Code par vous, vos collègues et les utilisateurs. Deuxièmement, il accélérera les sites qui utilisent votre code. Qu’est – ce qui se passe? Voici quelques conseils: Assurez – vous que votre code est aussi strict que possible pour obtenir ce dont vous avez besoin. Évitez de dupliquer le Code: utilisez un fichier contenant ou écrivez une fonction
Votre code. La documentation est essentielle, c’est pourquoi nous la mettons à la disposition des développeurs wpmu. La documentation est essentielle si vous souhaitez publier votre code au public. Il s’agit d’une exigence de la Bibliothèque de sujets et de plug – ins, qui devrait expliquer la fonctionnalité, la structure et la façon dont le Code est étendu. Documenter les actions et filtrer les crochets dans les plug – ins ou les sujets afin que les gens puissent les utiliser et fournir des informations sur les fonctionnalités et la structure des fichiers dans le Code. Code d’amélioration des performances Code d’amélioration des performances: il a l’air très impressionnant! Malheureusement, il ne vous aidera pas à fonctionner plus rapidement ou à vivre plus longtemps, mais il améliorera les performances du site qui exécute le Code. Si vous écrivez un plug – in, il ne s’agit pas d’améliorer les performances (à moins que votre plug – in ne soit conçu spécifiquement pour améliorer les performances), ni de ralentir. Votre thème devrait également tenir compte du rendement et être codé de façon à ce que les pages du site Web qui exécutent votre thème puissent être chargées le plus rapidement possible. Les façons de s’assurer que le Code ne ralentit pas la page sont de définir un style d’appel en haut de la page et un script à la fin de la page, selon l’ordre des demandes du navigateur. N’encodez pas les liens: Au lieu de cela, utilisez la bonne fonction et ils s’afficheront correctement, ce qui signifie qu’ils ne seront pas redirigés ou qu’il n’y aura pas d’erreur. Évitez d’appeler des scripts et des styles lorsque vous n’en avez pas besoin. Utilisez PHP pour appeler des images de la bonne taille dans le site de réponse au lieu de simplement les redimensionner en utilisant CSS. Vous pouvez utiliser les paramètres de taille des médias wordpress pour les images de premier plan. N’écrivez jamais de nouvelles fonctionnalités pour compléter ce que WordPress a déjà fait. Appelez les scripts correctement pour éviter de les appeler plusieurs fois. Dans le plug – in, utilisez require _ once () et include once ()
Accepter d’inclure ou de demander des documents plus d’une fois. Minimiser les requêtes http. Dans la mesure du possible, utilisez CSS plutôt que des images pour obtenir des effets graphiques. Veuillez prendre soin de stocker les données dans la page de configuration et d’utiliser la base de données de façon appropriée. Évitez d’exécuter le Code écrasé autant que possible. Évitez les redirections à moins qu’elles ne soient absolument nécessaires. Appelez le script correctement en utilisant WP _ enqueue script () Si vous suivez ces conseils et les normes de codage WordPress, votre code fonctionnera plus rapidement, ce qui signifie que le site qui l’exécute sera également plus rapide. Assurez – vous d’éviter l’enflure, car cela peut ralentir inutilement le site. Enfin et surtout, votre code doit être intrinsèquement sûr et ne pas rendre le site qui l’exécute vulnérable aux attaques. Vous trouverez plus d’informations à ce sujet dans ce billet de sécurité WordPress et sur la page WordPress Enhanced Codex, mais voici quelques conseils de base: utilisez des fonctions telles que ESC _ HTML () pour valider et désinfecter les données saisies dans l’écran de configuration. Utilisez nonce pour vous assurer que le lien n’est utilisé que si nécessaire. Si vous ou vos utilisateurs trouvez des problèmes de sécurité, surveillez votre code et mettez – le à jour rapidement. Évitez d’écrire des fichiers ou des répertoires à partir du plug – in à moins qu’il ne soit absolument nécessaire et assurez – vous de le faire en toute sécurité si nécessaire. Évitez d’extraire du Code de sources tierces, en particulier le Code exécutable interdit par le plug – in contenu dans le dépôt du plug – in. Évitez le flou du Code. Ne Collectez pas de données utilisateur sans autorisation. Conseils pour améliorer la qualité du Code les titres ci – dessus illustrent bien les principaux domaines dans lesquels vous pouvez améliorer la qualité du Co.