Procédure de nettoyage de votre code Web - Les nuls

Que vous codiez manuellement votre site Web ou que vous travailliez avec un éditeur de code / WYSIWYG, vous devez toujours vérifier l'ordre hiérarchique, la syntaxe et l'orthographe de votre code HTML, CSS, JavaScript, jQuery et autres codes de programmation. Même lorsque vous utilisez les meilleurs programmes disponibles, votre code peut à un moment donné inclure des erreurs, car vous êtes humain.

Quel que soit le soin apporté à la création d'un site, le code HTML de vos pages sera probablement surchargé de balises redondantes, de balisage inutile et de code nuisible pouvant avoir un impact négatif sur la présentation et la fonctionnalité de vos pages Web.

Beaucoup de ces erreurs se produisent souvent lorsque vous collez du contenu sur vos pages à partir d'autres sources, telles qu'un fichier Word ou Excel, un site Web, un e-mail ou un autre éditeur de code ou application. D'autres erreurs peuvent provenir d'une faute de frappe ou d'erreurs de codage qui se sont produites dans les coulisses lors du déplacement d'éléments autour de la page en cliquant et en faisant glisser ou en coupant et collant.

Un problème de code très courant est de trouver des liens hypertexte vides sur votre page, que certains éditeurs de code laissent parfois dans le code sans raison apparente lorsque vous déplacez un lien d'un endroit sur la page à un autre. Ces liens vides sont essentiellement des morceaux de code qui n'entourent aucun contenu, par exemple, ce qui signifie qu'ils n'apparaîtront pas dans le navigateur.

Comme c'est souvent le cas, un tel code supplémentaire peut ne pas être perceptible pendant la phase de construction de votre site, mais il sera souvent éveillé pendant la phase de test avant la publication.

Pour minimiser les erreurs de codage sur vos pages Web, assurez-vous d'effectuer le nettoyage du code au moins deux fois pendant la phase de construction:

1. Après avoir créé votre ou vos gabarits, nettoyez le code avant de construire l'une des pages restantes pour le site.

2. Effectuez un autre cycle de nettoyage sur toutes les pages du site à la fin de la phase de construction, avant le lancement du site.

Pour faciliter le processus de nettoyage, utilisez les outils spéciaux que votre application de codage peut recommander pour cette tâche. Dreamweaver, par exemple, propose plusieurs outils permettant d'automatiser le processus de nettoyage de tout site géré, tels qu'un outil Rechercher et remplacer, un vérificateur d'orthographe, une commande de nettoyage de Word, une commande de nettoyage de code, un outil de formatage source et un Convertir l'outil de syntaxe.

Bien que de nombreux exemples que vous trouverez ici incluent des instructions pas à pas spécifiques à Dreamweaver, la plupart des autres applications de codage peuvent avoir des outils similaires à ceux que vous pouvez utiliser pour effectuer ces tâches.

En outre, vous pouvez trouver un certain nombre d'outils en ligne pour vérifier vos pages de certaines erreurs et vous aider à identifier ces problèmes dans le code. Le seul inconvénient des outils en ligne, cependant, est que beaucoup d'entre eux vous permettent de saisir une seule URL à la fois, ce qui, bien que approfondie, peut rendre le processus de nettoyage plutôt fastidieux.

De loin, l'un des outils les plus robustes que vous trouverez dans la plupart des éditeurs de code HTML est l'outil Rechercher et remplacer. Avec cet outil unique, vous pouvez rechercher et éventuellement remplacer ou supprimer n'importe quel texte, code source ou tag spécifique sur une page entière, des pages sélectionnées, un dossier spécifié ou un site géré entier.

Supposons, par exemple, que vous réalisiez que le contenu fourni par le client contient un mot mal orthographié sur l'ensemble du site. Cet outil peut trouver cette faute d'orthographe et remplacer toutes les instances par l'orthographe correcte sur toutes les pages du site. Trucs assez puissant!

La seule chose à propos de ce type d'outil qui pourrait décourager certains concepteurs est que, souvent, ces types d'opérations globales ne peuvent généralement pas être annulées, ce qui peut être particulièrement critique lors de la modification des pages.

Par conséquent, pour vous assurer de pouvoir revenir sur des erreurs innocentes, faites une copie de sauvegarde de l'ensemble de votre site géré avant à l'aide de cet outil. De cette façon, dans le cas où quelque chose ne fonctionne pas, vous pouvez toujours rétablir votre site dans l'état dans lequel il se trouvait avant de commencer à apporter des modifications.

Après quelques semaines, lorsque vous savez que vous n'aurez plus besoin de revenir à cet état particulier du site, vous pouvez supprimer les fichiers de sauvegarde en toute sécurité.

Pour rechercher un mot ou une expression mal orthographié et le remplacer par un nouveau texte dans toutes les pages d'un site Dreamweaver géré, ouvrez le document contenant l'erreur d'orthographe et sélectionnez le mot ou la phrase mal orthographié. Choisissez ensuite Edition → Rechercher et remplacer pour ouvrir la boîte de dialogue Rechercher et remplacer.

Changer des mots et des phrases n'est qu'un exemple de la façon d'utiliser un outil aussi puissant. Vous pouvez également utiliser l'outil Rechercher et remplacer pour modifier des blocs entiers de code, remplacer les noms de fichiers sur le site et supprimer les balises et autres codes indésirables tels que les commentaires et autres annotations inutiles.