Elaboracin de

Pginas Web
Utilizar los elementos fundamentales del diseo
Ing. Lizette Martinez
CBTIS 269

Qu es el diseo?
Proceso de creacin visual con un propsito, el cual
cumple con exigencias prcticas.
Un buen diseo es la mejor expresin visual de la
esencia de `algo` cuya creacin no debe ser solo
esttica sino tambin funcional.

Los siguientes elementos son las

bases que construyen el Diseo:

Linea
Una lnea es definida como una marca con longitud
y direccin, creada mediante un punto que se
mueve a lo largo de una superficie. Una lnea puede
variar en longitud, ancho, direccin, curvatura y
color.
La lnea puede ser de dos dimensiones (una lnea de
lpiz sobre papel), o tres dimensiones implcitas

Forma
Una figura plana o una forma es creada cuando
lneas actuales o implcitas se encuentran alrededor
de un espacio. Un cambio en el color o el sombreado
puede definir una forma.
Las formas pueden ser clasificadas en varios tipos:
geomtricas (cuadrado, tringulo, crculo) y
orgnicas(irregulares en contorno)

Tamao
Este se refiere a las variaciones de las proporciones
de los objetos, lneas o formas. Hay una variacin de
tamao en objetos ya sean reales o imaginarios.

Color
El Color es el carcter percibido de una superficie de
acuerdo con la longitud de onda o la luz reflejada desde
esta. El Color posee tres dimensiones: TINTE (otra
palabra para color, indicada por su nombre as como rojo
o amarillo),VALOR (su luminosidad o oscuridad),
INTENSIDAD(su brillo u opacidad).

Textura
La Textura es la
forma como se
siente la superficie
(textura actual) o
como puede ser
observada (textura
implcita).
Las Texturas son
descritas con
palabras como
spero, sedoso o
rugoso.

Texturas en diseo web

El uso de Texturas en diseo web puede ser muy
sutil, quizs en un anuncio, o pueden ser en
cualquier otro punto del diseo. En algunos casos,
las texturas se utilizan para enfatizar ciertas partes
del diseo. Debido a la versatilidad de las texturas,
se pueden utilizar en combinacin con muchos otros
elementos de diseo, como la tipografa, los colores
y la iluminacin.

Valor
El Valor es que tan oscuro o claro se ve algo.
Podemos alcanzar cambios de valores en el color por
medio de la adicin de blanco o negro a dicho color.
Claroscuro usa valores en los dibujo mediante
contrastes de claros y oscuros en una composicin

Balance
El Balance es el sentido de equidad visual en
una forma, figura, valor, color, etc.
Existen tres tipos de balance:
Simtrico Este tipo de balance se ve en
los casos en que los diferentes elementos
componentes de la pgina web se
encuentran dispuestos de acuerdo a
alguna de las clases de simetra. (vertical y
horizontal)
Asimtrico Es cuando los elementos
componentes se colocan balanceados pero
sin seguir ninguna simetra.
Fuera de balance En estos casos, los
elementos son colocados en forma

Balance simtrico
Simetra horizontal
Como est descrito anteriormente, la simetra
horizontal es bastante rara en el diseo web
todo el contenido de la misma puede ser incluida sin
necesidad de que el usuario deba emplear las barras
de desplazamiento, el diseador puede basar su
creacin en la simetra horizontal

Balance simtrico
Simetra horizontal

En ella vemos que el men est compuesto por lneas horizontales

que abarcan la totalidad del ancho de la pgina y que el
logotipose encuentra ubicado en el pie de la pgina y tambin se
encuentra dispuesto de acuerdo a la simetra horizontal del resto
de la composicin.

Balance simtrico
Simetra vertical
Una pgina web basada en simetra vertical implica
que sus contenidos se encuentran distribuidos
endos o ms columnasms o menos definidas que
ocupan todo el largo de la pgina

Balance simtrico
Simetra vertical

Tal es el caso del siguiente ejemplo, donde puede verse

claramente que el contenido principal de la pgina se encuentra
dividido en dos columnas simtricas, debajo de un encabezado
horizontal.

Balance simtrico
Simetras vertical y horizontal combinadas

Balance asimtrico
Los diferentes elementos que componen una pgina
web se encuentran equilibrados o balanceados pero sin
seguir un patrn simtrico.

Fuera de balance
Esto se hace en forma deliberada, buscando el impacto
visual.
Un ejemplo de pgina sin balance es el siguiente, donde
el creador ha decidido romper el equilibrio tanto
horizontal como vertical, consiguiendo un efecto
informal y abstracto muy llamativo.

Contraste
El contraste es la yuxtaposicin (fusin) de los
elementos opuestos.

Enfasis
El nfasis es usado para crear ciertas partes de sus
trabajos artsticos a travs de llamado atencin de
manera especial. El centro de inters o punto foco es el
lugar del dibujo que le invita a enfocar su mirada

Proporcion
La Proporcin describe el tamao, ubicacin o el
monto de una cosa comparada con otra.

Patrones
LosPatronesson
creadosmediantela
repeticin de un
elemento (lnea,
forma o color) una y
otra vez.

Gradacin
La Gradacin del color es desde gamas clidas a
fras y de tonos oscuros a claros

Composicin
Lacombinacindedistintos elementos para formar
un todo.