Algunas tendencias de diseño web para 2018

Tendencias diseño web 2018

Las tendencias van y vienen, pero siempre quedan algunas que se mantienen por una buena cantidad de tiempo, pues su éxito es tan grande que no cesan los proyectos que las implementan. El diseño web es una parte de la tecnologí­a que tiene como finalidad principal ofertar y vender. Para ello, es indispensable un sitio de calidad que se actualice cada cierto tiempo con nuevas herramientas y aspectos visuales que atraigan la atención del cliente.

El 2018 será el doble de digital que el año anterior, así­ que siempre es recomendable que tengas en cuenta algunas tendencias que puedes implementar en tu sitio web para darle mayor aspecto e imagen. A continuación verás 3 de las mejores tendencias de diseño para tu página web. Continúa leyendo «Algunas tendencias de diseño web para 2018»

Ten Years Ago, para ver cómo eran nuestras web favoritas hace 10 años

Ten Years Ago

Internet ha cambiado enormemente en los últimos años. Atrás quedó el uso extendido de Flash, que dejó paso a tecnologí­as mucho más eficientes, como el HTML5. Además, el aspecto de los sitios web ha mejorado enormemente con el paso del tiempo gracias a los avances en el mundo del diseño y del desarrollo web. Hoy os hablamos de Ten Years Ago, una web que nos enseña cómo eran nuestras páginas favoritas hace 10 años.

En concreto, la web de la que hablamos nos muestra el aspecto de 15 páginas web distintas el 29 de julio de 2007. En concreto, podremos navegar por las versiones antiguas de YouTube, Reddit, Amazon, Apple y The New York Times, entre otras. Para ello solo tenemos que hacer clic en la web que queramos visitar y automáticamente se cargará la versión antigua (algo posible gracias a la tecnologí­a de The Web Archive. Lo mejor de todo es que no se limita a la portada de la web, ya que podemos hacer clic en todos los enlaces disponibles.

Continúa leyendo «Ten Years Ago, para ver cómo eran nuestras web favoritas hace 10 años»

Sharingbuttons, para incluir botones de redes sociales en nuestro sitio web

Sharingbuttons

Como sabréis, con frecuencia os recomendamos diferentes recursos de utilidad relacionados con el mundo de la programación y el diseño web. Recientemente hemos descubierto Sharingbuttons, una curiosa página web que nos facilita el proceso de instalación de botones de redes sociales en nuestro sitio web.

Teniendo en cuenta el modo en el que los usuarios utilizan en Internet, a dí­a de hoy es impensable poner en marcha una web sin incluir botones para compartir el contenido en las redes sociales. A pesar de ello, a menudo los scripts proporcionados por las propias redes sociales son demasiado grandes, nos obligan a descargar múltiples archivos y rastrean a los usuarios. Es aquí­ donde entra en juego la magia de Sharingbuttons, una herramienta que no usa Javascript (por lo que es realmente rápida), es accesible y no rastrea al usuario.

Continúa leyendo «Sharingbuttons, para incluir botones de redes sociales en nuestro sitio web»

Una herramienta para convertir Markdown a página web de forma rápida y sencilla

Markdown

Estamos seguros de que muchos de vosotros habréis oí­do hablar acerca de Markdown, el popular lenguaje con el que dar formato a un texto de una forma sencilla: por ejemplo, podemos emplear un asterisco (*) para escribir en cursiva o dos asteriscos (**) para escribir en negrita. Recientemente hemos descubierto «markdown to web», una curiosa herramienta que nos permite transformar cualquier documento escrito en Markdown en una página web.

En general, el funcionamiento de «markdown to web» es de lo más simple e intuitivo. De hecho, tan solo es necesario introducir el texto en Markdown a través de la propia página web o subir un documento Markdown que previamente hayamos preparado. Tan pronto lo hayamos hecho tendremos que pulsar sobre el botón «Continue» e indicar nuestro nombre y dirección de correo electrónico.

Continúa leyendo «Una herramienta para convertir Markdown a página web de forma rápida y sencilla»

Tutset, selección de tutoriales para aprender diseño y desarrollo web

Hay muchí­simos recursos y plataformas que pueden recurrir aquellos interesados en dar sus primeros pasos en diseño y desarrollo web o mejorar sus habilidades.

Para no se sentirnos abrumados con tanta información, hay iniciativas como Tutset que permiten concentrarnos en aquellos contenidos que se adapten a nuestras necesidades.

Si damos un recorrido por Tutset, veremos que organiza tutoriales online en diferentes categorí­as. Por ejemplo, tenemos “Web Fundamentals” para aquellos que recién se inician en el desarrollo web, con una serie de tutoriales de diferentes plataformas.

Tutset

Si preferimos recursos que nos guí­en para crear páginas web, podemos ir “Frontend Development”, que nos mostrará tutoriales sobre HTML, CSS y JavaScript.  Encontraremos tutoriales para principiantes, para aquellos que quieren poner a prueba sus conocimientos, así­ como recursos más avanzados.

Hay recursos tomados de Codecademy, Udacity, Treehouse, Khan Academy, W3schools, entre otras plataformas. En cada una de las sugerencias se nos dirá el tipo de recurso que se ofrece, si es un libro, video, si es de pago, etc. Solo tenemos que decidir si es lo que estamos buscando según nuestros conocimientos.

No es necesario registrarse, ni crear ninguna cuenta para ver los tutoriales que se sugieren. Solo dar un recorrido por las diferentes opciones y estar pendientes de los nuevos tutoriales y categorí­as que se vayan sumando.

WixEd, cursos gratuitos de Wix para profesionales de diseño web

WiEdUna nueva propuesta educativa pensada para aquellos usuarios que desean iniciarse como trabajadores independientes en diseño web: WixEd.

Es una iniciativa de Wix, plataforma que nos permite crear sitios web personalizados, que ha diseñado un programa de cursos online gratuitos para ayudar a los usuarios potenciar su negocio de diseño web.

Además, de tener una sección dedicada a conocer las caracterí­sticas de Wix, también hay clases dedicadas a guiar a los freelance a desarrollar su negocio aplicando diferentes estrategias, desde la gestión de los clientes, marketing online hasta cómo llegar el control de nuestra carrera.

Por ejemplo, veremos cómo conseguir nuevos clientes y cómo educarlos para que valoren el potencial de tener presencia en la web mediante diferentes propuestas que se ajusten a sus necesidades.

WixEd

También hay clases para ayudar a los usuarios a ser productivos en su negocio de diseño web, teniendo en cuenta diferentes tips. Y por supuesto, también se ha tenido en cuenta detalles relacionados con la estimación de precios en los trabajos y cómo controlar el presupuesto.

Para participar de este programa de entrenamiento, solo tenemos que crearnos una cuenta y escoger la clase de nuestro interés. A medida que vamos avanzando en las clases recibiremos badges y diferentes recompensas, así­ como un certificado al terminar todo el curso.

Palettab, para descubrir paletas de colores y fuentes para nuestros proyectos

Palettab es una extensión para Chrome que nos sugiere una serie de paletas de colores y fuentes en la nueva pestaña del navegador.

Podemos tomar nota de la paleta entera o considerar los colores que mejor se ajustan a nuestro proyecto.

Palettab

En cada tarjeta de color tendremos el valor del color que podemos copiar automáticamente al posicionar el mouse, además de dirigimos a Google Fonts para visualizar la fuente sugerida.

Si deseamos tener más detalle de la paleta nos dirigirá a la comunidad de COLOURlovers, donde podremos ver los comentarios de la comunidad, así­ como su popularidad entre los miembros. Además nos permitirá crear un patrón basándonos en los colores de la paleta.

Es una extensión simple que puede servir como fuente de inspiración al trabajar en proyectos creativos, además de mostrarnos las interesantes caracterí­sticas de COLOURlovers.

Otras herramientas gratuitas que pueden tener en cuenta aquellos que trabajen en diseño web son las  que compartimos en el artí­culo Extensiones Chrome para diseñadores web.

¿Qué tipografí­as elijo para mi próximo proyecto web? 5 herramientas de recomendaciones para ayudarte con ello

Echamos hoy un vistazo a brillantes opciones online que seguramente servirán a muchos en la búsqueda de la respuesta a una de las más difí­ciles decisiones a la hora de trabajar en el diseño de un nuevo proyecto web: Sus tipografí­as, el combo de fuentes que le harán relucir. Pues bien, para la tarea repasamos las recomendaciones de un hilo en Reddit y algunas que ya habí­amos tenido oportunidad de reseñar, en todo caso, espacios perfectos tanto para quienes tienen una idea inicial como para quienes no saben por dónde empezar. Un detalle extra: Si deseas ayuda con el texto de relleno en tus pruebas, no olvides estas alternativas al Lorem ipsum.

Type Genius

typegenius
Selecciona una de las elegantes fuentes dentro del menú principal de Type Genius, pulsa en View Matches y enseguida tendrás varias recomendaciones de tipografí­as que irí­an bien con ella, además, como muestra, algunos ejemplos de texto de relleno -similar al Lorem Ipsum- y sitios web que ya ocupan dichas combinaciones. Ojo a la parte inferior de Type Genius pues, aunque casi imperceptibles, están los botones para cambiar entre las webs de ejemplo a modo de presentación.

Fonts in use

fonts in use
En Fonts in use pueden encontrarse cientos de ejemplos de combinaciones presentes tanto en sitios web como en publicaciones fí­sicas, en particular, libros, revistas, pelí­culas y anuncios publicitarios. Aunque las vistas previas recogen detalles rápidos de las fuentes consignadas en cada ejemplo, lo más recomendado, además del buscador, es valerse de los tres filtros que le componen para iniciar las consultas: Industries (negocios, arte, noticias, música, deportes, etc.), Formats (publicidad, infografí­as, revistas, diarios, software, móviles, etc.) y Typefaces.

Typewolf

Typewolf
Otro escaparate de sitios web que logran destacar por sus muy bien escogidas combinaciones de tipografí­as, eso sí­, Typewolf es mucho más personal que las anteriores opciones así­ que además de las selecciones generales podremos encontrar artí­culos especializados, rankings y recomendaciones subjetivas, muy valiosas valga decir, que su respectivo autor comparte frecuentemente.

Fontface Ninja y WhatFont

Fontface Ninja
Y finalmente un par de herramientas con las que podremos conocer rápidamente qué tipografí­as utiliza determinado sitio web que nos haya llamado la atención. Nombre, Font family, Font Size, Line Height y Line Spacing, y en ocasiones hasta el lugar donde pueden conseguirse, se incluyen en los detalles presentados.

Vale destacar que Fontface Ninja además de como bookmarklet está disponible en forma de extensión para Google Chrome y Safari, y WhatFont solo funciona en Chrome. Por cierto, para identificar fuentes de texto en publicaciones fí­sicas no sobra recomendar al siempre útil WhatTheFont!, un servicio online que se encargará de la detección con apenas cargar una imagen y/o captura de pantalla.

Dos interesantes recursos para recibir lecciones de diseño web por emails

En la web encontramos una selección impresionante de recursos para aprender sobre diseño web, como cursos, tutoriales, ebooks.

Pero a veces esos recursos quedan olvidados en nuestros marcadores o perdidos entre nuestra lectura pendiente. Una solución a ello, es tener en cuenta opciones como la que propone David Kadavy, autor de Design for Hackers .

Design for Hackers

Durante 12 semanas enviará una lección a nuestra dirección de correo electrónico, tomando algunos puntos principales de su libro, repasando todos sus capí­tulos. Si bien son breves, nos servirán para aprender algunos conceptos y tener en cuenta algunos tips al realizar nuestros proyectos.

Otra propuesta es Hack Design, que con la ayuda de diferentes diseñadores han creado un plan de estudio con contenido interactivo y diferentes herramientas de diseño.

Hack Design

Además de seguir el contenido en la plataforma, podemos recibir las 50 lecciones que componen el curso en nuestro correo.

En las dos opciones que hemos comentado solo necesitamos señalar nuestra dirección de correo electrónico y esperar las lecciones semanales. Y por supuesto, siempre contaremos con la opción de dar de baja la suscripción, si es que no se ajustan a nuestras expectativas.

Acámica lanza nuevos cursos y carreras completas sobre diseño y desarrollo web

acamicaHemos hablado en diferentes oportunidades de Acámica, una interesante plataforma educativa en español que sigue la filosofí­a de “aprender haciendo”.

Ahora nos sorprende con una nueva colección de cursos y la posibilidad de tomar carreras completas, pensando en las necesidades de los usuarios al brindar una formación online que les brinde nuevas oportunidades laborales.

AcámicaCon el nuevo diseño de la plataforma, cada usuario podrá evaluar qué cursos debe tomar de acuerdo a su nivel de conocimiento o sus metas profesionales.

Podremos afianzar nuestros conocimientos en determinados temas, complementar nuestra habilidades o centrar nuestros esfuerzos a una carrera.

Acámica

Por ejemplo, podemos optar por “Desarrollador web” o “Diseñador web”. Cada carrera nos sugiere una serie de cursos para comenzar desde cero, que podemos seguir a nuestro propio ritmo.

Un detalle interesante del nuevo modelo de Acámica, es que todo el contenido de la plataforma está disponible de manera gratuita, dando la posibilidad de realizar un curso completo (de nuestra elección) por mes.  Y aquellos que deseen avanzar más rápido, pueden optar por una suscripción mensual abonando un pequeño monto.

Además de la formación online, también formaremos parte de una comunidad que comparte nuestros intereses y un perfil visible para empresas del sector, dándonos la posibilidad de crear nuevos contactos y oportunidades laborales.