cómo cambiar la URL en la barra de direcciones sin volver a cargar la página

Tengo http://mysite.com/index.php .

Y un submenú

  • home => http://misitio.com/index.php
  • sobre nosotros => http://misitio.com/about.us.php
  • productos => http://misitio.com/productos.php

Pero quiero http://mysite.com/index.php para procesar cada solicitud, y simplemente cambiar el contenido utilizando la solicitud de Ajax. De esta forma, el sitio solo carga la parte de contenido y es mucho más rápido y fácil de navegar.

El problema aquí es SEO, porque la única URL que verá Google es http://mysite.com/index.php y me gustaría asociar http://mysite.com/about-us al contenido Acerca de nosotros , http: //misitio.com/producto al contenido de los productos , etc.

Sé que puedo hacer esto con PHP simplemente leyendo la URL y escribiendo el Ajax sobre la marcha, pero al hacerlo toda la página se volverá a cargar cada vez. ¿Hay alguna forma de hacerlo sin tener que volver a cargar toda la página? Lo que creo que necesito es tener un ancla regular en el submenú, para un examen que apunte a ” http://misitio.com/contacto-us “, pero cuando se hace clic en él, en lugar de abrir esta página, procesa la solicitud de Ajax.

Y si esto es posible, Google lo verá probablemente como un sombrero negro, ¿verdad?

Saludos Alex

No puede cambiar la URL en la barra de direcciones sin cambiar la página porque para poder hacerlo puedo visitarme en http://www.imhackingyou.com/sucker, pero cambie la barra de direcciones para leer http: // www. .bankofamerica.com / login

Este es un problema de enrutamiento, no un problema de AJAX.

Si estuvieras usando otra herramienta ( tos ASP.NET MVC tos ), solo agregarías una ruta (y espero que haya una manera de hacerlo en PHP) que acepte URLs como

/home /products ... 

y los encaminó a, por ejemplo,

 /index.php?area=home /index.php?area=products 

Esto normalmente se logra con un motor de reescritura cuando se usa fuera de un buen sistema MVC o RESTful URL. Utilizo ISAPI Rewrite en IIS, pero si está trabajando en la stack LAMP, creo que Apache proporciona un módulo que proporciona las mismas capacidades. (Google .htaccess )

ADVERTENCIA: RANT SIGUE

Y, por lo que vale,

  1. Evite tratar de escribir toda su aplicación en JavaScript. El servidor está ahí por una razón. Parte de su trabajo como desarrollador web es absorber la mayor cantidad posible de trabajo en su servidor. El rendimiento del navegador y los problemas de compatibilidad te volverán loco cuando tratas de hacer todo en el cliente.

  2. Evitar las devoluciones tiene sentido en muchas circunstancias, pero no es una panacea que deba intentar aplicar a todas las páginas. Por lo general, tiene sentido cargar una nueva página cuando se hace clic en un enlace. Es lo que el usuario espera, es más estable (ya que la mayoría de la infraestructura requerida es del lado del servidor) y no es más lento que una solicitud de AJAX para recuperar lo mismo.

Reglas:

  1. NUNCA rompa el botón de atrás. Sin una planificación cuidadosa, la mayoría de las aplicaciones AJAX rompen esta regla.
  2. Ver la regla # 1.

AQUÍ HAY UNA SOLUCIÓN:

 window.history.pushState(data, title, url) 

Aquí Rob explica cómo funciona, y usted tiene un ejemplo de trabajo:

http://moz.com/blog/create-crawlable-link-friendly-ajax-websites-using-pushstate

Esto suena como que debería lograrse con un motor de reescritura , pero suponiendo que tiene una buena razón para usar AJAX, puede cambiar las URL con javascript modificando la parte después del hash, o mejor aún, el hashbang:

 window.location.hash = "#!about-us"; 

Para obtener más información sobre el hashbang desde una perspectiva de SEO, consulte http://www.seomoz.org/blog/how-to-allow-google-to-crawl-ajax-content

¿Cómo lo hace Shopify entonces? Vaya a su sitio web, haga clic en el enlace Características y verá que la URL dice:

http://www.shopify.com/tour/sell-online

A continuación, haga clic en cualquiera de los enlaces secundarios y verá que la dirección en el URL cambia sin utilizar un hash, pero no se da vuelta de página.

No creo que estén usando ajax para cambiar el contenido porque todo parece estar incluido en divs ocultos en la página, pero independientemente, aparentemente puedes cambiar la URL usando trucos del lado del cliente.