miércoles, 22 de mayo de 2013

HTML. Ejercicios del 1 al 5.



                                       HTML/PRÁCTICA                                            
EJERCICIO 1:
a-Diseñar la siguiente página:
<html>
<head>
<title>primer ejercicio</title>
</head>
<body>
este es el primer ejercicio de html
</body>
</html>
b- Guardar la página como Ejercicio 1.html en una carpeta con tu nombre.
c- Abrir Ejercicio 1.html desde Internet Explorer.

EJERCICIO 2
a- Abrir el ejercicio 1 y agregar las siguientes modificaciones:
<html>
<head>
<title>primer ejercicio</title>
</head>
<body>
este es el primer ejercicio de html<br>
<b>este texto esta en negrita</b><br>
<i>en cambio este texto esta en cursiva</i><br>
<u>además se puede subrayar</u><br>
<s>ytambién tachar</s><br>
<b><u>y...puedo usar </u> <i>varios a </i>la vez!!</b>
</body>
</html>
b-  Guardar los cambios realizados como ejercicio2.html y observa el resultado obtenido.

EJERCICIO 3
a- Diseñar la siguiente página para comparar formatos de texto:
<html>
<head>
<title>formato de texto 2</title>
</head>
<body>
<font size=1>el agente me preguntó: ¿tiene ud. algo que declarar? </font><br>
<font size=-1>no tengo muy claro qué es eso de la movida mañanera. </font><br>
<font size=+2>los secuestradores se refugiaron en un camping. </font><br>
<basefont size=2>el poema que más me gusta es la canción de pirata.
</basefont><br>
<basefont size=3>el cuento comienza así. érase una vez una niña muy fuerte...
</basefont><br>
<basefont size=5>le pusieron un multa por no respetar la señal de stop.
</basefont><br>
</body>
</html>
b- Guardar los cambios realizados en tu carpeta como Ejercicio3.html. Ver en el Explorer.

EJERCICIO 4
a- Diseñar la siguiente página para comparar los diferentes tipos de encabezados:
<html>
<head>
<title> encabezados de texto</title>
</head>
<body>
<h1>h1 enorme</h1>
<h2>h2 grande</h2>
<h3>h3 normal</h3>
<h4>h4 chico</h4>
<h5>h5 pequeño</h5>
<h6>h6 muy pequeño</h6>
</body>
</html>
b- Guardar los cambios realizados en tu carpeta como Ejercicio 4.html. Ver resultados en el Explorer.

EJERCICIO 5
a- Abrir el ejercicio anterior y agregar las siguientes modificaciones dentro de Body
<p align="left">este párrafo está alienado a la izquierda</p>
<p align="center">este párrafo está centrado</p>
<p align="right">este párrafo está alienado a la derecha</p>
B. Guardar los cambios realizados como Ejercicio5.html y observa el resultado obtenido desde Internet Explorer.

lunes, 20 de mayo de 2013

HTML. Ejercicios del 6 al 10



                                                                   HTML/PRÁCTICA        
                                    
EJERCICIO 6:
a-Diseñar la siguiente página:
Título de Página: Publicidad
Título de Cuerpo: Quieren poner fuertes restricciones a la publicidad en las calles de la Ciudad

Subtítulo: Un relevamiento oficial reconoce que el 70% de la publicidad está en infracción.

Texto: El Ejecutivo porteño presentará esta semana un proyecto en la Legislatura para restringir los tipos de carteles publicitarios que se pueden instalar en las calles, iniciativa que seguramente despertará polémica. La idea es combatir la contaminación visual, porque, según admite el Gobierno, hoy el 70% de los carteles, unos 30.000, están en infracción.

Un primer cambio será prohibir los carteles con sponsor. Por ejemplo, un quiosco o bar podrá poner en la fachada del local su nombre, pero en el cartel no podrá haber marcas de gaseosas o golosinas. Además, se limitará mucho la colocación de marquesinas.

Luego, el proyecto plantea dividir la Ciudad en cuatro zonas. La primera será la que va desde el Riachuelo hasta la General Paz, entre el Río de la Plata y las calles Salta, Rincón, Junín, Santa Fe, Cabildo y otras (ver mapa). Es la misma zona que el Gobierno porteño propuso que sea nombrada "Paisaje Cultural Urbano" por la UNESCO.

Allí habrá fuertes restricciones a la publicidad. Los principales cambios serán que prohibirán los grandes carteles en las terrazas de los edificios. Y sólo se permitirán carteles rectos colocados en la fachada y que sólo se podrán ver parándose de frente a los locales. Es decir que no podrá haber más carteles salientes, visibles desde los laterales. Tampoco podrán tener luces.

La segunda zona será la de los alrededores del Obelisco y varias cuadras de Corrientes y Lavalle. Allí se permitirán más tipos de carteles y se incentivará a que se instalen equipos de alta tecnología, como pantallas electrónicas. Según explicaron en el Gobierno, la idea es convertir esa zona en una especie de Times Square porteño, en referencia a la zona comercial y de espectáculos de Nueva York.

El resto de la Ciudad serán las zonas 3 y 4. Allí tampoco se permitirán los carteles salientes, aunque los frontales sí podrán tener luces de fondo, por ejemplo.

Otro planteo novedoso es que se autorizará en toda la Ciudad la colocación de publicidad en las mediasombras de los edificios en construcción o en los que se esté arreglando la fachada. El objetivo es que la publicidad les dé fondos a los consorcios y los constructores para concretar esas obras. Esta idea había sido alguna vez pensada por el Gobierno de Aníbal Ibarra, aunque nunca la concretó.

Por otra parte, se permitirá a los edificios corporativos poner un "rótulo" con el nombre de la empresa que lo ocupe (como en algunos complejos de oficinas de Catalinas, por ejemplo). Y los que sean de una sola firma, como los supermercados, podrán colocar en sus fachadas alguna publicidad.

La necesidad de reordenar la publicidad callejera tiene que ver con el desborde que se ve actualmente. El ministro de Espacio Público, Juan Pablo Piccardo, aseguró: "Hay un total descontrol del Estado. El 70% de los elementos publicitarios que vemos en la calle está en infracción. Además, el Código de Habilitaciones vigente data del año 80 y es muy confuso y permisivo, lo que facilitó que todas las compañías publicitarias avanzaran sobre el espacio público. El nuevo código que queremos lanzar hace foco en el cuidado de la estética urbana y del patrimonio cultural y arquitectónico".


Datos:
Título del Cuerpo
Subtítulo
Texto
Destacado: Nombres
Características:
Negrita
subrayado
Tamaño 2
Centrado
Negrita
Cursiva
Tamaño 4
Alineación Izquierda
Fuente General
Ancho de hasta 11 palabras
Tamaño 4
Negrita y subrayado


b- Guardar la página como Ejercicio 6.html en una carpeta con tu nombre.
c- Abrir Ejercicio 1.html desde Internet Explorer.

EJERCICIO 7
a- Diseñar la siguiente página para comparar los distintos formatos de texto:
<html>
<head>
<title> formatos de texto 3 colores</title>
</head>
<body>
<p align="center"> <font face="arial">colores</p></font><br><br>
<font color=blue>la película de hoy se llama: almas de metal. </font><br>
<font color="#0000ff">mi hobby es la construcción de maquetas de trenes.
</font><br>
<font color=red size=5>el estado soy yo se atribuye a Luis XIV </font><br>
<font color=orange size=+2 face=book antigua>la palabra pícaro tiene muchos significados.</font><br>
<font color=red face="comic sans ms"> dice el refrán: cuando hay hambre, no hay pan duro. </font><br>
<font color=green basefont=+3>dejé la moto en el parking de la plaza. </font>
</basefont><br>
</body>
</html>
b-  Guardar los cambios realizados como ejercicio7.html y observa el resultado obtenido.

EJERCICIO 8
a- Abrir el ejercicio 5 y modificar la etiqueta BODY de la siguiente manera:
<body bgcolor=”#ff0000”  text=”ffffff” link=#00aeff”  vlink=”#00ff00”>
b- Guardar los cambios realizados en tu carpeta como Ejercicio8.html. Ver en el Explorer.

EJERCICIO 8-a
a-  Abrir el ejercicio 6 y colocarle las siguientes características de color:
Título: Negro  / Subtítulo: Bordo / Texto: Negro  / Destacado: Rojo
b- Guardar con el nombre de ejercicio8b.html

EJERCICIO 9
a- Diseñar la siguiente página para comparar los diferentes tipos de listas:
<html>
<head>
<title> lista</title>
</head>
<body bgcolor=green font face=comic sans ms text="#00ff00">
<p align="center"> listas ordenadas, no ordenadas y de definición</p><br><br>
<ol>
<li>las listas ordenadas presentan la información antecediendo a cada párrafo un número, siempre que a su inicio se especifique
<b>li</b>.
En caso de que no se especifique la orden <b>li</b>, como ocurre aquí, la presentación de
la información guardará el sangrado, pero el párrafo no se numerará.
<li>las listas pueden estar anidadas, de forma que a partir de un nivel de una lista puede generarse otra lista, es suficiente con establecer un nuevo bloque de información entre las órdenes
<b>ol</b> y <b>/ol</*bl>
<ol>
<li>los anidamientos de listas permiten una estructuración muy deseable para clarificar la información.
<li>despuès de cerrar la lista, con la orden que sigue a este párrafo, volveremos a la lista principal.
</ol>
<li>asegurate de <i>cerrar todas las listas</i> (deben figurar tantos <b>ol</b> como
<b>/ol </b>).
</ol>
<ul>
<li>las listas no ordenadas se insertan entre los comandos <b>ul</b> y
<b>/ul </bl>.<br>esta línea no tiene marca; no está antecedida con la orden <b>li</bl>.
<li>en este nivel iniciamos otras lista:
<ul>
<li> este es su primer nivel.
<li> este su segundo nivel.
</ul>
<li>final de la lista.
</ul>
</body>
</html>
b- Guardar los cambios realizados en tu carpeta como Ejercicio 9.html. Ver resultados en el Explorer.

EJERCICIO 10
a- Diseñar una página teniendo en cuenta los siguientes criterios:
Título de página: informática
Texto: Virus y seguridad informática
Dentro del espectro de temas que cubren la seguridad informática, los virus informáticos
ocupan solo una pequeña parte, pero son el factor de más extraña evolución. Desde los
años de procesos informativos se sofisticaron debido a los avances tecnológicos existieron
intrusos que intentaban acceder a datos confidenciales o personas que trataban de dañar
sus sistemas, tanto a nivel software como en hardware, pero los virus informáticos producen
un daño de tipo indiscriminado ya que no puede preverse hasta qué computadora va a
llegar. Hoy se conocen virus cuyo proceso de multiplicación y dispersación llevan a varios
años, incluso existen exponentes que ya dieron la vuelta al mundo. En realidad es una
muestra de esquema vandálico, pues ni siquiera hay una ideología explicita que los
sostenga como para asimilarlo a un esquema de vandalismo. Por lo tanto, los virus, como
amenaza para informática, no responde a los modelos de causalidad de fallas de software,
las impericias y los sabotajes.
Autor: Ricardo Ferrigno.

Los formatos serán:
Datos:
Título
Texto
Autor
Página
Características:
Centrado
Color violeta
Subrayado
Tamaño 1
Times New Roman
Alineación izquierda
Color Azul
Tamaño 2
Cursiva
Verdana
Ancho de hasta 14 palabras

Alineado a la Derecha
Color negro
Subrayado
Tamaño 1
Arial
Fondo amarillo


B. Buscar una imagen y  sobre el tema tratado en Internet y colócala debajo del Autor, en el centro de la página. Guardar los cambios realizados como Ejercicio10.html y observa el resultado obtenido desde Internet Explorer.




sábado, 18 de mayo de 2013

HTML. Ejercicios del 11 al 14



HTML/PRÁCTICA                                            

EJERCICIO 11:
a-Buscar una imagen en internet de un personaje famoso y guardarlo en la carpeta:
<html>
<head>
<title> imágenes</title>
</head>
<body bgcolor=green font  text="blue">
el personaje del año es … <br><br>
<img src="personaje.jpg" alt="colocar el nombre del personaje"> </img><br>
<img src="personaje.jpg" border=4 alt="colocar peso en kb del archivo"> </img> <br>
<p align=center><img src="personaje.jpg" width=300 border=4 alt=" 12 kb"></p>
 <br>
<img src="personaje.jpg" align=center height=54 width= 67 border=4
alt=" 12 kb"> </img> <br>
</body>
</html>
b- Guardar la página como Ejercicio 11.html.

EJERCICIO 12
a- Diseñar la siguiente página para comparar los distintos tipos de hipervínculos:
<html>
<head>
<title> hipervínculos  </title>
</head>
<body bgcolor="black" text="yellow" link="cyan" vlink="fuchsia" alink="white">
a continuación se dan ejemplos de hipervinculos <br> <br> <br> <br> <br>
<a href="#mail"> este hipervínculo me desplazará hasta el final de la página
html </a><br> <br> <br> <br> <br>

<a href="ejercicio1.html"> este hipervínculo abrirá el primer ejercicio de html
</a><br> <br> <br> <br> <br>

<a href="http://www.clarin.com.ar"> este hipervínculo abrirá la página del diario>
</a><br> <br> <br> <br> <br>

<a href="http://www.yahoo.com.ar"> este hipervínculo abrirá la página del buscador>
</a><br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>

<a name="mail"><a href="mailto:nombreusuario@yahoo.com.ar"> mi cuenta de e-maill 
</a><br> <br> <br> <br> <br>
</body>
</html>
b-  Guardar los cambios realizados como ejercicio12.html y observa el resultado obtenido.

EJERCICIO 13
a- Diseñar la siguiente página para observar Tablas:
<html>
<head>
<title>ejercicio de tablas</title>
</head>
<body>
<table border=4 cellpadding=12 cellspacing=6 widht=320 heigt=160>
<tr>
<td>titulo 1</td>
<td>titulo 2</td>
<td>titulo 3</td>
</tr>

<tr>
<td>contenido 1-a</td>
<td>contenido 1-b</td>
<td>contenido 1-c</td>
</tr>

<tr>
<td>contenido 2-a</td>
<td>contenido 2-b</td>
<td>contenido 2-c</td>
</tr>

<tr>
<td>contenido 3-a</td>
<td>contenido 3-b</td>
<td>contenido 3-c</td>
</tr>
</table>
</body>
<html>
b- Guardar los cambios realizados en tu carpeta como Ejercicio12.html. Ver en el Explorer.

EJERCICIO 14
a-  Diseñar la siguiente página para observar los ejercicios  10 y 11 en marcos.
<frameset cols="20%, 80%">
<frame name="izquierda" src="ejercicio11.html">
<frame name="derecha" src="ejercicio10.html">
</frameset
Título: Negro  / Subtítulo: Bordo / Texto: Negro  / Destacado: Rojo
b- Guardar con el nombre de ejercicio14.html

EJERCICIO  15
a- Diseñar una página que integre todos los contenidos vistos en clase, incluyendo link a correo electrónico y a varios sitios.
b- El tema podrá ser sobre las vanguardias estéticas, tribus urbanas, la historia de la publicidad en Argentina, medios de comunicación y su relación con la publicidad, u otro tema a elección del alumno previa autorización del profesor.