Miércoles, 12 Jul 2006
La World Wide Web permite una manera más organizada de acceder a la información
disponible en Internet, presentando una interfaz amigable con el usuario mediante
navegadores como Netscape, Mosaic y Microsoft Internet Explorer.
El surgimiento de la World Wide Web ha ayudado a un crecimiento considerable
de Internet en la actualidad. Compañías pequeñas, empresas
grandes, ayuntamientos, estados, gobiernos de distintos países, universidades,
bibliotecas, están presentes en Internet.
El presente trabajo tiene como objetivo mostrar las maravillosas capacidades
de la World Wide Web, en que consiste la misma, sus utilidades, como así
también los criterios a tener en cuenta en el diseño para que
un sitio Web tenga éxito.
Por otro lado intenta hacer un aporte a trabajos nombrados en la página
54, ya que algunos hacen mención del tema o lo muestran desde una visión
particular.
Este trabajo trata de dar un enfoque actual y personal, tratando de ser útil
a quien este interesado en el tema.
Unidad 1 "La Word Wide Web"
1.1. Internet
Internet es una gran red de redes, también llamada Supercarretera de
la información. Es el resultado de la interconexión de miles de
computadoras de todo el mundo. Todas ellas comparten los protocolos de comunicación,
es decir que todos hablan el mismo lenguaje para ponerse en contacto unas con
otras.
Los servicios básicos ofrecidos ahora por Internet son correo electrónico,
noticias en red, acceso a computadoras remotas y sistemas de adquisición
de datos, y la capacidad para transferir información entre computadoras
remotas.
1. 2. Historia de Internet
Empezó en los Estados Unidos de América en 1969, como un proyecto
puramente militar. La Agencia de Proyectos de Investigación Avanzados
de Defensa (DARPA) desarrolló una red de computadoras llamada ARPANET,
para no centralizar los datos, lo cual permitía que cada estación
de la red podía comunicarse con cualquier otra por varios caminos diferentes,
además presentaba una solución para cuando ocurrieran fallas técnicas
que pudieran hacer que la red dejase de funcionar.
Los sitios originales que se pusieron en red eran bases militares, universidades
y compañías con contratos del Departamento de Defensa. Conforme
creció el tamaño de esta red experimental, lo mismo sucedió
con las precauciones por la seguridad. Las mismas redes usadas por las compañías
y las universidades para contratos militares se estaban volviendo cada vez más
accesibles al público
Como resultado, en 1984, ARPANET se dividió en dos redes separadas pero
interconectadas. El lado militar fue llamado MILNET. El lado educativo todavía
era llamado técnicamente ARPANET, pero cada vez se hizo mas conocida
como Internet.
En mayo de 1995, entre 35 y 45 millones de personas usaban Internet y este
número fue creciendo mes a mes en un 10 a 15%. Las estimaciones actuales
colocan al número de personas en Internet en enero de 1997 en 62 millones
de usuarios individuales.
Podemos decir que el resultado final es que lo que comenzó como un proyecto
de investigación gubernamental y educativo ahora se ha convertido en
uno de los medios de comunicación más importante de la actualidad.
Nunca antes había sido posible tener acceso a tantas personas de culturas
y antecedentes tan variados.
Además podemos decir que la Internet no es gratis, la pagamos básicamente
nosotros, los contribuyentes, centros de investigación, educacionales,
institutos y universidades, las empresas comerciales, nosotros a través
del incremento en sus productos y la publicidad.
1. 3. Historia de la Web
La Web es una idea que se construyo sobre la Internet. Las conexiones físicas
son sobre la Internet, pero introduce una serie de ideas nuevas, heredando las
ya existentes.
Empezó a principios de 1990, en Suiza en el centro de investigación
CERN (centro de Estudios para la Investigación Nuclear) y la idea fue
de Tim Berners-Lee, que se gestó observando una libreta que él
usaba para añadir y mantener referencias de cómo funcionaban los
ordenadores en el CERN.
Antes de la Web, la manera de obtener los datos por la Internet era caótica:
había un sinfín de maneras posibles y con ello había que
conocer múltiples programas y sistemas operativos. La Web introduce un
concepto fundamental: la posibilidad de lectura universal, que consiste en que
una vez que la información esté disponible, se pueda acceder a
ella desde cualquier ordenador, desde cualquier país, por cualquier persona
autorizada, usando un único y simple programa. Para que esto fuese posible,
se utilizan una serie de conceptos, el más conocido es el hipertexto.
Con Web los usuarios novatos podrían tener un tremendo poder para hallar
y tener acceso a la riqueza de información localizada en sistemas de
cómputos en todo el mundo.
Este solo hecho llevó un avance tremendo de Internet, un ímpetu
tan grande que en 1993 World Wide Web creció un sorprendente 341000%,
tres años después, en 1996, todavía sé esta duplicando
cada 50 días.
1. 4. ¿Qué es la World Wide Web o la Web?
La World Wide Web consiste en ofrecer una interface simple y consistente para
acceder a la inmensidad de los recursos de Internet. Es la forma más
moderna de ofrecer información. el medio más potente. La información
se ofrece en forma de páginas electrónicas.
El World Wide Web o WWW o W3 o simplemente Web, permite saltar de un lugar
a otro en pos de lo que no interesa. Lo más interesante es que con unas
pocas ordenes se puede mover por toda la Internet.
Para entender lo que es la Web debemos tener una idea de lo que es el Hipertexto.
1. 5. Hipertexto
Hipertexto son datos que contienen enlaces (links) a otros datos.
En el lenguaje Web, un documento de hipertexto no es solo algo que contiene
datos, sino que además contiene enlaces a otros documentos.
Un ejemplo simple de hipertexto es una enciclopedia que al final de un tema
tiene referencias de algún tema en especial o referencias bibliográficas
a otros textos.
En Hipertexto, el ordenador hace que seguir esas referencias sea facilísimo.
Esto implica que el lector se puede saltar la estructura secuencial del texto
y seguir lo que más le gusta.
En Hipertexto se pueden hacer enlaces en cualquier lugar, no sólo al
final.
Cada enlace tiene una marca que lo destaca, puede estar resaltado, subrayado
o puede estar identificado por un número.
El hipertexto no esta limitado a datos textuales, podemos encontrar dibujos
del elemento especificado, sonido o vídeo referido al tema. Estos documentos
que tienen gran variedad de datos, como sonido, vídeo, texto, en el mundo
del hipertexto se llama hipermedia.
El hipertexto es una herramienta potente para aprender y explicar. El texto
debe ser diseñado para ser explorado libremente y así se consigue
una comunicación de ideas más eficientes.
1.6. Funcionamiento de la Web
Una vez que el usuario esta conectado a Internet, tiene que instalar un programa
capaz de acceder a páginas Web y de llevarte de unas a otras siguiendo
los enlaces.
El programa que se usa para leer los documentos de hipertexto se llama "navegador",
el "browser", "visualizador" o "cliente" y cuando
seguimos un enlace decimos que estamos navegando por el Web.
Así, no hay más que buscar la información o la página
deseada y comenzar a navegar por las diferentes posibilidades que ofrece el
sistema.
Navegar es como llaman los usuarios de la red a moverse de página en
página por todo el mundo sin salir de su casa.
Mediante los Navegadores modernos podemos, acceder a hojas de calculo, base
de datos, vídeo, sonido y todas las posibilidades más avanzadas.
Pero el diseño de páginas debe mantener un equilibrio entre utilizar
todas las capacidades y la posibilidad de ser leídas por cualquier tipo
de Navegador.
El visualizador nos presentará perfectamente cualquier página
".txt" generada por cualquier editor, y los links entre documentos
sólo requieren un simple y sencillo comando. Y aún así
podremos conseguir el tipo y tamaño de letra y colores de texto y fondo
que queramos, simplemente configurando el visualizador.
1. 6. 1. Navegadores que se utilizan
Los más conocidos son el Explorer de Microsoft, Mosaic y el Netscape
de Netscape Communications Corporation en Estados Unidos y otros países.
Tienen capacidades diferentes y es importante cuando se crea una página
Web, además de un buen diseño, tener en cuenta la compatibilidad,
es decir, programar páginas de modo que las acepte cualquier Navegador.
Netscape es el que soporta más y mejores efectos, incluido programas
embebidos en el propio texto (versión 2.0 en adelante), escritos en lenguaje
Java (algo muy parecido al lenguaje C), que son interpretados por el visualizador,
y que permiten realizar páginas "inteligentes".
Conectándose a Internet, con un visualizador Netscape o Explorer, además
de ver documentos HTML se puede recibir y enviar correo electrónico,
recibir y enviar NEWS (noticias), visitar los servidores GOPHER (servidores
de ficheros), y acceder a servidores FTP (más servidores de ficheros)
tanto en entrada como en salida, todo ello con el mismo programa. También,
como no, se pueden imprimir los documentos visualizados. Casi todos suelen ser
" WYSIWYG".
1. 7. ¿Cómo encuentra la gente una página Web?
1. 7. 1. Sistemas de Búsqueda
En la Web no existe un directorio centralizado. Para acceder a una página
directamente se debe conocer la dirección exacta donde se encuentra.
Pero lo más habitual no es conocer esa dirección exacta, sino
tener una idea del tema en el que se está interesado y sobre el que se
necesite información.
Existen empresas como Yahoo, Altavista, Olé, Ozú, etc., que han
creado diferentes Sistemas de Búqueda, para evitar la navegación
a la deriva.
Estas consisten en un tipo de páginas Web donde se puede escribir una
palabra o una breve referencia que defina la búsqueda que se quiere realizar.
El sistema consulta sus datos y te muestra enlaces con las páginas Web
que contienen la referencia escogida. Existen diferentes buscadores y cada uno
de ellos ha creado su propio directorio. Unos son más completos, otros
más organizados, otros son más exigentes y selectivos en su información,
cada uno tiene características propias, pero todos ellos ayudan a mantener
el rumbo.
1. 8. ¿Qué puede contener una Página Web?
Hemos mencionado el tipo de información que puede contener una página
Web: texto, imagen, sonido, vídeo, e incluso, mundos 3D y animación.
El usuario no se limita a buscar y encontrar la información de un modo
pasivo, sin intervenir. La mayor innovación de las páginas Web
se traduce en una sola palabra: Interactividad. Una página Web puede
contener elementos que permiten una comunicación activa entre el usuario
e información, la página responderá a sus acciones.
Por ejemplo:
* Formularios: a través de los cuales la empresa podrá disponer
de un modo de solicitud de información, un buzón de sugerencias
o posibilidad de realizar subscripciones o pedidos
* Accede y manejar bases de datos de todo tipo: Consultar por ejemplo, una
lista de todos los fondos de inversión en España.
* Participar en los juegos más diversos. Echar una partida de Bingo
o participar en un divertido juego de búsqueda por el ciberespacio.
* Sistemas de Búsquedas: Encontrar las páginas que contienen
información que se necesita en los principales buscadores españoles
o localizar una empresa en las páginas amarillas electrónicas.
1. 9. ¿Qué puede hacer una empresa a través de
una página web?
* Proveer a clientes la información acerca de sus productos y servicios,
y actualizarla a medida que se van desarrollando nuevos aspectos de ellos. Esto
es mucho más sencillo y económico que hacer llamadas telefónicas,
imprimir nuevos catálogos o hacer publicaciones de prensa cada vez que
lo requiera.
* Evaluar a sus clientes actuales y desarrollar nuevas oportunidades de negocio.
Mediante encuestas publicadas dentro de su página Web, puede obtener
una respuesta de sus clientes actuales, y así conocer y abordar mejor
sus inquietudes y sugerencias respecto al servicio que están recibiendo
de su empresa. Igualmente, puede mostrar nuevos productos e ideas y conseguir
la opinión de los visitantes de su página, que son a la vez sus
clientes potenciales. De esta manera, puede crear una base de datos de clientes
(actuales y potenciales) para luego enviarle nuevas informaciones a través
de correos electrónicos con costos irrisorios.
* Otorgar información detallada y específica acerca de sus productos
(manuales de instrucción) y de los procesos de comercialización
(adquisición y compra) de los mismos. Si su público desea saber
más sobre la empresa, la página Web es el mejor vehículo
para hacerle llegar esa información.
1. 10. Dominio
En el supuesto de estar buscando información sobre una empresa determinada,
el primer impulso sería teclear el nombre de la empresa seguido del sufijo
es o com, los más habituales.
Si se realiza esta acción sólo se encontrará a la empresa
en esa dirección si se dispone de dominio propio, es decir si la empresa
tiene un servidor propio o ha alquilado espacio en un servidor dedicado a la
gestión y mantenimiento de páginas Web. Si no es así, si
la empresa simplemente se encuentra situada en el dominio de otra compañía,
será más difícil de localizar, ya que tendrá una
dirección más complicada, difícil de encontrar y memorizar.
Además, si la empresa tiene dominio propio, en el caso de que decida
cambiar de compañía a la que alquile el espacio, la dirección
se mantiene, ya que el dominio propio pertenece a la empresa que lo usa y puede
instalarse en otro host sin problemas. Si no tiene dominio propio y decide cambiar
de proveedor de Internet, su dirección de Internet cambiará y
tendrá que reflejarlo en su publicidad.
El dominio propio ofrece una imagen más profesional y competente. Los
clientes agradecerán que se les proporcione un acceso sencillo y consistente
a su información.
1. 11. URLs
Localizador Uniforme de Recursos (URL; Uniform Resource Locator )es una dirección
especial usada por los navegadores Web, para tener acceso a información
en Internet. El URLs especifica el ordenador en que se hospeda, el directorio,
y el nombre del fichero A través de estas direcciones o URLs vamos a
poder conectar los diferentes objetos (no solo texto), aunque se acceda a ellos
a través de diferentes protocolos. Una cualidad de los URLs es que permiten
utilizar los datos ya existentes en la Internet (Wais, Gofher, ftp) y así
es como consigue la Web envolver a la Internet sencilla y eficazmente
Si no sabemos el URLs, se puede ir a al URL de alguno de los índices
de Búsqueda.
Unidad 2 "Construcción de Páginas Web" - Premisas
básicas para crear un Web de éxito
2. 2. 1. Un buen contenido
El contenido dependerá directamente de la temática del Web. La
gran mayoría de los usuarios que acuden a un sitio Web lo hacen en busca
de información. Da igual como se presente dicha información (texto,
imágenes, vídeo, audio) pero un Web debe aportar contenido. Es
importante tener en cuenta que WWW es un medio de comunicación distinto
a los que hasta ahora conocíamos (televisión, radio, prensa, etc.);
el navegante pasa de página en página Web a ritmo de clic de ratón,
y generalmente pasa poco tiempo en una misma página. Por lo tanto no
se debe abusar de la información textual, ya que son muy pocos los visitantes
que se leen completamente una página Web. Siempre se ha dicho que una
imagen vale mas que mil palabras, y aunque una página Web no es un programa
de televisión, las imágenes siempre son importantes.
2. 2. 2. Un buen Diseño
No es necesario ser un gran diseñador para crear paginas Web con un
mínimo de sensibilidad gráfica. A veces, un diseño simple
se agradece mucho más que una Web inundada de "gifs" en movimiento.
El utilizar una tipografía determinada, unos colores adecuados, iconos,
fotos, etc. puede convertir la experiencia de visitar un Web en algo mucho más
agradable.
Es importante en el aspecto del diseño de un Web la estructuración
del mismo. Facilitar la navegación mediante menúes, iconos, mapas
y otros elementos puede evitar que más de un visitante se pierda dentro
de un Web. En el caso de crear un Web excesivamente grande y complejo resulta
de ayuda para el visitante la inclusión de mapas (esquemas con enlaces
de hipertexto que representan todo el Web) para no perderse.
2. 2. 3. Las imágenes en el diseño
La velocidad de acceso al Web está siempre muy reñida con el
diseño. Es frecuente el caso en que, para embellecer un Web se utilicen
muchas imágenes (en formatos gif o jpeg) de gran tamaño. Esto
obliga a los usuarios con conexiones lentas a sufrir largas esperas hasta que
la información se presente en pantalla, y eso es un riesgo porque más
de dos saltarán a cualquier otra dirección Internet antes de perder
su tiempo.
La velocidad de la Web también dependerá en gran medida de lo
saturadas que estén las líneas de acceso a nuestro centro proveedor
de presencia en Internet (en resumen, el servidor donde se aloja el Web). Sin
embargo este es un problema que se escapa del ámbito del diseño.
2. 2. 4. Elementos Interactivos
La interactividad es fundamental para el éxito de un Web. Se debe evitar
la sensación "lectura de periódico" que puede causar
en un visitante un Web pasivo y lineal. Además la interactividad puede
beneficiar a quien publica el Web ya que a través de formularios podrá
conocer mejor los perfiles de quienes pasan por las páginas.
Podemos calificarlos como aspectos filosóficos a tener en cuenta en
el diseño de un Web.
2. 3. Etapas de Desarrollo de un proyecto de sitio Web
El desarrrollo de un proyecto de sitio Web puede dividirse en tres etapas principales:
1. Prediseño,
2. Diseño,
3. Instalación y prueba.
El punto de vista desde el cual se analiza el proceso de diseño no es
desde la interrelación usuario-tecnología, sino como interacción
humana, mediatizada por la técnología. Es decir, entender a la
Web como medio de comunicación entre personas. Esto nos debe ayudar a
pensar permanentemente en "el otro", la persona invisible y desconocida
para quien hacemos la página Web.
De todas las palabras que utilizamos al hablar de Internet, la que más
deben tener en cuenta los diseñadores es la que designa al acto de instalar
un sitio, pensar en el público, pensar en cómo piensa el público.
Etapa de la conceptualización
- Planificar la Web
* Objetivos AJUSTE
* Público Se corrigen los
* Contenido elementos de
* Estructura prediseño que no
* Visualización cumplen los requerimientos previstos.
Etapa de armado de páginas y configuaración del sitio
"Hacer" la Web"
AJUSTE
* Diseño de gráficos Se corrigen los
* Diseño de páginas elementos de
* Establecer links diseño que no internos y externos funcionan
* Incorporar multimedia correctamente o no se
* Incorporar archivos. visualizan de acuerdo a lo esperado
Etapa de puesta en marcha
Correcciones y ajustes finales
"Hacer que todo funcione"
* Prueba de todos los links
* Prueba de funcionamiento de todos los elementos de multimedia.
* Prueba de funcionamiento de formularios, e-mail, buscadores, etc.
1. Prediseño
A la etapa de Prediseño o conceptualización podemos dividirla
en cinco componentesstro análisis. Ellos son: objetivos, público,
contenidos, estructura y visualización. Estos interactúan entre
sí y se condicionan mutuamente.
* Objetivos
Este es uno de los elementos más importantes, que determina a los otros.
Hay que responder a la pregunta: ¿para qué se pública este
sitio?; ¿qué quiero que suceda raíz de mi publicación
en la Web?.
Las respuestas deben ser del tipo como por ejemplo: quiero que los clientes
puedan actualizar la lista de precios, en forma sencilla, que acceda al catalogo
electrónico de productos y puedan hacer sus pedidos automáticamente,
contribuir acerca de la necesidad de conservar las especies en peligro de extensión,
etc. Estar en Internet no es una respuesta válida.
En la elaboración del objetivo(si existe más de uno, hay que
listarlos a todos y jerarquizar) conviene que participen todas las personas
que tienen que ver o están interesadas en el éxito del proyecto.
En este momento habría que validar si las aspiraciones expresadas en
los objetivos son compatibles con el funcionamiento de Internet. Por ejemplo,
si bien es posible vender libros, discos, pizzas o corbatas a través
de Internet, posiblemente no funcione con calzado, que necesita ser físicamente
probado.
* Público
Al hablar de público no nos referimos a cualquier persona que recorriendo
la red llegue a nuestra página, sino a aquella parte de la población
a la que pretendemos alcanzar e influir con el mensaje. Esto esta estrechamente
vinculado con los objetivos establecidos y la naturaleza del sitio que nos proponemos.
Necesitamos construir un identikit de nuestro público, tratando de definir,
en general sus intereses, inclinaciones, gustos, preferencias, etc., y en particular,
como usuarios de Internet. Tenemos que dar una respuesta lo más concreta
y específicamente posible a la pregunta "esa gente, ¿qué
busca de mi página?". Porque la Web debería dar respuesta
a esa pregunta.
Todo lo que sepamos y supongamos sobre el público-target (el que nos
interesa) servirá, además, para establecer parte de los criterios
de diseño de contenidos, lenguajes, estética.
* Contenidos
Se debe listar la información que se desea incluir en la Web. Esta información
debe ser significativa, y útil para el público. Teniendo en cuenta
lo que a ellos les interesa, no lo que a nosotros nos gustaría que nos
interese.
En el caso de que existan otras formas de acceso a información disponible
para esas mismas personas, el contenido de la Web deberá ser superador
de esos otros materiales. Es decir que si los clientes de una firma reciben
un folleto en el que se describen los servicios que se prestan, el sitio Web
al que accederán luego no puede repetir simplemente lo que allí
se dice.
Información, no textos redundantes sobre la importancia de esa información.
El lenguaje utilizado para brindar la información en Internet debe ser
sobrio, conciso, concreto. No funciona bien el lenguaje insinuante y ambiguo
que puede ser perfecto para avisos gráficos o folletería.
Todo lo que se hace contribuye a formar la imagen que tiene el público
de la empresa, marca, producto, institución o servicio. La Web no es
una excepción y cualquier sentimiento de frustración que experimente
el usuario no se canalizará hacia el o los autores del sitio Web, sino
hacia la imagen que mencionamos.
* Estructura
La organización de la información es un tema clave para asegurar
un buen funcionamiento de un sitio.
El primer elemento organizador son las páginas. Conviene incluir en
cada una de ellas una unidad de información autónoma, completa.
En el caso de que el volumen sea excesivo para ello, dividir esa unidad de información
en subunidades más pequeñas, coherentes, completas cada una en
sí misma. Una unidad de información es un tema o un subtema.
Las relaciones de las páginas entre sí configuran la estructura
del sitio. A partir de la página principal o home page se vinculan mediante
links el resto de las páginas. Esto es bastante sencillo de implementar
en lenguaje HTML, pero es más complicado decidir de que manera, en qué
orden, con qué configuración se establecerá la cadena de
vínculos.
Ante todo hay que tener en cuenta que la estructura debe responder a los criterios
de búsqueda. Hay que hacerse la pregunta acerca de ¿cómo
se intentará encontrar esta información?. Los criterios "
naturales" de clasificación pueden no ser adecuados. Por ejemplo,
es común que quienes venden repuestos acomoden los mismos por tipo: juntas
por aquí, poleas por allí, resortes de este lado. El usuario,
a su vez, necesita el repuesto para una máquina o artefacto, marca, modelo,
función del repuesto que busca. Los links y la estructura del sitio tendrán
que tener en cuenta estas cuestiones.
El otro tema es que los usuarios reconocen las páginas de la Web utilizando
como guía palabras clave colocadas en botones, barras de control, gráficos
mapeados, o utilizadas como marcas de hipertexto; palabras que por su significado
indican o sugieren el contenido de páginas a las que derivan. Es sabido
que los significados de las palabras no son unívocos, y la ambigüedad
puede ser un problema. El conocimiento de la cultura y usos lingüísticos
del público nos será sin duda, de gran utilidad a la hora de elegir
las palabras que se titularán nuestros botones o identificarán
los links de derivación a otras páginas del sitio.
Hay que tener en cuenta que el usuario no tiene cómo saber la manera
en que sigue la cadena de links más allá de las páginas
a las que puede entrar directamente desde el lugar donde se encuentra. Que el
usuario no encuentre la información buscada después de recorrer
cuatro o cinco páginas encadenadas puede significar que el mismo abandone
el sitio o la indeseada sensación de frustración que nos interesa
evitar.
Un tema relacionado a éste es el de los mecanismos de identificación
y de recorrido del sitio. Estos deberían permitir al usuario saber en
todo momento el lugar o zona del sitio donde se encuentra, así como desplazarse
hacia cualquier otra página sin necesidad de recorrer toda la cadena
en sentido inverso. Los paneles de control son una buena ayuda.
* Visualización
Un sitio Web no es una torta. La gráfica (incluida elementos multimedia)
de un sitio Web debe se una herramienta de comunicación al servicio de
los objetivos planteados y condicionados por las pautas culturales (preferencias,
gustos) del público.
Esto significa que tampoco es un espacio de lucimiento del diseñador,
ni la estética.
Debe adecuarse a los gustos y preferencias de los responsables del sitio. Una
vez más los objetivos trazados y el perfil del público deberían
ser los instrumentos para tomar las decisiones de diseño gráfico
y multimedia.
Además de los criterios estéticos y comunicacionales del diseño
gráfico, es importante respetar los criterios técnicos específico:
1. Que cada página sea fácil de cargar.
* La velocidad de carga de una página está en función
del estado de las líneas y de la
cantidad de información que contiene. Sobre el primer parámetro
no hay nada que podamos hacer desde el diseño, pero sí sobre el
segundo: establecer para cada página un máximo de bytes y no sobrepasarlo.
* Realizar los gráficos del tamaño más chico posible.
* Repetir los iconos siempre que sea posible. El browser los leerá
de la memoria caché a
partir de la segunda vez que deba colocarlos en la página.
* Grabar cada gráfico en formato GIF y JFG, verificar el tamaño
de ambos y descartar el
mayor.
* Reducir la cantidad de colores de cada gráfico al mínimo indispensable.
De todos modos, la mayor parte de los usuarios no pueden visualizar más
de 256.
* Reflexionar cuidadosamente sobre la utilización de recursos de multimedia:
¿agregan algo realmente a la página? .
2. Que las páginas sean fáciles de leer.
* Resolver el contraste texto/fondo con valores de luminosidad y no sólo
decolor. Eliminar el color del monitor, si tiene esa posibilidad, o imprimir
la página en un láser monocroma para verificar esto.
* Tener cuidado con las texturas del fondo: no deben tener un dibujo excesivamente
nítido que perjudique la lectura. Tampoco es conveniente que sean motivos
muy contrastados (contornos claros y oscuros), ya que se verán mal tanto
los textos oscuros como los claros. En el caso de utilizar texturas fuertes,
agrandar los suficiente el tamaño de la tipografía.
* El tamaño de la tipografía debe ser adecuado para ser leído
sin dificultad aun en computadoras seteadas con altas resoluciones de pantalla.
* Es importante jerarquizar los títulos, subtítulos, manteniendo
la coherencia de los estilos en todo el sitio. Para eso es una buena ayuda escribir
una pequeña norma que establezca el tamaño relativo de la tipografía
para cada categoría de títulos, y subtítulos, así
como si éstos van centrados, alineados, con bullets, etc.
3. Establecer guías visuales que permitan saber que cada página
pertenece al mismo sitio.
La coherencia visual ayuda en ese sentido. Un sitio en el que cada página
tiene un fondo diferente, varían los iconos y cambian otros componentes
de la composición visual, desconcierta al usuario, que no sabe si está
en el mismo sitio o si el último link lo llevó al otro extremo
del mundo.
2. Diseño
Cuando hablamos sobre diseño de páginas Web, realmente nos referimos
al HTML o Hyper-text Markup Language. El lenguaje HTML consiste en una serie
de comandos que le indican al programa navegador de WWW cómo darle formato
al texto que contienen los archivos. En la actualidad no hace falta ser un experto
en HTML debido a que los procesadores de texto existentes se encargan de hacer
el trabajo, agregando el código automáticamente, a lo que queremos
mostrar.
Los servicios de diseño de páginas Web cubren un rango que va
desde convertir archivos de texto a formato HTML, hasta desarrollar extensos
conjuntos de páginas cargadas de ilustraciones e hipervínculos
relacionados entre sí. Podría dársele un enfoque especial
a su página para algún programa navegador específico, pero
siempre debe asegurarse de que las páginas sean vistas por el mayor número
de plataformas posibles.
La tarea de diseño de páginas Web convoca por lo menos tres especialidades
diferentes: comunicación (humana), programación (HTML, CGI, Java),
diseño gráfico y multimedia. Ninguna de estas especialidades tiene
en sí misma todos los recursos para llevar a cabo proyectos de Web exitosos.
En los proyectos de sitios Web no participan sólo los especialistas
contratados o designados para ello. Las empresa o institución que origina
la demanda tiene diversos grados de responsabilidad y compromiso con la publicación
del sitio.
3. Instalación y Pruebas
En esta etapa nos encargamos de la puesta en marcha, correcciones y ajustes
finales.
Se debe hacer que todo funcione.
Debemos hacer la prueba de todos los enlaces o links, corroborar el correcto
funcionamiento de todos los elementos de multimedia y del funcionamiento de
formularios, e-mail, buscadores, etc.
La transferencia de archivos a la Web, se realiza a través de FTP (File
Transfer Protocol), generalmente, se necesita un nombre de usuario y una clave
de acceso.
Unidad 3 "Lenguaje HTML"
Lenguaje HTML
Por medio del lenguaje HTML (HyperText Markup Languaje), podemos navegar por
miles y miles de páginas a través de la WWW. Es un lenguaje que
sirve para escribir hipertexto, es decir, documentos de texto presentado de
forma estructurada, con enlaces (links) que conducen a otros documentos o a
otras fuentes de información (por ejemplo bases de datos) que pueden
estar en la propia máquina o en máquinas remotas de la red. Todo
ello se puede presentar acompañado de cuantos gráficos estáticos
o animados y sonidos seamos capaces de imaginar.
HTML es el lenguaje con el que se construyen las páginas Web. La idea
inicial de HTML era describir la estructura y el contenido de un documento,
sin embargo la tendencia actual es utilizarlo también como un lenguaje
de descripción, controlando el aspecto de documento (tipografía,
posicionado, etc.).
Por supuesto, la estética de los documentos escritos en HTML no se limita
a texto digamos normal; consigue todos los efectos que habitualmente se pueden
producir con un moderno procesador de textos: negrita, cursiva, distintos tamaños
y fuentes, tablas, párrafos tabulados, sangrías, incluso texto
y fondo de página de colores, y muchos más.
El programa encargado de interpretar el texto HTML es el navegador o browser.
El navegador puede recibir el código HTML junto con los elementos integrados
en la página (imágenes, sonidos, vídeo, etc.) desde un
servidor remoto o de un servidor de red (utilizando el protocolo de transferencia
de hypertexto y HTTP) o leer las páginas directamente de nuestro disco
duro(sin un protocolo de transmisión tipo HTTP, sino el equivalente a
abrir un documento con un procesador de textos).
En HTML todas las codificaciones de efectos en el texto que lo forman no son
más que instrucciones para el visualizador. Partiendo de esto, se entiende
el porqué no se ve lo mismo con todos los visualizadores. Depende de
cómo estén diseñados y para qué versión de
lenguaje estén diseñados.
Hasta no hace mucho los programadores de HTML cobraban una barbaridad por crear
una página Web. Eran los inicios del boom WWW.
HTML no es un lenguaje de programación como puede serlo C, Pascal o
Java; HTML tan sólo es un lenguaje para crear documentos en formato electrónico,
una forma de definir efectos en el texto de manera similar a como se hacía
en los antiguos procesadores de texto pero con complicados y poderosos servidores
de información.
En la actualidad cualquiera puede crear sus páginas Web; puede escribir
el código HTML directamente o utilizar alguno de los excelentes editores.
Muchos usuarios de la Red tienen ya sus páginas Web publicadas, gracias
al espacio que les brindan la mayoría de los proveedores de acceso. No
es necesario que la pagina Web este publicada en Internet; podemos utilizarla
tan solo para consultas en la red de área local para realizar consultas
internas de la empresa u organización(Intranet).
La unidad fundamental en lenguaje HTML es el " tag " o la marca.
Cada estructura de texto se encerrará entre una marca de inicio y otra
de fin.
En HTML las marcas vienen delimitadas con los signos <(inferior) y >(superior).
De este modo el navegador sabe que debe interpretar código comprendido
entre estos símbolos.
Esqueleto Básico de un documento HTML
<HTML>
<HEAD >
<TITLE >Título del documento < /TITLE >
< / HEAD >
BODY
Cuerpo del documento
</BODY >
< / HTML >
Esqueleto Básico de la estructura HTML
Entre <html> y </html> encontraremos la definición de la
página propiamente dicha. En el bloque delimitado por <head> y
</head> se establecen ciertas características de la página,
tales como el título, quien las construyó, etc. De estas características
de la página, la única que es obligatoria declarar es el título.
Esto se hace mediante el par de tags <title> y </title>.
Por último está <body> y </body>, entre los cuales
se encierra toda la información que el navegador debe mostrar.
No todos los tags son iguales; hay alguno cuyas acciones están acotadas
por las funciones que cumplen, por lo que no es necesario incluir otro tag para
finalizar su acción. Algunos de ellos son:
<br> Genera un retorno de carro
<p> Equivale a un retorno de carro + un avance de línea
<hr> Crea una línea divisoria horizontal.
Existen tags que llevan parámetros asociados cómo:
<img xsrc="/cm/marzo.gif" width=104 height=97>
Este tag <img> permite incluir imágenes dentro de una página.
El parámetro src indica la ruta de acceso al archivo donde está
la imagen, mientras que width y height detallan su ancho y alto en pixeles.
Formatear Texto
Hay códigos qué afectan a la distribución y aspecto del
texto. Los más importantes agrupados en las categorías Tamaño,
Tipo de letra y posición.
Tamaño
Lo más destacable aquí son los seis niveles de cabeceras. Por
ejemplo:
<H1> Guía de Redacción HTML</H1>
<H2> Notas sobre esta Guía</H2>
<H3> Un Poco de Historia</H3>
Esta guía fue elaborada…
Se puede cambiar el tamaño de las palabras utilizando los códigos:
<FONT SIZE= +2> estas palabras </FONT>
Tipo de letra
La siguiente tabla muestra los principales códigos que afecta al aspecto
del texto.
Atributo Sintaxis Resultado
Énfasis(cursiva) Quiero<EM>desacar<EM> esto. Quiero destacar
esto.
Fuerte(negrilla) Quiero<STRONG>recalcar</STRONG>. Quiero recalcar
esto.
Monoespaciado Teclea <TT>estos códigos</TT>. Teclea estos
códigos
Posición
Los códigos principales son los que provocan salto de línea y
el que se centra.
El código <P> señala el inicio de un párrafo y provoca
un salto de línea precedido por un renglón en blanco.
El código <BR> hace lo mismo pero sin renglón en blanco.
Los códigos <center> y </center> centran el texto entre
los márgenes.
Elementos Textuales
Caracteres y símbolos
Muchos de los caracteres que necesitamos representar, letras acentuadas, requieren
un trato especial en HTML. Un buen editor nos irá haciendo la conversión
automáticamente, pero a veces resulta necesario recurrir a los códigos.
Aca se ve una tabla de los principales:
á á Á Á é è ü ü
ñ & ntilde Ñ Ñ ç ç © ©
¿ ¿ ¡ ¡ ª ª º º
Caracteres especiales
Listas
Hay varias maneras de tratar listas. Las principales son la lista numerada(OL)
y de los puntos conductores(UL) que tiene un par de variantes. También
hay una lista pensada para glosarios de términos (DL).
Una Lista Numerada (Ordered List)
<OL>
<LI>Animales
<LI>Plantas
</OL>
Se ve así:
1. Animales
2. Plantas
Una lista No Numerada (Unordered List)
<UL>
<LI>Animales
<LI>Plantas
</UL>
Se ve así:
. Animales
. Plantas
Un Lista de Definiciones (Definition List)
<DL>
<DT> Animales
<DD> Son unos bichitos que algunos tienen espinazo y otros no.
<DT> Plantas
<DD> Están vivas pero no les puedes llamar bichos. No sería
correcto.
</DL>
Se ve así:
Animales
Son unos bichitos que tienen espinazo y otros no.
Plantas
Están vivas pero no se les puede llamar bichos. No sería correcto.
A veces resulta útil anidar las listas para representar un esquema jerárquico.
Un ejemplo:
<UL>
<LI>Animales
<UL>
<LI>Vertebrados
<LI>Invertebrados
</UL>
<LI>Plantas
<UL>
<LI>Verdes
<LI>Nucleares
</UL>
</UL>
Se ve así:
. Animales
. Vertebrados
. Invertebrados
. Plantas
. Verdes
. Nucleares
Tablas
Las tablas nos permiten distribuir las cosas en columnas y en filas, aprovechando
mejor el ancho de página. Se puede especificar un montón de parámetros
de formato tanto de tabla (TABLE) como de filas (TR) y las celdas (TD) individuales.
Los principales son:
<TABLE>
<TR><TD></TD>Mallorca</TD></TD>Menorca</TD><TD>Ibiza</TD></TR>
<TR><TD>Extensión</TD><TD>Grandecito</TD><TD>Mediano</TD><TD>Chiquitín</TD></TR>
<TR><TD>Población/TD><TD>Mallorquines</TD><TD>Menorquines</TD><TD>Ibicencos</TD></TR>
<TABLE>
Se ve así
Mallorca Menorca Ibiza
Extensión Grandecito Mediano Chiquitín
Población Mallorquines Menorquines Ibicencos
Podemos mejorar el aspecto de la tabla insertando atributos dentro de los códigos
de TABLE, TR, y TD. Como el ancho de la tabla (WIDTH) y del reborde (BORDER),añadiendo
un título(CAPION) debajo (ALIGN=BOTTOM) y formateamos las celdas de la
primera fila y columna como cabeceras (TH) que salen en negrilla y centradas.
<TABLE BORDER=2 WIDTH=75%>
<CAPTION ALIGN=bottom>Datos de Baleare.</CAPTION.
<TR><TD></TD>Mallorca</TD></TD>Menorca</TD><TD>Ibiza</TD></TR>
<TR><TD>Extensión</TD><TD>Grandecito</TD><TD>Mediano</TD><TD>Chiquitín</TD></TR>
<TR><TD>Población/TD><TD>Mallorquines</TD><TD>Menorquines</TD><TD>Ibicencos</TD></TR>
<TABLE>
Se ve así:.
Mallorca Menorca Ibiza
Extensión Grandecito Mediano Chiquitín
Población Mallorquines Menorquines Ibicencos
Editores de HTML
Los editores existentes en el mercado eran bastante simples y pocos funcionales;
y no soportaban muchos tags especiales ni tampoco los frames. Por esta razón
para un diseño complejo, era imprescindible recurrir a un editor de textos
convencional y abrir los archivos HTML, modificar el código y obtener
el resultado esperado. Por lo tanto era necesario conocer el lenguaje HTML,
para conseguir un Web mínimamente profesional.
Pero ahora existen editores complejos y WYSIWYG, por lo que ya no es imprescindible
conocer el lenguaje HTML:
* FrontPage Express, incluido con Microsoft Internet Explorer 4.0.
* FrontPage 98, con las mismas características que el anterior.
* el editor de Netscape (Netscape Composer).
Links o enlaces de hypertexto
El link es uno de los elementos más importantes, es posible pasar de
un Web a otro, alojados en servidores remotos, separados por miles de kilómetros.
En general, los enlaces tienen la siguiente estructura:
<A xhref="xxx"> yyy </A>
dónde xxx es el destino del enlace e yyy es el texto indicativo del
enlace (con un color especial y generalmente subrayado).
En el parámetro HREF del tag <A> para crear los enlaces se debe
especificar el URL o dirección a la cual apunta el enlace. Estas direcciones
pueden ser absolutas o relativas.
En el caso de direcciones absolutas especificamos la dirección completa
a la que apunta el enlace.
Por ejemplo:
<A xhref= http://www.pcplus.es/pruebas/test/mi_página.html>Enlace</a>
Si nuestro enlace apunta a una página dentro del mismo servidor, debemos
utilizar direcciones relativas, es decir sin hacer referencia a la dirección
de Internet (en el ejemplo anterior sería http://www.pcplus.es/)
Por ejemplo <A HREF ="../test2/ejemplo.html">Enlace2</a>
En el ejemplo anterior, las palabras "Enlace2" son un enlace a la
página ejemplo.html situada en el directorio test2, al mismo nivel en
el árbol de directorios que la página donde se encuentra el enlace.
Para ascender niveles en una estructura de árbol de directorios se utilizan
los dos puntos(exactamente igual como se hace en MS-DOS o Unix).
Tipos de enlaces
Podemos distinguir cuatro tipos de enlaces:
1. Enlaces dentro de la misma página
2. Enlaces con otra página nuestra
3. Enlaces con una página fuera de nuestro sistema
4. Enlaces con una dirección de email
1. Enlaces dentro de la misma página
En el caso de documentos (o páginas) muy extensos, nos puede interesar
dar un salto desde una posición a otra determinada.
En este caso, lo que antes hemos llamado XXX, es decir, el destino del enlace,
en este caso el sitio dentro de la página a donde queremos saltar, se
sustituye por #marca (la palabra marca puede ser cualquier palabra que queramos).
Lo que hemos llamado antes YYY es la palabra (o palabras) que aparecerán
en la pantalla en color (en forma de hipertexto). Su estructura es, entonces:
<A xhref="#marca"> YYY </A>
Y en el sitio exacto a donde queremos saltar, debemos poner la siguiente etiqueta:
<A NAME="marca"> </A>
Por ejemplo, si quiero saltar desde aquí a la pantalla final, pongo
la siguiente etiqueta:
<A xhref="#final"> Pulsa para ir al final</A>
Que resulta como: Pulsa para ir al final
Y en el final del documento esta otra etiqueta:
<A NAME="final"> </A>
2. Enlaces con otra página nuestra
Puede ser que tengamos una sola página. Pero lo más frecuente
es que tengamos varias páginas, una inicial o principal y otras conectadas
a ella, e incluso entre ellas mismas.
En este caso, simplemente sustituimos lo que hemos llamado XXX (el destino
del enlace) por el nombre del fichero:
<A xhref="pag2.html"> Ejemplo </A>
Si queremos que vaya a un sitio concreto de otra página nuestra en vez
de ir al principio de la página, adonde va por defecto, en ese sitio
tenemos que colocar una marca, y completar el enlace con la referencia a esa
marca.
Una observación importante: Suponemos que la página en la que
escribimos esta etiqueta y la otra página a la que quiero saltar están
en el mismo directorio. Porque pude ocurrir que e organizamos el sitio del Web
con un directorio principal, y otros subdirectorios auxiliares. Si la página
a la que quiero saltar está, por ej. en el subdirectorio subdir, entonces
en la etiqueta tendría que haber puesto "subdir/pag2.html".
Y a la inversa, si quiemos saltar desde una página a otra que está
en un directorio anterior, en la etiqueta tendría que ponerse "../pag2.html".
Esos dos puntos hace que se dirija al directorio anterior. Obsérvese
que se debe utilizar el símbolo / para indicar los subdirectorios, y
no este otro \, que es propio únicamente de Windows.
Si nos queremos evitar todas estas complicaciones, podemos tener todo junto
en un único directorio, pero esto tiene el inconveniente de que esté
todo más desordenado, y sean más difíciles de hacer las
futuras modificaciones.
3. Enlaces con una página fuera de nuestro sistema
Si queremos enlazar con una página que esté fuera de nuestro
sistema (es decir, que esté en un servidor distinto al que soporta nuestra
página), es necesario conocer su dirección completa, o URL (Uniform
Resource Locator). El URL podría ser, además de la dirección
de una página del Web, una dirección de ftp, gopher, etc.
Una vez conocida la dirección (o URL), lo colocamos en lugar de lo que
hemos llamado anteriormente xxx (el destino del enlace). Si queremos enlazar
con la página de Netscape (cuyo URL es: http://home.netscape.com/), la
etiqueta sería:
<A xhref="http://home.netscape.com/"> Página inicial
de Netscape </A>
Es muy importante copiar estas direcciones correctamente (respetando las mayúsculas
y minúsculas, pues los servidores UNIX sí las distinguen).
4. Enlaces con una dirección de email
En este caso, sustituimos lo que se ha llamado antes xxx (el destino del enlace)
por mailto: seguido de la dirección de email. La estructura de la etiqueta
es:
<A xhref="mailto: dirección de email"> Texto del enlace
</A>
Un ejemplo
Comentarios a <A xhref="mailto: info@oninet.es">Soporte Técnico</A>
Ejemplo práctico
<HTML>
<HEAD>
<TITLE> Mi pagina del Web - 3 </TITLE>
</HEAD>
<BODY>
<CENTER>
<H1> Mis paginas favoritas </H1>
</CENTER>
<HR>
Estas son mis paginas favoritas:
<P><A xhref="http://home.netscape.com"> Netscape </A>
<BR> <A xhref="http://www.microsoft.com"> Microsoft </A>
<BR> <A xhref="http://www.yahoo.com"> Yahoo! </A>
</BODY>
</HTML>
Imágenes
Podemos incorporar imágenes, la estructura de la etiqueta es:
<IMG xsrc="imagen.gif">
Con el comando IMG SRC (image source, fuente de la imagen) se indica que se
quiere cargar una imagen llamada imagen.gif (o el nombre que tenga).
Al programa navegador se le indica el nombre y la localización de un
fichero que contiene una imagen.
Dentro de la etiqueta se pueden añadir otros comandos, tal como ALT
<IMG xsrc="imagen.gif" ALT="descripción">
Con el comando ALT se introduce una descripción (una palabra o una frase
breve) indicativa de la imagen. Este comando, que en principio se puede omitir,
es en beneficio de los que accedan a nuestra página con un programa navegador
en forma de texto solamente. Ya que no son capaces de ver la imagen, por lo
menos pueden hacerse una idea sobre ella. Pero no es sólo por esto. Hay
casos, en los que se utiliza una imagen como enlace a otra página. Si
se omitiera este comando, los que utilizan dichos navegadores no podrían
de ninguna manera acceder a esas páginas.
Con respecto a la localización del fichero de esa imagen, si no se indica
nada especial, como en el caso que se ha expuesto, quiere decir que el fichero
imagen.gif está en el mismo directorio que el documento HTML que estamos
escribiendo. Si no es así, se siguen los mismos criterios que los indicados
para los enlaces.
Al igual que una página con la que queremos enlazar puede estar fuera
de nuestro sistema, (en cuyo caso había que indicar su URL o dirección
completa), podemos cargar una imagen que no esté en nuestro sistema siguiendo
el mismo método, es decir, indicar en la etiqueta el URL completo de
la imagen. Aunque esto no es muy aconsejable, pues alargaría innecesariamente
el tiempo de carga de nuestra página.
En lo que se refiere a las direcciones absolutas y relativas se pueden aplicar
en el caso de las imágenes. Un buen consejo al diseñar la Web
es crear un directorio para las imágenes. De este modo siempre deberemos
apuntar bien al directorio de imágenes para que aparezcan las imágenes
correctamente en la página Web.
Los formatos más utilizados son del tipo:
Formato GIF
* Apropiado para logotipos y además arte gráfica, para imágenes
con colores sólidos y continuos(especialmente para imágenes con
bordes definidos, u texto o un dibujo). Este es el único soportado por
cualquier navegador existente.
* Además comprime la información de la imagen sin pérdida
de información.
* Este formato soporta un máximo de 256 colores.
* Un GIF puede ser transparente; la transparencia permite crear imágenes
que comparten el mismo color de fondo de la página, simulando una apariencia
no rectangular.
Formato JPEG
* Apropiado para imágenes complejas o para fotografías, ya que
es bueno para trabajar con imágenes con múltiples patrones y contrastes.
* JPEG comprime y destruye parte de la información de la imagen.
* Soporta hasta 16,6 millones de colores.
* Un JPEG no puede ser transparente.
Teniendo en cuenta todo esto, no es bueno convertir un GIF a JPEG o viceversa.
Se pierde gran parte de la calidad de imagen, además puede ocupar más
espacio(en KB) que en el formato anterior.
Estos formatos gráficos cuentan con ciertas variaciones que permiten
agilizar la visualización de sus contenidos hasta hacer simples animaciones.
Ellos son:
* Los GIF intercalados que cargan las imágenes acrecentando el nivel
de detalle: comienzan por verse borrosas y van tomando formando hasta que se
completan; esto sirve para la espera por los gráficos de la página
no sea ardua.
* Los JFEG progresivos, funcionan de manera similar a los GIF intercalados:
primero muestran una imagen de baja resolución que luego se va completando
con una alta resolución; esta clase de formato JPEG es bastante nueva,
por lo que no todos los navegadores la soportan.
* Los GIF animados conocidos también como GIF89a; este formato permite
crear simples animaciones que dan un impacto especial y atraen la atención
de los visitantes.
Los GIFs animados están soportados por la gran mayoría de los
navegadores, además debemos tener en cuenta que ocupan un mayor número
de byte.
Un aspecto muy importante a tener en cuenta es el tamaño de las imágenes,
pues una imagen grande supone un fichero grande, y esto puede resultar en un
tiempo excesivo de carga, con el consiguiente riesgo de que quien esté
intentando cargar nuestra página se canse de esperar, y desista de ello.
Además las imágenes incrustadas en páginas Web son en partes
responsables de los cuellos de botellas existentes en laWWW.
Algo bueno relacionado con el HTML es incluir en el tag <IMG> los parámetros
WIDTH y HEIGHT, es decir el alto y el ancho de la imagen. Por defecto, HTML
toma las dimensiones reales de la imagen. Pero si incluimos estos valores la
página HTML se presentará mucho más rápido en pantalla(el
texto) mientras se acaban de transmitir las imágenes.
Posición de las imágenes
Para elegir la posición de la imagen con respecto al texto hay distintas
posibilidades. La más sencilla es colocarla entre dos párrafos,
con un titular a un lado. Los navegadores más actuales (como el Netscape
Navigator y el Microsoft Internet Explorer) permiten que el texto pueda rodear
a la imagen.
De momento nos vamos a limitar a escoger la posición del titular con
respecto a la imagen (sí es que queremos ponerle un titular, claro está).
Se puede poner arriba, en medio o abajo del lado de la imagen. Para ello se
añade el comando ALIGN a la etiqueta, de la siguiente manera:
<IMG xsrc="isla.gif" ALIGN=TOP> Titular alineado arriba
<Imagen: isla>Titular alineado arriba
<IMG xsrc="isla.gif" ALIGN=MIDDLE> Titular alineado en medio
<Imagen: isla>Titular alineado en medio
<IMG xsrc="isla.gif" ALIGN=BOTTOM> Titular alineado abajo
<Imagen: isla>Titular alineado abajo
Imágenes utilizadas como enlace
Podemos utilizar una imagen como enlace a otra página. Para estos casos
se utilizan generalmente imágenes pequeñas (iconos), aunque se
puede usar cualquier tipo de imagen.
La estructura general de un enlace es:
<A xhref="xxx"> yyy </A>
donde xxx era el destino del enlace e yyy el texto del enlace . En este caso
sustituimos xxx por el nombre del fichero de la página a la que queremos
acceder. Y en lugar de yyy ponemos la etiqueta completa de la imagen
<A xhref="pag2.html"><IMG xsrc="hombre.gif"></A>
También podemos utilizar una imagen para enlazar con otra imagen. En
este caso sustituimos xxx (el destino del enlace) con el nombre del fichero
de la imagen a la que queremos acceder e yyy
<A xhref="isla.gif"><IMG xsrc="casa.gif"></A>
Por último, otra posibilidad es la de utilizar un texto para enlazar
con una imagen. En este caso sustituimos xxx (el destino del enlace) con el
nombre del fichero de la imagen a la que queremos acceder e yyy (lo que aparece
en pantalla como el enlace) por el texto.
<A xhref="isla.gif"> un paraíso tropical </A>
Un tipo de imágenes del que se hace abundante uso y que sirven para
mejorar la presentación de la página son los iconos, botones,
barras separadoras, etc. A pesar de su tamaño o forma, son imágenes
como cualquier otra.
Editores de imágenes
|
Producto |
Descripción |
Plataforma |
Descripción |
Categoría |
|
Animagic |
Animación |
Windows |
Http://www.rtlsoft.com/animagif |
Shareware |
|
GIF |
Animación |
Windows (todas) |
Http://www.mindworkshop.com |
Shareware |
|
Graphic |
Editor |
Windows (todas) |
Http://www.mindworkshop.com |
Shareware |
|
Paint |
Editor imágenes |
Windows |
Http://www.jasc.com |
Shareware |
|
MS |
Editor |
Windows |
http://www.microsoft.com |
Shareware |
Frames o marcos
Con los frames se puede dividir una página HTML en varias y navegar
dentro de cada frame. Por ejemplo es muy común utilizar un frame para
situar en él un menú o iconos de navegación dentro del
Web que permanece siempre en pantalla, mientras que las páginas van apareciendo
en el segundo frame.
Podemos dividir las páginas HTML con los frames horizontalmte(líneas)
o verticalmente(columnas). También se admiten frames anidados.
Los formularios
HTML permite crear un formulario(con listas de selección, menús
desplegables, campos de texto, botones, etc.) para que el usuario pueda introducir
cualquier tipo de información y la comunicación sea bidireccional,
dejando de ser un mero espectador. La información introducida en el formulario
es tratada en el servidor por un programa(CGI) y puede responder con una nueva
página presentada en el navegador. La programación CGI es bastante
más compleja que el HTML.
Sin embargo, sin necesidad de utilizar programas CGI podemos recibir información
de los visitantes de nuestra Web vía correo electrónico. La cabecera
de todo formulario en HTML es el tag<FORM>. Uno de sus parámetros
es ACTION.
EJ: ACTION=MAIL-TO: email, donde "email" es nuestra dirección
de correo electrónico, de esta manera recibiremos el contenido de los
campos del formulario directamente en el buzón de correo.
Unidad 4 "Hardware y Software"
Hardware y Software
Las personas o empresas que deseen publicar sus páginas Web en un centro
proveedor de Internet o bien que deseen montar su propio servidor, antes de
publicar sus páginas, deben tener en cuenta varios aspectos como son
seguridad, velocidad de acceso y servicios.
Al contactar con cualquier centro proveedor de Internet éste nos informará
de todas sus características técnicas: el ancho de banda que tiene,
el número de usuarios, las máquinas que tiene, los sistemas de
seguridad que implementa y que sistema usa para tratar la información
que se desea colocar en el centro.
Hardware
Tipos de línea
Actualmente la forma más extendida de acceder a un servidor es por medio
de una Frame Relay, que es una técnica de conmutación por paquetes
que nos servirá para enviar información. Esta técnica básicamente
lo que hace es transferir a los terminales las funciones de flujo de control,
corrección de errores y otras que anteriormente hacían los protocolos
de comunicación como X.25. Frame Relay esta orientado a paquetes como
X.25 y también transparente a los protocolos como el modo circuitos.
Router
Estos dispositivos operan en el nivel de red y permiten la interoperatividad
entre redes diferentes eligiendo siempre el mejor camino para enviar un paquete.
El router necesario se debe adaptar a la información que nos llega por
la línea de acceso a información que la máquina pueda entender.
La elección del router vendrá especificada por el protocolo que
se use. Además se debe configurarlo.
Los routers son tolerantes a fallos de enlaces(rutas alternativas), también
soportan el desorden y duplicidad de paquetes, si bien los routers deberían
minimizar la pérdida adicional de paquetes aunque el nivel no garantiza
la entrega fiable de paquetes. Los routers introducen un tiempo de procesado
adicional.
Servidores (Hardware)
Servidores son las máquinas donde hay depositada la información
que deseamos publicar en Internet. Esta información puede estar distribuida
en varios ordenadores o en un ordenador más grande. Tanto sise trata
de una u otra opción, debemos tener en cuenta varios aspectos físicos.
* Memoria RAM
La mayoría de páginas que hay en Internet son HTML, por lo que
una vez se haya publicado una de ellas, esta pasará a la RAM de nuestro
servidor, por lo que sí un usuario viene inmediatamente después,
se encontrará con la página de una manera mucho más rápida
que no el usuario anterior. Por lo tanto, una buena cantidad de RAM siempre
hará que nuestro servidor no tenga que hacer tantos accesos a disco duro,
por lo que la velocidad de servicio aumentará. El mínimo que se
considera para una PC es 8MB.
Hay que tener en cuenta que si trabajamos con páginas que se generan
de forma aleatoria, que se generan con una consulta a una base de datos o simplemente
a gusto del usuario, diremos que la RAM no juega un factor tan importante ya
que es muy difícil que una misma sea cargada de una forma continuada.
* Disco Duro
Debido a toda la información que reside en disco duro, debemos tener
una velocidad de acceso a éste lo más elevada posible. Con un
par de imágenes, un fondo que no sea liso y un texto más o menos
grande nos vamos a un tamaño de una página de unos 25-35Kb. Si
tenemos en cuenta que las imágenes normalmente se encuentran en directorios
distintos a los documentos HTML, y que por lo general los discos duros se encuentran
llenos, se recomiendan el uso de discos duros SCSI o SCS II ya que tienen una
velocidad de respuesta mayor a la de los discos duro normales (IDE).
Debido a que en todas las plataformas los navegadores Web requieren mucho espacio
de disco libre el mínimo requerido está entre 50 y 100Mb libres.
* Procesador
Con las páginas HTML, no se gana mucho con la velocidad del procesador,
aunque también es un factor importante. Pero si la página Web
que nosotros generamos se hace a partir de una consulta a una base de datos
o, a parte de la página Web, se generan archivos de consulta para guardar
o imprimir, esto se realizará básicamente con el procesador, y
cuanto más potencia se tenga(velocidad de proceso) estas se generarán
de una manera más rápida.
Para las PC, se desea al menos un 486. Mientras más rápido el486
mejor, siendo el mínimo aceptable alrededor de 66MHZ. Mejor aún
sería un Pentium 100MHz o un Pentium 133MHz.
Necesidades de Hardware para PC IBM y compatibles
|
Componente |
Mínimo |
Preferible |
|
Disco |
50 |
200Mb |
|
Memoria |
4 |
8 |
|
Velocidad |
66 |
Pentiuma |
A parte de los aspectos físicos del servidor, hay que tener en cuenta
quien los gestiona. Esto es el sistema operativo. Máquinas como Silicon
Grafhics o Sun Microsystems son un claro exponente de potencia y seguridad.
Sus sistemas operativos, sus componentes de hardware y software hacen que estos
ordenadores sean bastantes caros, pero en muchos modelos casi infranqueables
por los temidos hackers.
Otras soluciones más económicas son el uso de servidores como
los de IBM, Siemens, HP, u otras marcas que ofrecen soluciones a nivel hardware
que se adaptan a las que hemos citado antes ya que ofrecen software o sistemas
operativos más económicos.
Software
Servidores (Software)
Cuando hablamos de servidores a nivel software nos referimos a los programas
que necesitamos para que los usuarios se beneficien de los servicios que se
ofrecen. Algunos de estos servicios son:
* DNS (Domain Name Server)
Conocido como servidor de dominio. Este servidor lo que hace es traducir la
dirección que enviamos con formato texto, en una dirección IP.
Si reconoce esa dirección, dentro del dominio, la sirve; si no, reenvía
la dirección a un servidor inmediato superior que si tampoco la reconoce,
actuará de la misma manera.
* WWW (Word Wide Web)
Este servicio utiliza el protocolo HTTP ( Hyper Text Transfer Protocol) que
está basado en la filosofía cliente-servidor y se utiliza para
intercambiar documentos entre distintos ordenadores.
Este servidor debe soportar el HTML(Hiper Text Markup Lenguaje), que es el
lenguaje usado en la realización de páginas Web, para que pueda
ser tratado en todas las plataformas.
* FTP (File Transfer Protocol)
Lo utilizamos para poder intercambiar información en forma de archivos
entre dos ordenadores. Generalmente, los usuarios utilizan el FTP para poder
poner sus páginas Web en su servidor de una manera más clara,
rápida y segura, ya que cada usuario normalmente tiene acceso a su directorio
particular.
* Pop3 (Post Office Control)
Representa la central de correos del usuario. Una vez que se ha recibido la
información de para quién es y de quién es el mensaje por
parte del SMTP, actúa el Pop3.
Esto son los servicios principales e imprescindibles, pero no los únicos.
Otros servicios que se pueden añadir son sevidores de audio, vídeo,
etc.
Otras características
Otros aspectos importantes a tener en cuenta son:
Direcciones IP
Basadas en el protocolo TCP/IP el cual ofrece un servicio no orientado a conexión,
es decir, que cada trama en la que se ha dividido un paquete puede ser enviada
por un camino distinto y también puede llegar de forma desordenada. El
control de flujo y de errores se realiza en los terminales, por lo que hace
que el envío de los paquetes sea bastante rápido. Cada máquina
tiene asociado un número de 32 bits, al que llamaremos dirección
IP. Esta dirección se divide en dos partes: NETID y HOST ID.NETID: esta
parte es asignada por el NIC(Network Information Center).
Cuando la red o servidor no va a ser visto por ningún usuario externo
o por ninguna red externa, no tenemos que pedir nada a este organismo. Según
el tamaño que tenga la red, tendremos 8, 16 o 24 bits para poder identificarla.
HOST ID: Identifica cada máquina dentro de la red, esta parte corre a
cargo del redmaster (administrador de red)
Cada dirección vendrá representada, por cuatro números
decimales separados por un punto entre sí, 194.168.100.7, que representará
el valor binario de cada campo. De esta manera podemos asegurar que cualquier
dirección, que se haya hecho pública podrá ser accesible
siempre y cuando se cumplan los permisos necesarios para poder acceder a ella.
Servidor DNS
Algunas de las características más importantes que rigen el DNS.
Por lo general los usuarios prefieren asociar a un nodo un nombre simbólico
en lugar de una dirección numérica, esto es www.xxxxxxx.es en
vez de la dirección IP UUU.XXX.ZZZ.
EL DNS se puede entender como un servicio de directorios de Internet que proporciona
información acerca de la asociación entre el nombre simbólico
de un nodo con su dirección IP. Otra de sus particularidades es que divide
la red en dominios y subdominios a partir de una estructura arbórea que
identifica por caminos, por lo que una zona será una región compuesta
de uno o más dominios y subdominios gestionada por un único administrador.
Cada nodo se identifica por una etiqueta o alias, de longitud inferior a 63
caracteres, y cada nombre de dominio de un nodo del servicio DNS está
formado por una concatenación de etiquetas, cada una de ellas separada
por un punto.
EL servicio DNS se basa en una estructura cliente-servidor, donde los dominios
superiores están divididos en tres grandes grupos: gestión(org),
dominios compuestos por tres caracteres(net), y dominios compuestos por dos
caracteres(resto de países). Todos estos gestionados por el NIC.
El DNS actúa como una base de datos distribuida donde los servidores
DNS intercambian información en modo jerarquizado, los servidores son
responsables de jerarquizar las zonas teniendo conocimiento de sus servidores
vecinos y almacenando la información en los RR(Resource Records).
Acceso telefónico
Teniendo un servidor conectado(la máquina donde hay la información)
a un módem o batería de módems, se puede recibir tantas
llamadas como módems tengamos.
Una opción interesante del acceso telefónico es poder administrar
de forma remota el servidor, con una simple llamada, poder estar trabajando
de forma remota con un equipo que se encuentra a una cierta distancia física,
siempre que se tengan los permisos necesarios para poder hacerlo.
CGI’s
CGI(Common Gateway Interface) es un estándar de programación
que actúa como interfaz entre un programa cliente (navegador), un servidor
HTTP y una aplicación programada de forma tradicional. Los programas
CGI pueden escribirse con cualquier lenguaje de programación.
Gracias a la programación CGI(anterior al lenguaje Java) se puede proporcionar
interactividad al sistema Web, tales como tratamiento de formularios introducidos
en el cliente, consulta y/o modificación de bases de datos remotas, estadísticas
de acceso a una determinada página Web, animaciones con gráficos,
etc.
La idea de la programación CGI es construir el documento HTML correspondiente
a un enlace de hypertexto en el mismo momento en el que se hace clic sobre el
enlace. El documento se envía al cliente a medida que se construye. Sin
almacenarse nunca en un fichero.
Esto se realiza por medio de enlaces ejecutables. El cliente indica el nombre
de un fichero, siempre mediante un URL, no para recibir el contenido sino para
solicitar su ejecución en el servidor. Este ejecuta el programa indicado
y devuelve al cliente la salida estándar de dicho programa(es decir,
lo que se hubiera obtenido en la pantalla al ejecutar el programa manualmente
desde el "prompt" del sistema operativo).
Esta salida estándar es lo que constituye el documento HTML. Los programas
ejecutados a partir de enlaces ejecutables reciben el nombre de scripts CGI.
Los scripts CGI residen en un directorio determinado dentro de la estructura
de datos del servidor, que generalmente, suele llamarse cgi-bin (aunque algunos
servidores permiten que dichos scripts se ubiquen en otros directorios). Además
los ficheros CGI deben tener permisos de acceso y ejecución para todos
los usuarios. Esto es especialmente importante en sistemas operativos como Unix.
Al ser ejecutables por cualquier usuario externo es conveniente evitar que
esos programas adquieran privilegios de superusuario.
Los scripts CGI pueden construirse en cualquier lenguaje, la única limitación
la marca el sistema sobre el que está ejecutándose el servidor
HTTP.
Los lenguajes utilizados en la programación CGI son, con diferencia,
el Perl y el C. Esto se debe, principalmente a que la mayoría de servidores
HTTP corren sobre máquinas Unix. Las principales ventajas del Perl son
su carácter interpretado ya que simplifica el desarrollo y las pruebas,
los potentes comandos de tratamiento de ficheros con que cuenta, y las numerosas
extensiones con las que se puede ampliar el ámbito y funcionalidades
del lenguajes.
Tecnologías capaces de integrarse en una Página Web
Lenguaje Java
Con el lenguaje de programación Java es posible incrustar una aplicación
multiplataforma dentro de una página Web con los llamados applets. Es
necesario utilizar un navegador o browser compatible con Java como Sun Hot_Java,
Netscape 2.x, Internet Explorer 3.0 o superiores,
Con Java también es posible implementar programas como C++, que no se
ejecuten a través de Internet, sino de forma local y sin la necesidad
de utilizar un navegador.
Java es un lenguaje de programación orientada a objetos que ha sido
desarrollado por Sun Microsystems.
Java, cuya denominación original fue Oak(1991) fue diseñado para
programar dispositivos electrónicos de consumo y crear una red heterogénea
de productos electrónicos domésticos.
* Independencia de plataforma
Java frente a cualquier otro lenguaje de programación, se caracteriza
por su independencia con respecto al hardware o plataforma, tanto al nivel de
código fuente como a nivel binario. A nivel de código fuente,
las estructuras de datos primitivas de Java tienen el mismo tamaño para
cualquier plataforma de desarrollo.
Los ficheros binarios de programas Java también son independientes y
pueden ejecutarse sobre distintos sistemas sin necesidad de recompilar el código
fuente.
* Lenguaje de programación orientada a objetos
Java es un lenguaje de programación orientada al objeto, por lo tanto
soporta las tres características de este tipo de programación:
Encapsulación, herencia, y polimorfismo.
Java se basa en C++, con una sintaxis similar, pero está diseñado
para evitar las características más problemáticas de C++,
lo que hace más fácil la programación en Java. Incluye
un conjunto de librerías de clases para obtener los tipos de datos básicos,
procedimientos de entrada/salida, comunicaciones a través de red, lleva
integrados protocolos de Internet(TCP/IP, HTTP y FTP) y funciones para desarrollar
interfaces de usuario.
Otra de las funcionalidades inexistentes en C++ y qué si incluye Java
es la resolución dinámica de objetos. En C++ se suele trabajar
con librerías dinámicas (DLLs) que obligan a recompilar la aplicación
cuando se retocan las funciones que se encuentran en su interior. Este inconveniente
es resuelto por Java mediante un interfaz específico llamado RTTI (RunTime
Type Identification) que define la interacción entre objetos excluyendo
variables de instancias o implementación de métodos. Las clases
en Java tienen una representación en el intérprete que permite
a los programadores interrogar por el tipo de clase y enlazar dinámicamente
la clase con el resultado de la búsqueda.
Robustez: Java se puede considerar un lenguaje robusto. A diferencia de C++,
con el que resulta sumamente fácil tener que reiniciar el ordenador por
culpa de algún error de programación. Java obliga a la declaración
explícita de métodos, reduciendo así las posibilidades
de error. Java soporta punteros, pero no así la aritmética propia
que éstos tienen en C++. Se implementan arrays auténticos, en
vez de listas enlazadas de punteros que señalan a zonas equivocadas.
Multienhebramiento: Java puede trabajar con sistemas operativos de alto nivel
que soportan multienhebramiento. De esta forma un programa Java puede tener
más de una hebra en ejecución. Por ejemplo, podría realizar
un cálculo largo en una hebra, mientras otras hebras interactúan
con el usuario. Así los usuarios no tienen que dejar de trabajar mientras
los programas Java complementan las operaciones más largas.
La programación en un entorno multienhebrado suele ser difícil
porque pueden producirse varios eventos al mismo tiempo. Java, sin embargo,
posee características de sincronización fáciles de utilizar
que simplifican la programación.
Las hebras Java suelen corresponder a hebras reales del sistema operativo,
si el sistema operativo de la máquina soporta esta característica.
Los programas Java se dividen en dos grupos: Applets y aplicaciones.
Los Applets: son programas Java que se encuentran en un servidor de páginas
Web y son ejecutados por un navegador Web en el ordenador cliente. Si el cliente
no posee un navegador que soporta Java, no podrá ejecutar los applet.
Para que se ejecute el applet, se debe hacer referencia a éste dentro
del texto HTML, utilizando el tag <APPLET CODE="<APPLET CODE=">nombre.class">
Las aplicaciones son programas independientes y más generales escritos
en lenguaje Java. Estas aplicaciones no necesitan de un navegador para ejecutarse,
y de hecho, se puede utilizar Java para escribir un programa como en C o Pascal.
Para ejecutar estos programas se debe utilizar el intérprete o máquina
virtual Java.
* Incompatibilidades y seguridad
Aunque Java nació como una filosofía de crear programas independientes
de la plataforma, también en este lenguaje se producen incompatibilidades.
Java permite crear programas que son transferidos a la computadora del usuario
y ejecutados ahí. Esto significa que cuando el usuario tiene acceso a
un sitio Java, el software es transferido en forma automática a la computadora
y ejecutado. Esto le da al programa Java la oportunidad para hacer cosas como
instalar un virus o alterar, destruir o recuperar datos.
A pesar de que los programadores de Java lo diseñaron para ser bastante
seguro manteniendo afuera comandos que permitieran a los programadores tener
acceso a áreas prohibidas o usar recursos en forma inapropiada, existen
agujeros que permiten a un cracker persistente tener acceso a áreas indeseables.
Además, mucho del código fuente Java abunda en Internet. Es fácil
para los crackers modificar las bibliotecas existentes o crear rutinas falsas
o reemplazar rutinas que cuando son usadas por desarrolladores confiados, introducen
inestabilidades.
Aún no está en claro si Java se volverá una amenaza grave
para la seguridad o no. Por eso se debe tener cuidado extra cuando diseñe
su propio Java; partiendo de cero y usando lo menos posible los ejemplos de
dominio público existentes. Y además usar bibliotecas Java que
provengan de sitios oficiales, donde puede tener garantizado que son la versión
apropiada y que no han sido alterados.
JavaScript
Es un lenguaje de programación compacto y orientado al objeto destinado
al desarrollo de aplicaciones Internet que actúa a modo de complemento
del HTML. El primer navegador que soportó JavaScript fue Netscape Navigator
2.0. El código de las aplicaciones Java Script se integra en el mismo
archivo con el texto en formato HTML y es interpretado por el cliente(navegador).
Actualmente los únicos navegadores que soportan JavaScript son Netscape
Navigator(a partir de la versión 2.0) y Microsoft Internet Explorer (a
partir de la versión 3.0, denominándolo Jscript). También
afectan a JavaScrip las incompatibilidades: los navegadores 4.0 soportan nuevas
especificaciones de JavaScript que no soportan los browsers anteriores. Además
el mismo código JavaScript en Navigator no se comporta de manera idéntica
en Internet Explorer.
Sintaxis: JavaScript hereda principalmente de Java su sintaxis y estructura,
aunque el estilo de programación puede diferir bastante.
JavaScript está destinado para la implementación de programas
pequeños, es ideal para tareas repetitivas y de control de eventos. Por
ejemplo, se puede utilizar para calcular el valor de una variable dependiente
del valor de un campo de formulario. Cada vez que cambie el valor de dicho campo,
el programa JavaScript encargado de controlar dicho evento se invoca y se calcula
el nuevo valor de la variable.
* Lenguaje Interpretado
JavaScript es un lenguaje interpretado. Los archivos con el código se
ejecutan directamente.
Los lenguajes interpretados ofrecen varias; entre ellas que son más
sencillos y fáciles de aprender. Además, normalmente es más
fácil desarrollar, modificar y depurar programas para lenguajes interpretados
porque no es necesario recompilar el código cada vez que se realiza un
cambio.
Los programas para lenguajes interpretados suelen requerir un mayor tiempo
de ejecución que los programas compilados. En el caso de JavaScript esto
no supone un problema, ya que, con los anchos de bandas actuales, la velocidad
de ejecución es despreciable frente a la velocidad de transmisión.
Los scripts escritos en JavaScript se compilan en formato Bytecode(como los
programas Java) y evalúan mientras se está transmitiendo el script.
* Lenguaje no extensible
JavaScript en comparación con Java, no es totalmente extensible. El
modelo de JavaScript está formado por un número limitado de objetos
básicos, propiedades, métodos y tipos de datos, que son suficientes
para desarrollar aplicaciones cliente-servidor.
Ventajas de JavaScript
JavaScript no requiere un tiempo de compilación, los scripts se pueden
desarrollar en un periodo de tiempo relativamente corto. A esto podemos añadirle
las características de interfaz como, por ejemplo, cuadro de diálogo,
formularios y otros elementos GUI (Interfaz Gráfico de Usuario), son
gestionados por el navegador y por el código HTML. Por lo tanto los programadores
que utilizan JavaScript no se deben preocupar en crear o controlar dichos elementos
en sus aplicaciones.
Aunque JavaScript tiene muchas similitudes con Java, no incluye la sintaxis
y reglas complejas de Java.
Como WWW es independiente de la plataforma hardware o sistema operativo, los
programas escritos en Javascript también lo son, siempre y cuando exista
un navegador con soporte JavaScript para la plataforma en cuestión.
Los programas JavaSript tienden a ser pequeños y compactos(en comparación
con los applets de Java), no requieren mucha memoria ni tiempo adicional de
transmisión. Además, al incluirse dentro de las mismas páginas
HTML se reduce el número de accesos independientes a la red.
Desventajas de JavaScript
En las primeras versiones de Netcape Navigator con soporte JavaScript el número
de métodos integrados era extremadamente reducido. En la versión
actual, Navigator 4.0, se ha incrementado significativamente el número
de métodos, pero sigue siendo insuficiente para gestionar documentos
y ventanas.
El código de JavaScript debe incluirse dentro del mismo documento HTML,
y no es posible ocultar el código fuente y evitar la copia y reutilización
de éste.
Características. JavaScript vs. Java
|
JavaScript |
Java |
|
Interpretado Orientado |
Compilado Orientado |
|
Código |
Los |
|
No |
Estricto |
|
Las |
Las |
|
No |
No |
ActiveX
Cascading Style Sheets (CSS)
Las CSS son una de las últimas novedades en la creación de páginas
Web. Con CSS podemos ampliar el lenguaje HTML según nos convenga. En
resumen se puede decir que son un grupo de propiedades o estilos que definen
cómo aparecerá un elemento HTML en el navegador. Las CCS pueden
incluirse en la misma página HTML o en un archivo externo. En este último
caso las CCS pueden afectar a múltiples páginas. Bastará
con realizar los cambios oportunos en dicho archivo y cambiará la apariencia
en todas las páginas.
Pueden definirse muchos estilos para un documento con distintos niveles de
importancia. Si se producen conflictos de apariencias, se toma por defecto la
CCS más cercana al tag. Con CCS no sólo puede definirse a apariencia
sino también la colocación en la página.
CCS está soportado en Microsoft Internet Explorer y en Netscape Navigator.
VRML
EL Lenguaje de Modelado de Realidad Virtual(Virtual Reality Modeling Languaje)
es una interesante herramienta para agregar realidad tridimensional a los sitios
Web. Este lenguaje fue iniciado por Silicon Grafhics, una compañía
conocida por su hardware y su software gráficos para computadora de alta
calidad.
VRML extiende Web al proporcionar sitios tridimensionales completos. Estos
son sitios por los que un usuario puede caminar moviendo un ratón. En
lugar de una página estática con imágenes apareciendo en
ella, la página tiene una imagen única en la que el usuario puede
entrar y maniobrar adentro.
VRML es la ola del futuro, ya que se ha dotado con capacidades como Java dónde
los objetos pueden tener funcionalidad incorporada. Por ejemplo, tocar un televisor
virtual podría hacer que se ejecutara un programa Java que en realidad
adquiere una alimentación de vídeo vía Internet y la coloca
en la pantalla del televisor, permitiéndole por tanto ver televisión
virtual.
VRML es un lenguaje que no se usa mucho a pesar de ser bastante amigable con
el ancho de banda, coloca su carga en la máquina del usuario. Es decir
que le corresponde a la computadora del usuario crear la escena tridimensional.
La tercera dimensión requiere muchos recursos de la computadora. Lo que
reduce esto es la velocidad. Por lo tanto mientras más rápida
sea la computadora del usuario, más rápido calcula y dibuja la
tercera dimensión.
Unidad 5 "Seguridad en una Página Web" - Seguridad
en una Página Web
Condiciones de Seguridad
Debido a los pocos mecanismos de seguridad informática en Internet,
el hecho de colocar una página Web en ella trae determinados riesgos
que pueden ser controlados con alguna estrategia adecuada.
La información de una página Web tiene tres condiciones de seguridad:
operatividad, integridad y privacidad, al igual que cualquier tipo de información
manejada por computadoras. Mantener estas tres condiciones de seguridad es una
tarea compartida entre el dueño de la página(autor y/o responsable)
y el prestador del servicio de Internet(dueña del sitio)
Teniendo en cuenta algunas consideraciones:
- Que la página Web es puesta on-line en Internet por un proveedor del
servicio de conexión a Internet.
- La actualización y modificación del servicio corren por cuenta
del dueño por medio de un acceso al sitio del proveedor protegido por
algún tipo de sistema de seguridad
( por ej: un sistema de paswwords)
Analizamos las responsabilidades del prestador del servicio y del creador de
la páginas en estos tres aspectos fundamentales de la seguridad:
Operatividad
La información que contenga la página debe estar siempre en condiciones
operativas para quienes acceden a la misma puedan recorrerla sin problemas,
sin encontrar fallas, faltas, o cualquier tipo de anomalía.
Responsabilidad del encargado de la página: la información añadida
o modificada por un responsable de la página debe ser colocada en ella
en los formatos establecidos y verificado su correcto funcionamiento dentro
de la estructura de programación.
Responsabilidad del prestador del servicio: todo sistema de computadoras está
expuesto a fallas de hardware, software y de tipo externo como fallas de suministro
eléctrico. Para esto deberá tener un plan de soluciones y un mantenimiento
preventivo. También debe garantizar que si una información es
colocada en la página según las especificaciones y procedimientos
acordados, ésta funcionará correctamente.
Hay que considerar también que el ingreso de un intruso al sistema puede
provocar daños que afecten a la operatividad.
El prestador del servicio deberá tener un sistema de seguridad, por
ejemplo, en barreras de protección como firewalls, proxis, etc., que
impidan los accesos no autorizados.
Integridad
De nada sirve que una información esté en condiciones operativas
si es incompleta o está alterada. Para que una información resulte
inútil no es necesario que sea destruida, puede ser suficiente una acción
tan sutil como cambiar los unos por ceros. Por lo tanto la integridad de la
información que se muestra en una página Web es uno de los factores
más importantes de la seguridad, pues de él dependen el interés
y la credibilidad de la página. La integridad de la página puede
ser dañada por fallas de hardware o software, o atacada por intrusos
en el sistema que toman el control sobre algún sector y modifican el
contenido de las páginas
Responsabilidades del dueño de la página: la información
que es agregada o modificada en la página debe estar en condiciones de
integridad cuando llega a ella, y tratando de que se mantenga hasta que termine,
pues puede ser afectada por la transmisión hasta el sitio o por algún
problema de su funcionamiento o seguridad.
Responsabilidades del prestador del servicio: asegurar la integridad de la
información que contiene una página Web, en lo que atañe
a accesos no autorizados al sistema.
Los bugs (errores estructurales) de los programas utilizados también
pueden ser la puerta de entrada para los accesos no autorizados. Se debe exigir
que el sistema del proveedor esté depurado de este tipo de fallas.
Privacidad
Es lógico pensar que quien quiere que una información sea privada
no debe colocarla en una página Web. Pero puede ocurrir que parte de
la información esté reservada a usuarios registrados o que exista
algún tipo de restricción.
Responsabilidades del dueño de la página: el dueño de
la página debe definir y separar claramente cuál es la información
de dominio público y cual de acceso restringido, y manejarlas en zonas
separadas en la programación de su página.
Responsabilidades del prestador del servicio: el acceso restringido a parte
de la información de una página debe ser sustentado por el prestador
del servicio asegurando que los mecanismos de control de acceso de la página
funcionen correctamente en su sistema
Riesgos externos al sistema - Fallas de hardware
- Fallas de software
- Fallas de los formatos en información
Riesgos internos del sistema
- Alimentación eléctrica
- Siniestros
- Intrusos
- Virus informáticos
Riesgos internos del sistema
- Hardware
- Software
Riesgos externos del sistema
- Intrusos
- Virus informáticos
Riesgos internos del sistema
- Personal Prestador
Riesgos externos del sistema
- Intrusos
Cada una de las condiciones de seguridad de la información de una página
Web: operatividad, integridad y privacidad, tienen sus propios riesgos que actúan
dentro o fuera del sistema.
Para establecer una estrategia de seguridad se debe evaluar el grado de importancia
de cada uno de ellos y basándose en ello, establecer normas y procedimientos
necesarios para contenerlos.
Seguridad y transacciones en efectivo en la Web
Para muchas aplicaciones de negocios, como la publicidad y promociones simples,
es probable que no se necesite tratar con precauciones de seguridad. Pero si
se permite que los usuarios tengan acceso a datos delicados, se deberán
tomar medidas para proteger a los datos. Debido a que cada vez son más
las personas que desean transferir documentos e información de tarjetas
de crédito o cualquier tipo de transmisión de datos en forma segura
y sin el temor a los crackers y piratas.
Las medidas de seguridad básicas a tener en cuenta son:
La encriptación de datos
Es una técnica para ocultar datos de manera que sólo puedan ser
vistos por aquellos que deben verlos. Consiste en reemplazar un mensaje enviado
con un algoritmo difícil de adivinar.
Los servidores seguros tratan de encriptar los datos entre el navegador y el
servidor.
En algún momento durante el ciclo de compras, después que los
datos llegan al servidor seguro, el sistema debe desencriptar los datos. Aun
si los datos son desencriptados sólo por un instante, la información
podría ser interceptada por algún pirata. Crear un sistema en
el que la información permanezca encriptada a lo largo del ciclo es prácticamente
imposible.
La configuración más segura es una que transmita la información
al propietario de la empresa en formato encriptado, pase la información
a una computadora que no esté en Internet y luego desencripte la información.
El usuario
Encriptación
Internet
Proveedor de destino
Su conexión de Internet
Desencriptación
Computadora segura
Además si en una empresa se utiliza un mismo algoritmo para encriptar
y desencripar datos, se necesitará que alguna tercera pieza de datos
desencripte el código, que seria una clave. Esto sólo funcionará
si tanto la persona transmisora como la parte receptora conocen la clave. Si
la persona receptora no conoce la clave, tiene que enviar la clave a esa parte,
y está puede ser interceptada.
Firma digital
Ofrece un método de encriptación de datos que evita tener que
compartir claves para leer mensajes.
Es la técnica llamada encriptación de clave pública, donde
cada usuario tiene dos claves: una clave pública y una clave privada.
Los algoritmos de encriptación y desencriptación son adaptados
de manera que sólo la clave pública puede desencriptar los datos
encriptados por la clave privada. Por consiguiente, puede transmitir con libertad
la clave pública al mundo.
Creación de un sitio seguro
Las ventajas de crear un sistema seguro antes de ser pirateado deben ser obvias.
La prevención es la mejor medicina y esto se aplica también ala
seguridad de las computadoras.
Se debe mantener la seguridad de los archivos de datos de tal forma que solo
las personas correctas puedan verlos. Esto es crucial para los siguientes tipos
de datos y archivos: contraseñas de usuarios, archivos de facturación,
registros de sistema y de usuarios, información de tarjetas de créditos,
información confinada de sistemas remotos, compiladores, herramientas
de administración.
Firewalls, Wrappers y Proxies
Los firewalls, wrappers y proxies ofrecen una buena línea de defensa
para los propietarios de servidores Web y administradores de sistemas.
Los firewalls pueden ser software o hardware que protege los puertos y evita
que los piratas penetren al sistema. Los firewalls permiten que tengan acceso
al sistema sólo ciertos nombres de dominio confiables.
Los wrappers se encuentran disponibles en CERT al igual que en otros archivos
en Internet. Los wrappers se ejecutan como una capa de software alrededor de
su otro software. Un usuario que se conecta a FTP primero entraría en
contacto con el wrapper, el cual luego habilitaría al FTP. El usuario
no sabe que existe el wrapper y no puede detectar ninguna diferencia en el sistema.
Los wrappers son interesantes porque son flexibles. Pueden actuar como firewalls
y en realidad pueden rechazar usuarios con base en sus nombres de usuarios al
igual que en sus nombres de dominios. Además permite crear callejones
sin salida que permiten atrapar piratas.
El modo proxy es un método permite ocultar datos por medio de reenrutamiento
de las solicitudes. Es útil para usuarios que están detrás
de una firewall. Los usuarios establecen una dirección proxy de su navegador
para que apunte hacia su servidor Web. El servidor Web maneja entonces la dirección
real de los datos hacia el mundo exterior. Esto reduce la dirección que
el usuario está tomando cuando deja su sistema, permitiéndole
al usuario enrutar los datos los datos a través de los agujeros en sus
propias firewalls. La otra ventaja es que las solicitudes pueden ser filtradas
por el software del servidor. Al filtrar la información, puede restringir
el contenido y rastrear el uso al igual que modificar la información
en ese instante.
Los servidores proxy también pueden ser dirigidos a otros servidores
proxy, lo cual les permite ocultar datos en forma efectiva.
Otra ventaja de los servidores proxy es que los servicios como FTP, Telnet,
Gopher, NetnNews, etc., pueden ser erutados a servidores diferentes. Esto le
permite distribuir diversas cargas de servidor Web a diferentes servidores físicos.
Además de beneficiarse con el ocultamiento de los datos, ser reduce la
carga del servidor.
Conclusión
En Internet puede encontrarse prácticamente toda la información
que pueda imaginarse: texto, fotografías, audio, vídeo, programas,
datos, enciclopedias, novelas, investigaciones, y cada día hay más.
Para que todos esos datos puedan ser consultados, deben estar ordenados de
alguna manera. El desarrollo actual del World Wide Web ha proporcionado herramientas
de búsqueda, como "motores" o "índices".
En general, el WWW tiene una interfaz de usuario muy amigable, que tiene como
nombre Navegador o "Browser", capaz de interpretar "páginas
Web" e "hipervínculos" y mostrar esta información
al usuario.
Una página Web es una vía de comunicación entre una empresa
y el público: clientes y proveedores, por lo tanto es una herramienta
que hay que saber usar y explotar para sacarle el mejor provecho en función
de las necesidades comunicacionales de la empresa.
Las posibilidades que ofrece una publicación en la Web son infinitas,
tomando en cuenta su flexibilidad para adaptarse a los cambios de una empresa.
Esto permite dar difusión inmediata a promociones y comunicados especiales.
Una Página Web personalizada, con ilustraciones atractivas, texto y
con las últimas características de programación, darán
una gran oportunidad de generar nuevos negocios o de distribuir información.
Para lograr que una página sea exitosa, se debe tratar de hacerla llegar
a la mayor cantidad de personas posible, y para ello, debe ser desarrollada
utilizando criterios de diseño que sean compatibles en todas las plataformas,
bien sean sistemas bajo Windows, Macintosh o UNIX.
Cuando hablamos sobre diseño de páginas Web, nos referimos al
lenguaje HTML que consiste en una serie de comandos que le indican al programa
navegador de WWW cómo darle formato al texto que contienen los archivos.
Los servicios de diseño de páginas Web cubren un rango que va
desde convertir archivos de texto a formato HTML, hasta desarrollar extensos
conjuntos de páginas cargadas de ilustraciones e hipervínculos
relacionados entre sí.
Una página Web debe estar ubicada en una computadora que esté
físicamente conectada a Internet. La manera más sofisticada (y
costosa) es disponer de un servidor de WWW propio y conectarlo directa.
Es indispensable que los visitantes potenciales sean capaces de encontrarla.
Para ello, hay que registrar la página en algunos de los principales
"Indices de Búsqueda" en la Internet, que proveen a los navegadores
una manera sencilla de conseguir las páginas, según los intereses
particulares.
Los servicios "gratuitos" que ofrecen a sus suscriptores espacio
para publicar sus páginas Web como parte de una tarifa mensual por servicio.
Muchas personas aprovechan este servicio, aunque sus nombres de dominio son
algo complicado.
Muchos de estos servicios no ofrecen algunas de las características
que son deseables en páginas Web con un enfoque comercial. Esto incluye
soporte de CGI Script, aplicaciones JAVA, JAVASCRIPT y ActiveX, formas y contadores.
Una alternativa popular consiste en utilizar los servicios de un proveedor
que "alquila" el espacio en su servidor de alto rendimiento. Por un
reducido costo mensual, se puede disfrutar de los beneficios de tener el propio
servidor, sin todo el tiempo y esfuerzo que requiere administrarlo. Para la
mayoría de las empresas que desean tener presencia en el Web, esta es
la mejor opción.
Una vez que la página Web esté activa en algún servidor,
es muy poco, o prácticamente nulo el mantenimiento que requiere. De cualquier
manera, las páginas Web más exitosas son aquellas que atraen un
gran número de visitantes, y, en el mejor de los casos, visitantes repetitivos.
Los lugares más exitosos en el WWW son proyectos en continua evolución.
Generalmente, el esfuerzo se refleja en más visitantes a las páginas.
Para una empresa, este efecto es positivo en muchos sentidos. Mientras más
personas visiten las páginas, se tendrá mejor presencia corporativa,
mejorarán sus contactos y estos se verán reflejados en un aumento
de las ventas.
Bibliografía - Libros :
* Inicie su negocio en Web.
David Cook y Deborah Sellers
Prentice-Hall Hispanoamericana, S.A.
* Diseño en la Web
Mcgraw-Hill
Revistas:
* PC Plus
* COMPU MAGAZINE
En Internet:
* http://www.iac.es/galeria/westend/node1.htm
* http://www.iac.es/galeria/westend/node2.htm
* http://www.iac.es/galeria/westend/node3.htm.
* http://www.iac.es/galeria/westend/node4.htm, etc.
* http://www.ocea.es/forem/guiahtml.htm
Titulo: Un sitio en Internet "La Web"
Categoria: Informática
Resumen: La World Wide Web - Historia - Hipertexto - Funcionamiento de la Web
- Sistemas de búsqueda - Construcción páginas web - Etapas
de desarrolo de un sitio web - Lenguaje HTML - Hardware y Software - Seguridad
en una página web
Trabajo realizado por:
Lora Veronica
Analista Universitario de Sistemas
Universidad Tecnológica Nacional de Córdoba