TEMA 4: INFORMACIÓN EN LA RED: PÁGINAS WEB

Transcripción

1 TEMA 4: INFORMACIÓN EN LA RED: PÁGINAS WEB CONCEPTOS BÁSICOS DE INTERNET CONTENIDOS DE UNA WEB SERVICIO FTP INSTRUCCIONES BÁSICAS EN HTML INSTRUCCIONES BÁSICAS PARA TABLAS XHTML INSTRUCCIONES BÁSICAS PARA FORMULARIOS INSTRUCCIONES BÁSICAS DE HOJAS DE ESTILO CSS EJEMPLOS DE PÁGINAS WEB CONCEPTOS BÁSICOS DE INTERNET Servidor Web: equipo informático preparado para alojar en su disco duro páginas web públicas y para atender peticiones de otras máquinas clientes mediante protocolo HTTP Modem: periférico que sirve para conectar un ordenador a una red, tanto telefónica como de área local. Es el componente físico que permite acceder a Internet. Proveedor de servicios (ISP): suele ser una operadora de telefonía que ofrece servicios de conexión a Internet. Estos incluyen el dar una dirección IP al ordenador (dar de alta) y otros servicios como cuentas de correo electrónico, alojamiento de páginas web, etc. En Internet, todos los ordenadores tienen su propia dirección IP con la cual se conectan. Las IP's son cuatro bloques de ocho bits cada uno separados por un punto (cada bloque podría contar entre 0 y 255) de forma que una dirección IP podría ser Esto quiere decir que pueden existir posibles dir IP. Servidor DNS: Son servidores especializados en traducir las dir IP (p.e ) en nombres de dominio (p.e. y viceversa. Dirección IP: Es un número asignado automáticamente a una máquina en el momento en que solicita los servicios de conexión a un proveedor. Protocolo informático es un conjunto de reglas estándar que utilizan los ordenadores para comunicarse a través de Internet o de cualquier tipo de red. Es de dominio público y los más importantes para nosotros son: TCP/IP: Es el protocolo base del funcionamiento de todos los servicios de Internet (correo, páginas web, chats, descargas, streaming, etc), lo implementan todos los sistemas operativos y realiza dos tareas: establece la identidad del ordenador en la red mediante una dirección IP y permite enviar y recibir información por Internet. HTTP: Es un protocolo utilizado para enviar y recibir páginas web (es decir, implementa el servicio World Wide Web, más conocido como www) Una página web consiste en dos tipos de ficheros: por un lado, las imágenes y los gifs animados que visualiza, y por otro, un fichero de extensión.html (normalmente el fichero index.html) con instrucciones de cómo debe visualizarse dichas imágenes, del color o imágenes de fondo que han de verse, del texto que debe aparecer, en qué lugar exactamente y con qué tabulado y, finalmente, las direcciones de los enlaces que tiene dicha página. Todas estas instrucciones están escritas en lenguaje HTML, un lenguaje que interpreta un programa instalado en nuestro ordenador llamado navegador web: programa que permite leer la información de una página web, esté en un servidor web de Internet o un servidor web local. 1 de 12

2 4.2.- CONTENIDOS DE UNA WEB Contenidos web: Toda información en forma de texto, fotografías, audio o vídeo que presenta una página web. Cada vez son más complejos y, por eso, el lenguaje en que se escriben las webs deben de ir añadiendo nuevos elementos. Hipertexto: es un fragmento de texto (palabra, conjunto de palabras, frase o párrafo) que conduce a otro texto y que tiene relación con él. Es la base de las webs. Lenguaje de programación: es un lenguaje con una sintaxis perfectamente definida que se utiliza para controlar el funcionamiento de una máquina y, en concreto, de un ordenador. Para un site veremos los siguientes: HTML (HyperText Markup Language) Lenguaje de programación más utilizado en la elaboración de páginas web, ya que define la estructura y el contenido de las mismas. CSS (Cascade Style Sheets): Lenguaje usado conjuntamente con el HTML para definir la presentación de una web escrita en este último. Se utiliza para separar la estructura de su presentación. Javascript es otro lenguaje utilizado con HTML que permite mejoras en la interfaz de usuario que no se consiguen con los anteriores. Direccionamiento: es el modo que tiene un ordenador de acceder a un contenido dentro de una estructura de carpetas anidadas. Hay dos tipos: absoluto: los contenidos se especifican partiendo de la carpeta raiz mostrando todas y cada una de las carpetas por donde pasa hasta llegar a ellos relativo: los contenidos se especifican partiendo de la carpeta donde está el fichero html que invoca dichos contenidos. Sistema de colores: codificación que sirve para matizar los colores que queremos mostrar en una página web y que utiliza dos cifras en código hexadecimal para cada uno de los canales de colores precedidas del símbolo #. Hay dos tipos: RGB (Red, Green, Blue) que especifica la intensidad de tonalidades rojo, verde y azul. Es el utilizado en las páginas web. Un ejemplo sería #5100ff. CMYK (Cyan, Magenta, Yellow, Black) que especifica la intensidad de tonalidades Cián, Magenta, Amarillo y Negro. No se usa en las páginas web sino en edición de fotografía SERVICIO FTP El servicio WWW es un servicio que facilita Internet y que se puede realizar gracias al protocolo HTTP pero se ha hecho tan famoso que la gente confunde este servicio con Internet. Internet es mucho más: servicios de correo electrónico (y que utiliza los protocolos POP3 y SMTP), el servicio de transmisión de archivos (protocolo FTP), las conversaciones en línea, telefonía y televisión por Internet, el acceso remoto a otros dispositivos o los juegos en línea son algunos servicios. Todos estos protocolos funcionan utilizando como base el TCP/IP. FTP (File Transfer Protocol) es uno de los servicios que ofrece el protocolo TCP/IP para la transferencia de archivos entre sistemas conectados a una red de manera que desde un equipo llamado cliente uno puede conectarse a otro equipo llamado servidor para descargar archivos desde él o para enviarle archivos, independientemente del sistema operativo utilizado en cada equipo (es lo que se llama arquitectura cliente-servidor) Un servidor FTP es un programa especial que se ejecuta en un equipo servidor normalmente conectado a Internet (aunque puede estar conectado a otros tipos de redes). Su función es alojar datos en su disco duro y permitir el intercambio de ficheros entre él y una máquina cliente. 2 de 12

3 Por lo general, los programas servidores FTP no suelen encontrarse en los ordenadores personales, por lo que un usuario normalmente utilizará el FTP para conectarse remotamente a uno y así intercambiar información con él. Las aplicaciones más comunes de los servidores FTP suelen ser el alojamiento web en el que sus clientes utilizan el servicio para subir sus páginas web y sus archivos correspondientes; o como servidor de backup (copia de seguridad) de los archivos importantes que pueda tener una empresa. Cuando un navegador no está equipado con la función FTP, o si se quiere cargar archivos en un ordenador remoto, se necesitará utilizar un programa cliente FTP. Un cliente FTP es un programa que se instala en el ordenador del usuario, y que emplea el protocolo FTP para conectarse a un servidor FTP y transferir archivos, ya sea para descargarlos o para subirlos. Para utilizar un cliente FTP, se necesita conocer el nombre del archivo, el ordenador en que reside (servidor, en el caso de descarga de archivos), el ordenador al que se quiere transferir el archivo (en caso de querer subirlo nosotros al servidor), y la carpeta en la que se encuentra INSTRUCCIONES BÁSICAS EN HTML Etiquetas o Tags para la cabecera 1.- <HEAD> y </HEAD> 2.-<TITLE> </TITLE> : Para indicar el título de la página 3.- <STYLE TYPE= text/css > y </STYLE>: Para hojas de estilo CSS 4.- <LINK TYPE="text/css" rel="stylesheet" href="mifichero.css"> Para llamar a un fichero externo de hojas de estilo CSS 5.- <SCRIPT LANGUAJE= Javascript > y </SCRIPT> Para código en otro lenguaje de programación Etiquetas o Tags para el body 1.- <BODY [BGCOLOR= color ][BACKGROUND= fichero.jpg ] [TEXT= color ] [LINK= color ] [VLINK= color ]> y </BODY> 2.- <B> </B> Para intensificar un determinado texto 3.- <I> </I> para escribir en cursiva 4.- <U></U> para escribir el texto subrayado 5.- <BR> para que el texto aparezca en la siguiente linea. 6.- <P ALIGN= left center right > y </P> establece la alineación del párrafo a la izquierda, centrado o a la derecha según el parámetro) 7.- <! -- Comentarios --> 8.- <CENTER> y </CENTER> para centrar una parte de la página web 9.- <MARQUEE [direction= dir ]> y </MARQUEE> 10.- <IMG SRC= nombrefichero ALT = texto > para poner una imagen de tipo.gif o.jpg y, de forma alternativa, un mensaje de error 11.- <A HREF= dir de otro documento TARGET= _blank > </A> sirve para asignar a un trozo de texto un enlace a otro documento de la red o hipervínculo <A HREF =#NombreAncla> y </A> junto con la siguiente 13.- <A NAME =NombreAncla> y </A> enlaces dentro del documento. 14.-<FONT [FACE="TipoLetra"] [SIZE="número"]> </FONT> 15.- <TABLE [WIDTH="%"] [BORDER="1"] [CELLSPACING="0"]> <TR [ALIGN= alineación > y </TR> <TD [VALIGN= alineación ]> y </TD> 16.- <UL> y </UL>, junto con <LI> Y </LI> 3 de 12

4 Signos especiales: < (Menor que): < " (comillas dobles): " ñ: ñ; > (Mayor que): > á: á : & (símbolo de and, o ampersand): & ü: ü : INSTRUCCIONES BÁSICAS PARA TABLAS XHTML La estructura para crear una tabla es la siguiente: <TABLE [WIDTH="95%"] [BORDER="1"] CELLSPACING="0"] > <TR> <TD > </TD> </TR> </TABLE> Y los parámetros a utilizar son los siguientes: WIDTH: indica cuánto ancho de pantalla ocupará la página Web. BORDER indica el grosor del borde de la tabla, CELLSPACING el espacio entre las líneas de las celdas. CELLPADDING el espacio entre el texto y las líneas de la celda BACKGROUND: pone una fotografía de fondo en la tabla/fila/celda que se indique. BGCOLOR: pone la tabla/fila/celda del color que se indique. TR indica el comienzo y final de una fila (fila=arrow), TD indica el comienzo y final de una celda (actúa a modo de columna) ALIGN alineación horizontal de los datos dentro de las celdas. Puede tener tres valores: LEFT (izquierda), RIGHT (derecha) y CENTER (centro). VALIGN: Alineación vertical de los datos dentro de las celdas. Puede tener tres valores: TOP (arriba), BOTTOM (abajo) y MIDDLE (centro). ROWSPAN:se utiliza en la definición de una celda (<TD>) o cabecera (<TH>) e indica que su anchura o altura son equivalentes a un determinado número de filas. COLSPAN se utiliza en la definición de una celda (<TD>) o cabecera (<TH>) para indicar que su anchura o altura son equivalentes a un determinado número de columnas. TABINDEX= <número>, sirve para poder utilizar el tabulador en una serie de enlaces. Ejemplo: <a tabindex= 1 href= #uno >enlace número 1</a><p> 4 de 12

5 4.6.- INSTRUCCIONES BÁSICAS PARA FORMULARIOS 1.- <FORM ACTION= mailto:dir_ METHOD= POST ></FORM> 2.- <INPUT TYPE= Text NAME= Un_nombre > 3.- <INPUT TYPE= Password NAME= Un_nombre VALUE= > 4.- <INPUT TYPE= Radio NAME= Tipo VALUE= Un_nombre > 5.- <INPUT TYPE= Checkbox NAME= Tipo VALUE= on > 6.- <TEXTAREA NAME= Un_nombre ROWS= 4 COLS= 30 [READONLY]> </TEXTAREA> 7.- <SELECT NAME= Un_nombre > <OPTION> Nombre_de_Opción1 <OPTION> Nombre_de_Opción2 <OPTION> Nombre_de_Opción3 </SELECT> 8.- <INPUT TYPE= Submit NAME= Enviar VALUE= Enviar > 9.- <INPUT TYPE= reset NAME= Un_nombre VALUE= Un_nombre > 10.- <INPUT TYPE= button NAME= Un_nombre VALUE= Un_nombre ONCLICK= Nombre_JavaScript > 11.- <INPUT TYPE="button" VALUE="Back" ONCLICK="window.location='/página a la que quieres volver'"> donde NAME es el nombre de la variable donde se guarda el valor y VALUE es el valor que se asigna a la variable Excepciones: en reset, submit y button, VALUE es el nombre del botón en radio, todas las casillas de opción que pertenezcan a la misma opción deben lleva mismo NAME y distinto VALUE El correo que se recibe lleva escrito una línea como esta ValorNAME=VALUE separados entre si por una interrogación INTRUCCIONES BÁSICAS DE HOJAS DE ESTILO Página con fichero css aparte: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " <HTML> <HEAD> <TITLE> Mi página web con CSS </TITLE> <LINK TYPE="text/css" rel="stylesheet" href="mifichero.css"> </HEAD> <BODY> <!-- Texto </BODY> </HTML> 5 de 12

6 /*EJEMPLO DE FICHERO CSS*/ body { margin-left: 10%; margin-right: 10%; font: 8pt/16pt Georgia; color: #555753; background: #fff url(blossom.jpg) no-repeat bottom right fixed; P { font-family:verdana; font-size:8pt; font-weight:bold; H1 { font-size:x-small; font-family: Times New Roman; font-weight: normal; text-decoration: blink; color: #660f00; H2 { font-size:small; font-family: Arial; font-weight: italic; color: #660f00; a:visited { font-weight: bold; color:#800000; a:link { text-decoration: underline; color:#000000; a:hover { font-weight: bold; color:#800000; Instrucciones CSS font-family : Indica el tipo de letra. Se recomienda que los tipos de letra sean encerrados entre comillas, a excepción del último. font-weight :extra-light light demi-light medium demi-bold bold extra-bold bolder lighter (Los valores bolder y lighter se dan en relación a la opacidad actual, y lo incrementan o decrementan (respectivamente) en dos unidades) font-style :normal italic small-caps oblique line-height : <número> <porcentaje> Indican la altura de la línea de texto. Los valores porcentuales se refieren al tamaño de letra en curso. text-decoration :none [ underline overline line-throught blink ]+ Indica adornos o cualidades extra de la letra. Los valores son underline (subrayado), overline (línea por encima del texto), line-throught (tachado) y blink (parpadeo) 6 de 12

7 text-transform :none capitalize uppercase lowercase Permite cambiar el texto al cual se refiere, poniendo la primera letra en mayúscula, todo en mayúsculas o todo en minúsculas, respectivamente. vertical-align :baseline sub super top text-top middle bottom text-bottom <porcentaje> Indica la posición vertical del elemento, con respecto a los límites del texto y los límites de la línea de texto. text-align : left right center justify Se aplica sólo a los elementos de tipo bloque. El valor justify indica que se insertarán espacios extra entre las letras para que las líneas de texto ocupen todo el ancho permitido para su bloque. text-indent : <longitud> <porcentaje> Indica la sangría en los elementos de bloque. Su valor por omisión es cero, y los valores porcentuales se refieren a la sangría del elemento padre. color : <color> Indica el color de todos los elementos, a menos que subsecuentes reglas asocien color explícito a algunos elementos. background : transparent <color> [ / <color> ]? <dirección de la mezcla> <url> <tipo de repetición> <posición> <scrolling> Indica propiedades genéricas para el fondo de un elemento. El fondo puede ser : transparente { background : transparent de un sólo color { background: red colores mezclados en degradación: background : yellow / green una imagen { background: url( nubes.gif ) 50% repeat fixed Cuando se usa una imagen para rellenar el fondo, se pueden especificar dos propiedades adicionales. 1.El tipo de repetición determina cómo se repetirá la imágen: repeat-x (repetir horizontalmente), repeat-y (repetir verticalmente), no-repeat (no repetir) y repeat (repetir horizontal y verticalmente), que es el valor por omisión. 2.La posición especifica su localización inicial a lo ancho y a lo alto del elemento, También tenemos left, center y right para indicar posición horizontal de 0%, 50% y 100% respectivamente, y top, middle y bottom para indicar posición vertical de 0%, 50% y 100%. Finalmente, el scrolling indica si el fondo permanecerá fijo al fondo de la ventana (valor fixed), o se moverá junto con el elemento al cual se está aplicando (valor scrolling) EJEMPLOS DE PÁGINAS WEB Ejemplo 1: PÁGINA WEB BÁSICA <HTML> <HEAD> <TITLE> La página de Luismi</TITLE> </HEAD> <BODY BGCOLOR= Red TEXT= White LINK= Blue VLINK= Grey > <FONT FACE= Times New Roman SIZE= 7 > Esta es mi página y esta es mi fotografía <BR> <IMG SRC= Luismi.jpg > </FONT> </BODY> </HTML> 7 de 12

8 En el siguiente ejemplo se muestra una serie de instrucciones que hacen el código un poco difícil de digerir pero que los generadores de páginas web lo ponen de forma automática: La instrucción DOCTYPE es una declaración del tipo de documento que es nuestro fichero XHTML. Le dice al navegador en el que se vaya a visualizar nuestra página que nuestra página web está escrita en XHTML definido por el consorcio w3c (entidad internacional que especifica protocolos y lenguajes de internet). Sin un específico DOCTYPE, la mayoría de los navegadores mostrarían mal las páginas y se verían en quirks mode o «modo rarillo» y fuera de toda compatibilidad. También se define un lenguaje humano específico (por defecto, el inglés) modificando un atributo del tag HTML llamado xml:lang Ejemplo 2: GENERACIÓN AUTOMÁTICA <!DOCTYPE html PUBLIC -//W3C// DTD XHTML 1.0 Strict//EN xhtml1- strict.dtd > <HTML xmlns= xml:lang= es > <HEAD> <TITLE> La página de Luismi</TITLE> </HEAD> <BODY BGCOLOR= Red TEXT= White LINK= Blue VLINK= Grey > <FONT FACE= Times New Roman SIZE= 7 > Después de dos meses en <H1> Francia </H1> estas son las fotos de mi <H1>Viaje a París </H1> incluido el viaje en el <H2> Bateau Mouche</H2> y la escalada a la <H2>Torre Eiffel </H2> <BR> <IMG SRC= Paseo Sena.jpg > <BR> <IMG SRC= VistaParís.jpg WIDTH= 70 HEIGHT= 58 > </FONT> </BODY> </HTML> Ejemplo 3: LISTAS Y REFERENCIAS <HTML> <HEAD> <TITLE> La página de Luismi</TITLE> </HEAD> <BODY BGCOLOR= #0048AA TEXT= # LINK= # VLINK= #0000FF > <FONT FACE= Times New Roman SIZE= 7 > <P ALIGN= left > Esta es mi <H1> página </H1> y esta es mi <H2>fotografía </H2> </P> <P ALIGN= right > <IMG SRC= Luismi.jpg > </P> <BR> <CENTER> Alguna de las páginas web que Luismi te recomienda <!-- lista no numerada <UL> <LI><A HREF= > Los pendragon </A> <LI><A HREF= Porcupine Tree </A> <LI><A HREF= > 7ieben </A> 8 de 12

9 </FONT> </BODY> </HTML> </UL> Ejemplo 4: CREACIÓN DE UNA TABLA <!doctype html public "-//w3c//dtd html 3.2//en"> <html> <head> <title>la página de Gaudí.</title> <meta name="generator" content="microsoft FrontPage 4.0"> <meta name="formatter" content="arachnophilia 4.0"> </head> <body bgcolor="#808080" text="orange" link="#00ff40" vlink="#0000ff"> <font face="matisse ITC" size="5" color="#00ff00" > <center>gaudi </center> </font> <font face="arial" size="2"> <table width="95%" border="1"> <tr> <!-- Primera fila --> <td valign="top"> Vistas de la <a href="fbatllo.jpg" target= _blank > Casa Batlló </a> <td > <img src="fbatllopequenia.jpg" alt="imagen pequeña de la Casa Batlló"> </tr> <tr> <!-- Segunda fila --> <td valign="top"> Vistas de la <a href="fmila.jpg" target= _blank > Casa Milá</a> <td > <img src="fmilapequenia.jpg" alt="imagen pequeña de la Casa Milá"> </tr> <tr> <!-- Tercera fila --> <td valign="top"> Fotos del<a href="pguel.jpg" target= _blank > Park Guell</a> <td> <img src="pguelpequenia.jpg" alt="imagen pequeña del Parque Guell"> </tr> <tr> <!-- Cuarta fila --> <td valign="top"> Algunas vistas de la <a href="fsf.jpg" target= _blank > Sagrada Familia</a> </tr> </table> </body> </html> <td > <img src="fsfpequenia.jpg" alt="imagen pequeña de la Sagrada Familia"> 9 de 12

10 Ejemplo 5: PÁGINA WEB CON INSTRUCCIONES CSS <HTML> <HEAD> <TITLE> La página de Luismi</TITLE> <STYLE TYPE= text/css > H1 { Font-family : Matisse ITC; Font-size: 35; text-decoration: blink; H2 { Font-family: Times New Roman; color: red; </STYLE> </HEAD> <BODY BGCOLOR= Red TEXT= White LINK= Blue ALINK= Grey > <FONT FACE= Times New Roman SIZE= 11 > Esta es mi <H1> página </H1> y esta es mi <H2>fotografía </H2> <BR> <IMG SRC= Luismi.jpg > </FONT> </BODY> </HTML> EJERCICIOS DE PÁGINAS WEB 1.- Qué tag se utiliza para poner el nombre de la página en la barra de títulos? Dónde se pone? 2.- Para que se utiliza el parámetro Background que se coloca en el tag BODY? 3.- Qué diferencia hay entre los tag <BR> y <B>? Y entre <BR> y <P>? 4- Qué tag utilizarías para poner una fotografía que está en el fichero PinguinodeLinux.jpg? Escribe la instrucción. 5.- Si quieres que una página entera tenga un color gris de fondo y que el tipo de letra de toda la página sea de tipo Impact qué instrucción utilizarías? 6- En una página web quiero que todo el texto aparezca escrito en tamaño 21 y con el tipo de letra Bernhard EFFashion de Word. Qué tag emplearías? Indica la instrucción completa, con sus parámetros 7.- Qué significan los parámetros LINK, VLINK y BGCOLOR? 8.- Escribe una página web completa en la que se muestre el fichero SenorAnillos.jpg centrado y debajo un texto a tamaño 12 de tipo Courier que diga: el Señor de los Anillos 9.- Escribe una página web completa en la que se muestre el texto a tamaño 12 y de tipo TimesNewRoman, mientras que el texto escrito entre <H1> y </H1> sea de tipo Arial y a tamaño Define el tipo de letra H2 de forma que el color sea verde y el tamaño Escribe una página web completa de título Asterix en Bretaña en la que se muestre el texto: La aldea de los Irreductibles galos a tamaño 12 y de tipo TimesNewRoman, mientras que las palabras aldea e Irreductibles galos sean de tipo Arial y a tamaño 18. (Nota: utiliza los tags <H1>) Qué instrucción añadirías a la página anterior para que, al hacer clic con el ratón en la palabra Irreductibles galos el navegador se vaya a la página Qué instrucción añadirías para hacer lo mismo que en el ejercicio anterior, pero haciendo clic en la foto? 10 de 12

11 14.- Escribe las instrucciones para que el siguiente texto se vea de forma que las frases en negrita aparezcan con letra Courier a tamaño 32 de color verde y las subrayadas, con letra System de color rojo. Las demás, con letra Times New Roman de tamaño 11. Tras leer emocionado el reportaje de Argentina en LA MIRADA no pude por menos que preparar las maletas 15.- En una página escribimos el listado de todos los alumnos de la ESO. Qué tags usarías para poner en el encabezado ocho enlaces del tipo 1ºA, 1ºB, 2ºA, 2ºB,así hasta 4ºB, de manera que al pulsar uno de ellos la página se desplace hasta el primero de los alumnos de ese curso? (Usa un diagrama de bloques) 16.- En una página ponemos las letras de 8 canciones de los Rammstein y al principio un listado de las canciones Qué tags usarías para poder pinchar en el listado de canciones y, sin cambiar de página, vaya a la letra de dicha canción? 17.- Crea una lista no ordenada de enlaces a las siguientes páginas: Escribe una pagina web que presente la información en forma de periódico, con el nombre DominicasDigital ocupando toda una fila en la parte superior y abajo tres columnas: una que ocupe el 15%, otra el 50% y la última el 35% Escribe las líneas de código HTML para mostrar la siguiente página web cuyo título es La página del rey (de mi casa). Nota: el color de fondo es #ccccff, el de la letra es #6600CC, el de los enlaces es rojo, el de los enlaces visitados es verde, el tipo de letra es MattiseITC y el muñeco está en el fichero elrey.png. Además, la primera fila que ocupe el 15%, la segunda el 35% y la última el 50%, que la primera columna ocupe el 25% y que el título se mueva de izquierda a derecha todo el rato. Notici as Contac ta con nosotros Googl e Escribe una tabla en HTML como la siguiente. Nota: el color de las celdas es #6600cc, el del texto es #007866, el ancho de las celdas laterales es 20% cada una y su altura es de 20% cada una excepto la última, de 60%. Además, el texto de arriba está centrado y en negrita y se desplaza de izquierda a derecha y el de abajo sea un hiperenlace a DIGITALTEXT Pincha aquí 21.- Escribe un formulario para una universidad en el que aparezca un apartado para escribir el nombre del alumno, otro el apellido, y luego un menú desplegable con las carreras que se estudian en la facultad. Además, poner algun elemento para indicar si el alumno es repetidor o no, si es traslado de expediente, si estudia la carrera técnica, la superior o si es un curso de doctorado Escribe el formulario de validación de Fresqui donde solicita el nombre de usuario, la clave y pregunta si quiere recordarme en este equipo es decir, si la próxima vez que me conecte, necesito o no 11 de 12

12 poner la clave. Acaba todo con un botón login de verificación 23.- Escribe un formulario de reclamaciones en el que los datos se envíen a fernandos@upm.com y que solicite el nombre y apellidos del demandante y elija de entre los siguientes uno de los motivos de la reclamación. Los motivos son: Funcionamiento de la red lento La red no funciona Se detiene a medio Otros motivos (indicar cuales) Incluir en el formulario un apartado para la opción Otros motivos 24.- Si en el anterior ejercicio los motivos se muestran mediante un SELECT, reescribe esa parte mediante RADIOs y, si es al revés, reescríbelo con un SELECT Escribe una página web en la que se vea el logo de la empresa logo.bmp y a la derecha haya dos apartados, uno que diga Acceder que incluya dos cajas de texto, una para el y otra para la contraseña. En el otro apartado, que muestre el texto Crear una cuenta ahora y que muestre la página newuser.html. Cuando escriba la contraseña que la mande a la dirección luismitecno@mixmail.com Escribe la página newuser.html para el ejercicio anterior donde se especifiquen datos como nombre, apellidos, contraseña, dirección de correo electrónico, estado civil (soltero, casado, viudo, divorciado), sexo y un botón para enviar todo ello a la dirección nuevacuenta@mixmail.com 12 de 12