C.

-Establecimiento del entorno para el

desarrollo de un sitio web.

• Herramientas para el desarrollo.

• Planificación del trabajo.
• Elementos gráficos y multimedia.

Herramientas para el desarrollo

Fases: diseño y maquetación Adobe photoshop: Esta aplicación sólo está disponible en
Windows, y es el más caro, aunque es el más usado y gracias a ello dispone de una gran
comunidad de usuarios con los que poder contar ante cualquier problema. Con él
crearemos el diseño, así como las imágenes que usemos en la maquetación. GIMP: Es el
equivalente de software libre más próximo a Photoshop. Al ser libre es posible
conseguirlo gratuitamente, y de hecho cualquier distribución GNU/Linux lo incluye. Al
igual que en Photoshop, con él podremos crear el diseño y las imágenes de la
maquetación HTML. También disponible en Windows Fase: maquetación INKSCAPE: El
equivalente en Windows es Adobe Fireworks. Es un excelente editor gráfico vectorial con
el que poder crear iconos, banners, y demás dibujos de forma muy fácil y sencilla, incluso
para aquellos que no tengan demasiados conocimientos en edición gráfica digital. Adobe
Fireworks: El editor de gráficos vectoriales más fácil de usar que he tenido la oportunidad
de usar, aunque no lo eché de menos cuando descubrí Inkscape. Al igual que su
compañero Photoshop es muy caro, y más aún si tenemos una gran alternativa gratuita
como es Inkscape. Fases: maquetación, programación cliente Dreamwever, Aptana,
Amaya: Estas herramientas las describí en mi anterior artículo sobre los principales
editores web del mercado, así que os remito a él para más información. Con ellos
crearemos el código HTML/CSS (maquetación), siendo Aptana la opción más profesional
para la programación cliente (JavaScript). Fase: programación servidor Zend Studio: Sin
duda el mejor IDE existente en el mercado para desarrollo web con PHP. Es comercial,
aunque no demasiado caro teniendo en cuenta la excelente herramienta que es. Además
es posible descargarlo desde la web de Zend para probarlo durante 30 días. Con él
crearemos fácilmente la aplicación web en PHP. Aunque podremos usar igualmente
cualquier editor. Una muy buena alternativa es Eclipce con el plugin PHP. Otra
aplicación muy útil que está muy ligada a Zend Studio es Zend Plantform, un módulo
para Apache que permite depurar una web directamente en el navegador (Internet
Explorer o Firefox), además de otras funciones más complejas, como alertas
configurables para que nos envíe un email por cada error ocurrido en la web, o cuando
un script sobrepase un tiempo determinado de ejecución, por ejemplo. Fase: prueba
local Apache Instalar un servidor web Apache en la máquina donde desarrollamos es
fundamental. De esta manera haremos pruebas rápidamente: editamos un fichero PHP,
vamos al navegador, actualizamos, y vemos los cambios. Fases: pruebas en local,
depuración Firefox /Firebug/ web devoloper extensión Firefox es sin duda la mejor
herramienta creada en los últimos tiempos para los desarrolladores web, y con Firefox
Planificación del trabajo

El trabajo de desarrollo de una página web comienza con el proceso de definición de una
estrategia y unos objetivo del sitio web, continúa con el diseño (en el que se define el
aspecto y el funcionamiento de la web) y avanza hasta la fase de producción y desarrollo
(durante la cual se crea la web); la funcionalidad se comprueba para ver si se cumplen
los objetivos establecidos y, al final, se publica el sitio). Planificar sitios Web Es un tópico
pero no deja de ser verdad: planificación y organización bien desde el primer momento
ayuda a ahorrar tiempo más adelante. La organización del sitio implica mucho más que
determinar el lugar en el que irá cada archivo: la planificación del sitio implica también
investigar los requisitos que debe cumplir el sitio, el perfil de la audiencia y los objetivos
de la web. Además, debe tener en cuenta requisitos técnicos tales como el acceso de los
usuarios, los navegadores,... Una vez que haya organizado la información y que haya
determinado una estructura operativa, podrá comenzar a crear el sitio. Determine qué
estrategia va a emplear y cuáles son los aspectos relativos a los usuarios que debe tener
en cuenta durante la planificación del sitio. Utilice el “mapa del sitio” de Dreamweaver
para establecer la estructura organizativa del sitio. En la ventana Sitio de Dreamweaver
puede añadir, borrar y renombrar los archivos y carpetas fácilmente para cambiar la
organización de la estructura. Consulte Introducción a la administración del sitio y la
colaboración. Cuando la creación y el desarrollo de la página web se haga entre varias
personas: Establezca sistemas que impidan que personas que puedan acceder a la
página que Vd. Está desarrollando sobrescriban archivos; consulte Configurar el sistema
de desprotección/protección. Utilice Design Notes para comunicarse con otros miembros
del equipo de desarrollo Web. Organizar la estructura del sitio web organizar la página
web cuidadosamente desde el primer momento puede ahorrarle frustración y tiempo más
adelante. Si comienza a crear documentos sin pensar en la jerarquía a la que
corresponden, puede terminar con una enorme carpeta llena de archivos y difícil de
administrar, o con archivos relacionados repartidos por media docena de carpetas con
nombres similares. La forma habitual de crear un sitio consiste en crear una carpeta en el
disco local con todos los archivos del sitio (lo que se conoce como sitio local) y crear y
editar los documentos dentro de dicha carpeta. Después podrá copiar dichos archivos en

un servidor web cuando esté preparado para publicar el sitio y permitir al público que lo
vea. Este enfoque es mejor que crear y editar archivos en la propia página web en vivo,
ya que le permite comprobar cambios en el sitio local antes de hacerlos públicos y,
cuando haya terminado, cargar los archivos del sitio local y actualizar todo el sitio público
de una vez. Divida la página web en categorías. Coloque las páginas relacionadas en
una misma carpeta. Utilice subcarpetas cuando sea necesario. Este tipo de organización
facilitará el mantenimiento y la navegación por el sitio. Decida dónde desea colocar
elementos como imágenes y archivos de sonido. Los diseñadores sitúan a veces todos
los elementos que desean utilizar en un sitio y que son ajenos a HTML en una carpeta
llamada Activos. Diseñar el esquema de navegación Otra área en la que merece la pena
planificar es la navegación. Cuando diseñe su página web, piense en la experiencia que
le gustaría que tuvieran sus visitantes. Las búsquedas y los índices facilitan a los
visitantes la localización de la información que están buscando. Diseñe la apariencia que
tendrá la navegación. La navegación debe ser homogénea en toda la web. Si sitúa una
barra de navegación a lo largo de la parte superior de la página principal, intente
mantenerla en ese lugar en todas las páginas vinculadas.
Elementos y gráficos multimedia

Una pequeña introducción a multimedia dentro del mundo de computación y los elementos que
conforman su estructura.
El término Multimedia en el mundo de la computación es la forma de presentar información que
emplea una combinación de texto, sonido, imágenes, vídeo y animación.
<img height="122" alt="Multimedia"<br /> src="/images/cds.jpg" width="103"
class="lateral"/>Entre las aplicaciones informáticas multimedia más comunes podemos
mencionar juegos, programas de aprendizaje y material de referencia.
La mayoría de las aplicaciones multimedia incluyen asociaciones predefinidas conocidas como
hipervínculos o enlaces, que permiten a los usuarios moverse por la información de modo
intuitivo.
La conectividad que proporcionan los hipertextos hace que los programas multimedia no sean
presentaciones estáticas con imágenes y sonido, sino una experiencia interactiva infinitamente
variada e informativa.
Las aplicaciones multimedia son programas informáticos, que suelen estar almacenados en
CD-ROMs y claro que pueden residir en páginas de Web.
La vinculación de información mediante enlaces se consigue mediante programas o lenguajes
informáticos especiales como el HTML empleado para crear páginas web.
Las aplicaciones multimedia suelen necesitar más memoria y capacidad de proceso que la
misma
información representada exclusivamente en forma de texto.
Una computadora multimedia también necesita memoria adicional para ayudar al CPU a
efectuar cálculos y permitir la representación de complejos gráficos en la pantalla. Además
necesita un disco duro de alta capacidad para almacenar y recuperar información multimedia,
así como una unidad de cd-rom o acceso al web para obtener los archivos necesarios.
ELEMENTOS VISUALES
Cuanto mayor y más nítida sea una imagen, más difícil es de presentar y manipular en la
pantalla de
una computadora.
Las fotografías, dibujos, gráficos y otras imágenes estáticas deben pasarse a un formato que el
ordenador pueda manipular y presentar. Entre esos formatos están los gráficos de mapas de
bits y los gráficos vectoriales.
Los gráficos de mapas de bits almacenan, manipulan y representan las imágenes como filas y
columnas de pequeños puntos. En un gráfico de mapa de bits, cada punto tiene un lugar
preciso definido por su fila y su columna. Algunos de los formatos de gráficos de mapas de bits
más comunes son el Graphical Interchange Format (GIF), el Tagged Image File Format (TIFF)
y el Windows Bitmap (BMP).
Los gráficos vectoriales emplean fórmulas matemáticas para recrear la imagen original.
En un gráfico vectorial, los puntos no están definidos por una dirección de fila y columna, sino
por la
relación espacial que tienen entre sí.
Como los puntos que los componen no están restringidos a una fila y columna particulares, los
gráficos vectoriales pueden reproducir las imágenes más fácilmente, y suelen proporcionar una
imagen mejor en la mayoría de los monitores.
Entre los formatos de gráficos vectoriales figuran el Encapsulated Postscript (EPS), el Windows
Metafile
Format (WMF), el Hewlett- Packard Graphics Language (HPGL), archivos de Macromedia
href="http://www.maestrosdelweb.com/editorial/multime/flash" >Flash (SWF) y el formato
Macintosh para archivos gráficos, conocido como PICT.
Para obtener, formatear y editar elementos de vídeo hacen falta componentes y programas
informáticos especiales. Los archivos de vídeo pueden llegar a ser muy grandes, por lo que
suelen reducirse de tamaño mediante la compresión.
Algunos formatos habituales de compresión de vídeo son el Audio Video Interleave (AVI), el
Quicktime y el Motion Picture Experts Group (MPEG o MPEG2).
Estos formatos pueden comprimir los archivos de vídeo hasta un 95%, introduciendo diversos
grados de borrosidad en las imágenes. Las aplicaciones multimedia también pueden incluir
animaciones. Éstas son especialmente útiles para simular situaciones de la vida real, como por
ejemplo el movimiento de un vehículo automotor.
La animación también puede realzar elementos gráficos y de vídeo añadiendo efectos
especiales como la metamorfosis, el paso gradual de una imagen a otra sin solución de
continuidad.

ELEMENTOS DE AUDIO

El sonido, igual que los elementos visuales, tiene que ser grabado y formateado de forma que
la
computadora pueda manipularlo y usarlo en presentaciones.
Algunos tipos frecuentes de formato audio son los archivos de forma de onda (WAV), el
Musical Instrument Digital Interface (MIDI), El MPG Layer
3(href="http://www.maestrosdelweb.com/editorial/multime/mp3"
>MP3) y el Transform-domain Weighted Interleave Vector Quantization (
href="http://www.maestrosdelweb.com/editorial/multime/vqf" >VQF).
Los archivos WAV, MP3 y VQF almacenan los sonidos propiamente dichos, como hacen los
CD musicales
o las cintas de audio. Los archivos WAV pueden ser muy grandes y requerir compresión, lo que
se ha
logrado con el MP3 y el VQF.
Los archivos MIDI no almacenan sonidos, sino instrucciones que permiten a unos dispositivos
llamados
sintetizadores reproducir los sonidos o la música.
ELEMENTOS DE ORGANIZACIÓN
Los elementos multimedia incluidos en una presentación necesitan un entorno que empuje al
usuario a aprender e interactuar con la información.
Entre los elementos interactivos están los menús desplegables, pequeñas ventanas que
aparecen en la
pantalla del ordenador con una lista de instrucciones o elementos multimedia para que el
usuario elija.
Las barras de desplazamiento, que suelen estar situadas en un lado de la pantalla, permiten al
usuario
moverse a lo largo de un documento o imagen extenso.

Los hipervínculos o enlaces conectan creativamente los diferentes elementos de una

presentación multimedia a través de texto coloreado o subrayado o por medio de iconos,
que el usuario señala con el cursor y activa pulsándolos con el mouse.