Los diseñadores web y diseñadores gráficos conocen el continuo cambio de la industria que sugiere cambios, adaptaciones, desarrollo de nuevas destrezas para hacer frente al ineludible desarrollo tecnológico. En los últimos años, una de las áreas que más cambios ha sufrido debido al incremento de la demanda de usuarios de Internet, ha sido la de la telefonía móvil y la necesidad de disponer de sitios adaptados para este tipo de portabilidad y formato.

La tecnología WAP es una necesidad en crecimiento que exige de sitios webs diseñados para complacer a esa audiencia en auge. Diseñar sitios web para dispositivos moviles exige un gran desafío y requiere un enfoque estratégico del diseñador y el desarrollador.

Durante el proceso de desarrollo es esencial tener en consideración determinados aspectos para un desarrollo eficiente y ajustado a los estandares web:

• Código semántico y limpio. Lo mejor es dejar atrás los viejos códigos de gran peso basados en tablas y otros códigos engorrosos. La marcación limpia le ayudará a asegurar una correcta visualización en navegadores y móviles (crossbrowsing), sin apuros ni sobrecarga excesiva. Ajustese a las normas de la W3C.
• Separación de contenidos y presentación en CSS. Lo más importante para sus visitas es tener un acceso libre e inmediato al contenido y enlaces. La presentación lujosa es prescindible. un sitio que utiliza una marcación adecuada y eficaz es un sitio de éxito en móviles.
• Etiquetas Alt: Algunas visitas no son capaces de hacer un seguimiento de las imágenes. Las etiquetas “alt” permiten orientar sobre el tipo de contenido que hay debajo de la imágen.
• Etiquetar campos de formulario: Permiten hacer el sitio mucho más utilizable.
• Utilizar encabezamientos. utilice con intelgiencia encabezadores destacando los textos más importantes (h1, h2, h3) frente a los más secundarios.
• Evitar flotadores. Utilices fijas y no flotantes para asegurar una mayor estabilidad en la pequeña pantalla.
• Reducir márgenes y relleno. En tecnología móvil los márgenes deben ser más pequeños. Cantidades grandes de márgenes y paddings pueden hacer un fastidio a más de un internauta-móvil.
• Navegabilidad fácil. Proporcione únicamente enlaces relevantes y trate de engrosar el contenido con navegación inútil o irrelevante.
• Contrastes de color: Las pantallas móviles no tendrán la misma apariencia que un ordenador personal o portatil. Asegúrese de que los textos y colores son los adecuados para estos soportes.

Volvemos con una colección de escenarios recreados en vectores para personalizar a cualquier tamaño en formatos EPS / PDF. Forman parte de la obra del sitio Vector Jungle.

Descargar vectores gratuitos aqui.

SEGUIR LEYENDO ….

Vector Jungle brinda numerosos vectores completos que suelen incluir un escenario y toda una ilustración llena de detalles minuciosos. Unos recursos de vectores útiles para tus diseños o creatividades. Todas ellas disponibles en formatos EPS y PDF:

Chica en el espacio. Una completa pieza de vectores que integra elementos, objetos y una ilustración.
Descargar | Visitar Sitio

SEGUIR LEYENDO ….

La tecnología WAP prolifera y los sitios más oficiales y populares de Internet no dudan en adelantarse a este gran advenimiento de usuarios que buscan un lugar en Internet a través de sus móviles. Aunque los sitios web son en su mayoría sitios en inglés, se espera que en poco tiempo el mercado español invierta en publicidad para estos medios utilizando sitios adaptados a la portabilidad móvil e invierta de una manera inteligente.

Después de haber hablado de sitios web móviles echemos un vistazo a algunas capturas de pantalla como ejemplo. Muchas de estas capturas de pantalla han sido obtenidas de los sitios estrella de Internet.

Ebay, compañía lider en la compra-venta de productos por Internet.

SEGUIR LEYENDO ….

Te ofrecemos un recopilatorio navideño de pinceles (brushes) para utilizar a tu gusto en Adobe Photoshop. Con estos brushes podrás dar un toque navideño a cualquier tipo de obra.

Descargar Brushes.
Set de Brushes. Realizado por Obsidian Dawn

Descargar Brushes.
Set de Brushes. Realizado por Obsidian Dawn

Descargar Brushes.
Set de Brushes. Realizado por Yasny-chan

Autor: Zeus Box.
Licencia: GNU General Public License.
Website: http://www.zeusbox.org/
Descargar Pack de Iconos (PNG & ICONS)

Autor: EnhacedLabs.
Licencia: Uso personal.
Website: http://www.enhacedlabs.com
Descargar Pack de Iconos (PNG & ICONS)

Autor: IconDrawer
Licencia: Gratuito. Uso personal.
Website: http://www.icondrawer.com/
Descargar Pack de Iconos (PNG & ICONS)

En navidad es común encontrar numerosos vectores de calidad hechos por verdaderos artistas. Nosotros hemos seleccionado los de un autor en especial que ha desarrollado varios vectores sobre personajes de la navidad: Rudolph, Papa Noel y el muñeco de nieve.

Descargar vectores aqui.

Descargar vectores aqui.

Descargar vectores aqui.

Visitar Web del Autor | Licencia GPL

Con motivo del espíritu más navideño, muchos creativos han desarrollado numerosos iconos vectorizados para personalizar y utilizar en sus diseños o creatividades personales. Vector Jungle nos presenta esta pequeña colección de imágenes navideñas en vectores bajo una licencia libre de uso de Creative Commons, un conjunto de símbolos de esta temporada útiles para cualquier trabajo digital.

Descargar | Visitar sitio oficial.

Descargar | Visitar sitio oficial.

Con el siguiente ejemplo de actividad y pasividad de espaciados verticales podemos comprobar la importancia de estos elementos que deben configurarse en armonía con el diseño y los espacios del diseño. El espacio en blanco sirve para crear un diseño equilibrado y armonioso a menudo con el que uno se siente cómodo en la lectura. Por tanto, es esencial, su presencia equilibrada en sitios dirigidos sobre todo a lectores habituales.

Cuando no hay configuración de los espacios verticales todo es muy estrecho y agobiante y obliga a forzar al lector su vista sobre un espacio demasiado pequeño. En definitiva, no existe comodidad visual con el diseño.

Para solucionar este y otros problemas podemos dar un estilo al diseño a través de las hojas de estilo CSS. Debemos añadir márgenes, espaciados interiores, variedad de tipografías, tamaños, alineamiento entre caracteres y espaciado vertical entre líneas. No utilizar estos parametros es insensato y puede descomponer el trabajo textual.

El espacio en blanco llamado “whitespace” crea la posibilidad de balance y equilibro y es realmente importante, quizás lo esencial en un diseño orientado a una gran cantidad de textos a utilizar en él.

Analicemos el ejemplo gráfico superior para tener una mayor comprensión sobre la estética de los elementos visuales:

• 1. En el primer ejemplo del gráfico podemos contemplar que existe una ausencia de regularización de los espacios entre textos haciendo que encabezados, subtítulos y textos descriptivos permanezcan casi juntos. El problema de esto se encuentra en que al permanecer juntos, el ojo no puede discriminar correctamente los distintos elementos y tampoco separarlos. Se trata de una falta de racionalización que radica en su falta de espaciados blancos.

• 2. En el segundo epígrafe remarcado en el gráfico podemos discernir que se trata de un encabezado. Tras él, se encuentra un subtítulo descriptivo del encabezado que nos da la sensación de que se trata de un resumen corto previo al texto introductorio.

• 3. En el tercer epígrafe podemos ver como se nos introduce con armonía en el texto y en esta ocasión podemos separarlo del encabezado. Existe suficiente espaciado entre encabezado y texto que nos ayuda a dividirlo en un esqueleto entre “cabeza” y “cuerpo”. También la separación de lineas en el texto nos facilita una mayor orientación y continuidad de lectura. Para conseguir efecto, debemos utilizar un espaciado vertical mayor al tamaño de la fuente. Personalmente, recomiendo utilizar un espaciado vertical con un tamaño doble al tamaño de la fuente, es decir, si la fuente tuviera 12px, el espaciado vertical debería ser de 24px.

Estos son algunos de los diseños favoritos realizados en 2007 renovando la antigua imágen de las compañias. Destaca en los rediseños mejoras sobresalientes tanto en aspecto como en funcionalidades. Todos estos sitios recibieron rediseños que descencadenaron un gran cambio.

Twitter. Sus cambios permitieron a los usuarios vestir sus propias páginas con un look personal y distinguido. Más alla de eso, el servicio de “microbloggin” tiene mucha calidad y su diseño fácil y sencillo es intuitivo y manejable.

Galería de fotos de Mac. El servicio Mac realizó una versión actualizada que nos proponía un concepto diferente. Pequeños cambios tanto en color como en la presentación final pueden hacer que un diseño realmente hermoso.

Documentación de Google y hojas de cálculo. Una de las herramientas de documentos más populares de Google con un procesador de documentos en línea. Tuvo una enorme revisión a finales de Junio del 2007. Hizo una transición a colores pasteles en lugar de fuertes colores azules haciendo una nueva dirección hacia un concepto diferente. Ahora es más fácil y liviano organizar y compartir documentos con esta aplicación 2.0 online.

Adobe Buzzword. Mientras Google presumía de procesadora de hojas de cálculo y documentos, Adobe Systems Inc. estaba ocupado en adquirir la franquicia Buzzword, un procesador de textos moderno. Esta herramienta es preciosa y saca el máximo rendimiento de los editores web.

Pownce. Su expresión estilizada se debe a Daniel Burka quien diseñó el clásico Digg. Pownce hace muchas cosas correctas incluyendo los temas seleccionables por el usuario y llenar artículos útiles sin provocar el desorden.

Vimeo. El rediseño nos muestra un planteamiento más 2.0, esquinas redondeadas y textos grandes con gran simpleza. Hoy en día, es una plataforma de streaming multimedia de gran popularidad.

Picnik. Interfaz limpia y simple y sobre todo sencilla. El software de escritorio que permite editar fotos. Los usuarios de Flickr consiguen un berneficio extra con esta potente herramienta.

Current. Además de tener un diseño hábil e ingenioso para una televisión online tiene un estilo muy organizado y ordenado que nos hace la navegabilidad mucho más fácil.

Facebook para el iPhone. Hay una tonelada de aplicaciones de iPhone pero de los más hermosos es la versión de Facebook. El sitio fue diseñado para que fuese exprimido al máximo en cuanto a funcionalidad a pocos clicks.

Fluther. Sus diseños estan basados en temas relajantes. Ademas de tener una mascota de medusas con anteojos, el diseño es maravillosamente simple.