“deldan” Recomienda (28-06-12)

 

Recomienda

Formularios en HTML5

 

Código

Una de las mejoras en el nuevo Estandar HTML5 aún en desarrollo, está en los Formularios, es cierto que no todos los navegadores tiene la posibilidad de ejecutar correctamente todas las funciones de HTML5, pero es bueno empezar a usar muchas de sus funciones para los navegadores más modernos, nos ahorran mucho trabajo, y siempre hay herramientas como modernizr que nos ayudarán con los navegadores que no soportan HTML5.

Placeholder

Un nuevo atributo que sirve para poner texto dentro de un input cuando está vacío, y que al tabular o pulsar dentro del input desaparezca ese mismo texto, antes para hacer esto había que usar javascript.

<input type="text" placeholder="texto ejemplo">

Autofocus

Nos ayuda a definir que input va a quedar marcado, enfocado, cuando se cargue la página.

<input id="buscar" type="text" autofocus>

Required

Un nuevo atributo que apunta que campos tiene que estar rellenos antes de enviar el formulario, para hacer esto había que crear javascript algo largo dependiendo tipos de campos y las comprobaciones que hacíamos.

<input type="text" name="usr_name" required="required" />

Nuevos tipos de inputs

Tipo search, un input en el que el texto visualmente se le añade una x parar borrar el texto.

<input type="search" name="buscar" />

Tipo email, un input en el que el texto tiene que ser un email.

<input type="email" name="email" />

Tipo url, un input en el que el texto tiene que ser un url

<input type="url" name="miweb" />

Tipo number, con los atributos min, max, y step, nos ayuda a seleccionar un número.

<input type="number" max="10" min="0" step="2" name="minumero" />

Tipo range, similar a number con los mismos atributos, pero visualmente es similar a un slide.

<input type="range" max="10" min="0" step="2" name="minumero" />

En fechas hay varios date, mounth, week, time, datetime.










Geolocalización para google maps desde el navegador

 

Código

En las últimas versiones de los diferentes navegadores hay la opción de geolocalización gracias a la ip donde estás conectado.

Sabiendo está opción me animé a implementarlo en un mapa de google maps. Dejó la parte del código referente a usar la geolocalización del navegador.

 
if (navigator.geolocation) { //Compruebo si el navegador tiene la opción de geolocalizar
	navigator.geolocation.getCurrentPosition(function (position) {
	// accedo a geolocalización			
		map.setCenter(new GLatLng(position.coords.latitude,position.coords.longitude),12);
                //añado las coordenadas en la función de google maps
	});
}else{
	      map.setCenter(new GLatLng(40,-4),5);
              // si el navegador no tiene la opción de geolocalizar añadimos las coordenadas manualmente
}

Pequeño podcast Número 2

 

Podcast

En este podcast voy a comentar un poco el evento First Tuesday Madrid sobre SEO. Por cierto Evento recomendable.

Los puntos que voy a comentar.

  • Seo y multilenguaje.
  • Html5 y SEO.
  • Flash y SEO.
  • Que tiene más valor en SEO. ( contenido, programación,  servidor).
  • El futuro del SEO.

“deldan” Recomienda (7-9-10)

 

Recomienda

Esto es una nuevo tipo de post en mi blog.

Mi intención es compartir links interesantes que me he encontrado durante la semana.

- http://joshduck.com/periodic-table.html – Se trara de una orginal forma de ver las etiquetas de html5 y la posibilidad de ver las que usa tu web.

- http://html5demos.com – Algunas demostraciones del potencial de html5

- http://duperconf.com/ – Conferencias online en castellano, la última html5 principios

- http://www.alzado.org/articulo.php?id_art=525 – Artículo antiguo pero interesante sobre el papel de la redundancia en el diseño de interacción.