IMPLEMENTACIÓN DE SITIOS WEB CON FRONTPAGE

Los primeros creadores de páginas Web debían conocer muy bien el lenguaje HTML y para escribir los programas que definían los contenidos de las páginas web, debían utilizar editor de texto comun, como por ejemplo el bloc d notas de windows.
Con el tiempo aparecieron programas que facilitares esa tarea y se los denominó Editores de HTML Sin embargo, tenían un inconveniente: el contenido que se veía mientras se editaba no era exactamente el mismo que mostraba el navegador.

Para resolver ese problema surgieron los editores WISIWYG de HTML, entre ellos el FRONTPAGE (WISIWYG significa "lo que ves es lo que obtienes", del inglés What You See Is What You Get).

FRONTPAGE además de ser un editor WYSIWYG de HTML, es un verdadero administrador de sitios web. Solamente con el editor se puede leer, convertir y editar archivos HTML: crear, diagramar y vincular páginas Web. Y en cada página se pueden incluir y modificar textos , tablas, marcos, imágenes, mapas de imágenes, formularios, controles Äctive X y applets de Java

imp

TRABAJOS PRACTICOS ENTREGADOS

MORENO, MARIA
LIENDRO, MAIRA
PALAVECINO JESSICA
BRECIANO
GUTIERREZ SILVANA
LOPEZ ROXANA
ARIAS E
VELAZQUEZ KAREN
FERRUFINO ELIZABETH
CABALLERO LAURA
ALANIZ MONICA
SORIA RITA
SAAVEDRA NATALIA
ZAPANA FABIOLA
SARAPURA FERNANDO
PALLARES ALBERTO

CREACIÓN DE SITIOS WEB

Si bien la construcciön de una pägina web personal es bastante sencilla; la de un sitio web completo tiene una complejidad superior.
Como todo proyecto informático se divide en etapas bien definidas:
ANÁLISIS - DISEÑO - IMPLEMENTACIÓN - PUBLICACIÓN - PROMOCIÓN Y MANTENIMIENTO.

En la etapa de ANÁLISIS se deberían responder las siguientes preguntas: 1) Tiene sentido construir este sitio web? 2) Para quién seria útil? y 3 ¿Cuáles podrían ser los contenidos del sitio?
Durante el DISEÑO se deberán establecer la estructura lógica del sitio y las características generales de diagramación de las páginas. En general, la estructura es jerárquica desde la página principal (home page) se puede acceder a las secciones principales y desde allí a las subsecciones. Es recomendable que desde cualquier página se pueda volver a la página principal y saltar a las páginas de las secciones principales. Por otro lado es conveniente que la diagramación sea consistente, es decir, que todas las páginas respeten un diseño general y que no estén repletas de imágenes, sonidos o animaciones ya que dificultan mucho la carga de aquellas. En esta etapa también se deben decidir los vínculos a otras páginas o siios web que se incluirán.
Hasta aquí se utiliza únicamente lápiz y papel.

La construcción en si comienza en la etapa de IMPLEMENTACIÓN. El lenguaje de programación de las páginas web es el HTML, (Hyper Text Markup Language), pero para construirlas no es necesario ser un experto en él, ya que es posible utilizar editores de HTML o de páginas Web. Por medio de esos programas se arman las páginas We b con texto, imágenes, sonidos, animaciones, porciones de video, hipervínculos y servicios a los usuarios, como la posibilidad de bajar archivos.

Una vez terminada la IMPLEMENTACIÓN, el sitio debe hacerse disponible a los usuarios de Internet. Para ello, debe instalarse en el servidor de un proveedor de Internet. A ese proceso se lo conoce como PUBLICACIÓN del sitio.
La etapa de PROMOCIÓN consiste en facilitar a los usuarios de Internet varios medios para encontrar el sitio recién publicado. Es decir, se debe publicitar el sitio por todos los buscadores y sitios Web posibles.
La etapa de MANTENIMIENTO puede existir o no, dependiendo de las características del sitio. En el caso de una página personal o de un lugar turístico, quizá nunca sea necesario actualizarla, pero en el caso del sitio de un diario es indispensable modificarlo todos los días de acuerdo con las noticias que vayan surgiendo. Igualmente es recomendable actualizar la información de los sitios, ya que de lo contrario, al no tener novedades, los usuarios pronto se cansarán de ver lo mismo.

UNIDAD 4: DISEÑO DE SITIOS WEB

TEMAS:
Nociones básicas sobre Internet. Protocolo. URL, DNS y direcciones IP. HTTP. Concepto de Servidor Web. Hosting. Concepto de páginas web. Concepto de sitios web. Aspectos a tener en cuenta para determinar la necesidad de un sitio web. Planificación y diseño de mapa de navegación del sitio. Software de diseño y programación de sitios web.

TRABAJO PRÁCTICO

Responde el siguiente cuestionario:
1. ¿Qué es una red informática? ¿Para qué sirve?
2. ¿Quë es internet? ¿Qué servicios ofrece?
3. ¿Qué es una dirección IP?
4. ¿Cómo podemos saber la dirección IP y el nombre de una PC en Windows?
5. Dibuja un esquema de la red de la sala de informática.
6. ¿Còmo podemos visualizar la dirección IP del modem de la sala de informática?
7. Describe el significado de DNS - URL - Dirección IP y HTTP - servidor web - Hosting.
8. ¿Qué diferencia existe entre una página web y un sitio web?
9. ¿Qué es HTML? Escribe la estructura básica de una página en lenguaje html.
10. ¿Qué aspectos se deben tener en cuenta para determinar la necesidad de un sitio web?

EDI 2 - COLEGIO "JUAN CALCHAQUI"










TRABAJO PRÁCTICO - PAINT Y PAINT SHOP PRO - 23 Jun 2010

1. Herramientas de Microsoft Paint. Nombrar y describir sus funciones.

2. Componentes de Paint Shop Pro. Describir

3. Busca en Internet que son los siguientes formatos de archivos:


PNG - JPEG - JPG - TIF - PSP - BMP - GIF - RAW


PAINT SHOT PRO

El PAINT SHOT PRO es un programa de dibujo y diseño gráfico que cuenta con muchas de las herramientas de programas profesionales y con algunas propias que lo distinguen.

Para acceder al programa deben seguir la secuencia Inicio (tecla con la bandera de Windows) - Todos los programas - Paint Shot Pro 5 - Paint Shot Pro 5.

Vamos a crear un nuevo archivo de imagen: Para ello hacemos click en la opción Nuevo (New) del menú Archivo.



Aparecerá una ventana que nos permite definir entre otras cosas el Ancho (Width) y Alto (Height) de la imagen y definir la unidad de medida (por defecto Pixels), como así también la Resolución de la imagen en Pixels por pulgada o por centímetro. También podemos definir el tipo de imagen pudiéndose elegir entre: escala de grises, 2, 16, 256 o 16,7 millones de colores y de acuerdo a la opción escogida en la ventana se nos muestra la memoria requerida para la imagen. Vamos a elegir 16,7 millones de colores porque en este tipo de imagen es que se pueden utilizar los efectos, deformaciones o filtros. Hacemos click en Aceptar (Ok)

Aplicación de Efectos Especiales

Una de las ventajas del Paint Shot Pro 5 es que permite agregar efectos especiales a un dibujo entero o solo a una parte. Los efectos pueden ser: distintos tipos de sombras, deformaciones, cambios de colores, bordes y filtros de retoque fotográfico. El programa además cuenta con un visor de deformaciones y un visualizador de filtros (los filtros son efectos que se pueden aplicar a las imágenes para transformarlas, por ejemplo: pixelarlas - agrandar los píxeles -, suavizarlas, eliminar el ruido - píxeles que no corresponden-, etc.)

Vamos a abrir una de las fotografías descargadas, eligiendo la opción Abrir desde el menú Archivo. Seleccionamos una de las imágenes y hacemos click en Aceptar (Ok).

Para aplicar un efecto a una zona de la imagen, primero hay que seleccionarla con el recuadro de selección o con el lazo. Vas a seleccionar una parte de la imagen abierta con una de estas herramientas. Al seleccionar una herramienta, se activa la Paleta de Control que muestra las opciones para esa herramienta. Fíjate las opciones para la herramienta lazo y recuadro de selección.

Una vez seleccionada una parte de la imagen, podemos aplicarles efectos, describiéndose a continuación algunos, luego prueba con otros incluidos en el programa:

Cambio de color: Menú Colores

Cambio de color, de borde y sombra: Imagen - Efectos - Buttonize o Drop Shadow.

Texto con sombra y rotado a 45°: Imagen - Efectos - Drop Shadow e Imagen - Rotate - 45°

Deformación circular: Imagen - Deformations - Circle (Círculo).

Deformación en perspectiva: Imagen - Deformations - Perspective Horizontal

Texto con contorno y profundidad: Image - Effects - Chisel.

Práctica: Diseño de un folleto turístico

Vamos a hacer el diseño de un folleto que promociona un viaje a nuestro país, vas a insertar imágenes de lugares de Argentina y textos con y sin sombra, además vamos a combinar varias imágenes en una e incluir un relleno rectangular o circular y varios picture tubes.

Para combinar varias imágenes en una, se carga la imagen principal y se agranda la zona de dibujo. Se selecciona Image - Canvas size y se escribe 640 x 480 o 800 x 600. Luego se elige el ícono de selección rectangular, se recuadra la imagen principal y se la mueve a la posición deseada. Posteriormente se carga (abre) otra imagen, que aparece en una ventana distinta, se le puede cambiar el tamaño siguiendo la secuencia Image - Resize (Dimensionar) y en Percentage of Original se escribe por ejemplo 50% horizontal y 50 % vertical. Con la selección rectangular, se recuadra y copia pulsando las teclas Control y C en forma simultánea. Luego se cierra esa ventana quedando la imagen principal.

Allí se elige Edit (Edición) - Paste (Pegar) - As New Layer (Como nueva capa) y se ubican las imágenes donde se desee.

Los Pictures Tubes (Tubos de imágenes) permiten agregar varias imágenes del mismo tipo. Para usarlos se activa el ícono Tubo de imágenes y se hace click al azar en la pantalla.

GRAFICACION BASADA EN PUNTOS - MICROSOFT PAINT

Prácticas con MS PAINT

Vamos a utilizar el link que está abajo para reconocer las herramientas de PAINT y su uso.
Una vez efectuada la lectura y práctica del uso de las herramientas, vamos a realizar la actividad TARJETA DE FELICITACION.

Link: http://www.scribd.com/doc/2461636/Microsoft-Paint-manual-sencillo

NOTAS DEL PRIMER TRIMESTRE

NOMBRES TP EXAMEN NOTA
ALANIS, Mónica Débora si 8 8
ARIAS, Emanuel no A
BRECIANO, Maximiliano si 7 6
CABALLERO, Laura Griselda si 8 8
CHAMBI, Gabriela Yamila si 9 9
ERAZO, Laura Beatriz si 8 8
FERRUFINO, Elizabeth J. si 8 8
GARCIA, José Luis no 5 4
LEDESMA, Ricardo no no A
LIENDRO, María Ramona si 8 8
LOPEZ, Roxana Mabel si 8 8
MORENO, María Fernanda si 9 9
LUNA, Patricia Gabriela si 8 8
PALAVECINO, Jessica si 10 10
PUCA, Alejandro David no A
RODRIGUEZ, José Luis no 6 5
ROMERO, Rodrigo Carlos no A
SAAVEDRA, Natalia Gabriela si 9 9
SARAPURA, Fernando Daniel si 8 8
SORIA, Rita Paola si 7 7
TAPIA, Jessica Janet no 6 5
VERA, Sergio Héctor si 9 9
VELAZQUEZ, Karen Isabel si 6 6
ZAPANA, Fabiola Mercedes no 10 9
GUTIERREZ, Gloria no A
PALLARES, Marcelo Alberto no 7 6
GUTIERREZ, Silvana no A

METODO PROYECTUAL

1. DEFINICIÓN DEL PROBLEMA: Delimitar el problema permite encuadrar la tarea sin dispersar esfuerzos.
2. ELEMENTOS DEL PROBLEMA: Es una tarea de análisis que lleva a descubrir los subproblemas que integran el problema.
3. RECOPILACIÓN DE DATOS: La documentación sobre lo ya existente es imprescindible para evitar tareas inútiles. Brindan información que ayuda a resolver los problemas parciales.
4. ANÁLISIS DE DATOS: Para formularse preguntas, se producen aportes, etc.
5. CREATIVIDAD: La creatividad se logra a partir del análisis de datos, considerar todas las situaciones para la solución.
6. RECOPILACIÓN DE MATERIALES Y TÉCNICAS: Se profundiza a partir de este momento el conocimiento de los materiales y las técnicas disponibles.
7. EXPERIMENTACIÓN: Se realiza en función de la creatividad, las experimentaciones con materiales, técnicas, instrumentos que permitan obtener mas datos.
8. MODELOS: Con toda la información recopilada se puede realizar un modelo con los materiales y técnicas seleccionados.
9. VERIFICACIÓN: Los modelos son sometidos a pruebas para comprobar su validez. 10. DIBUJOS CONTRUCTIVOS: Parciales y totales
11. SOLUCIÓN: Poder resolver el problema


FASES DEL PROCESO DE DISEÑO Y DESARROLLO EN EL SIGLO XXI.-
Este proceso conlleva la realización de un conjunto complejo de actividades, en las que deben intervenir la mayoría de las áreas funcionales de la organización. Generalmente este proceso de desarrollo se suele dividir en cinco fases o etapas:
1.- Identificación de oportunidades.
2.- Evaluación y selección.
3.- Desarrollo e ingeniería del producto y del proceso.
4.- Pruebas y evaluación.
5.- Comienzo de la producción.

PERSPECTIVAS

La perspectiva es el arte de dibujar para recrear la profundidad y la posición relativa de los objetos. En un dibujo, la perspectiva simula la profundidad y los efectos de reducción.

Es, también, la ilusión visual que, percibida por el observador, ayuda a determinar la profundidad y situación de objetos a distintas distancias.
1. Perspectiva isométrica: es una forma de proyección gráfica o, más específicamente, una axonométrica cilíndrica ortogonal. Constituye una representación de un objeto tridimensional en dos dimensiones, en la que los tres ejes de referencia tienen ángulos de 120º, y las dimensiones guardan la misma escala sobre cada uno de ellos. La isometría es una de las formas de proyección utilizadas en dibujo técnico que tiene la ventaja de permitir la representación a escala, y la desventaja de no reflejar la disminución aparente de tamaño -proporcional a la distancia- que percibe el ojo humano.
2. Perspectiva caballera: es un sistema de proyección paralela oblicua en el que, por convenio, el plano proyectante es horizontal y las secciones horizontales de los cuerpos representados se proyectan en verdadera magnitud.
3. Perspectiva militar, es un caso particular de la perspectiva caballera.

COTAS

Las cotas son las medidas que se agregan en las vistas .Para hacerlo existen normas de acotación



Líneas de cota: Son líneas paralelas a la superficie de la pieza objeto de medición.

Cifras de cota: Es un número que indica la magnitud. Se sitúa centrada en la línea de cota. Podrá situarse en medio de la línea de cota, interrumpiendo esta, o sobre la misma, pero en un mismo dibujo se seguirá un solo criterio.

Símbolo de final de cota: Las líneas de cota serán terminadas en sus extremos por un símbolo, que podrá ser una punta de flecha, un pequeño trazo oblicuo a 45º o un pequeño círculo.


Líneas auxiliares de cota: Son líneas que parten del dibujo de forma perpendicular a la superficie a acotar, y limitan la longitud de las líneas de cota. Deben sobresalir ligeramente de las líneas de cota, aproximadamente en 2 mm. Excepcionalmente, como veremos posteriormente, pueden dibujarse a 60º respecto a las líneas de cota

VISTAS

¿Qué son las vistas?
Es la representación de las caras paralelas de un objeto en dos dimensiones. Para
comprender al objeto se deben tener como mínimo tres vistas (las principales).

El nombre de las vistas depende de su ubicación. A la que vemos de arriba la llamamos SUPERIOR, a la que vemos de frente la llamamos FRONTAL, y a las que vemos de costado las llamamos LATERALES IZQUIERDA Y DERECHA.
Podemos entender como es un objeto a través de sus vistas principales.

ESCALA

La representación de objetos a su tamaño natural no es posible cuando éstos son muy grandes o cuando son muy pequeños. En el primer caso, porque requerirían formatos de dimensiones poco manejables y en el segundo, porque faltaría claridad en la definición de los mismos.

Esta problemática la resuelve la ESCALA, aplicando la ampliación o reducción necesarias en cada caso para que los objetos queden claramente representados en el plano del dibujo.

Se define la ESCALA como la relación entre la dimensión dibujada respecto de su dimensión real, esto es: E = dibujo / realidad
Si el numerador de esta fracción es mayor que el denominador, se trata de una escala de ampliación, y será de reducción en caso contrario. La escala 1:1 corresponde a un objeto dibujado a su tamaño real (escala natural).


Existen tres tipos de Escala:
· Real o Natural: se mantienen las mismas medidas del objeto real en la representación.
· De Reducción: se dividen las medidas reales del objeto tantas veces como indique el divisor.
· De ampliación: se multiplican las medidas del objeto real tantas veces como indique el denominador.

Ejemplos


ESCALAS NORMALIZADAS
Aunque, en teoría, sea posible aplicar cualquier valor de escala, en la práctica se recomienda el uso de ciertos valores normalizados con objeto de facilitar la lectura de dimensiones mediante el uso de reglas o escalímetros.

Estos valores son:

Ampliación: 2:1, 5:1, 10:1, 20:1, 50:1 ...

Reducción: 1:2, 1:5, 1:10, 1:20, 1:50 ...

No obstante, en casos especiales (particularmente en construcción) se emplean ciertas escalas intermedias tales como:

1:25, 1:30, 1:40, etc...

EJEMPLO 1

Se desea representar en un formato A3 la planta de un edificio de 60 x 30 metros.

La escala más conveniente para este caso sería 1:200 que proporcionaría unas dimensiones de 30 x 15 cm, muy adecuadas al tamaño del formato.

EJEMPLO 2:

Se desea representar en un formato A4 una pieza de reloj de dimensiones 2 x 1mm.
La escala adecuada sería 10:1

UNIDAD I - AÑO 2.010

UNIDAD Nº 1 . DISEÑO Y PRODUCTO TECNOLÓGICO.

El diseño: concepto, especificaciones, aspectos (funcionalidad, morfología, técnicos). Representaciones: cotas y escalas, sistemas de vistas y perspectivas. Formas del dibujo técnico (boceto, croquis, dibujo delineado). Mercado y diseño de productos: etapas del proceso de diseño. El lenguaje de la innovación: el diseño. Método proyectual.



TIPOS DE DIBUJO: BOCETO, CROQUIS Y DIBUJO DELINEADO

BOCETO es un dibujo técnico hecho de forma espontánea, que nos sirve para hacernos una idea de las soluciones que se nos ocurren para nuestros proyectos. Es un dibujo libre de normas, se realiza sin instrumentos de dibujo técnico y debe ser claro.
CROQUIS: es un boceto mas detallado en el que podemos poner dimensiones, características, colores, etc., para definir el objeto con mas precisión. Se realiza también sin instrumentos de dibujo técnico, Si alguna de las partes del dibujo resulta demasiado pequeña y no se puede apreciar su forma, será necesario una ampliación de esa zona. A este tipo de dibujo se le denomina detalle.
DIBUJO DELINEADO: es el que se realiza con la ayuda de los instrumentos de dibujo técnico: escuadra, regla graduada, compás, etc. Se realiza siempre a escala y debe ir bien acotado y rotulado.