Conseils d'utilisation de l'échange h1 tag_Experience-tutoriel CSS-php.cn

Conseils d'utilisation de l'échange h1 tag_Experience

PHP中文网

Libérer： 2016-05-16 12:06:48

original

1798 Les gens l'ont consulté

L'utilisation correcte des balises h1 peut atteindre l'objectif du référencement, alors comment utiliser les balises h1 sans perdre la beauté originale ? En fait, en utilisant correctement la balise h1, nous pouvons atteindre à la fois des objectifs de référencement et d’esthétique. Tout le monde sait que les moteurs de recherche préfèrent les balises h1. La balise h1 est également une étape très basique et importante du référencement. Mais parfois, pour des raisons de style d'interface, une grande partie du texte du titre est transformée en images. Dans la plupart des cas, les images sont utilisées directement lors de la découpe des pages. En termes de code, la balise h1 perdra de son effet sur les moteurs de recherche.

En fait, avec un petit ajustement, vous pouvez vous occuper des deux. Il nous faut deux images :
1
2

Regardez ce paragraphe. La balise h1 est toujours lisible par les moteurs de recherche, nous utilisons simplement text-indent:-9999px pour placer le texte "Inviter des amis à rejoindre" tout à gauche.

Le code est le suivant :

<style>  
.test{}  
.test h1{margin:0; padding:0; text-indent:-9999px; width:522px; height:45px; 
background:url(header.gif) no-repeat;}  
.testbox{background:url(bg.gif); width:522px; height:323px;}  
</style>  
<div class="test">  
<h1>邀请好友加入</h1>  
</div>  
<div class="testbox"></div>

Copier après la connexion

<!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"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>h1标签的使用</title> 
<style> 

.test{} 
.test h1{margin:0; padding:0; text-indent:-9999px; width:522px; height:45px; 
background:url(/upload/20071124114047865.gif) no-repeat;} 
.testbox{background:url(/upload/20071124114047678.gif); width:522px; height:323px;} 
</style> 
</head> 

<body> 
正确使用h1标签，兼顾美观与seo. 
<div class="test"> 
    <h1>邀请好友加入</h1> 
</div> 
<div class="testbox"></div> 
</body> 
</html>

Copier après la connexion

La balise h1 peut aussi être utilisée comme ça, de bien sûr, vous pouvez également utiliser la balise h1. Utilisez des styles tels que la taille de la police, la couleur de la police, etc. Bien sûr, comme dans l'exemple ci-dessus, juste pour atteindre l'objectif du référencement, il n'est pas nécessaire d'utiliser des styles pour modifier la balise h1, car ce qui est affiché devant l'utilisateur est une image.

Ce qui précède est le contenu de l'échange de compétences_expérience d'utilisation de la balise h1. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !