Tips & Tricks

Creemos de manera ferviente que solo algunas ideas o diseños en el mundo caen dentro del la palabra “Genialidad”. Los siguientes ejemplos de como se usa de manera brillante el Scroll en un diseño, comprueba que algunos todavía pueden caer dentro de esta categoría, seleccionamos cinco sitios los cuales nos parecen realmente brillantes por la calidad del diseño y la interacción que lograron solo usando HTML, CSS y Jquery.

Si conocen algún otro sitio que merezca estar dentro de esta categoría por favor manden sus comentarios para anexarlo dentro de esta selección.

Siguiendo con nuestra línea de tutoriales relacionados con Jquery, HTML & CSS, ahora vamos a ver la manera de crear un control de hojas de estilo para nuestro sitio, en este caso tomaremos de ejemplo un Theme que estamos realizando para el sitio ThemeForest.

En este ejemplo vamos a realizar el diseño del control por medio de Photoshop y después le agregaremos el código necesario para que pueda cambiar de un estilo (.css) a otro de manera sencilla sin necesidad de cargar de nuevo la página.

La tarea más difícil de un buen diseñador web, es lograr encontrar el equilibrio perfecto entre el diseño y la usabilidad. No cualquiera puede lograr llevar de la mano estos dos aspectos y mucho menos a la hora de crear una tienda en línea, ya que la experiencia que tenga el usuario al momento de ...

Para poder diseñar en estilo “one page”, se pueden utilizar diferentes técnicas o tipos de animación, en este post vamos a utilizar un plugin de Jquery llamado “Scroll To”, este nos permite hacer la animación de recorrido tanto en horizontal como en vertical, podemos utilizarlo de diferentes maneras de acuerdo a nuestro diseño.

Te mostraremos como lograr este efecto de un manera fácil y rápida

Una tendencia que en lo particular me gusta mucho, es el diseño de una sola página o “one page”, esta técnica consiste en tener toda la información de tu sitio en la misma página y mostrarla de una manera dinámica y divertida por medio de jquery. Algunas de las técnicas que veremos a continuación para ...

Vamos a crear una tabla de precios y buscaremos resaltar una columna en especifico, esto para dar la idea que de todos los servicios que ofrecemos el mas importantes es el que esta resaltado, estos tipos de tablas se pueden usar en diferentes ejemplos, pero principalmente son utilizados para mostrar paquetes o planes de algún tipo de servicio

Comenzamos por generar nuestra imagen, en este caso nosotros ya la tenemos definida, es una tabla de precios que vamos a diseñar para el portal Teko Estudio.

La sección de los “Sitios del Mes” es una selección de los mejores y mas sorprendentes websites, que hemos encontrado durante este mes de septiembre. Algunos de los afortunados son Nfluk.com, Twittercon el rediseño de su nuevo portal, Epic Agency, Creative Mints y Tomas Pojeta Cerative Mints Twitter Epic Agency Tomas Pojeta NFLUK

El uso de sprites en CSS es una práctica muy común en los desarrolladores web, esto se hace para poder reducir el tiempo de carga de imágenes en el portal que estas desarrollando. Ahora vamos a ver como funcionan los sprites y que necesitas hacer para poder crear el tuyo.

En este caso vamos a comenzar con el diseño de un botón y vamos a hacer el código necesario para su buen funcionamiento.

Vamos a diseñar nuestro botón en photoshop y va a ser solamente una base de gradientes y lineas , para comenzar creamos un forma de esquinas redondeadas, las proporciones del botón depende del diseño que ustedes necesitan, en mi caso lo voy a hacer de 360 x 110 px y esta será la base que tomare para el código CSS…