-
Il y a deux ans, j'ai commencé à m'intéresser au SEO. L'engouement pour l'apprentissage à cette époque m'a fait visiter divers forums et blogs nationaux, et utiliser toutes les méthodes dont je ne savais pas si elles étaient utiles ou inutiles dans ma pratique. Mais au fil du temps, le Deep Learning. Je me suis méfié des diverses méthodes circulant sur Internet. Lorsque les méthodes bien connues consistant à envoyer des liens, à rédiger des articles soft, à empiler des mots-clés, etc. ont été épuisées, je n'arrivais toujours pas à les battre. dans les classements et le trafic. En même temps, j'étais épuisé. J'ai également dû réfléchir aux méthodes de fonctionnement plus profondes et plus efficaces du référencement. Après d'innombrables rebondissements, je suis revenu à mon ancien domaine de « programmation et développement front-end ». ". Il semblait que du jour au lendemain, ce que je fais maintenant est devenu clair. N'est-ce pas le meilleur référencement ?
Pour être honnête, mes études sont relativement fermées. Je n'ai pas atteint l'état « le meilleur référencement n'est pas le référencement », et je n'ai pas non plus une très bonne expérience pratique en matière de référencement. Ce à quoi je pense souvent, c'est comment améliorer mon travail actuel. Intégré au SEO, si je devais donner une définition du SEO maintenant, ce serait : réseau + matériel + programme + structure du site + standards du web + contenu + personnes De nombreuses personnes sur Internet discutent du concept de « le contenu est roi ». ", mais de nombreux autres facteurs sont ignorés. Si ces facteurs sont expliqués en détail. On estime qu'un livre très épais peut être publié. Cet article veut juste partager avec vous l'impact des standards WEB sur le SEO.
Le texte commence :
Pour comprendre la relation entre les normes du Web et le référencement, vous devez d'abord comprendre ce que sont les « normes du Web ». Je suppose que vous avez consulté de nombreux documents explicatifs sur Internet, mais vous vous sentez toujours un peu confus et confus. pour apprendre sur Internet. Je vais vous copier un paragraphe, mais au final je n'arrive toujours pas à le comprendre. Pour comprendre les standards du web, il faut commencer par construire une page web de base :
Par exemple : Si je veux écrire la page Web la plus simple, je dois utiliser des balises html. Par exemple : si je veux mettre en valeur le texte, je dois utiliser la balise <strong>. Si je veux changer la couleur du texte, je le fais. Je dois ajouter une balise <font color="color" >, je veux commencer un nouveau paragraphe, je dois donc utiliser la balise < >. Je ne peux pas utiliser la balise dénuée de sens <jacu> pour souligner le texte, car il y en a. Il n'y a pas de balise de ce type et le navigateur ne peut pas l'analyser, alors l'association W3C (World Wide Web), une organisation) s'est levée et a dit aux praticiens d'Internet du monde entier : « Tout le monde a des opinions, unifions ces étiquettes, lesquelles peuvent être utilisés et lesquels ne peuvent pas être utilisés ; et ensuite chacun donnera à ces étiquettes une explication unifiée et raisonnable, afin que chacun puisse comprendre à quoi servent ces étiquettes. " Après d'innombrables discussions. En conséquence, le standard HTML 1.0 a finalement été introduit. Après des modifications et des mises à jour ultérieures, d'autres standards Web sont progressivement devenus disponibles, comme HTML 2.0. .html 4.01, le xmhtml1.0/1.1 le plus couramment utilisé dans les pages Web de tout le monde, et la norme xmhtml 2.0 qui n'a pas encore été officiellement publiée. Les mises à jour standard sont toutes compatibles avec les versions ultérieures. Lorsque nous créons des pages Web, elles sont généralement en haut. de la page web Une telle phrase :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
Cela définit en fait votre modèle de document, qui est expliqué à l'aide de la norme xhtml 1.0.
Mais plus tard, la mise en page des pages Web est devenue de plus en plus complexe. Il était impossible de créer une belle et belle page simplement en s'appuyant sur ces balises HTML. Il fallait l'aider par d'autres outils. Par exemple, je voulais compenser certains. image de 20px, ou je voulais espacer le texte de 5px, c'est vraiment difficile à réaliser en s'appuyant uniquement sur HTML. À cette époque, le W3C ne pouvait plus rester assis, alors il s'est levé et a appelé : « Définissons quelque chose de plus pour réaliser cette fonction. » Après d'innombrables discussions, la norme CSS 1.0 a été publiée. Grâce à cela, vous pouvez facilement obtenir un décalage de contenu, un espacement et d'autres effets. Après le développement, nous sommes arrivés à CSS 2.0 et CSS 3.0. Tout le monde doit suivre cette norme lors de la définition de styles avec CSS.
Plus tard, les gens ont découvert que s’appuyer uniquement sur HTML et CSS n’était toujours pas parfait. Il manque d’interaction d’interface homme-machine et ne peut pas obtenir d’effets dynamiques. Ce serait encore mieux si nous pouvions faire bouger les choses sur la page Web, c'est pourquoi le w3c a introduit la norme emascript, qui stipule l'interface du modèle objet du document. Grammaire etc Par exemple, le javascript couramment utilisé est conforme au standard emascript.
OK, maintenant tout semble parfait. Avec les normes HTML, CSS et Emascript, nous pouvons enfin créer de belles pages Web. Nous rassemblons ces normes pour former des normes Web. Alors, quels types de pages Web sont conformes aux normes Web ?
Par exemple, un morceau de code HTML s'écrit comme ceci
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html>
<tête>
<title>démo</title>
</tête>
<corps>
<p><font color="#ff0000">Contenu du texte</font><p>
<img src="x.jpg" />
<dl>
<dt><h1>Titre</h1></dt>
<dd>Contenu</dd>
<dd>Contenu</dd>
<dl>
<b>Contenu</b>
</corps>
Alors ce code est-il conforme aux standards du web ? Analysons à nouveau ces codes. Dans la première ligne, vous définissez que votre type de document est xhtml 1.0, ce qui signifie que toutes vos balises html doivent être écrites conformément à cette norme. du corps Dans une balise <p>, la balise font a été obsolète dans cette norme, et l'attribut color a également été obsolète dans cette balise, ce paragraphe n'est donc pas conforme à la norme Web. Regardons le <img>. tag à nouveau. Son L'attribut align définit l'alignement de l'image, mais l'attribut alt est manquant. Dans la norme xhtml 1.0, img doit définir l'attribut alt. Ce code n'est donc pas conforme à la norme 1.0. , dt définit le titre, La balise <h1> est imbriquée, comme défini par xhtml 1.0. L'imbrication des balises <h1> n'est pas autorisée dans les balises <dt>, elle ne répond donc pas non plus à la norme 1.0. Regardez la dernière balise <b>, Dieu merci. Cette balise est enfin conforme aux standards du web. Mais W3C l'a dit. Nous retiendrons pour l’instant la signification de cette étiquette. Il est néanmoins recommandé d’utiliser la balise <strong>, plus sémantique. Dans le nouveau standard ultérieur, nous pourrons annuler la balise <b> en tant que balise standard. Concernant les contraintes du standard HTML, merci de consulter les documents correspondants.
En parlant de ça. Je pense que tout le monde comprend. Cette page n'est même pas conforme au standard xmhtml 1.0, elle n'est donc certainement pas conforme au standard web. Quant à savoir si elle est conforme au standard web, tout dépend de la version que vous avez définie. Mais ce code peut être analysé normalement. le navigateur, car nous l'avons mentionné ci-dessus. Comme je l'ai dit, les standards sont tous compatibles, mais ils ne sont tout simplement pas conformes aux standards que vous définissez maintenant. Alors, comment puis-je rendre ce code conforme à mes standards Web ? Il n'y a que deux manières. 1. Abaissez le niveau de votre modèle de document (cela peut causer plus de problèmes) 2. Re-modifiez votre code, par exemple en mettant la couleur dans l'attribut style, l'attribut img plus alt En comparaison, nous sommes plus disposés à choisir le second. taper.
Il y a une explication sur Internet : web standard = div + css. La disposition des tableaux ne peut pas être utilisée. Après avoir lu l'article ci-dessus, ce n'est pas difficile pour nous de comprendre. Ce concept est purement déroutant et généralisant. On ne peut pas dire que les pages Web avec une disposition en tableau ne soient pas conformes aux normes du Web. Le W3C n'a jamais défini que l'utilisation d'une disposition en tableau n'était pas conforme aux normes. La balise <table> a toujours été la balise standard dans toutes les versions. Bien que nous utilisions tous des divs pour la mise en page, nous devons comprendre : les pratiques recommandées par d’autres ne sont pas égales aux normes.
Comme mentionné précédemment, les normes Web dépendent de la version que nous définissons lors de l'écriture du code HTML/css/js. Par exemple, si mon code HTML utilise la norme xhtml 1.0, alors mon code HTML doit également être conforme à la norme xhtml 1.0. Mais cela ne semble pas être le cas. Près de 99,999 % des pages Web sur Internet ne peuvent pas passer la vérification. Il y a toujours des erreurs d'une sorte ou d'une autre. Toutes les pages du site officiel du w3c : http://www.w3. .org peut réussir la vérification. Oui, les amis intéressés peuvent le tester. À ce stade, notre article semble être dans une impasse, étant donné que de nombreuses pages Web ne sont pas conformes aux normes du Web, elles peuvent également obtenir un bon classement et un bon trafic. standards du web Quel est le lien avec le référencement ? Nous devons commencer par la structure et l'analyse HTML.
La conception Web met l'accent sur la séparation de la structure (html) et de la présentation (css). Nous pouvons comprendre leurs concepts de cette manière. La structure est une maison. Il s'agit d'une étagère en béton armé et en briques, et la performance est la décoration et la modification de la structure, c'est comme la décoration, l'installation des sols, le plâtrage et la peinture des murs de la maison. Sans structure, la performance n'a pas de valeur réelle de performance, c'est pourquoi <font color="#ccc" size="12">text</font> ou de telles balises ou propriétés, car pour la structure, cela ressemble plus à une performance, il doit rester dans la couche de présentation, c'est-à-dire CSS Si nous appliquons la balise font sur la page stricte xhtml 1.0, en fait elle peut également être analysée correctement, car comme nous l'avons dit dans le premier article, les normes sont compatibles avec les versions ultérieures. .
Comprenons comment les navigateurs et les moteurs de recherche analysent notre code HTML. Pourquoi parlons-nous ici de navigateurs ? Parce qu'à mon avis, les moteurs de recherche et les navigateurs utilisent à peu près la même méthode lors de l'analyse des pages Web. Après la descente, l'analyse HTML commence, qui finira par analyser la page entière dans une arborescence DOM avec des nœuds de relation parent-enfant stricts. Et puis le présenter à l'utilisateur, par exemple lorsque j'écris le code suivant :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml ">
<tête>
<titre>titre</titre>
</tête>
<corps>
<div id="top">
<h1>Voici le titre<h1>
<img src="xx.jpg"/>
<p>Ceci est un <strong>texte</strong><p>
</div>
<div id="conteneur">
<h2>C'est un autre titre</h2>
<p>Ceci est un autre <strong>texte</strong></p>
</div>
</corps>
</html>
Vous pouvez voir qu'il s'agit d'un morceau de code HTML conforme à la norme de transition xhtml 1.0. Il y a de nombreuses erreurs (les erreurs incluent : la balise <h1> dans le premier div n'a pas de balise de fermeture. img n'a pas d'attribut alt. La balise <p>. n'a pas non plus de balise de fermeture). Mais si vous mettez ce code dans le navigateur et l'exécutez, vous pouvez voir l'effet correct. La balise P fonctionne également et l'image peut être affichée. Nous sommes très surpris de savoir pourquoi ce code n'a même pas la bonne balise, mais pourquoi il peut être analysé correctement dans le navigateur. Si nous supposons que ce code n'est pas faux, il est vrai. est correct. La structure dom doit être comme indiqué ci-dessous (Figure 1).
Télécharger et télécharger la pièce jointe (16,49 Ko) à 16h58 avant-hier
Pourquoi le navigateur peut-il analyser correctement le code incorrect ? Et il semble être capable de « deviner » la véritable intention du code d’erreur. Le principe est que le navigateur utilise le mode d'analyse du dictionnaire et le mode de collation (html spice) lors de la construction de l'arborescence des balises. En termes simples, le navigateur fera correspondre toutes les balises et attributs avec les informations du dictionnaire intégré. Si la correspondance est normale, elle sera analysée directement. Si la correspondance n'est pas normale, elle sera analysée directement. Activez simplement le mode de finition. Le mode de finition analysera votre code erroné et le corrigera. Par exemple, les balises <h1> et <p> à la fin de ce qui précède seront automatiquement remplacées par la balise de fermeture, ou si vous écrivez un. Paire de balises <jiacu> texte</ jiacu>. Cela ne peut pas du tout être égalé et ne peut pas être réparé. Cela effacera directement la paire de balises invalides, ne laissant que le texte à l'intérieur. Bien sûr, lorsque vous parcourez le HTML dans une arborescence DOM, cela ne changera pas votre code source HTML. Par conséquent, souvent, si nous ne vérifions pas les erreurs HTML sur nos pages, nous ne trouverons pas ces erreurs. . Parce que le navigateur l'a automatiquement corrigé pour nous. De manière générale, les navigateurs assurent une compatibilité totale avec les erreurs HTML. Corrigez-le si cela peut vous aider. Si les balises ou attributs redondants peuvent être effacés, ils le seront. S'ils ne peuvent pas être effacés et corrigés, les balises seront automatiquement supprimées pour que vous puissiez garantir un affichage normal.
Cependant, le « mode d'organisation » n'est pas tout-puissant. Nous ne pouvons pas attendre du navigateur qu'il nous aide à corriger toutes les erreurs, tant de fois lorsque nos pages sont imbriquées de plus en plus profondément, avec de plus en plus de balises et de plus en plus de contenu, Parfois, lorsque le Le navigateur ne peut pas corriger les balises, la seule chose qu'il peut faire est de "supprimer toutes les balises d'un bloc d'erreur et de conserver uniquement le contenu".
Du point de vue d'un moteur de recherche, avant d'analyser le contenu, son principe est le même que celui d'un navigateur, qui nécessite la construction d'une arborescence DOM complète. Ce n'est que lorsque cette arborescence est terminée que le moteur de recherche peut déterminer la relation contextuelle dans la page, ainsi que. vos balises pondérées (telles que <strong>, <h1>) utilisées dans la page, ainsi que leurs positions de distribution, etc. Cependant, les moteurs de recherche mettent davantage l'accent sur la notion de « bloc de contenu » lors de l'analyse, c'est-à-dire une balise par bloc. Toujours l'exemple HTML ci-dessus. Lorsque le moteur de recherche construisait cette arborescence DOM, lorsqu'il analysait la balise <h1> dans le premier div, il découvrait qu'il y avait une erreur. Lors de l'analyse de la balise P, il rencontrait une autre erreur à ce moment-là. construisez correctement cet arbre DOM A, cela activera le mode de finition, mais le mode à ce moment peut ne pas vous aider à corriger les erreurs, mais en "blocs". Recherchez le bloc supérieur (nœud) du bloc d'erreur (nœud) (s'il y a toujours une erreur au niveau supérieur, continuez à rechercher le niveau supérieur. S'il n'y a pas d'erreur dans le bloc de niveau supérieur, alors tous les sous). -les blocs et les sous-blocs de ce bloc de niveau supérieur seront recherchés. Toutes les balises erronées du sous-bloc sont supprimées, c'est-à-dire que toutes les balises erronées dans <div id="top"> sont supprimées. L'arbre construit est comme le montre la figure 2 ci-dessus (révision 2011.4.5 : il y a une petite erreur dans la figure 2. Il y a une balise img sous la balise div à gauche).
De cette façon, nous voyons que les balises <h1> et <strong> que nous avons soigneusement écrites ont disparu après l'analyse, et que le « poids » de l'ensemble du bloc a changé. Selon le principe de l'analyse HTML, nous pouvons facilement en dessiner. conclusion:
1. Lorsque le niveau du nœud de page augmente, nous devons être particulièrement attentifs aux erreurs au niveau des étiquettes. Plus nous sommes proches du nœud supérieur, plus nous devons être prudents, par exemple, nous devrions écrire moins de balises de fin. fatal au référencement.
2. Quelle que soit la disposition que vous utilisez, moins il y a de niveaux d'imbrication de nœuds, mieux c'est. Premièrement, cela peut réduire la charge des moteurs de recherche lors de l'analyse des nœuds. Deuxièmement, il est plus facile pour les moteurs de recherche de déterminer la relation (contextuelle) entre les nœuds. , La pondération des mots-clés est importante.
3. Lorsque les attributs du label peuvent être remplacés par du CSS, déplacez-les autant que possible en CSS.
4. Les navigateurs et les moteurs de recherche autorisent les erreurs HTML, mais le HTML standard est évidemment plus facile à obtenir un meilleur classement dans les mêmes conditions externes.
Il m'a fallu près de quatre heures pour rédiger cet article. Certaines parties ne sont pas très approfondies, je les partagerai dans le troisième article.
Source de l'article : Lightyear Forum (veuillez indiquer le lien source et l'auteur lors de la réimpression)
Auteur de l'article : newyhj