00 Edicion Html Introduccion

MINISTERIO DE EDUCACIÓN Y CIENCIA

SECRETARÍA GENERAL DE EDUCACIÓN Y FORMACIÓN PROFESIONAL DIRECCIÓN GENERAL DE EDUCACIÓN, FORMACIÓN PROFESIONAL E INNOVACIÓN EDUCATIVA CENTRO NACIONAL DE INFORMACIÓN Y COMUNICACIÓN EDUCATIVA

Edición HTML Introducción y herramientas necesarias

C/ TORRELAGUNA, 58 28027 - MADRID

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

Índice de contenido Información general ............................................................................................................. 3 ¿Qué es un hipertexto? ....................................................................................................... 4 ¿Qué es el HTML?............................................................................................................... 4 Conceptos de Servidores y Clientes WEB .......................................................................... 5 ¿Cómo funciona el par Cliente-Servidor? ........................................................................... 5 Unas cuantas ideas esenciales............................................................................................ 6 Para comunicar hay que tener algo que decir.................................................................. 6 Una buena idea puede escribirse con mala caligrafía...................................................... 6 ...aunque es preferible que la caligrafía acompañe......................................................... 7 En el fondo tenemos gustos similares.............................................................................. 7 Si en mi cabeza no está claro ¿cómo lo va a estar en la del visitante?........................... 7 Calor de hogar................................................................................................................. 8 ¡Viva la comunicación viva!.............................................................................................. 8 Herramientas........................................................................................................................ 9 Obtención e instalación........................................................................................................ 9 N|VU................................................................................................................................. 9 Gimp................................................................................................................................. 9 Real Producer Basic 10 y Real Player Basic 10 ........................................................... 11 Filezilla........................................................................................................................... 11 Instalación...................................................................................................................... 12 Notepad ++.................................................................................................................... 14

Estilos CSS - Menús

2 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

INFORMACIÓN GENERAL Seguramente ya habrás leído la guía del alumno y tendrás una idea clara del funcionamiento del curso. De todas maneras es importante que recuerdes que el objetivo final consiste en construir y publicar un sitio WEB de contenido educativo compuesto de varias páginas con sus correspondientes enlaces. Los recursos para llevar a cabo esta tarea los iremos trabajando paso a paso, pero deberías tenerla presente desde el momento de iniciar el curso. Los materiales que encontrarás recogen una serie de explicaciones sobre los diferentes elementos que constituyen las páginas WEB y un conjunto de ejercicios intercalados para ir practicando los conceptos explicados. La navegación por los contenidos del curso puede hacerse siguiendo una secuencia lineal o bien de forma no secuencial para lo que se utilizará el menú con el desarrollo de los bloques de contenido que tendrás presente en la pantalla. Junto a las explicaciones textuales encontrarás zonas del manual diferenciadas gráficamente: En algunos casos se tratará de recomendaciones de "estilo", ya que crear una sitio WEB es algo más que amontonar información más o menos correctamente relacionada. Como en todo medio de comunicación se han ido desarrollando una serie de normas de estilo que será conveniente respetar. No pretendemos ser estrictos, pero ten en cuenta que la habilidad para navegar se adquiere gracias a que las páginas por las que pasamos respetan un conjunto similar de convenciones y no tenemos que ir descubriendo nuevos indicadores a cada paso. Las encontrarás en este tipo de recuadros.

Detrás de cada página WEB hay unos códigos que permiten que la veamos tal como se presenta en nuestra pantalla. Aunque trabajarás fundamentalmente en un entorno gráfico en el que las herramientas que utilices irán construyendo el código hay algunos momentos en los que se hace imprescindible recurrir a la edición manual del mismo. La presentación en pantalla será como la de este bloque.

El tercer tipo de cuadros será el correspondiente a las prácticas. Siempre encontrarás un número identificativo de la actividad

que te permitirá localizar rápidamente los

ejercicios.

Este tipo de señal te avisará de alguna cuestión relevante. Puede tratarse de un detalle que puede alterar la forma de llevar a cabo un procedimiento o provocar un error, de alguna advertencia importante respecto a códigos o estilos o, en general, alguna nota que te puede evitar más de un quebradero de cabeza. La secuencia de prácticas se inicia trabajando directamente con el código. Si ya has tenido algún contacto con alguna otra herramienta de diseño de páginas WEB puede parecerte que esta fase sobra. Como autor del curso considero que es un recurso metodológico necesario para hacer patentes las características del lenguaje HTML y por ello los primeros ejercicios son de este tipo. A partir de la cuarta práctica iniciaremos el trabajo con el editor gráfico.

Estilos CSS - Menús

3 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

¿QUÉ ES UN HIPERTEXTO? El concepto de hipertexto responde, fundamentalmente, a una forma de concebir el acceso a la información. El texto impreso podría considerarse un modelo de presentación de la información de manera lineal: la página 2 sucede a la 1, y así sucesivamente, del prólogo al epílogo. Sin embargo existen, incluso en soporte impreso, materiales en los que el lector es quien establece la secuencia de acceso a la información. Podemos mencionar ejemplos entre grandes obras literarias, como "Rayuela" de Julio Cortázar, en modestas obras de literatura infantil, del estilo "Construye tu propia aventura" o, en el entorno más cotidiano, la información contenida en un diario. Posiblemente sea el modelo del diario el que más fácilmente nos pueda dar pistas sobre lo que es un hipertexto. Prácticamente nadie lee un periódico desde la primera a la última página: seleccionamos la información que consideramos más interesante a partir de lo que aparece en portada y es a ese artículo al que acudimos en primer lugar. Esta posibilidad de seleccionar el itinerario que vamos a seguir es uno de los elementos que definen al hipertexto. Ahora bien, aunque pueda servirnos para asimilar de forma intuitiva el concepto de hipertexto, tendremos que considerar un segundo elemento para definirlo: la posibilidad de incluir, junto a la información escrita y la imagen fija, el sonido y la imagen en movimiento. Aunque es posible seguir buscando signos identificativos del hipertexto podemos dejar esta primera aproximación en este punto. Por tanto, a los efectos de este curso, consideraremos hipertexto al conjunto de información en soporte multimedia que se estructura mediante enlaces entre los diversos elementos, de forma que el usuario pueda acceder a ella de forma ágil y teniendo la posibilidad de establecer su propio itinerario de "lectura".

¿QUÉ ES EL HTML? Una de las primeras preguntas que se hace uno al acercarse a la creación de páginas WEB es qué significa eso de HTML. Las siglas HTML son las iniciales de la expresión en inglés HyperText Markup Language. Traducido al castellano sería Lenguaje de Etiquetas de Hipertexto. Se trata de un conjunto de etiquetas que se van intercalando entre el texto de forma que los programas que utilizamos para navegar por la Red sepan qué es lo que tienen que mostrar cuando accedemos a una página y cómo deben presentarlo en la pantalla. Dada la constante evolución de Internet, el lenguaje HTML ha ido igualmente evolucionando de forma rápida e incorporando especificaciones a través de las sucesivas versiones del mismo. Existe un organismo internacional independiente ( World Wide Web Consortium o W3C) que se encarga de ir fijando cuáles son las etiquetas válidas pero, a pesar de ello, la batalla comercial que se ha desarrollado en torno a los navegadores para Internet ha originado situaciones en las que han aparecido etiquetas propietarias de un determinado programa. Llamamos etiquetas propietarias a aquellas que sólo son interpretadas correctamente por un navegador, mientras que el resto de los navegadores las ignora. Como consecuencia de ello hay efectos que se pueden ver cuando se visita una página con el navegador Internet Explorer de Microsoft y que no aparecen con otros navegadores o viceversa. Antes de ponernos a trabajar con nuestras páginas WEB tendremos que considerar que algunas de las cosas que nos resultan muy sencillas de hacer con un procesador de texto no lo van a ser tanto cuando estemos creando una página para la Red. El motivo es que el lenguaje HTML surgió con la finalidad de permitir organizar de forma estructurada la Estilos CSS - Menús

4 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

información (fundamentalmente textual) para su consulta por la red, pero no tenía intención de preocuparse por el aspecto gráfico de dicha información. Por ello echarás de menos algunos de los recursos que nos ofrece un procesador de textos de alto nivel como el MS Word, el OpenOffice.org o el Corel WordPerfect, por ejemplo, aunque en el nivel de profundización podrás comprobar cómo las hojas de estilo en cascada (CSS) sí nos permiten definir de forma bastante flexible la apariencia.

CONCEPTOS DE SERVIDORES Y CLIENTES WEB Tras este primer acercamiento a lo que es una página WEB veremos qué hay que hacer para que la información recogida en ella se convierta en algo público y accesible en Internet, o en una Intranet en el interior de nuestro centro de trabajo. Para lograr que nuestras páginas WEB estén disponibles en Internet son necesarios varios requisitos: 1. Que se encuentren en un ordenador permanentemente conectado a Internet. 2. Que dispongamos de una dirección IP fija y conocida por los ordenadores que se encargan de traducir las peticiones de los internautas a direcciones IP. 3. Que el ordenador en el que se alojan nuestras páginas disponga del software adecuado para recibir conexiones exteriores y sea capaz de poner a disposición de los visitantes aquello que solicitan. Los requisitos que acabamos de mencionar, aunque no exclusivos, son algunos de los que necesitamos para considerar que una máquina es un Servidor WEB. Ya empieza a ser posible que un usuario particular disfrute de condiciones que le permitan cumplir el primer requisito, pero es bastante más difícil que se cumpla el tercero. Tengamos en cuenta que el software del servidor debe ser capaz de prestar el servicio a quien lo solicite, pero tiene también que disponer de las medidas adecuadas para evitar los accesos no autorizados y proteger la información que tiene almacenada el equipo en el que está instalado. Una buena política de seguridad requiere un alto nivel de capacitación técnica, por lo que lo más frecuente es que recurramos a una institución, pública o privada, que nos ofrezca espacio para alojar nuestras páginas, lo cual nos permitirá aprovechar su infraestructura técnica. En el caso de las Intranets, donde el acceso sigue siendo público pero limitado al entorno de la propia institución, la preparación de un servidor WEB resulta menos problemática, ya que no requiere la configuración de seguridad exigida por un servidor abierto a Internet. El otro extremo del hilo comunicativo lo establece cada uno de los usuarios que quiere consultar una página WEB. Para ello utilizará un software especializado en recibir la información ofrecida por el ordenador que hace las funciones de servidor. Se trata del Cliente WEB , Agente de usuario o navegador. El empleo del término "navegador" obedece a dos motivos: por una parte la metáfora de Internet como un mar de contenidos nos lleva a aplicar el nombre de "navegador" al programa cuya misión es transportarnos por ese mar. Por otra parte, el término es en parte una generalización por extensión del nombre del programa más utilizado durante la fase inicial de la expansión de Internet: el Navigator de Netscape. Así pues, ya tenemos definida la estructura de relación entre ordenadores necesaria para que la WEB funcione: establecer un par Cliente-Servidor.

¿CÓMO FUNCIONA EL PAR CLIENTE-SERVIDOR? El proceso de distribución de información almacenada en páginas WEB se realiza en las siguientes etapas :

Estilos CSS - Menús

5 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

1. Un internauta solicita una determinada información tecleando el URL de la página o haciendo clic en un enlace. 2. El proveedor de acceso del internauta consulta a su servidor de nombres de dominio (DNS), traduce la petición recibida del navegador a la dirección IP del servidor correspondiente y se pone en contacto con dicho ordenador. 3. El servidor WEB recibe la petición y comprueba que la información solicitada existe y está disponible. Si es así envía la página solicitada al ordenador que le ha realizado la petición. 4. El navegador del internauta recibe, a través de su proveedor de acceso, los recursos que constituyen la página solicitada y los organiza para presentarlos en la pantalla según las instrucciones que contiene el código HTML de la página. Dichos recursos están formados por el texto y los elementos multimedia que componen la página: imágenes fijas, sonidos, imágenes en movimiento, pequeños programas. Todos hemos visto páginas que tardan una barbaridad en cargarse hasta que se presentan en pantalla. Habitualmente, el contenido textual y los códigos de definición de una página tienen un tamaño bastante reducido. Pero no debemos olvidar que la página está compuesta también por el resto de elementos multimedia. La cantidad de información necesaria para presentar completamente una página es lo que constituye su "peso". ¡No lo dudes!: Si quieres garantizar la pérdida de visitas diseña tus páginas cargándolas con elementos multimedia irrelevantes o mal trabajados que aumenten innecesariamente el peso de las mismas. Si los visitantes no huyen desesperados por la lentitud de carga tienes el 99% de posibilidades de que no incluyan tu URL entre sus favoritos.

UNAS CUANTAS IDEAS ESENCIALES ¿Cuántas veces hemos oído aquello de que el sentido común acaba por ser el menos común de los sentidos? Si este aforismo es, desgraciadamente, bastante acertado en la mayoría de los campos de nuestra existencia, parece que acrecentara su validez cuando se trata de una actividad en la que intervienen ordenadores. Es como si supusiéramos que la potencia de cálculo del ordenador va a ser capaz de suplantar nuestra capacidad de crear, pensar y organizar. Por ello quiero recordar algunos principios esenciales que, debido posiblemente a su obviedad, suelen acabar olvidándose.

PARA COMUNICAR HAY QUE TENER ALGO QUE DECIR Desde luego, cuando no hay nada que contar lo máximo que podemos lograr, si dominamos la técnica para ello, es crear brillantes y atractivas burbujas vacías. El primer paso que hemos de dar para crear nuestro sitio WEB es aclarar nuestras ideas sobre lo que pretendemos comunicar a través de sus páginas.

UNA BUENA IDEA PUEDE ESCRIBIRSE CON MALA CALIGRAFÍA... Podemos aprender literarias tras esos

afirmar sin lugar a duda que todos los grandes genios de la literatura tuvieron que a manejar un lápiz. Y es casi seguro que más de uno hizo sus primeras intentonas con caligrafías temblorosas que, a pesar de todo, no ocultaban el talento que había trazos.

El lenguaje HTML va a ser la herramienta con la que plasmaremos nuestras ideas para

Estilos CSS - Menús

6 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

publicarlas en Internet. Como ocurre con cualquier herramienta, la calidad de los trabajos realizados con ella dependerá de la familiarización que seamos capaces de adquirir con su manejo ... y eso tiene mucho que ver con la práctica.

...AUNQUE ES PREFERIBLE QUE LA CALIGRAFÍA ACOMPAÑE Si atendemos a lo dicho en los párrafos anteriores puede ocurrir que desequilibremos la balanza hacia el platillo del fondo en detrimento del platillo de la forma. Aunque es verdad que el predominio de la forma nos acerca peligrosamente a los fuegos de artificio, no es conveniente que abandonemos un cierto grado de preocupación por la constante superación de nuestra "caligrafía". En muchas ocasiones hay aspectos, que parecen meramente formales, cuya incidencia sobre la legibilidad y facilidad de transmisión de los contenidos los alejan del campo del adorno para llevarlos al terreno de la arquitectura del mensaje.

EN EL FONDO TENEMOS GUSTOS SIMILARES Cuando hago esta afirmación no me refiero a los aspectos estéticos, donde está claro que encontraríamos casi tantos matices como seres humanos. Pensemos el entorno en el que nos estamos moviendo: navegación por Internet en un entorno educativo. Hay algunas coordenadas que son comunes a la mayoría de los que trazamos esta singladura: •

Nos gusta movernos rápido.

•

Nos impulsa la búsqueda de información relevante.

•

Agradecemos que nos brinden sistemas cómodos de navegación.

•

Nos molestan las visitas a sitios en obras (Me refiero a esos que lo único que tienen es un cartel que nos lo dice, porque la verdad es que una buena WEB siempre debería estar en obras). ¿Imágenes y sonidos? Todos los que pida el contenido, pero optimizados, que el que paga la conexión telefónica soy yo y no todos tenemos conexiones a velocidades de vértigo. ...

•

•

Seguro que encontramos bastantes más puntos de coincidencia. Así que ¿por qué no nos planteamos lo que pensaríamos del autor si fuéramos visitantes de la WEB que estamos creando? Por cierto, cuando intentes responder esta pregunta olvida las horas de esfuerzo que le has tenido que dedicar a lo que tienes en tu pantalla ;-)

SI EN MI CABEZA NO ESTÁ CLARO ¿CÓMO LO VA A ESTAR EN LA DEL VISITANTE? Una WEB educativa no debería ser uno de esos eventos que se dieron en llamar "performances" en los que cada uno reelaboraba y reinterpretaba la propuesta creativa. Seamos serios: si pretendo transmitir una información el proceso es, inicialmente, asíncrono y unidireccional. Otra cosa es que arbitre los procedimientos para que haya interactividad, pero el flujo inverso se tendrá que producir cuando el visitante tenga claro el mensaje y las ideas que le quiero transmitir. Si esas ideas no están organizadas en mi cabeza no podré plasmarlas de forma que el visitante las perciba como algo coherente.

Estilos CSS - Menús

7 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

CALOR DE HOGAR No se trata de que todos los muebles sean iguales, de que todos los cuadros sean del mismo tamaño,... pero lo cierto es que cualquier casa tiene un estilo que hace que, por muy grande que sea, cuando cambias de habitación no sientas que te has mudado a casa de los vecinos. Desgraciadamente son muchos los sitios WEB en los que el salto de página me hace sentir que me he mudado, más que a casa del vecino, a otro país. Cuando pensemos en nuestro sitio WEB deberíamos hacernos una idea de la "decoración" general para que los visitantes adquieran de forma inmediata una sensación de comodidad y de sitio conocido que les facilite la estancia en nuestra "casa virtual".

¡VIVA LA COMUNICACIÓN VIVA! Juega a gusto con las palabras y dales el sentido que te plazca: •

¿La exclamación jubilosa de un deseo?

•

¿Una orden, tal vez?

•

¿Quizás un simple eslogan publicitario arropado por ese tono imperativo?

La verdad es que mi intención era un poco más inmediata. Lo que quería decir en realidad es lo siguiente: •

¡Haga usted el favor de no preocupar a sus visitantes haciéndoles creer que ha muerto!

Si en algún punto de la WEB situamos un enlace que apunte a nuestra dirección de correo tiene que ser con el propósito de contestar a los mensajes que se generen a través de él. Si no es así, es preferible que les ahorremos preocupaciones a nuestros visitantes ;-)

Estilos CSS - Menús

8 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

HERRAMIENTAS Para realizar el curso vamos a necesitar varias herramientas, todas ellas de carácter gratuito. • • • • • •

Una herramienta para edición de texto plano en Windows (puede usarse el bloc de notas, aunque recomendamos Notepad ++) o cualquier editor de textos de Linux Un editor de páginas WEB: N|VU. Un editor de mapas de imágenes: Gimp 2.2.8. Un editor de imágenes: Gimp 2.2.8 Una herramienta de compresión de audio y vídeo y su reproductor asociado: Real Producer Basic y Real Player. Un programa para realizar transferencias vía ftp: Filezilla o GFTP

OBTENCIÓN E INSTALACIÓN Según esté configurado tu ordenador dispondrás de unos u otros programas. Veamos lo que hay que hacer para instalar algunos de ellos.

N|VU Es el programa con el que realizaremos la mayoría de las tareas propuestas en el curso. Toda la documentación está elaborada teniendo como referencia la versión 1.0 de 28 de junio de 2005 que se incluye en la carpeta de programas en la que encontrarás el instalador para Windows y los tres instaladores disponibles para Linux (un tarball para debian con kernel 2.6.10 y gcc/g++ 3.3.5, un tarball para Mandriva 10.1 y un tercero para Fedora Core3) En la página oficial del programa encontrarás como siempre la versión más actualizada. Una vez completada la instalación el programa arrancará en inglés. Para traducirlo al castellano necesitas el paquete de traducción que también tienes en la carpeta de programas. Se trata del archivo nvu-1.0.es-ES.langpack.xpi y para instalarlo tendrás que hacerlo desde la versión original mediante la opción de menú TOOLS EXTENSIONS. Tras completar la instalación, que se limita a pulsar el botón INSTALL y elegir el archivo, tendrás que reiniciar el programa para que la traducción surta efecto

GIMP Nadie discute la importancia de un buen tratamiento gráfico para aumentar la efectividad de una página WEB. Para conseguir que la riqueza gráfica no afecte a la agilidad de nuestras páginas será necesario conocer unos rudimentos de tratamiento de imagen y utilizar alguna herramienta que permita mantener a raya el tamaño de nuestras imágenes.

Estilos CSS - Menús

9 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

El programa elegido es potentísimo por lo que únicamente utilizaremos una parte mínima de sus posibilidades referida a los cambios de tamaño y a la creación de mapas sensibles para las páginas web. Si utilizas Linux tendrás instalado Gimp puesto que forma parte de los componentes base de todas las distribuciones de usos común. En el caso de Windows tendrás sin embargo que obtenerlo de la red, aunque hemos puesto una copia de los componentes necesarios para su instalación en la carpeta Gimp donde verás que aparecen dos archivos, debido a lo que se explica en el siguiente párrafo. Para instalar Gimp para Windows es necesario haber instalado previamente una serie de bibliotecas denominadas GTK+. Así pues, el primer paso será descomprimir el archivo gtk+2.6.9-setup.zip y ejecutar el archivo gtk+-2.6.9-setup.exe resultante de la misma. Una vez completada esta primera fase habrá que descomprimir el archivo gimp-2.2.8-i586-setup.zip y ejecutar el instalador resultante gimp-2.2.8-i586-setup.exe sin asustarte porque los mensajes aparezcan en inglés: el instalador no está traducido, pero el programa asumirá automáticamente el español como lenguaje. La primera vez que arranques Gimp, tanto en Windows como en Linux, aparecerá una pantalla informándote que se va a iniciar la instalación de usuario para completar la instalación básica. Lo único que tendrás que hacer será pulsar las veces que sea necesario en el botón continuar hasta que el programa recoja todos los datos necesarios y dé por finalizada la instalación. El arranque del Gimp en Windows puede resultarte algo lento puesto que tiene que cargar todas las librerías y fuentes, pero una vez finalizado este primer paso su funcionamiento es el que corresponde a una aplicación de gran potencia. En Linux su arranque es mucho más ágil al contar con bibliotecas nativas. Podrás instalar Gimp en Windows 98, aunque la recomendación para obtener el mejor rendimiento es hacerlo en un sistema Windows NT4, 2000 o XP. Cuando se realiza una instalación en un sistema con Windows 98 puede suceder que aparezcan algunos mensajes de advertencia indicando que no se han podido localizar alguna fuente o similares. Dado que estos mensajes aparecen en una pantalla negra de MS-DOS la respuesta habitual es cerrar esa ventana, pero no debes hacerlo, puesto que si se cierra esa ventana de advertencia se finalizará el programa. Así pues, si te encuentras en ese caso, limítate a minimizar la ventana y el programa seguirá su curso normal funcionando sin mayor dificultad. (Aunque, como se ha comentado, podría ser algo más inestable en sistemas Windows 98) Si quieres comprobar la existencia de una versión más actualizada de Gimp puedes consultar www.gimp.org donde encontrarás zonas de descarga para sistemas basados en las plataformas de la familia Unix, Windows y también para Mac OS X.

Estilos CSS - Menús

10 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

REAL PRODUCER BASIC 10 Y REAL PLAYER BASIC 10 Son varias las herramientas que pugnan por hacerse un hueco en el mercado de la compresión de sonidos e imágenes de vídeo para su transmisión por Internet. Hasta el momento, uno de los estándares "de facto" ha sido el conjunto de herramientas RealNetworks. Para conseguir ambas herramientas tendrás que acudir a la WEB de Real Networks que, como suele ocurrir con las grandes empresas es muy dinámica. Eso puede provocar que las direcciones que se ofrecen en este momento no sean válidas en el futuro, aunque en ese caso habría que recurrir a la página principal e iniciar desde allí la búsqueda. En el momento de redactar este curso las páginas para iniciar las descargas eran las siguientes: Real Player Basic para Windows (en castellano) o Real Player 10 para Linux (en inglés por el momento) y Real Producer Basic (disponible únicamente en inglés en el momento de la redacción de este manual)

FILEZILLA Filezilla es un gestor de descargas ftp creado para funcionar en plataformas con sistema operativo Windows En la carpeta de programas dispones de la versión 2.2.16 de este programa. Dado que se trata de un programa con una frecuencia de actualizaciones puuedes comprobar si ya está operativa alguna de las nuevas versiones visitando la página sourceforge.net/projects/filezilla La página principal de Filezilla se enmarca dentro de Sourceforge.net que es una de las comunidades más activas en el desarrollo y difusión de sofware libre. Cuando accedas al sitio y pulses sobre el enlace Download correspondiente a la última versión verás que aparece una ventana en la que están señalados con un color especial los archivos correspondientes a la misma. Al tratarse de programas con licencia GPL comprobarás que se incluyen también las fuentes del programa (archivo src), aunque lo más habitual, es que descargues únicamente el ejecutable para Windows que lleva l, salvo que tengas conocimientos de programación y quieras ver cómo está hecho el programa. Package

Release & Notes

Filename

Date Size

D/L

Arch.

Type

FileZilla 2005-09-12 06:46

2.2.16 Download FileZilla_2_2_16_dbg.zip Download FileZilla_2_2_16.md5

6552631

9875 i386

.zip

234

1627 i386

text

Download FileZilla_2_2_16_setup.exe Download FileZilla_2_2_16_src.zip

3459745 74346 i386

.exe (32-bit Windows)

2332680

1515 i386

Source .zip

Download FileZilla_2_2_16.zip

4456627

9669 i386

.zip

Tanto en el caso de Filezilla como en el de cualquier otro programa que descargues desde Sourceforge.net verás que, al pulsar sobre el archivo que quieres descargar se abre una ventana en la que te da la opción de elegir uno de los "mirrors" (servidores en espejo) de los que puedes descargarlo.

Estilos CSS - Menús

11 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

En la captura puedes ver que aparecen dos servidores en Europa y tres en Norteamérica. Lo más habitual es que los servidores más próximos geográficamente sean los más rápidos a la hora de realizar la descarga, pero no siempre tiene por qué ser así, puesto que puede darse la circunstancia de que se encuentre temporalmente fuera de servicio o saturado. Para elegir uno de los servidores basta con pulsar sobre el icono y eso nos llevará a una página en la que se nos informa del "mirror" que hemos seleccionado. En esa página de información nos avisa de que la descarga se iniciará de forma automática al cabo de unos segundos, indicándonos que tenemos dos posibilidades en caso de que no ocurra así: pulsar sobre el enlace directo o bien elegir otro "mirror" diferente, para lo cual tendríamos que utilizar el botón de vuelta atrás del navegador. Si descargamos programas de forma habitual desde Sourceforge.net podemos marcar una de los servidores que aparecen en la zona inferior y utilizar el botón lo cual hará que en el futuro no tengamos que pasar por la pantalla de seleccióna ya que, salvo que ocurriera una de las incidencias que hemos comentado se lanzará automáticamente la descarga desde el servidor que hayamos predeterminado con esa elección.

INSTALACIÓN Una vez completada la descarga tendrás en tu ordenador el archivo FileZilla_2_2_8_setup.exe, o una versión más actualizada. Recuerda que el archivo mencionado ya se encuentra en la carpeta de programas del CD ROM por lo que no tendrás que descargarlo. Sea cual sea el origen bastará con hacer un doble clic sobre el archivo para que se inicie la instalación. Es probable que te lleves un primer cuando el programa lance un panel de selección de idioma y compruebes que aparece el catalán o el chino tradicional, pero no el castellano. No te preocupes porque se trata del idioma que se utilizará en el instalador. Aunque puedes elegir otro idioma diferente del inglés si piensas que te puedes sentir más a gusto te comentamos los pasos esenciales y seguro que no te pierdes si los sigues. Damos pues por supuesto que has elegido el inglés y lo primero que te presenta es la licencia GPL que tendrás que aceptar pulsando el botón A partir de aquí se inicia la instalación propiamente dicha y comprobarás que la opción que se ofrece por defecto es que es la que te recomendamos que utilices.

Estilos CSS - Menús

12 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

Aunque el funcionamiento del programa es bastante sencillo, la instalación Standard no dispone de una ayuda traducida al castellano, por lo que si te resulta más cómodo consultar una ayuda en francés puedes optar por marcar la casilla para que se instale la documentación en francés, aunque realmente no te lo recomendamos puesto que consideramos que no te va a resultar necesaria. Además, si decides instalar esta opción el programa te pedirá que estés conectado a Internet para descargar unos archivos complementarios. Sea pues con la documentación en francés o sin ella sólo te queda pulsar sobre el botón para continuar con el proceso. Las dos siguientes pantallas, como en prácticamente todas las instalaciones te ofrecen una carpeta por defecto para la instalación y el nombre del grupo de programas que se creará en el menú Inicio. Salvo que tengas alguna preferencia especial puedes aceptarlas con la pulsación de para continuar, con lo que te aparecerá una pantalla que sí es interesante que tengas en cuenta. Las opciones que te muestra por defecto son las que aparecen en la imagen. La primera de ella es no utilizar el modo seguro, que será recomendable cuando se trate de tu ordenador personal puesto que el programa recordará las contraseñas. Sin embargo, si se trata de un ordenador compartido deberías modificarla y marcar USE SECURE MODE, lo cual te obligará a escribir las contraseñas cada vez que las necesites, pero impedirá que otros usuarios se aprovechen de la memorización de las mismas para acceder indebidamente a tus sitios personales. En cuanto a la segunda opción el programa recomienda que se utilice la instalación a través de un archivo XML, salvo en el caso de que se trate de un ordenador en el que estén definidos diferentes perfiles de usuario, caso en el cual sería necesario utilizar el registro para que cada usuario tuviera sus propias preferencias. Llegados a este punto ya le hemos indicado al instalador las condiciones necesarias y basta con pulsar la tecla que hará que vaya apareciendo una barra de progreso y el listado de los archivos que se van copiando en el disco duro. Una vez finalizado el listado aparecerá el botón que utilizaremos para dar por concluida la instalación quedando el programa listo para su uso con el icono situado en el escritorio. Si al arrancar el programa compruebas que el entorno sigue estando en inglés tendrás que modificarlo manualmente mediante la opción de menú EDIT SETTINGS que desplegará la pantalla de preferencias, encontrando en la rama que podrás seleccionar el español.

INTERFACE SETTINGS

el apartado

LANGUAGES

en el

Tras aceptar las opciones que nos ofrece el programa y completar la instalación dispondremos de un nuevo grupo de programas al que accederemos a traves de INICIO PROGRAMAS.

Estilos CSS - Menús

13 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org

NOTEPAD ++ Si trabajas en Linux, independientemente de la distribución que estés usando, contarás con muchos editores de texto plano con prestaciones avanzadas. En el caso de Windows la situación es más deficitaria, contando únicamente con el Bloc de notas, que puede ser una herramienta válida pero es muy pobre en cuanto a prestaciones. Por ese motivo se sugiere la utilización del programa Notepad++ que es una herramienta que ofrece unas prestaciones muy superiores. Se trata también de un programa de código abierto cuya última versión podrás encontrar en notepad-plus.sourceforge.net/es/site.htm desde te dirigirán a Sourceforge cuyo funcionamiento ya conoces. La utilización de Notepad++ es bastante intuitiva y no nos extenderemos en explicaciones al respecto. Su utilidad fundamental en este curso puede ser como aplicación complementaria para la edición de hojas de estilo, por lo que se usará en el nivel más avanzado.

Estilos CSS - Menús

14 de 14

Materiales de Formación con licencia Creative Commons elaborados por el MEC y promocionados por autodidactas.org