La Divina Proporcion y El Dis

Preview:

Citation preview

MexsideArte, diseño y cultura popular.

Inicio•Acerca De•Contacto•

Subscribe to RSS•

La Divina Proporción y el diseño webby Mexside on abril 9, 2008 in Diseño Web

La divina proporción o proporción aurea, es considerada como la proporción perfecta. Se encuentra en figuras geométricas, partes del cuerpo y naturaleza, como relacion de porporciones morfológicas armoniosas. Su uso data desde la antigüedad, existe indicios desde hace más de 2000 años. Los griegos lo utilizaron para diseñar las proporciones de sus templos. Platón consideró a la sección aurea como la relación matemática perfecta.

Durante el renacimiento, el uso de la proporción áurea se extendio entre las artes, uno de los artistas que más uso le dio fué Leonardo Da Vinci. Sus obras se apegaban a una reticula basada en la proporción aurea, en la Gioconda, el rostro encaja perfecto en un rectángulo áureo y las partes de la cara a su vez se componen de rectangulos o proporciones aureas.

Diseño Gráfico Gran NivelPublicistas reconocidos buen nivel Vanguardia y Excelencia, Inscribetewww.ucq.edu.mx

Clases de DibujoAprende las técnicas modernas con la Moderna Enseñanza a Distancia.InstitutoMaurer.com.mx

Relaciones PúblicasLa mejor manera de llegar a sus clientes y construir su marca.www.bluemarketing.com.mx

Fine Art PhotographyFive series: the Wind, Shadows, Reflections, the Moon, & Abstractwww.Rphillipsabbott.com

Página 1 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

Pero ¿Que es la proporción áurea?

El número áureo representa la proporción que existe entre dos segmentos, tales que el segmento menor es al mayor lo que el mayor es a la totalidad.

La fórmula es: (A/B)=(A+B)/A

Tal proporción corresponde al Número Áureo o Phi: 1,618. De suerte que el segmento AB es 1,618 veces A, y A es 1,618 veces B. Inversamente, B es 0,618 veces A, y A es 0,618 veces AB.

Una forma facil de entender es dibujando un cuadrado y agregar un punto medio en uno de sus lados, luego lo unimos con uno de los vertices del cuadrado y por ultimo llevamos esta distancia hacia alguno de los lados a partir del punto que dibujamos, obtenemos gráficamente un rectángulo con proporciones áureas.

Página 2 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

Que es lo mismo que multiplicar la recta AB por el numero Phi y nos resultara igual a la recta AC. Esta proporcion equivale aproximadamente a dos segmento desiguales, uno de 62% y otro de 38% de una recta por tamaño 100%.

¿Que ventajas ofrece esta proporción?

Se dice que si a una linea recta le agregamos un punto en un lugar que no sea el centro, la mayoria de las veces lo agregaremos acercándonos a la proporción de 62% y 38%. Esto nos permite ofreces composiciones mas armoniosas que puedan enfocar la atención en un punto deseado. Una de las formas para trabajar con el número áureo es dimensionando el soporte. Esto no es otra cosa que utilizar un área de trabajo que tenga proporciones áureas.

El rectángulo dibujado anteriormente es un area de trabajo áurea, si esto lo aplicamos al diseño web obtenemos que para una intefaz 1024 x 768 con un ancho de 1010 pixeles visibles (le restamos 14 pixeles, que es lo que usan las barras de deslizamiento laterales) le corresponderia una altura de 624 pixeles. Aqui surge un problema, ya que en el diseño web generalmente podemos saber la anchura de un contenido, pero no la altura, ya que depende de la cantidad de contenido que estará en la página. Pero gracias a esta área de trabajo podemos crear una reticula proporcionada, para ajustar los elementos principales del diseño de un sitio web y ajustando los restantes con proporciones aureas.

Página 3 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

En este caso hemos dividido el area total en dos areas, de la cual el rectangulo del lado derecho es un rectángulo áureo. ¿Como resultaron esas medidas? de multiplicar el ancho total (1010 px) por Phi dando como resultado 624px, asi el rectángulo queda dividio en un cuadrado y otro rectángulo áureo que a su vez vamos a dividir.

Página 4 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

Si seguimos dividiendo infinitamente y luego trazamos un arco por la diagonal de cada cuadrado, se obtiene la espiral logarítmica, que aparece frecuentemente en la naturaleza y su ejemplo mas clásico la concha de un nautilus.

Con estos rectángulos aureos que hemos conseguido, podemos diseñar la reticula básica para hacer el diseño de nuestro sitio web.

Página 5 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

Esta reticula es básica, pero sirve de ejemplo para ilustrar lo que se puede hacer utilizando la proporción áurea para diseñar, las posibilidades son infinitas, se puede cambiar la orientacion de los rectangulos al lado derecho, hacer tres columnas, etc. En este caso es una retícula a dos columnas orientada al lado derecho con cabecera y un pie de página, cada una de las secciones encaja en un rectangulo aureo, habrá ocasiones en que esto no sea posible, porque, como habiamos comentado anteriormente, muchas veces no se puede tener el control total sobre el contenido, y la altura es la que se ve afectada, pero si definimos bien la anchura de las secciones, la proporción se seguirá

Página 6 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

17 Me gusta 6

manteniendo en gran medida. En caso de que sea un diseño líquido, se trbaja con porcentajes en lugar de pixeles.

Si quieren saber más sobre la sección áurea, aqui hay unos links interesantes:

La Divina Proporcion

Composición Divina

Espiral Logarítmica

Número Áureo

Espero que esta pequeña guia les sea util, Espero sus comentarios!!

Be Sociable, Share!

Tags: arte, aurea, diseño, divina, Internet, layout, perfecto, proporcion, reticula, web

About Mexside

View all posts by Mexside →

Subscribe

Subscribe to our e-mail newsletter to receive updates.

Autodesk® Building DesignDiseñe y construya mejores edificios con software BIM Autodesk

Mexico.Autodesk.com/BIMbuilding

2

Página 7 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

Related Posts:

Mercado Libre: ¿Plan con maña o error de usabilidad? •30 ejemplos de marketing de guerrilla •Fotografiando •Blog sobre música grupera •Nuevo retrato de Leonardo DaVinci •

← Mexside y WordPressWallpaper de Mexside →

37 Responses to “La Divina Proporción y el diseño web”

1.

Colormono abril 14, 2008 at 8:25 am #

Buen artículo! Bien explicado! Muchas gracias, me has sacado de una duda!

2.

jorge abril 14, 2008 at 10:24 am #

Ah muy bien, muy buen artículo

3.

embolicar abril 14, 2008 at 12:59 pm #

A que se refiere el diseño liquido?

4.

Gerardo abril 24, 2008 at 9:33 am #

Buena explicación, gran artículo. Interesante para manejar visualmente una página de inicio estática, aunque como bien decís, habrá oportunidades en las que no pueda ser utilizado al pie de la letra.

Gracias! Saludos

5.

¿eres el de la foto? abril 29, 2008 at 10:47 am #

Muy buen tip para un sitio web.

Página 8 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

Un saludo desde la Mixteca.

6.

pao junio 11, 2008 at 7:26 am #

me podria alguien mandar informacion sobre en donde los pintores usan la proporcion aurea?escriban gabypao_155@hotmail.com gracias!!!

7.

alex junio 27, 2008 at 11:39 am #

esta interezante el tema ,me sorprendo cada vez mas en los nuevos lugaes donde encuentro este nuemro

8.

alejandro agosto 12, 2008 at 4:33 pm #

yo solo lo busque por divercion pero me dejo facinado el ver en donde se puede encontrar este numero

9.

LORENA LA GRANDE agosto 27, 2008 at 3:09 pm #

ESTUVOMUY INTERESANTE TAL VES LE FALTO LA DECORACION MUY BIEN

10.

combarisa nossa maria fer. agosto 27, 2008 at 3:15 pm #

waooooooooooooooooooooooooooooo me encanto por fin personas utiles los amo m e han sacado de muchos problemas

11.

LORENA LA GRANDE agosto 27, 2008 at 3:20 pm #

ESTA MUY BONITA PERO LE HACE FALTA LA DECORACION LOS FELICITO

12.

mau octubre 25, 2008 at 1:25 am #

Que buen post, muchas gracias.

Página 9 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

13.

xxx noviembre 10, 2008 at 8:41 pm #

io no veo q desaparece esa sonrisa

14.

JUAN ANTONIO J.R. abril 28, 2009 at 1:22 am #

ツ esta muy bueno eso ツ “La Divina Proporción” Es la cuna de la vida…

15.

caro 3ero5 junio 16, 2009 at 4:23 pm #

muy buen artículo q sirbe mucho los felicito nico te amo yo caro carolina perdomo+nicolas nuñez

16.

ricaldi agosto 22, 2009 at 2:36 pm #

buenas tardes, los artículos que publican son interesante y nos ayudan a conocer más sobre el mundo del diseño. Les deseo lo mejor y sigan adelante.

gracias por todo. cuidense y un abrazo

17.

Juan paniagua enero 22, 2010 at 3:29 am #

Hola, podria haber puesto una referencia de donde ha sacado la foto de la gioconda, gracias.

18.

Salvador enero 26, 2010 at 3:18 pm #

La proporción áurea me parece ligada definitivamente a todo el Universo, a la creación, a lo superior, a lo infinito y, ¿porqué no? a Dios. Tal vez por ésto le llaman también proporción divina.

19.

Leandro marzo 6, 2010 at 11:17 am #

Página 10 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

Donde dice multiplicando deberia decir dividiendo. Ej. 1010 dividido 1,618. Saludos.

20.

lucero marzo 8, 2010 at 11:31 am #

bien echo

21.

carolina mayo 4, 2010 at 8:46 am #

me podrian decir cual es el intervalo para inicializar en la seccion aurea.???

22.

queti junio 22, 2010 at 5:54 pm #

emmmmmmm como que lo que salio no me sirvio para nada en mi tarea kuekkkk como no son capaces de poner la wea que lwe estan preguntando comoo tantooooooooo que les costaba a los shushetumareeeeeeeee haaa y carolina la aweona que esta arriba mio eso se busca en google po gila culia perejila y la concha…

se despide con cariño quieti .-

23.

phoenix julio 11, 2010 at 8:39 am #

El número de Dios ! Dios es número…

La divina proporción se revela para quienes saben ver y quienes buscan la verdad detras de las imágenes…

Una info muy importante aqui …

http://www.youtube.com/watch?v=j9e0auhmxnc

In lak’ech !

24.

carito octubre 28, 2010 at 12:50 pm #

yo tengo una pregunta!!!

la secuensia fibonacci puede llegar a ser el origen del origami?

25.

Página 11 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

Brenda noviembre 22, 2010 at 5:11 pm #

Hola:) esta info. me ayudo mucho en mi tareaa, estaaba perdida!!! muchas Gracias!

26.

Khaliis septiembre 1, 2011 at 7:46 am #

esta muii interesante el tema y mas si es de mate xD

27.

Ip marzo 12, 2012 at 5:53 pm #

Bien, cuida los acentos y la ortografía. saludos

28.

Yisus mayo 21, 2012 at 11:12 pm #

excelente explicacion amigo te felicito, me sivio mucho…quiero aplicarlo a arte sí…pero estoy seguro que esto me ayudará gracias y suerte!

Trackbacks/Pingbacks

meneame.net - abril 9, 2008 1.

La divina proporción y el diseño web…

Una miniguia sobre la construcci ón de una reticula para el diseño de un sitio web, basado en la divina proporción o proporción áurea…

La Divina Proporción y el diseño web at Luis Alarcón, Blog - abril 21, 2008 2.

[...] apropósito de esto, buscando hace unos días me encontré por casualidad con el blog Mexside en donde magistralmente hace un paralelo entre la Divina proporción y el diseño web y en simples [...]

Sección áurea en diseño web - octubre 13, 2008 3.

[...] Mexside (español) ejemplifican con una serie de esquemas las posibles aplicaciones de la sección áurea [...]

La proporcion aurea y el diseño web | Adventure Graphics - julio 7, 2009 4.

[...] La Divina Proporción y el diseño web [...]

La Divina Proporción y el diseño web | Mexside « Jaky - septiembre 4, 2009 5.

[...] La Divina Proporción y el diseño web | Mexside webnode [...]

Página 12 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

Web áurea - Escala gráfica - enero 12, 2010 6.

[...] el sitio Mexside se atrevieron a aplicar todo lo anterior al diseño web. Practicando sobre una intefaz 1024 x 768 [...]

La Proporción Aurea aplicada al Diseño Web de Hoteles - Blog Mirai - marzo 10, 2011 7.

[...] tanto, buscando información en la red, encontramos un post muy interesante que nos hizo probar sobre diferentes diseños [...]

La Divina Proporción y el diseño web | Mexside « Prueba jaky - mayo 5, 2011 8.

[...] La Divina Proporción y el diseño web | Mexside webnode [...]

Número de oro y la divina proporción « deSIGNALS - mayo 27, 2011 9.

[...] Fuente [...]

Leave a Reply

Name (required)

Mail (will not be published) (required)

Website

Submit Comment

Popular•Latest•Comments•

Top 10: Las máscaras mas “guapas” de la lucha libre mexicana abril 23, 2008 •

La Divina Proporción y el diseño web abril 9, 2008 •

Como hacer un brief informativo para un proyecto de diseño abril 17, 2008 •

Software esencial para diseñadores gráficos mayo 27, 2008 •

Página 13 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web

Serio problema con la tarjeta gráfica de las Macbook Pro octubre 6, 2008 •

Blogroll

• Fotografo de Bodas en GuanajuatoGabbagabba Design•Raza Grupera•Romita en Linea•

© 2012 Mexside. All Rights Reserved.

Mexisde

Página 14 de 14La Divina Proporción y el diseño web | Mexside

29/08/2012http://www.mexside.com/diseno-web/la-divina-proporcion-y-el-diseno-web