Comment apprendre la conception Web à partir de vos erreurs

Le Web n'est pas constitué d'un cadre monolithique unique. Il est d'autant plus difficile d'apprendre toutes les pièces qui composent tout ce que nous voyons sur Internet en raison de sa modularité.

N'importe qui est tenu de faire des erreurs qui ralentissent le temps de développement, votre programme ou introduisent des bogues dans votre programme. Non seulement cela, mais certains types d'erreurs vous désavantagent lorsque vous cherchez un emploi.

Les meilleures pratiques existent pour garantir que le moins de problèmes possible surviennent lors de la conception de votre site Web ou de son lancement en production. Voici les cinq erreurs les plus courantes commises par les développeurs Web juniors et comment les éviter.

Trop compter sur jQuery

jQuery est de loin le framework JavaScript le plus populaire au monde. L'adopter dans votre projet dès que vous l'avez créé peut sembler tentant, mais ne soyez pas si pressé.

Bien que jQuery fournisse de nombreuses méthodes pratiques pour accélérer votre développement Web, il est important de ne pas trop l'utiliser. Les nouveaux développeurs Web font presque toujours l'erreur de comprendre les méthodes API de jQuery plutôt que leur fonctionnement en dessous.

De nombreux employeurs considèrent jQuery comme un handicap plutôt que comme un avantage, car certains développeurs ne comprennent pas du tout le fonctionnement de JavaScript .

Rien de mal à utiliser jQuery. Si vous le pouvez, habituez-vous à utiliser les méthodes JavaScript par vous-même. Ne comptez sur jQuery que pour les méthodes pratiques qui prendraient autrement un certain temps à mettre en œuvre.

Trop compter sur les frameworks CSS

Les frameworks CSS comme Semantic UI et Bootstrap peuvent faire gagner beaucoup de temps. Ils éliminent le besoin de style manuel et intègrent une conception réactive à l'intérieur de votre application.

Tout comme jQuery, cependant, il est facile de se laisser entraîner dans le cycle de ne jamais écrire son propre code CSS. À la fin de la journée, votre site aura l'air générique et à moitié fait. À l'extrême, cela pourrait même ressembler à une douzaine d'autres sites Web qui ont eu la même idée que vous.

Si vous n'êtes pas un expert dans l'écriture d'un code CSS, vous aurez la possibilité de lire des manuels, de trouver un mentor, qui vous fournira les informations dont vous avez besoin, comme un guide de recherche rédigera un document de recherche pour moi et fournira vous avec une aide bonne et qualitative. Il existe différents frameworks qui pourraient être plus intuitifs pour écrire du code.

Des frameworks comme Bootstrap existent pour vous faciliter la vie . Pour éviter une dépendance excessive, apprenez le style CSS par lui-même, apprenez à utiliser les préprocesseurs pour accélérer le développement et étudiez la théorie des couleurs pour savoir quelles couleurs vont ensemble et lesquelles ne vont pas ensemble. Une fois que vous aurez bien compris les concepts, vous réaliserez peut-être que vous n'avez même plus besoin des frameworks.

Ne pas avoir d'outil de récupération

Ne pas avoir d'outil de récupération lorsque vous en avez le plus besoin peut entraîner le crash de votre site Web et sa possible disparition. Chaque fois que vous apportez une modification à votre site Web, vous risquez qu'il ne soit pas bon. Pour vous assurer d'avoir un filet de sécurité dans lequel vous pouvez tomber, pensez à utiliser un outil de récupération, tel que WP Reset.

WP Reset est votre meilleure solution lorsque des problèmes surviennent sur votre site Web. Peut-être que le problème est de ne pas pouvoir accéder à votre administrateur WP ou de rencontrer l'écran blanc de la mort. Quoi qu'il en soit, WP Reset est là pour vous. Il est équipé d'outils de nettoyage utiles qui vous permettront de récupérer rapidement et facilement votre site Web.

De plus, vous pouvez l'utiliser pour installer rapidement tous les plugins et thèmes, ou les désactiver s'ils sont défectueux. De plus, la fonction Snapshots de WP Reset prend automatiquement un instantané de votre site Web avant d'y apporter des modifications, ce qui vous permet de récupérer cet instantané si les choses ne se passent pas comme prévu.

L'option la plus puissante fournie par ce plugin est l'option de réinitialisation nucléaire, qui vous permet de nettoyer complètement votre installation, de supprimer tous les plugins, thèmes et entrées de base de données. Cependant, ne l'utilisez que lorsque vous en avez vraiment besoin.

Oublier d'optimiser votre site pour la vitesse

L'un des effets d'une dépendance excessive à jQuery est la tendance à tomber dans l'habitude des anti-modèles. Lorsque le navigateur se charge pour la première fois, le code JavaScript et CSS doit être exécuté avant le chargement de la page, selon l'endroit où vous placez vos scripts.

Comme vous pouvez l'imaginer, avoir trop de scripts va ralentir votre site Web. Le fait d'avoir des classes CSS inutilisées augmentera la taille du bundle de votre site Web et le ralentira de la même manière.

Beaucoup va dans l'optimisation de la vitesse. Pour n'en nommer que quelques facteurs : les polices, les images, les fichiers JavaScript et CSS supplémentaires et la compression des fichiers jouent tous leur rôle. Une fois que vous les avez maîtrisés, examinez les bundlers de packages tels que Webpack et Rollup qui peuvent supprimer les classes CSS et les méthodes JavaScript inutilisées de vos fichiers.

Validation de saisie incomplète

Certaines des parties les plus importantes de tout site Web que vous créez sont les formulaires. Étant donné que c'est le seul moyen pour une personne de transmettre des informations à votre serveur, il est toujours nécessaire de procéder à des vérifications d'intégrité.

Certains des vecteurs d'attaque les plus courants sur Internet sont toujours les attaques XSS et l'injection SQL. L'erreur que les développeurs juniors ont tendance à faire est de n'avoir que la validation des entrées sur le frontend.

Toutes les validations d'entrée sont effectuées via JavaScript, ce qui est simple à désactiver. Cela dit, Kenneth Sytian de Sytian Web Developer Philippines recommande de toujours effectuer la validation des entrées à la fois sur le backend et le frontend. De plus, tous les caractères non alphanumériques doivent être échappés pour rendre les attaques par injection impossibles.

Ignorer l'importance du SEO

Il ne suffit pas de créer de beaux sites Web et de les expédier. Il est tout aussi important que les gens voient et apprécient le contenu que vous proposez. La meilleure façon d'y parvenir est d' améliorer vos connaissances en matière de référencement et sa mise en œuvre.

Le référencement est un processus long et compliqué qui nécessite une recherche constante pour rester au courant des règles du jeu en constante évolution. Avec sa portée arquée, il ne doit pas être écarté pour être fait à la fin du processus de développement.

Certaines pratiques, comme toujours avoir des balises descriptives "alt" sur vos images, doivent être activement traitées. Imaginez que vous numérisez tous vos fichiers pour rechercher les balises alt et meta lorsque vous avez déjà terminé le projet.

Ne pas avoir de favicon

Il est facile de rejeter le favicon comme étant inutile en raison de la simplicité de sa configuration, mais son existence est assez importante. Sur le Web moderne, il est courant que les utilisateurs aient plusieurs onglets ouverts pour pouvoir les visiter à nouveau plus tard. Les favicons agissent comme une sorte de signet afin que votre site soit visible d'un seul coup d'œil. L'absence d'un peut signifier que les utilisateurs perdent tout intérêt en cours de route.

Plutôt que d'en générer un vous-même dans Photoshop, la designer UX primée, Michelle Dipp, recommande d'utiliser des outils de conception graphique gratuits que vous pouvez trouver en ligne. Vous pouvez même en trouver un qui propose des modèles de favicon afin que vous puissiez créer le vôtre sans tracas.

Ignorer le responsive design

La conception réactive est l'une des choses les plus importantes qu'un site Web devrait avoir. La plupart du trafic sur Internet provient d'appareils mobiles. Ne pas avoir un site qui affiche un contenu différent en fonction de la taille de l'écran vous désavantage considérablement. C'est particulièrement vrai si vos concurrents offrent la même chose.

Une façon d'améliorer l'expérience utilisateur consiste à implémenter des éléments collants sur votre site Web. Les éléments collants sont ceux qui restent fixes sur la page pendant que l'utilisateur navigue. Lorsque les éléments sont fixes, il est plus facile d'y accéder et vous savez qu'ils sont toujours au même endroit, ce qui est essentiel lorsque vous êtes sur un téléphone mobile.

Cela étant dit, WP Sticky est le plugin parfait que vous pouvez utiliser pour créer vos éléments collants. WP Sticky vous permet de rendre autant d'éléments collants que vous le souhaitez, sans écrire une seule ligne de code ; il vous suffit de choisir votre élément directement sur l'écran.

Avec WP Sticky, vous pouvez rendre votre menu, votre en-tête, votre pied de page et bien plus encore collants. De plus, vous pouvez ajuster la position, l'opacité de l'élément et l'ajouter ou le supprimer d'un message spécifique.

En outre, c'est l'un des facteurs pris en compte par Google lors du classement des pages. Si votre page n'est pas réactive sur mobile, vous recevrez probablement quelques e-mails de la console du webmaster vous avertissant de mettre à jour votre site.

Conclusion

Une bonne conception de sites Web prend du temps. Temps de recherche, temps de travail et encore plus de temps pour s'habituer aux pratiques recommandées. Faire une erreur pendant le temps de développement n'est pas la fin du monde. Au lieu de cela, considérez tous les revers que vous rencontrez comme une expérience d'apprentissage. Améliorez vos connaissances et votre application de la conception Web appropriée en les utilisant.

–

À PROPOS DE L'AUTEUR

Becky Holton est journaliste et blogueuse sur Bestdissertation.com, meilleur service de rédaction d'essais. Elle s'intéresse aux technologies de l'éducation, à l'écriture experte et est toujours prête à soutenir les discours informatifs chez AustralianWritings. Suivez-la sur Twitter.