informe general2

Diapositivas de presentación

● Daniel Arturo Sánchez Ortiz Cod.1227835

● Cristian Danilo Rodríguez G Cod.1230845

Estructura general● Para todas las paginas utilizamos la siguiente estructura:

● <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

● En head enlazamos las paginas con los documentos css

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>TELSDANN</title><link href="estilos1.css" rel="stylesheet" type="text/css" media="all" /><link rel="icon" type="image/jpg" href="image/logo1.jpg"/>

</head>

● En body pusimos la cajas “div”

● <body>

● <div id="global"> <div id="encabezado"></div> <div id="menu"></div> <div id="contenido"></div> </div> </body>

● </html>

http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd

http://www.w3.org/1999/xhtml

● Para todas las paginas utilizamos las cajas <div> </div> en el encabezado <div id=”encabezado”> puse el banner de la empresa con el logotipo; en el menú puse todos los enlaces a las paginas de la empresa como quienes somos, productos, fotos etc; en el contenido puse el tipo de organización y el objetivo principal también agregue una foto y una ventanilla enlazada a twitter y en el pie de pagina puse el validador w3 y el logo de la universidad del valle

● El banner lo puse utilizando las tablas div lo metí en el encabezado

●

● Para el menú agregue unos botones y les coloque el enlace a su respectiva pagina

●

● El <div id=”contenido”> varia según la pagina que necesitemos

● En el pie de pagina “<div id="pie">” pusimos el icono que nos daba el validador w3 cuando validamos sin errores cada pagina fue validada individualmente y también agregamos el logotipo de la universidad del valle.

●

●

Banner y el logotipo● Para el banner y el logotipo creamos una imagen desde el programa

Ai

Los botones del menu● Para esto utilizamos una herramienta online

http://jirox.net/AsButtonGen/

http://jirox.net/AsButtonGen/

Pagina de inicio

● En la pagina de inicio utilizamos la estructura anterior solo cambiando el <div id=”contenido”> en este caso agregamos el tipo de organización que es nuestra empresa y una breve descripción.

● tambien agregamos una tabla <table> </table> en la cual pusimos una foto de los integrantes del grupo y en la otra un enlace a una ventana del twitter la cual agregamos metiendonos en http://twitter.com/about/resources/widgets/widget_search llenamos el formmulario y copiamos el codigo que nos dan el la otra fila de la tabla

http://twitter.com/about/resources/widgets/widget_search

Quienes somos

● En la pagina quienes somos utilizamos la estructura general solo cambiando el <div id=”contenido”> al principio escribimos una breve descripción de la empresa y pusimos el link de la misión y la visión y el link de historia y principios y las hojas de vida de cada uno para esto metimos los pdf en http://issuu.com este nos da un código el cual ponemos en la pagina.

●

http://issuu.com/

Productos

● Para este tabulamos la información en tablas <table> </table> al lado izquierdo una descripción del producto y al otro lado una foto del producto para enlazar a la pagina del producto utilizamos y en el medio la imagen<a href=”pagina.html”><img src="image/internet8px.jpg" alt="Internet"/></a> creamos una pagina para cada producto con la estructura general en la cual hay información de producto y una foto mas grande.

Fotos

● En esta pagina tabulamos la información en tablas <table></table> en ella pusimos fotos de los productos que ofrece la empresa y al dar clic nos lleva al producto señalado para esto utilizamos los comandos

● <a href="internet2.html"><img src="image/internet8px.jpg" alt="INTERNET"/></a>

Contáctenos

● Para la pagina de contáctenos pusimos nuestra información como nombre correo y teléfono y en la parte de abajo un formulario para que los clientes llenes creado desde http://www.jotform.com/ el cual nos dio un código que pusimos en la hoja html.

http://www.jotform.com/

Documentación

● Hicimos los documentos los exportamos a pdf y lo pusimos en Internet para esto metimos los pdf en http://issuu.com este nos da un código el cual ponemos en la pagina.

http://issuu.com/

Vínculos externos

● Para esta pagina solo enlazamos con <a href="http:// www.ejemplo.co/">ejemplo</a>

●

http://www.ejemplo.co/

Hoja de estilo css● Esta pagina nos permitió agregarle estilo a la pagina sin necesidad

de utilizar html con esta le pusimos el fondo al las cajas div le pusimos colores y centre las tablas.

informe general2

Documents

Transcript of informe general2