Practica#5 Reino animal

Objetivo:Desarrollar la practica #5 en la cual se desarrollara por medio de tablas y visualizacion de imagenes y las descarga de los documentos en donde se obtubo la informacion sobre cada uno de los animales al igual que los sonidos de cada uno de los animales .



Desarrollo:


Este es el codigo inicial en donde desarrollamos la tablas en donde bamos a ingresar los datos de cada animal , imagenes , sonido , visualizacion etc.


Se sigue visualizando el contenido que se nos pidio con las caracterisitcas que se pidieron ,ademas de te establecemos los colores ,para que no lastime la vista. esto se desarrola para la omodidad del usuario que esta biendo al imagen.

Esta es la visualizacion de la parte inicial de los animales que se nos pidio mostrar se puede ver claramente como es que cada una de las caracteristicas que se nos pido se ven .






La tabla que desarrollamos atraves de filas para poder poner toda la informacion de cada uno de los animales se muestra como la ingresasmos y ademas metemos las iagenes atraves de un codigo en especifico.




Esta imagen es la continuacion de la inicial mostramos como se desarrollla el programa atraves de la filas este proceso es tardado pero tien sus bentajas de establcer todas las caractristicas de cada animal





Continuacion de el desarrollo de la pagina en interne se muestra los habances que emos llebado atraves de los dias .





Este es el fin del codigo se muestra la imagen y las caracteristicas que establecemos son por que hay ciertas cosas que podemos hacer como son las tablas , las lineas , el body y el html.

todas estas etiquetas debemos cerralar para poder dar por terninado el programas.





Concluciones :En este programa se establecen las caracteristicas correspondientes ademas de que se realiza atraves de las tablas para desarrollar mas nuestras abilidades en el codigo html , estas carateristicas que se nos pidieron nos encerran que todo debe tener un orden y una sintaxis en la cual un error puede significar que nuestro pragrama bo funcione.
Por lo cual como programadores en html debemos poner atencion en las etiquetas y sintaxis para evitar errores que puedan evitar nuestro retraso en la entrega de la practica en este caso.

Practica#4 Horario Escolar

Objetivo:Se realizar la siguiente practica en la cual aplicaremos lo visto en la teoria sobre las tablas realizando las caractiristicas que se nos piden ,poniendo haci nuestra avilidad sobre las caracteristicas de las tablas.




Desarrollo:
Se realiza las practica #4 en la cual tenemos que hacer el horario escolar de nuestras materias en las cuales cada una de nuestras materia tendra siertos atrivutos los cuales nos llevara por medio de un henlace a otra pagina las cual nos mostrara los datos perdonales del profesor y en otra el temario de la materi.


Se muestra el codigo en el cual establecemos las etiqeutas correspondientes para llevar acabo la pagina ,en la primera lia establecemos muchos enlaces los cuales nos llevaran respectiamente su enlace alas dos paginas anterior mente mencionadas.

Para poder hacer los enlaces se esta blce la etiqueta y la direcciion y nobre de donde se encuentra la pagina ala cual queremos enlazanos , ademas de que podemos poner una imagen en el enlace o texto .

Programaremos por filas con la etiqueta correspon diente si dejar atras el alta de la etiqueta table que es la que permite que nosotros podamos programar en la tabla .

Este es el resultado ala hora de correr la pagina se muestra como los enlaces estan de solor azul por defaul pero estos de pueden modificar con el codigo correspoente al igual que el color de fondo y el color del borde de la tabla.

Se mustra clara mente el contenido que emos ingresado que es el horario de clases del grupo:614 y el se unica ademas tambien con una tabla de calificaciones .




despues vamos a insetar la imagen del profesor en este seria el de biologia

Se puede la imagen del profesor claramente.

Este es el codigo de enlace ala pagina en el cual estan los datos personales del profesor dependiendo de la materia correspondiente ,en este caso nuestro enlace es sobre la materia de biologia.
caracteristicas:
*foto
*datos de estudio
*datos de edad
*datos de titulos
*boton para regresar

Se muestra cual es el resultado de la pagina de los dato personales de la materia y del profesor en curso,la foto se puede modificar el tamaño dependiendo de como lo quiera uno se puede hacer mas larga o mas ancha la imagen,las carcteristicas que se nos pidieron se muestran claramanete.


Otra de las pantallas que realizamos es la de nuestras calificaciones
se muestras como vamos ordenando cada uno de nuestros datos en este caso nuestras calificacione que emos obtenido en nuestras materias del ultimo semestre.


este es el codigo de nuestra tabla de calificaciones


Este es el resultado




Integrantes del equipo:Monica Espinosa Morales y Oscar Hernandez Morales

Concluciones: En esta practica pusimos a las enceñansas de las tablas y como se utiliza y sus caracteristicas ademas de como se ppude ocupar y se codifican codigo html, esta practica mustra el horario de las materias y ademas hacemos nuestros enlaces hacia los datos personales del profesor y el otro el tema rio de cada uno de las materias .

Este tema es muy inportante como los demas nos enseña a desarrollar una pagina atraves del codigo html ademas de que todas las etiquetas que emos visto se puden poner en practica para desarrollar otras practicas que nos dejara el profesor.

Tablas

OBJETIVO: Conocer la forma en la cual se diseña las tablas y se modifican el formato de las mismas atra ves de HTML (diseño de pág. web

DESARROLLO:
Nota: Investigar como se inserta una imagen en HTML y como se inserta sonido.
Etiquetas Tablas
< table y < /table
para filas
Columnas

Encabezados
**FORMATO DE TABLAS**
Atributo Significado Posibles valores
Width Ancho de la tabla un numero acompañado cuando se desea
Height Altura de la tabla un numero acompañado cuando se desea
Callpadding Espacios entre el contenido un numero
Callspacing Espacios entre celdas Un numero
Border Grosor del borde un numero
Align Alineación de la tabla dentro left, right, center
Bgcolor color de fondo hexadecimal
Background Imagen de fondo Número hexadecimal
Bordercolor color del borde Numero hexadecimal






***FORRMATO DE CELDAS***

Align Alineación horizontal left, rigth, center
Valign Alineacion Vertical baseline->linea de base

Bottom->inferior
Middle->medio
Top->superior

Bgcolor numero hexadecimal
Backgraund numero hexadecimal
Burdercolor numero hexadecimal
Width ancho
Heigth alto
NOTA: Estos atributos se pueden modificar en etiqueta


OBJETIVO:Conocer como se inserta imagenes en HTML.

DESARROLLO:
Tipo de formas para Imagenes;como sin JPG, GIF
Con la etiqueta < img src = "leon.JPG" >
PARA EL TAMAÑO DE LA IMAGEN
Width-ancho Height-alto Align-alinear border top botton


Trabajo en clase: Se desarrollara una tabla dentro de otra tabla y se mostrara el cfigo y el resultado de esta.






Este es el codigo en el cual se pone una tabla dentro de otra tabla
en la cual se muestra el ejemplo de como se progrma .


Este es el resultado de la tabal se muestra como esta la tabal dentro de una tabal con borde numero3 el ancho de los bordes del numero 10


CONCLUCIONES:
Las tablas cuentan con una gran funcion , por ellas podemos darle orden a ciertos documento a demas de que tambien tinen sus caracteristicas como toda etiqueta , ademas que tambien en clase vimos un repaso de como insertar una imagen y sus atributos corespondientes .

Caracteres especiales

Objetivo: Conocer los diferentes caracteres esp. que se utilizan en HTML, para el diseño de pagina WEB.


DESARROLLO:
Una pagina web se ha deber en distintos países que utilizan conjuntos de caracteres diferentes. El lenguaje de HTML nos ofrece un mecanismo por el que podemos estar seguros que una serie de ordenadores independientemente de sus juegos de caracteres.
Este conjunto son los caracteres especiales.




Alt+65=ñ
á->”&a acute”
é->”&e acute”
í->”&i acute”
Á->”&A acute”
ÁRBOL<-“Á”RBOL
Tipo de diéresis
Pingüino
Ü->ü
Ä->ä
Ï->ä
&-->&aup
< ->&it
B->ß
¿->¿.


Enlaces (hipervinculos)
Objetivo: Conocer los diferentes hipervinculos y sus características en HTML, para el diseño se paginas WEB.


DESARROLLO:
Para colocar un enlace utilizamos y dentro de la etiqueta de apertura debemos de especificar el destino del enlace.
Este destino será introducido en forma de atributo con el nombre href la sintaxis de un enlace tuene la forma



Tipo de enlaces
Los enlaces son agrupados del sig. Modo.
1.- Enlaces internos: Los que se dirigen a otras partes dentro de la pág.
2.-Enlaces locales: Los que se dirigen a otra pág. Del mismo sitio web.
3.-Enlaces remotos: Los dirigidos a otra pág. Web.
4.-Enlaces con direcciones de correo: Para crear un mensaje de correo dirigido a una dirección.
5.-Enlaces con archivos: Para que los usuarios puedan hacer download de archivos (ficheros).



CONCLUSION: Bueno como pudimos observa en los temas anteriores es muy elemental el echo de las etiquetas ya que nos permitirán obtener otra función como en el caso de las letras nos permite poner acentuaciones, signos etc. Lo cual es muy importante para la ortografía utilizar y checar cada uno de estos detalles pues al publicarla que nos daría. Otras de la cuales son muy importantes son los enlaces ya que estos nos permite pasar de una pagina otra dándonos una mejor presentación y un diseño mas agradable.

PRACTICA 3:DICCIONARIO

Objetivo:La practica #3 se realizara con requisitos correspondientes y este se realizara en codigo HTML poniendo en practica los temas vistos en clase .






DESARROLLO:




Este es la pantalla de inicio que se programo en codigo HTML en la cual utilizamos las litas ordenas y los enlaces .
Las caracteristicas que nos pidio son las sig;se creara un grosario de informacion en la cual se mostrar la informacion de los siguientes temas :
1.-Informatica
2.-Matematicas
3.-Historia



Este es el codigo inicial por el cual se empeso a programar los enlaces y los tipos de villetas que utilizamos




El codigo que se muestra en pantalla muestra como seda el enlace y sus caracteristicas y ademas establecemos el color de un enlace cuando es activado :esta es una de las caracteristicas que se pidio que es que el enlace se muestre de color amarillo cuando se activado.



Se muestra craramente como esta activado el enlace por que cambia de color amarillo.Ademas que se puede enlazar las paginas con imagenes en las cuales es el mismo caso con el codigo.



GLOSARIO DE INFORMATICA


Se muestra el codigo desarrollado para enlazar palabras que uno desea y que esten en otra parte del documento.


Sedesarrolla el contenido en el cual esta establecido nuestra informacion dentro del pprograma en html , este se muestra las caracteristicas de
(dt) y (dd) en las cuales e marcan uno como un titulo y el otro como
el contenido de ese titulo.








Esta es la pantalla cuando se a corrido el codigo en html y se muestra como se desarrolla la imagen




Se puede observar claramente el contenido del programa y este esta establecido atraves del codigo html claor sindejar en mente que si uno quiere puede regresar al menu principal para seleccionar otra opbcion.



GLOSARIO DE MATEMATICAS

Se muestra como en el glosario contine las mismas caracteristicas que el glosario de informatica por que se establecio mas mismas caracteristicas en las cuales nos enlasamos .



Se muestra el contenido del glosario.


Semuestra el contenido del programa cuando se a corrido en un navegador



Establecemos que este es el resultado de la informacion de el grosario de matematicas

GLOSARIO DE HISTORIA



Cambios que se isieron despues.


Desarrollamos las caracteristicas del glosario de historia basada en los datos que el profesor nos pidio , se muestra el inicio del codigo






La continuacion del codigo se muestra como se ampria cada ves mas la informacion que ingresasmos por lo cual deemos tener mucho cuidado de la informacion que estamos ingresando

Este el perimer resultado que es la de la cartula donde se muestra los vinculos de color amarillo y este cuando le damos clic nos lleba ala informacion en donde esta este nombre .


Mas adelante se muestra como se observa la siguiente pantalla sigue la informacion que emos ingresado , las caracteristicas de todas las paginas se pueden cambiar de acuerdo al gusto del programador o del cliente que pida una pagina


CONCLUCIONES:

Este programa fue realizado por los integrantes Monica Espinosa Morales , Oscar hernandez Morales;Se puede observar como estamos desarrollando los requisitos que se nos pidieron como son los enlaces ,los titulos y su contenido en un grosario en el cual no solo es de onformatica si no que tambien es de matematicas e historia ;En donde ponemos en practica aprendido los que emos visto en clase ;El desarrollo de esta practica ara que nuestra avilidad cresca para poder programar en html.