Está en la página 1de 16

Crea un diseo profesional

Usando las herramientas de Jimdo

Organiza tus ideas


Define un plan de trabajo Estructura la informacin Planifica las secciones y el contenido Define el mensaje que quieres transmitir

Objetivo

que tus visitantes reconozcan claramente:

qu deben hacer en tu pgina, cmo, cundo y dnde


Navegacin intuitiva y sencilla Una pgina fcil

Resultado

de usar

Empieza por la estructura


Selecciona la estructura segn tus necesidades y las de tus visitantes Ten en cuenta: El ancho y la distribucin de cada rea Los colores y detalles predeterminados

Objetivo Resultado

Encontrar un equilibrio entre forma y funcin Usar de la plantilla forma

efectiva

Un mejor aprovechamiento del espacio y distribucin de la informacin

Disea del fondo hacia afuera


Selecciona estilo de fondo que no compita con tu pgina Ten en cuenta: Un fondo neutro y plano ayuda a no sobrecargar la pgina Colores claros facilitan la lectura Colores oscuros resaltan el contenido, deben usarse con cuidado

Objetivo

Facilitar la lectura Resaltar el contenido de forma profesional

Resultado

Un diseo sencillo y atractivo que ayuda a mantener la atencin de tus visitantes

Disea del fondo hacia afuera


Una imagen o video como fondo
Usa una imagen llamativa y de buena calidad Contrasta el texto y el fondo web Alinea la pgina para destacar el fondo Haz que la imagen ocupe todo el fondo Utiliza un encabezado transparente para resaltar el ttulo

Presta atencin al encabezado


Decide cmo quieres usar el encabezado, s creativo Usa una imagen de buena calidad El ttulo y el logo deben ir en armona con la imagen.

Alternativas
Usa el encabezado transparente Incluye la imagen del encabezado en el contenido: podrs tener una imagen del encabezado diferente en cada subpgina crear una pgina de inicio diferente a las dems Incluye solo el logo y el ttulo: tendrs ms espacio en el contenido

Define una paleta de color


Define la paleta de colores que vas a usar en tu pgina y se consistente Recomendacin max.

Usa colores que sean relevantes para tu audiencia y que vayan de acuerdo con la imagen que quieres proyectar

Usa los elementos de color para resaltar la informacin de forma estratgica

Presta atencin al uso del color. Menos

es ms.

Usa la fuerza grfica del texto


Lo primero es que sea legible Limita el nmero de tipos de fuente Elige una fuente llamativa para los ttulos y una sencilla para los textos. Ejemplo. Con serifa o decorativa en los ttulos y sin serifa para el texto El tamao recomendado 14px-16px y el espaciado 1.5 - no menos de 11px Usa los tamaos de los ttulos para establecer la jerarqua Combina correctamente los colores y estilos, recuerda menos es ms. Evita las maysculas y subrayados

Usa la fuerza grfica del texto

Haz buen uso del espacio


Organiza el contenido de tu pgina de forma funcional Usa el elemento de columnas para distribuir el contenido Mantn un buen balance entre la cantidad de informacin Deja espacios en blanco No sobrecargues las reas de contenido Distribuye la informacin estratgicamente Se consistente en la distribucin y los estilos en toda la pgina Tomate el tiempo para organizar el contenido en cada subpgina Presta atencin a los pequeos detalles hacen la diferencia

Enfcate en lo esencial
Mantn el diseo sencillo y evita las distracciones Utiliza la regla 80-20 Enfatiza solo el 20% de los elementos que transmiten el 80% del valor y la utilidad de tu pgina

Mantn el balance
La informacin que importa debe estar

por encima del doblez (above the fold)


El contenido es el rey, disea tu pgina sin sacrificar el posicionamiento. Resalta las imgenes, ubica el texto en la parte inferior, pero no

dejes de incluir textos relevantes.

Utiliza llamados a la accin (call-to-action) claros de identificar -

repartidos inteligentemente y con sentido.


Evita el Haz clic aqu

Impacta con imgenes


Solo usa imgenes de buena calidad Optimiza tus imgenes para que tengan buena calidad y tamao Invierte en imgenes profesionales - si no puedes gastar mucho, tomate el tiempo para encontrar buenas

Utiliza los widgets correctamente


Prefiere html5 y olvdate de flash Prubalos primero No recargues tu pgina Usa aplicaciones funcionales y que no distraigan o cansen

Resumen
Planifica desde el inicio Elige la estructura correcta Disea desde el fondo hacia afuera S creativo con el encabezado Sigue el principio KISS (Mantenlo sencillo): Menos es ms Encuentra el equilibrio entre forma y funcin Optimiza el contenido Revisa, prueba y repite

Recursos recomendados
Combinar fuentes http://font-combinator.com/ http://bueltge.de/free-web-fontcombinations/ Edicin de imgenes http://www.photoshop.com/tools http://pixlr.com/editor/

Combinar colores http://www.colourlovers.com/ https://kuler.adobe.com/create/colorwheel/ Bancos de imgenes http://pixabay.com/es/ http://unsplash.com/ http://foter.com/ https://es.fotolia.com/jimdo

Crear galeras, banners e infografas http://www.slidesnack.com/ http://www.photosnack.com/ http://infogr.am/ Aplicaciones recomendadas http://ayuda.jimdo.com/aplicacionesexternas

También podría gustarte