Supongamos que necesita pasar de una página a otra. Hay muchas formas a continuación. ¿Puedes explicar claramente por qué?
<%--Forma de representación del enlace--%>
<asp:HyperLink ID="HyperLink1" runat="servidor" NavigateUrl="~/Default2.aspx">HyperLink</asp:HyperLink>
<asp:LinkButton ID="LinkButton1" runat="servidor" PostBackUrl="~/Default2.aspx">LinkButton</asp:LinkButton>
<%--Por razones estéticas, muchos sitios web utilizarán botones para reemplazar enlaces--%>
<asp:Botón ID="Botón1" runat="servidor" Texto="Botón" PostBackUrl="~/Default2.aspx" />
<%--Usando imágenes como enlaces, hay dos opciones--%>
<asp:ImageButton ID="ImageButton1" runat="servidor" PostBackUrl="~/Default2.aspx" ImageUrl="~/upup.gif" />
<asp:HyperLink ID="HyperLink2" runat="servidor" NavigateUrl="~/Default2.aspx" ImageUrl="~/upup.gif"></asp:HyperLink>
Si todavía está un poco confundido, le sugiero que verifique el código fuente después de que generen html.
<a id="HyperLink1" href="Default2.aspx">Hipervínculo</a>
<%: después de analizar el hipervínculo en HTML, corresponde a un hipervínculo simple y href apunta a la página a saltar--%>
<a id="LinkButton1" href="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("LinkButton1", "", false, "", "Default2.aspx", false, true))">LinkButton< /a>
<%--Aunque LinkButton1 también es una etiqueta de anclaje, en realidad usa JavaScript para saltar--%>
<input type="submit" name="Botón1" valor="Botón" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("Botón1", "", falso, "", "Default2.aspx" , falso, falso))" id="Botón1" />
<%--button se analiza en un elemento de entrada de tipo="submit", y la página también se salta a través de JavaScript--%>
<input type="image" name="ImageButton1" id="ImageButton1" src="upup.gif" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ImageButton1", "", false, "" , "Default2.aspx", falso, falso))" style="border-width:0px;" />
<%--ImageButton se analiza en un elemento de entrada de tipo="image", y la página también se salta a través de JavaScript--%>
<a id="HyperLink2" href="Default2.aspx"><img src="upup.gif" style="border-width:0px;" /></a>
<%--Después de asignar un valor al atributo ImageUrl de HyperLink, después de analizarlo en HTML, corresponde a una imagen "recortada" en un hipervínculo, pero el href aún apunta a la página a saltar--%>
¿De qué sirve saber esto?
Tiene muchos usos, pero hoy solo hablamos de SEO.
Con la tecnología actual de los motores de búsqueda, JavaScript (incluido AJAX, por supuesto), los elementos de formulario (como la entrada), Flash e Image no pueden (o son difíciles de) leer. Las "arañas" tienden a leer texto simple con formato html. Entonces, desde una perspectiva de SEO:
1. No utilice JavaScript ni formularios para enlaces de salto de página. Un <a></a> normal también puede realizar la misma función. En términos generales, las arañas no recuperarán cualquier navegación a la que no se pueda acceder a través del identificador de anclaje estándar <a></a>. Si originalmente usamos elementos del lado del cliente, debería ser más fácil para nosotros notarlo, pero cuando usamos controles encapsulados del lado del servidor, podemos ser descuidados;
2. Tenga en cuenta que no hay contenido de texto en UpdatePanel. Podemos hacer una prueba sencilla:
<asp:ScriptManager ID="ScriptManager1" runat="servidor">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="servidor">
<Plantilla de contenido>
<asp:Label runat="servidor" ID="lbl" ></asp:Label>
<asp:ID de botón="Botón1" runat="servidor" Texto="Botón" onclick="Botón1_Click" />
</ContentTemplate>
</asp:Panel de actualización>
Botón vacío protegido1_Click (remitente del objeto, EventArgs e)
{
this.lbl.Text = "¡Fui generado por UpdatePanel, así que no puedes verme!";
}
La parte del código fuente después de analizarlo en HTML:
<div id="Panel de actualización1">
<span id="lbl"></span>
<tipo de entrada="enviar" nombre="Botón1" valor="Botón" id="Enviar1" />
</div>
Esto es fácil de entender, porque UpdatePanel también genera contenido de la página a través de la función JavaScript de la página. Al observar el código fuente, podemos ver las funciones de JavaScript relevantes, pero no el contenido generado por las funciones. En cuanto a las arañas de los motores de búsqueda, sólo miran el código fuente.
3. Cuando necesitamos utilizar una página emergente, el enfoque habitual es:
<a href="#" onclick="window.open('popup.html','common','height=600,weight=800');">ventana emergente común</a>
Según explicamos anteriormente, esta forma de escribir es sin duda perjudicial para el SEO. Por lo tanto, deberíamos usar el siguiente código, que garantiza el efecto de la ventana emergente y es compatible con SEO. E incluso si el navegador del cliente no admite o deshabilita JavaScript, la página aún puede saltar sin problemas.
<a href="popup.html" onclick="window.open(this.href,'seo','height=600,weight=800');return false;" target="_blank">seo popup</a >
<%--Nota: La declaración falsa que se devuelve aquí no se puede omitir. --%>
4. Cuando queremos utilizar una fuente especial (a menudo títulos de columnas y similares), solemos utilizar una imagen de caracteres chinos. Esto también es problemático porque, como título, su contenido suele ser una palabra clave muy importante. Si utilizas una imagen, la araña no puede leerla. Una posible solución es sIFR, pero no estoy muy familiarizado con esto; después de buscar en línea, no parece ser aplicable a los caracteres chinos.
Para las imágenes, nuestro método SEO comúnmente utilizado es indicar el título y la alternativa, como
<img alt="Optimización de motores de búsqueda ASP.NET" title="Algunas técnicas de SEO que se deben tener en cuenta al desarrollar sitios web utilizando tecnología ASP.NET" src="seo.gif" />
Sin embargo, este también es un "elemento de página invisible" y el efecto específico es difícil de medir con precisión. ¡Pero algo es mejor que nada!
5. Algunas otras notas:
5.1 Combine la semántica de las etiquetas html con css. A diferencia de "span" y "div", "h1" significa título, "b" significa énfasis, "ul" y "li" significa lista... Estas etiquetas semánticas pueden dar búsqueda. instrucciones más claras para los motores;
5.3 Coloque contenido importante en la parte superior de la página html (haciendo referencia al código fuente, no a los resultados mostrados por el navegador)
5.5 Coloque grandes secciones de JavaScript en la parte inferior de la página o en archivos js separados;
5.2 Es mejor no utilizar el diseño del marco;
5.3 Una gran cantidad de VIEWSTATE puede causar interferencias con el "Spider";
5.5 Tenga en cuenta: Con la tecnología actual de los motores de búsqueda, JavaScript (incluido AJAX, por supuesto), elementos de formulario (como la entrada), Flash e Imagen no pueden (o son difíciles de) leer.