Diseño de Sitios Web (T.U.W., T.U.R.)

Tamaño: px

Comenzar la demostración a partir de la página:

Download "Diseño de Sitios Web (T.U.W., T.U.R.)"

Esther Hernández Castillo
hace 5 años
Vistas:

1 Diseño de Sitios Web (T.U.W., T.U.R.) Practico N 2: HTML Ejercicio N 1: Completar el siguiente código para poder visualizarlo en el navegador, respetando el formato de HTML5. <HTML> <TITLE> AGREGAR NOMBRE </HEAD> <BODY> El Hipertexto es una forma de organizar la informaci6n. Ciertos puntos del texto están unidos con otros mediante relaciones (llamados enlaces o links). En lugar de leer un texto en forma continua, como se hace normalmente (por ejemplo en un libro). El hipertexto da la posibilidad de cambiar el recorrido de la lectura al saltar de un punto a otro del texto, de un tema a otro. </HTML> De manera que el texto se vea con el siguiente formato El Hipertexto es una forma de organizar la información. Ciertos puntos del texto están unidos con otros mediante relaciones (llamados enlaces links). En lugar de leer un texto en forma continua, como se hace normalmente (por ejemplo en un libro). El hipertexto da la posibilidad de cambiar el recorrido de la lectura al saltar de un punto a otro del texto, de un tema a otro. Ejercicio N 2: Realizar una página web que contenga las siguientes líneas y cuyo título sea "Cabeceras". Donde cada línea debe ser del tipo de cabecera y con la alineaci6n indicada en ella. Cabecera Hl. La más grande. - centrada Cabecera H2. - Derecha Cabecera H3. - Izquierda Cabecera H4. - Izquierda Cabecera H5. - Derecha Cabecera H6. La más pequeña. - centrada

de Directorios De manera tal que: a. En el directorio raíz se encuentre la página principal con referencias al resto. b.

2 Ejercicio N 3: Generar un sitio web que constee de una página principal y tres secundarias. En la página principal debe aparecerr un vinculo a cada una de las secundarias y en estas uno hacia la pagina principal páginas paginas Ejercicio N 4: Definir un sitio web con la siguiente Jerarquía de Directorios De manera tal que: a. En el directorio raíz se encuentre la página principal con referencias al resto. b. Dentro del directorio Subpágina exista una página que tenga comoo fondo una imagen del directorio Imágenes y una referenciaa a la página principal. c. En el directorio Pagina2 exista una página con referencias a SubPagina2 y a la página principal y a una página en el directorio Pagina3. Ejercicio N 5: Uso del BLOCKQUOTE y MARCADORES. Crear una página web en la que se muestree el texto de abajo manteniendo el formato indicado. Además generarr TRES imágenes en PAINT u otro editor, las cuales deben contener cada una los siguientes textos: HTML LINKS URL y deben insertarse al comienzo de cada uno de los siguientes párrafos. Dichas imágenes deben contener un enlace (marcador) de manera que la figura llevee al texto correspondiente.. Fundamentos del Lenguaje HTML <IMAGEN LINKS> Para que el navegador nos muestre en pantalla una página, el texto, los gráficos etc. deben encontrarse en un formatoo estandarizado. Para que esto pudiera ser así y para que todos puedan ver los documentos de una forma parecida aunque tengan diferentes plataformas y SO, fue necesario crear un lenguajee común a todos. Este lenguaje es el HTML, que consiste en un grupo de comandos conocidos como "Tags" o "etiquetas" y que es estándar para todos los usuarios. Los Links (enlaces) <IMAGEN URL> Al navegar por la web, veremos que en general todas las páginas tienen alguna parte indicada en letra azul y subrayada. Esto nos indicaa que en esee lugar hay un vínculo a otra página.

Es una particularidad de la web, su capacidad mediante estos vínculos de "saltar" de una parte a otra ya sea de la misma página, de otra diferente del mismo sitio o bien directamente a otro sitio.

3 Es una particularidad de la web, su capacidad mediante estos vínculos de "saltar" de una parte a otra ya sea de la misma página, de otra diferente del mismo sitio o bien directamente a otro sitio. Todos los links tienen dos partes: Una es la referencia al lugar a donde nos llevan La otra es el direccionamiento a esa referencia que se activa mediante el clic del rat6n. URL <IMAGEN HTML> URL significa Uniform Resource Locator. Se trata de una descripci6n completa de un objeto mediante el protocolo necesario para tomarlo. Incluye la direcci6n donde se encuentra el servidor, el lugar dentro del servidor donde se encuentra el objeto, y el nombre del objeto en sí. Ejercicio N 6: Crear una página web que contenga la siguiente figura (Ancho = Alto = 172). Definir un mapa con áreas para las zonas grises de la figura. Asociar a las áreas un vínculo A los siguientes sitios: Ejercicio N 7: Crear una página que muestre una tabla como la siguiente (*) Docentes Profesor - Auxiliar (*) Materia (*) Aulas (*) Teoria (*) Practico (**) Nbre. del Profesor (***)Nbre. Del Auxiliar (**) Nbre. del Profesor (***)Nbre. Del Auxiliar (+)Nbre. de la Materia 1 (+)Nro. de Aula (+)Nro./s de Aula/s (++)Nbre. de la Materia 2 (++)Nro. de Aula (++)Nro./s de Aula/s

4 Con los Siguientes formatos Borde de la Tabla = 3 Borde de la Tabla = 0 Ejercicio 8. Realizar un iframes el cual debe contener la ubicación de la UNSL, obtener la misma de googlemaps. Ejercicio N 9: Crear una página web que muestre las siguientes listas: Tipos de Publicaciones: Diarios Revistas o Entretenimiento o Publicaci6n Científica Libros o Novelas o Poesía o Biográficos Papers Tipos de Publicaciones: 1. Diarios a. Revistas b. Entretenimiento c. Publicaci6n Científica 2. Libros i. Novelas ii. Poesía 3. Biográficos 4. Papers Glosario HTML Hypertext Markup Language; formato de los documentos web. HTTP Hypertext Transfer Protocol; protocolo que define c6mo las páginas web son requeridas y transferidas entre los servidores y los navegadores. Ejercicio 10. Realizar una página web la cual contiene un formulario de inscripción a la UNSL el cual solicita los siguientes datos. Nombre (Campo de texto 50 caracteres) Apellido (Campo de texto 30 caracteres) Edad (Campo Numérico) Tipo de documento (Lista desplegable -DNI-LC-PASAPORTE) Numero de Documento (Campo Numérico) Fecha de Nacimiento (Campo Date) Dos botones (Enviar Datos y Limpiar Formulario)

5 Ejercicio 11. Realizar una página la cual contiene un formulario que solicita datos generales de una persona como por ejemplo. Nombre apellido Correo Electrónico Edad Hobbies (Música, Arte, Deportes) Color Preferido (Paleta de colores) Dicha pagina debe contener una imagen en la parte superior del formulario, en el <aside> debe reproducir un video y en el área de navegación un campo de búsqueda. Ejercicio 12. Una empresa de contrataciones encargado de dar trabajo a personal ocasional necesita que los interesados en conseguir trabajo ingresen su curriculum para poder armar la base de datos y poder mantenerla actualizada. Los datos que los interesados deben ingresar son: Nombre y apellido; disponibilidad horaria; sueldo pretendido; lugar/s donde prefiere ser ubicado; estado civil; cantidad de hijos: menores de 12 años, entre 12 y 21 años y mayores de 21 años; pasaporte y documento de identidad. Nota: En cada ejercicio identificar y determinar qué tipo de control se deben usar.

Documentos relacionados

VÍNCULOS VÍNCULOS DENTRO DE LA PÁGINA

VÍNCULOS VÍNCULOS DENTRO DE LA PÁGINA VÍNCULOS Como ya se mencionó, una de las etiquetas más importantes de HTML es la que permite, a través de vínculos o enlaces, navegar por las diferentes páginas y sitios en la red. Se pueden colocar enlaces