Instituto de Investigación y Enseñanza Iberoamericano Docente: Lilia Rivera González Reportes de Prácticas de laboratorio Etiquetas Básicas Página Web
Alumno: Jorge Armando Corona Rodríguez Grado y grupo: 3-B Ciclo Escolar: 2015 – 2016 Fecha: 15 – Mayo – 2016
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
Objetivo: Utilizar todos los conocimientos adquiridos en, los parciales anteriores y el presente, para elaborar una página web personalizada y lo mejor realizada posible. La página web debe de estar orientada de la manera más adecuada al público del producto o servicio elegido y mantener una imagen idónea, en la medida de lo posible, y coherente.
Herramientas: *txt: Utilizada para crear la página web. Con ella podemos guardar nuestro archivo y modificarlo cada que se desee *html: Utilizada para visualizar todos los comandos y etiquetas realizados en el *txt como también las modificaciones en el mismo, con ayuda de un servidor de internet.
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
Disco CD: Para poder sacar nuestros *txt o *html, o ambos, y trabajar con ellos fuera del laboratorio de computo Bloc de notas: Es utilizado para poder realizar y guardar tanto los *txt y los *html Etiquetas de HMTL: Utilizadas para construir y personalizar, parte por parte, nuestra página web Servidor de Internet: Necesario en principio para poder visualizar nuestra página web con el *html. También para investigar más etiquetas necesarias y mandarnos el trabajo en caso de no contar con un disco CD.
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
Desarrollo Esqueleto: Para realizar mi esqueleto tuve que buscar diferentes páginas en internet y buscar un patrón. Por lo general tienen pocas divisiones, suelen ser sencillas y no decir más de lo necesario sí se trata de algún producto. Por otro lado yo encontré más atractiva la idea de una página con varias ventanas con diferentes funciones que pudieran ser estéticamente agradables. Al poco rato la docente me indicó que sería muy complicado hacer tantas divisiones, por lo tanto yo, como muchos de mis compañeros, me dedique a crear un nuevo boceto de esqueleto y reduje de 7 divisiones a sólo 4 divisiones, de las cuales sólo 1 o 2 son interactivas.
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
En éstas imágenes podemos ver la sintaxis de mi esqueleto (arriba) en *txt y mi esqueleto mostrado en el servidor de la computadora (abajo) en *html
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
Desarrollo Título y personalización: Una vez ya realizado mi esqueleto, venía lo realmente difícil, rellenar esos espacios “en blanco”. Primero tuve que escoger el título, pues aunque ya tenía la marca con la que habíamos trabajado y las imágenes y carácter necesarios, las primeras palabras que se ven en una página son importantes para atraer –o ahuyentar- a una persona que busca algo. Para esto la docente nos entregó las prácticas que seguían a las del esqueleto y nos pusimos a traspasarlas en el bloc de notas. Las herramientas que se nos dieron nos permiten escoger el título en cuanto a lo que dirá sin limitación alguna: podemos ponerle diferentes colores, estilos de fuente, tamaño, dirección en la que se mueve y espacio que ocupa de la página web, entre otros.
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
Después del título, fue también bien necesario agregarle color a la página, tanto de fondo, como en la barra en la que se encontraría el título, el color de las letras fue muy importante, pues de nada serviría tener un buen mensaje o tipografía sí no se pudiese ver nada o por lo contrario, se viera demasiado, que fuera inadecuada la letra en contraste al color.
Aquí está la captura de pantalla de la sintaxis del título y el color de la página
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
La imagen de arriba corresponde al título de mi página web. La imagen de abajo es del título junto con unos subtítulos que decidí agregar por estética. También se pueden ver los colores que decidí utilizar, el color negro al igual que el blanco fueron sencillos, pero el tono de rosa que yo deseaba y que se había puesto en “nuestros productos” fue más complicado de encontrar, tuve que buscar el código (FF00CC).
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
Sí lo anterior fue complicado, las imágenes, video, audio tablas no son la excepción. En cuanto a las imágenes, me topé con bastantes problemas, pues no había anotado correctamente la sintaxis para que pudiera insertar una imagen, entonces tuve que buscar con mis compañeros las partes y signos que me faltaban de la sintaxis, una vez que la completé, pude insertar una imagen. El asunto con la imagen es que el tamaño no me agradaba, la posición y pequeñas cosas de las cuales, no todas las he podido resolver. A final de cuentas decidí insertar las imágenes que ya tengo del producto de la forma que ya conozco. Cómo no tengo muchas imágenes, decidí descargar unas cuantas más y usarlas conforme las vaya necesitando.
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
(Arriba) Aquí, además de poder ver el digamos, subtítulo que había colocado, podemos ver una pequeña parte en la cual se aprecia la sintaxis para insertar imágenes. (Abajo) Se puede apreciar cómo es que se insertó la imagen de mi publicadad para nuestra variación de Pall Mall
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
Posteriormente
decidí
insertar
una
tabla
sobre
las
enfermedades que puede ocasionar el fumar cigarrillos, con la cual tuve unas cuantas complicaciones y me fallaron ´pequeños detalles cómo teclear mal la sintaxis, pequeños errores que se traducían en una tabla que aparecía incompleta o de plano no aparecía, pero al final pude.
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
En la imagen anterior podemos notar la sintaxis para hacer toda la tabla y en una parte como se acompañó de una imagen y cómo se personalizó con los colores, tipografía y tamaño de letra deseados.
Instituto de Investigación y Enseñanza Iberoamericano Preparatoria incorporada a la BUAP Clave BUAP: 8109 Jorge Armando Corona Rodríguez 3º B
Como conclusión, tengo que decir que la página web es complicada, aun teniendo las herramientas adecuadas y el tiempo, había cosas que dentro de las etiquetas no venían y uno tenía que investigarlas en internet, eso me retrasó bastante tiempo y me hizo frustrarme con la página. Cuando ya no había más tiempo para aplazar el trabajo, me di a la tarea de terminarla lo mejor posible, utilizando como referencia las otras prácticas y armando mi propia página casi desde 0 (pues al tener las etiquetas de html en la libreta y en las prácticas ya estás empezando desde algo) Aún tengo problemas para poder insertar audio y video, para poder vincular las los blocs de notas individuales y crear la página web que yo deseo, acomodar lo que hice en los lugares en los que quiero que quede, pero con la ayuda de la profesora, tiempo, paciencia y razón, creo que podré lograrlo…y más vale que lo logre y pueda disipar mis dudas, pues la entrega de la página es el martes que viene.