Planificando su sitio web. ¡Manos
a la obra!
Antes que nada
deberemos crear en nuestra computadora un entorno de trabajo.
Generaremos una carpeta independiente donde guardaremos
cuidadosamente todos nuestros trabajos destinados a ser publicados.
Tal vez parezca una obviedad, pero sin organización es imposible
llegar a buen puerto.
Es recomendable tener en nuestra carpeta “Mis documentos” una sub-carpeta
denominada “Mi-web” o similar en donde mantendremos almacenados
nuestros archivos, incluso luego de ser publicados en Internet.
Además de “Mi-web” podemos crear una carpeta adicional donde guardar
las imágenes, podemos llamarle por ejemplo “gráficos” o “imágenes”.
También podemos crear otras carpetas como “ebooks”, “textos”, etc. y
así tener clasificado y en orden todo el material que utilizaremos
en la confección de nuestro sitio.
Trabajando
con el editor de webs.
Vamos a comenzar a trabajar en nuestra web
utilizando aquí como base el programa Expresions Web, sucesor
del famoso Frontpage, junto con
Dreamweaver el mas utilizado por los webmasters a nivel mundial. Si no cuenta
con este recurso, puede seguir las directivas generales y realizar
su trabajo con el software que tenga a su alcance ya que lo que
explicamos es aplicable absolutamente a cualquier plataforma.
Le
recomendamos un programa gratuito y similar a los anteriores en:

www.kompozer.net
Una
duda habitual en quienes se sumergen en la creación de su propio website es conocer cuan imprescindible es dominar el Lenguaje de
Marcas de Hipertexto (HTML).
Para ellos buenas noticias: actualmente gracias a los nuevos
programas de edición, es posible crear y publicar nuestra web sin
prácticamente conocimientos de HTML.
No obstante siempre es positivo
tener una idea básica sobre el entorno en el que estamos trabajando.
Incluimos aquí la definición actualizada que brinda el organismo W3C
–artífice de las ultimas versiones del lenguaje- sobre la
universalidad de este lenguaje:
“HTML
– El lenguaje de marcas de hipertexto- es la “lingua franca”
utilizada para la publicación en la World Wide Web. Habiendo pasado
por diversas fases de evolución, el HTML de hoy cuenta con un amplio
rango de posibilidades que reflejan las necesidades requeridas por
la comunidad para satisfacer su amplia demanda de información a
través de la web.”
Programas
editores de HTML con entorno intuitivo WYSIWYG
Son programas que crean el código HTML a partir
de un trabajo en entorno visual. Su nombre WYSIWYG
deriva de las siglas en ingles “What
You
See
Is
What
You
Get”,
o sea “Lo que obtienes es lo que ves”. Se trata de editores en los
que usted diseña su web visualizando exactamente lo que será
presentado al usuario a través del navegador. En lugar de programar
directamente en el lenguaje, el diseñador gestiona directamente
desde un entorno de menús intuitivos. La información es
inmediatamente traducida por el software a su correcto HTML.
Colección de los tres editores WYGIWYS mas
exitosos del mercado
Preparando
el campo de juego
Antes de
comenzar a construir nuestro sitio web deberemos recolectar aquellos
elementos que necesitaremos para poner manos a la obra. Es momento
de esbozar el diseño de nuestra web. Abordaremos aquí la tarea
utilizando el programa MS Frontpage [ahora Expression Web], aunque
como hemos dicho esto pueda ser perfectamente extrapolado hacia
cualquier otro software similar.
Primeramente
vamos a introducir algunas directivas para ir preparando el formato
general. Comentaremos aquí una web de estilo simplificado. Luego
dedicaremos un espacio a websites algo mas complejos y finalmente le
enseñaremos las herramientas optimas y algunas ideas para la
construcción de un logo original para su empresa.
En este primer
paso de la edición de nuestra web es sumamente importante comenzar a
trabajar en un elemento esencial llamado “tablas”. Actualmente este
recurso ha sido paulatinamente sustituido por el CSS, pero si no
desea complicarse por el momento, siga estas simples instrucciones.
Las tablas son el
gran secreto que marca la diferencia entre una web profesional de
una que no lo es. Usted seguramente habrá visto websites muy
primitivos con texto e imágenes en una especie de longaniza que se
desliza verticalmente en su pantalla sin un formato definido y que
al cambiar de tamaño literalmente se “desarma”. Son sitios que no
utilizan “tablas”. Si bien aquí vamos a trabajar a continuación un
primer diseño de una sola página, utilizando “tablas” lograremos un
diseño apropiado y profesional. Estoy seguro que a usted le gustará
presentar un sitio profesional a su audiencia... aquí aprenderá como
hacerlo.
Epression Web, -nuestro generador de webs
recomendado- permite trabajar nuestros websites en un entorno ideal,
por una parte tenemos una primera pestaña [Normal]
que nos muestra una pantalla para un diseño completamente intuitivo
en base a menús e iconos, una segunda pestaña [HTML]
que nos da acceso a la visualización del código HTML para quienes
desean editar detalles directamente en el lenguaje, y finalmente una
tercera pestaña [Previsualizar]
mediante la cual podemos chequear la evolución de nuestro trabajo
tal cual aparecerá en el navegador del visitante [ver imagen]. No es
estrictamente necesario conocer el lenguaje de marcas [html] para
editar nuestra web en Frontpage u otros editores visuales, pero
siempre es recomendable poseer una idea básica sobre su significado
general.

No vamos aquí a
dar un curso de Expression Web o de cualquier otro editor de webs ya que
existen manuales específicos que jamás podríamos siquiera intentar
emular. A cambio queremos aprovechar este espacio para atacar
directamente -desde un software editor- los puntos cruciales que
consideramos hacen productiva a una página web. Por tanto damos por
hecho que usted entiende básicamente el funcionamiento general del
entorno Windows y específicamente el de alguno de los editores-web
WYSIWYG [What
You
See
Is
What
You
Get] del mercado.
La página web
que aquí editaremos corresponde a un sitio destinado a la
comercialización de un producto digital individual. Para el caso que
nos ocupa es imprescindible respetar un aspecto fundamental: la
velocidad.


|