DREAMWEABER

HOJAS DE ESTILO

Sirven para cuando queramos modificar el estilo del texto no tengamos que hacerlo página por página.

Contiene:

- Fuente tipofráfica
-El tamoño de la fuente
-Atributos (negrita, cursiva, etc.)
-Color, alineación

Nuestra página al ser sencilla utilizaremos para:

TITULO Arial de 12 puntos en negrita y verde oscuro
TEXTO Arial de 10 puntos y gris

Para crear hojas de estilo en el menu texto, estilos CSS y nuevo

VISUALIZAR MAPA DEL SITIO

Con expandir/contraer, cuando esta expandido nos da la opción de ver mapa del sitio en los botones superiores.

LOS DIFERENTES TIPOS DE VINCULOS EN DW / HTML

-Vínculos externos que nos llevan a un sitio fuera de la página -> fttp://www.----.com
-Vínculos internos son aquellos que nos llevan a una página del mismo sitio web.
-Vínculos correo electrónico-> mailto......
-Vínculos NOWHERE nos llevan a otra parte de la misma página o cambiar propiedades.

EJERCICIO IMAGEN DIGITAL

Repaso Imagen digital

Responde a las siguientes preguntas.

1. ¿cómo se denomina el proceso por el cual convertimos una imagen analógica en una digital?
Digitalización
2. ¿ De qué dos tipos de imágenes se componen principalemente los gráficos digitales?
Imagenes de mapa de bits y imagenes vectoriales
3. ¿Cuál es la característica de las imágenes de mapa de bits?
Cada bit es un pixel y no son planos tienen profundidad
4. ¿ Cuál es la cualidad principal de las imágenes vectoriales?
Vectorial o curvas bézier, son calculos matematicos, no existe la resolución, cuando se amplia se recalcula
5. ¿Qué profundidad de bits tiene una imagen que sólo me permita tener un tono más el color de fondo?
1 bit = blanco o negro
6. Si tanto el modo de color medios tonos, como el modo de color indexado tiene una profundidad de color de 8 bits, ¿en que se diferencian?.
Medios tonos son 256 bits de tonos de grises y el color indexado son 256 bits tonos de color
7. Si en la codificación de color RGB, tengo : R=255 , G=255 y B= 0, ¿que color tengo?
Amarillo
8. En la codificación de color CMYK el 0 equivale a: ......
Blanco
9. ¿photoshop es un programa de retoque de gráficos vectoriales o de mapa de bits?
De mapa de bits
10.¿qué es la resolución? ¿explica como influye la resolución en la representación de las imagenes en pantalla.
La resolución son los pixeles por pulgada, por pantalla el máximo son 72 pixeles por pulgada si ponemos mas resolución, la imagen crecera en dimesión

¿Cuál es la respuesta correcta?

1. ¿Por qué el formato TIFF es el más apropiado para ser impreso?
...Porque es el único que se puede imprimir.
X...Porque contiene información adicional para ser impreso.
...El formato TIFF nunca se utiliza para ser impreso.

2. ¿Para qué tipo de imágenes será ideal el JPEG?
X...Las imágenes de arte de línea y fotográficas,
...Sólo las imágenes pequeñas de arte de línea
...La fotográficas o que presenten degradados.


3. El formato GIF se caracteriza por...
...ser un formato obsoleto.
...ser utilizado en imágenes en blanco y negro.
X...comprimir una imagen de colores sólidos sin perder calidad.

4. ¿En qué formatos podemos encontrar la imagen dividida en capas?
En el PSD y el TIFF
X...Sólo en PSD
...En el PNG y el PSD
...En el GIF


5. ¿Qué formato gráfico utilizaríamos para publicar documentos en Internet?
...BMP
...GIF o JPEG
...EPS
X...PDF


6. Si queremos crear una aplicación interactiva para web, y deseamos utilizar imágenes vectoriales, ¿qué formato utilizaríamos?
...SVG
...SWF
X...Cualquiera de los anteriores.

PHOTOSHOP

LA IMAGEN DIGITAL
Las imagenes digitales las podemos obtener a través de perifericos de entrada como:
-Cámaras digitales
-Escaner
-Tableta gráfica
Con los periféricos de salida sacaremos la información del ordenador
- Impresora
- Pantalla

Tendremos muy en cuenta de donde nos viene la foto o por donde la vamos a mostras para la resolución.

DIGITALIZACIÓN
Convertir una imagen en digital.
El escaner lo que hace es una retícula (mapa de bits),donde cada bit es un pixel y lee donde hay color y donde no lo hay y lo convierte en código binario 011100001(blanco y negro).
Los pixels no son planos tienen profundidad que no la vemos llamada profundidad de bit o de color (gama de tonos) y es importante para saber de que tipo de foto estamos tratando.
Cada bit aporta información.
La mayoria de imagenes que conocemos son de 8 bits
Una imagen de:
1 bit= 2 elevado 1= blanco o negro
8 bits = 2 elevado 8= 256 colores
24 bits = 2 elevado 24 =16.777.216 colores
32 bits = 2 elevado 32 = Millones de colores

Para calcular los mb que tienen nuestras fotografías se utiliza la formla:
MB =Dimesión x resolución al cuadrado x profundidad de bits / 8

PROPIEDADES

Dimensión.- Tamaño fotografía (800x600 pixeles)
Resolución.- Cantidad de pixeles por pulgada
Codificación del color.- Se refiere a como va a interpretar digitalmente los colores el ordenador y junto con la profundidad nos va a dar "Los modos de color"

MODOS DE COLOR EN PHOTOSHOP

M. PLUMA-> 1 bit = 1 tono + fondo
M. MEDIOS TONOS O ESCALA DE GRISES-> 8 bit = 256 tonos gris
M. COLOR INDEXADO-> 8 bit = 256 tonos color (es el que utilizaremos para la web)
M. RGB-> 3 Canales
rojo x 8 bit \
verde x 8 bit - (24 bit) = 16 millonoes de colores
azul x 8 bit /

Colores primaros pigmento amarillo, cian y magenta para impresión.
Colores primarios luz verde, rojo y azul colores luz para pantalla.

RGB-> De 0 al 255
CMYK-> De 0 AL 100%
LAB-> Luminosidad / Componente cromático A y B
HLS-> Tono, Luminosidad y Saturación

La imagenes digitales pueden ser:
- Bitmap (mapa de bits)
- Vectoriales o curvas bézier son calculos matemáticos que se crean mediante secciones de color, no existe la resolución, cuando se amplia la imagen se recalcula y siempre está perfecta.

FORMATOS DE ARCHIVO PARA LAS IMAGENES DIGITALES

- Formatos de archivo BITMAP
*.Tiff, *.Bmp, *.Psd, *.Pict, *.Jpeg, *.Gif, *.Png
- Formatos de archivo BITMAP
*.Wmf, *.Eps, *.Swf, *.Svg, *.Pdf

Los que más vamos a utilizar para la página web seran Jpeg (fotografías) y Gif (colores planos)
Para impresión es mejor Tiff, para hacer composiciones por capas y guardarlo sin que se fundan estas sería formato Psd.
Formato Pdf para documentos, Eps para imprentas para separar por planos los colores y Swf es el tipico de flahs.

INFORME PROYECTO CANICO

Lo primero sería elegir un dominio y ver si está disponible, lo miraremos en un principio en la página oficial http://www.nic.es/
Hemos buscado http://www.vacacionesparamascotas.es/ y esta disponible, ahora vamos a mirar cual nos sale más economico.
Despues de mirar bastantes del listado de proveedores que nos proporciona el ministerio de industria he visto que la empresa AMEN es la más económica nos costaría 3€ al año, pero como no tenemos dinero porque estamos en el paro tendremos que prescindir del nombre elegido, en favor de un alojamiento gratuito que nos pondrá su nombre de dominio junto al que elijamos
En la página http://www.tripod.es/ obtenemos un alojamiento gratuito.
Despues de pasar por bastantes pantallas y poner varias veces las contraseñas, y de recibir un correo electronico para activarlo todo ya puedo acceder a MI PAGINA
Es hora de pasar a definir el proyecto.
Al ser una página de una residencia canica, para que las mascotas tengan tambien vacaciones cuando sus dueños se vayan y no puedan llevarselos con ellos.
A las personas que va dirigida seran de mediana edad y con un nivel economico medio, que a la vez que puedan irse de vacaciones puedan pagar unas vacaciones a sus mascotas, como pondremos fotos de nuestras instalaciones, actividades que se harán con sus mascotas etc. intentaremos que esten en la página el mayor tiempo posible y que visiten todas las secciones y por supuesto como cuando vuelvan de vacaciones su mascota va estar reluciente, contenta y con estado de salud impecable no solo volverán a nuestra página si no que la próxima vez que viajen volveran a dejarnos su mascota.
Ahora vamos a contestarnos a unas sencillas preguntas.
¿Qué mensaje debe recibir el visitante?
El visitante nada más entrar tiene que ver es una empresa seria y legal
¿Qué desas comunicar?
Que en nuestra empresa es la mejor para de dejen a su mascota cuando sus dueños no puedan
¿Qué imagen debe percibir el usuario?
La imagen que tiene que percibir es que en nuestra residencia vamos a cuidar de su mascota mejor o igual que él.
¿Qué información está buscando?
Donde estamos, cuales son nuestras tarifas, que actividades vamos a realizar con su mascota, que profesionales hay en nuestro equipo, cuales son nuestras instalaciones y su estado.
¿Qué motivos tendrá el usuario para visitar esa página en el futuro?
Como ya nos conoce y esta contento, solo tendrá que mirar la disponibilidad y las tarifas.
COMPETENCIA
Granja la luna: Se nota que van a ser unas verdaderas vacaciones para las mascotas y se ve que las peronas que trabajan allí adoran a los animales.
Adiscan: No me ha gustado como residencia más bien es una escuela de adiestramiento.
Hotel Canino de Pals: Está bien como residencia, pero la página web los enlaces no funcionan y como no puedo ver nada ni siquiera el contacto no llevaría a mi mascota.
LISTADO INFORMACIÓN IMPRESCINDIBLE
- Página de inicio
- ¿Quiénes somos? Con datos fiscales, la dirección y telefonos
- ¿Dónde estamos? A parte de la dirección un mapa de como llegar, tanto en coche como en transporte público.
- Servicios. Transporte para recojer las mascotas, el horario.
- Tarifas. A parte de los precios las condiciones de pago.
- Personal. Enumerar los profesionales conlos que contamos en nuestra plantilla.
- Enlaces para poder cambiar de idioma.
- Instalaciones. Con fotografías.
- Actividades con fotografías y descripciones.

PRESENTACION DEL PROYECTO EN COMUN E INTERFACE DE DREAMWEAVER

Presentación del Proyecto Común: Residencia canina.

Realizad los informes previos a la realización del diseño del sitio web, siguiendo la cronografía que vimos ayer, y publicar las conclusiones en una nueva entrada de vuestro blog.
Es decir:Elegir dominio, comprobar disponibilidad, "comprar/comparar precios de dominio...
Elegir alojamiento (Tripod), diseñar el sitio...
Especificar los objetivos del sitio, definir el público, enumerar toda la información necesaria para mostrar, informe de la competencia
Organizar jerarquía de páginas, diseñar el árbol del sitio...
Definir la estructura/formato visual...
Interface Gráfica de Dreamweaver Mx2004

1. Los menús de Dreamweaver pueden mostrarse u ocultarse desde el menú Ventana.
2. Desde Dreamweaver se puede trabajar con el código fuente.
3. El código fuente sólo puede modificarse en Dreamweaver.
4. Identifica en la imagen las herramientas: "mostrar vista de código", "menú emergente de tamaño de página" y "ver opciones".
5. ¿Cómo podemos insertar una regla horizontal en Dreamweaver? (una regla horizontal es un elemento de html para separar textos o párrafos en una página web).
6. ¿Cuáles serían los paseos para mostrár los números de linea en la vista de código y aplicar colores a la sintáxis?
7. ¿Cómo se pueden mostrar las reglas y la cuadrícula?

PRACTICA

Las afirmaciones verdaderas son las preguntas número:
2, 3, 5, 7, 12,

CRONOLOGIA DEL DISEÑO WEB

1.- OBTENER UN DOMINIO
2.- OBTENER EL ALOJAMIENTO
3.- DISEÑAR EL PROYECTO
4.- REALIZAR EL SITIO
5.- PUBLICAR EL SITIO
6.- REFERENCIAR EL SITIO.