El diseño de
páginas Web es una amplia área de aplicación
del
diseño
gráfico en la cual se
integran conocimientos propios del diseño
como son la composición, el uso de color y
la
tipografía con
conocimientos técnicos del medio como son
los lenguajes
HTML
(HiperText Markup Language)
y
CSS
(Cascading Style Sheets),
así como conocimientos sobre
usabilidad,
accesibilidad y
organización de un sitio web.
El diseño de
páginas web trata básicamente de realizar un
documento con información hiperenlazado con
otros documentos y asignarle una
presentación para diferentes dispositivos de
salida (en una pantalla de ordenador, en
papel, en un teléfono móvil, etc). Estos
documentos o páginas web pueden ser creadas:
-
creando
ficheros de texto en
HTML.
-
utilizando un programa de creación de
páginas.
-
utilizando lenguajes de programación del
lado del servidor para generar la página
web
Etapas
Para el
diseño de páginas web debemos tener en
cuenta dos etapas:
La primera
es el diseño visual de la información que se
desea editar. En esta etapa se trabaja en el
papel distribuyendo el texto, los gráficos,
los vínculos a otros documentos y otros
objetos multimedia que se consideren
pertinentes.
La segunda,
una vez que se tiene este boceto se pasa a
'programar' la página web. Para esto, y
fundamentalmente para manejar los vínculos
entre documentos, se creó el lenguaje de
marcación de hipertexto o
HTML.
Los enlaces que aparecen subrayados en este
documento y otros de Wikipedia son ejemplos
de hipertexto, puesto que al pulsar sobre
ellos conducen a otras páginas con
información relacionada.
El HTML
consta de una serie de etiquetas que
estructuran el texto y son presentados en
forma de
hipertexto por
agente
de usuario o navegadores.
Esto se puede hacer con un simple editor de
textos (debe guardarse como texto plano, sin
ningún tipo de formato y con extensión .html
o .htm). Aprender
HTML
es relativamente fácil, así que es sencillo
crear páginas web de este modo. Esta era la
única manera de generarlas hasta que
aparecieron, a mediados de 1996, algunos
editores visuales de
HTML,
como
MS
FrontPage y
Macromedia Dreamweaver.
Con estas herramientas no es absolutamente
necesario aprender
HTML
(aunque sí aconsejable), con lo cual el
desarrollador se concentra en lo más
importante, el diseño del documento.
Todo esto
teniendo en cuenta el nivel de programación
en el diseño de las aplicaciones y del
impacto visual que se quiere generar en el
usuario.
Fundamentos
Un correcto
diseño web implica conocer cómo se deben
utilizar cada una de la etiquetas permitidas
en HTML, es decir, hacer un uso correcto de
este lenguaje dentro de los estándares
establecidos por la
W3C
y en lo referente a la
web
semántica. Debido a la
permisibilidad de algunos navegadores web
como
Internet
Explorer, esta premisa
original se ha perdido. Por ejemplo, este
navegador permite que no sea necesario
cerrar las etiquetas del marcado, utiliza
código propietario, etc. Esto impide que ese
documento web sea universal e independiente
del medio que se utilice para ser mostrado.
La
web
semántica, por otra parte,
aboga por un uso lógico de las etiquetas
según el significado para el que fueron
concebidas. Por ejemplo se utilizará la
etiqueta
<P>
para marcar párrafos, y
<TABLE>
para tabular datos (nunca para disponer
visualmente los diferentes elementos del
documento). En su última instancia, esto ha
supuesto una auténtica revolución en el
diseño web puesto que apuesta por separar
totalmente el contenido del documento de la
visualización.
De esta
forma se utiliza el fichero HTML únicamente
para organizar y estructurar la información
y las
hojas de
estilo CSS para indicar
como se mostrará dicha información en los
diferentes medios (como por ejemplo, una
pantalla de ordenador, un móvil, impreso en
papel, leída por un sintetizador de voz,
etc...). Por lógica, esta metodología
beneficia enormemente la
accesibilidad del
documento.
También
existen páginas dinámicas, las cuales
permiten mayor interactividad entre la web y
el visitante, proporcionándole herramientas
dinámicas tales como buscadores, chat,
foros, sistema de encuestas, etc. y poseen
de un panel de control de administración de
contenidos. Este permite crear, actualizar y
administrar cantidades ilimitadas de
contenido en la misma.
