dobleclic » XHTML http://www.dobleclic.org Blog personal sobre Internet, Tecnologia, Linux, Macintosh, Sistemas Operativos, Software, Hardware, Noticias de Actualidad y, sobre todo, opinion Fri, 13 Feb 2009 17:48:14 +0000 http://wordpress.org/?v=2.8.4 en hourly 1 La forma correcta y usable de abrir los enlaces en una ventana nueva http://www.dobleclic.org/la-forma-correcta-y-usable-de-abrir-los-enlaces-en-una-ventana-nueva/ http://www.dobleclic.org/la-forma-correcta-y-usable-de-abrir-los-enlaces-en-una-ventana-nueva/#comments Wed, 28 Mar 2007 21:31:05 +0000 cromo http://www.dobleclic.org/la-forma-correcta-y-usable-de-abrir-los-enlaces-en-una-ventana-nueva/ Hace algún tiempo comentamos la forma de abrir los enlaces en una nueva ventana sin utilizar el atributo target=”_blank”. Sin embargo esa opción nos planteaba algunos inconvenientes, como la imposibilidad de especificar el tamaño de la ventana o la inefectividad en aquellos casos en los que el usuario no tiene javascript activado en su navegador.

Para lanzar enlaces en una ventana nueva de forma usable, fácilmente indexable por Google, podemos utilizar el siguiente código:

<a href="/index.htm" target="_blank"
onClick="window.open(this.href, this.target, 'width=300,height=400');
return false;">Lanzar correctamente</a>

De esta forma podemos especificar el tamaño de la nueva ventana. Además se sigue utilizando el atributo target, con lo que el popup seguirá funcionando aunque el navegador no tenga el lenguage javascript activado.

EDITADO: Si queréis especificar que la nueva ventana lleve barras de desplaamiento teneis que añadir el siguiente parámetro “scrollbars=yes”. En el siguiente ejemplo podeis ver como sería un enlace usable con barras de desplazamiento:

<a href="/index.htm" target="_blank"
onClick="window.open(this.href, this.target, 'scrollbars=yes;,width=300,height=400');
return false;">Lanzar correctamente</a>

VIA: Nosolousabilidad.com

]]> http://www.dobleclic.org/la-forma-correcta-y-usable-de-abrir-los-enlaces-en-una-ventana-nueva/feed/ 1 Abrir los enlaces en una ventana nueva sin utilizar _blank http://www.dobleclic.org/abrir-los-enlaces-en-una-ventana-nueva-sin-utilizar-_blank/ http://www.dobleclic.org/abrir-los-enlaces-en-una-ventana-nueva-sin-utilizar-_blank/#comments Wed, 28 Feb 2007 20:48:46 +0000 cromo http://www.dobleclic.org/abrir-los-enlaces-en-una-ventana-nueva-sin-utilizar-_blank/ Siempre se ha evitado abrir los enlaces externos, aquellos que nos llevan a una página distinta de la nuestra, en una nueva ventana, de manera que nunca se pierda nuestra web. El principal argumento esgrimido, y con toda la razón desde el punto de vista del márketing, es no obligar al lector a abandonar nuestra página para visitar otro enlace. Para realizar esta función se ha recurrido habitualmente al atributo target=”_blank” en el enlace. Sin embargo esta opción no es posible utilizarla si queremos que nuestra página valide como XHTML estricto, algo muy conveniente en el diseño web actual. Siempre es posible reducir los requerimientos a XHTML Transicional, pero recurrir a estas técnicas no es más que retrasar el problema.

Muchos habrán pensado en utilizar una función en javascript con el método window.open directamente. Sin embargo esta opción haría imposible la lectura de los enlaces por parte de buscadores como Google. La solución más acertada pasa por un javascript que actúe sobre una clase del enlace, tal y como explican en eslomas.com:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Ejemplo con método común</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript"><!--//--><![CDATA[//><!--

function prepareTargetBlank(){
var className = 'external';
var as = document.getElementsByTagName('a');
for(i=0;i<as.length;i++){
var a = as[i];
r=new RegExp("(^| )"+className+"($| )");
if(r.test(a.className)){
a.onclick = function(){
window.open(this.href);
return false;
}
}
}
}

window.onload = prepareTargetBlank;

//--><!]]></script>

</head>

<body>

<ul>
<li><a href="http://www.google.com">enlace normal a google</a></li>
<li><a href="http://www.google.com" class="external">enlace a google en ventana nueva</a><li>
</ul>

</body>
</html>

En el ejemplo se presentan 2 opciones, para un enlace normal y para un enlace en una ventana nueva

]]> http://www.dobleclic.org/abrir-los-enlaces-en-una-ventana-nueva-sin-utilizar-_blank/feed/ 0