Mostrando entradas con la etiqueta Plantillas Web. Mostrar todas las entradas
Mostrando entradas con la etiqueta Plantillas Web. Mostrar todas las entradas
15 febrero, 2016

Diseño web: la importancia de elegir la plantilla correcta

No hace mucho una persona me preguntó por una buena plantilla para una página web profesional (donde ofrecer productos y servicios). Aprovecho este artículo para compartir los consejos que le di.

En primer lugar, decir que lo mejor es contratar a un diseñador web, como es lógico. Siendo esto cierto, también lo es que podremos abaratar mucho su tarifa si le damos ya una idea terminada. De esta forma es una buena idea elegir antes de nada una plantilla, y luego contactar con el profesional sólo para que resuelva los problemas que nos surjan al usarla.

Ahora bien, lógicamente no valdrá cualquier plantilla. Necesitaremos una apropiada para nosotros. Básicamente, que sepamos usar y cumpla además con todo lo siguiente:

  • Diseño apropiado para el producto o servicio que vamos a ofrecer (colores, tipografías, etc…).
  • Adaptable a los dispositivos móviles (diseño responsive).
  • Que aporte toda la información necesaria sobre nosotros (ejemplos reales de lo que hacemos bien presentados, fotos de la oficina, tienda etc, formas de contactar claras, ubicación, formas de pago…).

Tipos de plantillas disponibles. ¿Cuál elegir?

Respecto al primer punto, dependerá lógicamente del sector en el que estemos. No puede ser igual el diseño para un dibujante que para un abogado. Recomiendo leer este interesante artículo de Silo Creativo en relación con el tema.

Otro buen consejo que puedo dar es escoger el tipo de plantilla que mejor conozcamos. Puede usarse una página web convencional, pero también podemos crear una web estilo blog, si tenemos más experiencia en ese tipo de sistemas. El precio será similar en ambos casos (tanto del template –esto es, la propia plantilla- como del hospedaje).

Ejemplo de plantilla web convencional.

En artículos anteriores ya vimos algunos ejemplos de páginas web convencionales para negocios (imagen de arriba, consultar la referencia en el enlace anterior).

Ejemplo de plantilla web tipo blog.

También pueden encontrarse listados de themes tipo blog para empresas (se llaman así en este caso), muy usados sobre todo para tiendas online. En el enlace anterior pueden verse muchos para WordPress.

Por último, especialmente interesantes para aquell@s que no tienen la menor idea de diseño web, está la opción de usar las plantillas que en algunos casos incluyen los propios hospedajes (la misma empresa donde registramos el dominio y alojamos la web). Un buen ejemplo serían las herramientas para un diseño óptimo que ofrece 1&1.

Ejemplos de plantillas web ofrecidas por 1&1.

Este tipo de plantillas son muy fáciles de usar, pues no requieren tener conocimientos en HTML, CSS, etc… Sencillamente se arrastran y sueltan los elementos que queramos poner. Lo cierto es que los diseños son buenos y responsive. Además, no necesitaremos la ayuda de un diseñador, podremos hacerlo todo nosotros solos.

¿Plantilla gratuita o de pago?

En los tres casos anteriores los precios son similares. Existen también plantillas totalmente gratis, incluso de calidad, pero siempre requerirán conocimientos de HTML para personalizarlas. Suelen ser muy “crudas”. En los enlaces previos pueden verse ejemplos.

De esta forma, la elección dependerá del grado de exclusividad que queramos dar a nuestra web. Si no tenemos grandes exigencias, lo cierto es que la opción de crear la página por nuestra cuenta –sin diseñador web- es hoy en día perfectamente posible.

Leer más...

24 abril, 2014

Plantilla PSD e interfaz para web de tienda o ventas

Justo hoy acaba de publicarse un recurso bastante bueno para diseño web enfocado al eCommerce o comercio electrónico, especialmente para aquellos sitios destinados a vender cosas por internet (tiendas virtuales y similares).

El kit es un freebie, totalmente gratuito y disponible para usos tanto personales como comerciales, y se llama Lucky Store. Ha sido diseñado por Sergey Azovskiy para el sitio pixelbuddha.net, que lo pone a disposición de cualquier diseñador que lo quiera utilizar.

Existe una versión premium de este mismo set, aunque lo cierto es que la versión gratuita es ya bastante completa. Incluye una interfaz UI con todos los elementos, apartados, botones e iconos necesarios para la tienda, que además se disponen en el PSD como si ya formaran parte de una página web. De esta forma es muy sencillo aplicar la plantilla, sólo habrá que reproducir el diseño original.

El diseño incluye también iconos sociales redondos de estilo flat, así como etiquetas y banderolas para precios, descuentos y ofertas. Iconos de búsqueda, cesto de compra, botones de paginación/navegación, campos para formularios, etc... Muy completo.

Parte superior de la plantilla web + set interfaz UI para ecommerce.

  • Como puede verse el set incluye una cabecera con logotipo, una barra-menú de navegación y un slide-show (galería de imágenes) con un juego tipográfico de diseño actual para incluir texto sobre las fotografías.
  • El diseño es muy limpio, sencillo y funcional, en la línea del flat design actual. A mí me gusta bastante, funcionará muy bien.
  • El PSD está muy bien ordenado, con los elementos perfectamente agrupados por capas, en el mismo orden en que aparecen (de arriba a abajo).
  • Las tipografías no están incluidas, aunque no son tipos de letra raros. Si de todas formas hubiera problemas de falta de fuentes podremos sustituirla por cualquier letra de palo seco, como Arial o Helvética.

En definitiva, un buen diseño para cualquier sitio de ventas, con todos los elementos, imágenes e iconos listos para ser aplicados en el HTML por cualquier diseñador web.

Para descargar este freebie, dirigirse a la web del recurso, publicado en:

Lucky Store UI

Leer más...

15 abril, 2014

Portada para página de Facebook de empresas, plantilla PSD

Catalogamos un recurso concreto, que puede ser de utilidad tanto como punto de partida para diseñadores como para ser usado directamente por empresas y profesionales del entorno corporativo, directivo, legal o "de oficina" en general.

Como puede verse en la imagen de muestra, se trata de una plantilla en formato PSD de Photoshop, editable y personalizable por tanto, además de totalmente gratuita, con un diseño pensado específicamente para una página de Facebook de línea corporativa. Es por tanto limpia y de aspecto profesional, mostrando un entorno de edificios de tipo financiero y empresarial, muy genérico y apropiado. En mi opinión consigue el efecto que se propone.

Pasando al apartado técnico, yo he podido abrir sin problemas el PSD con Photoshop CS3. IMPORTANTE: no se ha de usar toda la imagen incluida en el PSD, sino SOLO el área que he marcado en azul en la imagen de abajo. El resto es de adorno:

Plantilla con diseño para landing page de página de empresa en Facebook. Imagen de muestra y forma de uso.

  • Nota informativa: una portada para una landing page de Facebook debe medir idealmente 851x315px. Ésa es la medida que tiene el área que he señalado arriba en azul, el diseño está por tanto bien preparado. Una vez puestos nuestros datos y logotipo, sólo hemos de coger eso del PSD, el resto de capas habremos de eliminarlas. Finalmente, recortaremos la imagen a dicho contenido. La foto se añade en Facebook por medio de las herramientas de dicha red social, no debería incluirse también en la imagen de portada. Si necesita ayuda para usar la plantilla puede contactarme via email.

Es importante señalar también que esta plantilla usa la tipografía Calibri (la empleada por Microsoft Office, especialmente famosa debido al Word, de forma que es bastante apropiado su uso en este diseño). Si no disponemos de dicha fuente instalada en nuestro equipo habremos de sustituirla por otra.

Para descargar el PSD editable, que es totalmente gratuito, dirigirse a la web del recurso:

Corporate Facebook Cover Design (PSD) | design3edge.com

Leer más...