logo fondo principal menu
ver barra
Menú rápido

Obtener noticias

Noticias en 'Tutoriales'

Traducción al castellano del plugin WPTouch para versiones móviles de wordpress

WPtouch Traducción al castellano del plugin WPTouch para versiones móviles de wordpress

Recientemente he instalado el plugin WPTouch para optimizar la navegación desde dispositivos móviles y trás unos ligeros retoques de personalización he decidido traducirlo al castellano para completar la instalación.

El plugin no dispone de un sistema de traducciones, tal vez en sucesivas versiones lo implementen pero en tanto la única manera es editar los archivos de los temas ‘a la brava’.
Leer más

Jugando con @font-face (HTML5)

Durante años, los desarrolladores hemos estado tipográficamente limitados a las pocas fuentes disponibles para todos los navegadores. Cierto es que con el tiempo han ido apareciendo multitud de recursos para poder hacer uso de cualquier tipo de fuente de texto como puede ser Cufon o sIFR pero todas ellas requieren de la utilización de javascript, php e incluso flash. Aunque aún es pronto principalmente debido a la cuota de uso de Internet Explorer, ya los demás navegadores aprovechan o están a punto de aprovechar las nuevas características implementadas en HTML5.

Estos días atrás estuve jugando un poco con @font-face, ello permite cargar cualquier tipo de fuente para ser utilizada en tu web. En concreto he cambiado la fuente de los títulos de los posts de este blog que utiliza un atributo ‘h2′ quedando de la siguiente manera:

titulos en html5 Jugando con @font face (HTML5)
Su utilización es muy sencilla:

@font-face {
font-family: breipfont;
src: url(images/breipfont.otf) format("opentype");
}

Con esto cargamos la fuente (en mi caso breipfont) haciendo la declaración con la regla ‘font-face‘ y le asignamos un nombre.

.post-content h2 {
font-family: 'breipfont', 'Georgia';
font-size: 26px;
line-height: 30px;
padding-left: 18px;
}

Se la aplicamos a ‘h2‘ haciendo la llamada con ‘font-family‘. Si el navegador es compatible aplicará la fuente ‘briepfont‘ y en caso contrario utilizará ‘georgia‘. Sencillo verdad?

Aquí tienes un listado de fuentes disponibles para descarga.

Notas: Observo que Chrome y Opera no renderizan aún las fuentes, es extraño ya que anuncian su compatibilidad en sus últimas versiones. No he investigado demasiado el tema pero parece que en el caso de Chrome es debido a algún bug. Firefox 3.5 y Safari desde su versión 3.1 lo hacen a la perfección.

Uso del color en las primeras fases de un diseño web

Cada maestrillo tiene su librillo y en este artículo quiero compartir mi técnica para la elección de colores en esas primeras fases en el desarrollo del layout de un diseño.

Para mi estos estadios iniciales son esenciales, los mas complicados y hasta críticos ya que de ello dependera el progreso del aspecto visual del proyecto. No acertar adecuadamente a la hora de elegir colores y como utilizarlos puede resultar en una perdida de tiempo considerable una vez ya el diseño este avanzado.
Leer más

Crear un calendario de eventos con PHP y jQuery

Veo en Bari´s Blog un estupendo tutorial para la creación de un calendario de eventos con PHP y jQuery. La implementación es muy sencilla y está basado en el famoso calendario i-cal con jQuery que nos trajo Stefano Verna estos meses atrás.
Tambien Anieto2k nos hizo una adapatación muy interesante para wordpress que puedes ver AQUÍ.

i cal Crear un calendario de eventos con PHP y jQuery

Impresionante efecto hover para miniaturas

Encuentro en el blog de Sohtanaka un tutorial sencillísimo para crear un espectacular efecto hover para thumbnails. Un ejemplo de como lograr efectos Flash simplemente con CSS y jQuery.

efecto hover Impresionante efecto hover para miniaturas 

Puedes ver una demo del efecto AQUÍ.
Leer el artículo Fancy Thumbnail Hover Effect w/ jQuery.