24/04/2012 - 14/06/2012
Barcelona
________________________ temario DreamWeaver cs5 básico 30h ________________________

Descripción del curso

Dreamweaver se ha convertido la en primera herramienta profesional para el desarrollo de sitios web.

¿Qué aprenderás en este curso?
Con este curso aprenderás a trabajar a nivel profesional con Adobe DreamWeaver CS5.5 para la realización de contenidos web. Aprenderás a crear, administrar y visualizar un proyecto web utilizando las múltiples opciones de creación de contenidos, a la vez que conoces la filosofía de maquetación de HTML, optimizando así una web compatible con los principales navegadores existentes.
Aprende cómo publicar un sitio web y gestionar los archivos de forma fácil y sencilla desde tu ordenador.

¿A quién va dirigido?
Curso dirigido a profesionales del diseño gráfico y del diseño web que necesiten crear proyectos profesionales, así como a particulares y estudiantes que quieran conocer en profundidad el programa de Adobe DreamWeaver CS5.5

Conocimientos previos
Se requieren conocimientos medios del sistema operativo MacOS o Windows.

Introducción:
Internet y la WWW
Navegadores y editores de páginas web
Principales lenguajes de edición de páginas web
HTML: estructura y semántica
CSS: formato y maquetación
JavaScript: interactividad
Contenidos estáticos y dinámicos:
Lado cliente, lado servidor
Concepto de sitio y página web

Interficie y entorno de trabajo en Adobe Dreamweaver CS5.5
Diseño WYSIWYG
Modos de visualización: código, diseño, en vivo
Paneles: agrupar-desagrupar, anclar
Guardar espacios de trabajo

Hipervínculos: absolutos, relativos, correo electrónico, anclas
Hypervínculos entre imágenes
Mapas sensitivos

Sección head: title, meta (redireccionar, metadatos)

Texto (tags):
tipo bloque: párrafos, encabezamientos, div…,
inline: em, strong, span…,


Imágenes:
Atributo alt
Marcadores de posición
Integración con Photoshop CS5: editar en origen, objetos inteligentes, copiar y pegar
Integración con Adobe Illustrator


Tablas

Publicación: Concepto de sitio web: local y remoto
FTP alajar en un sitio remoto (ocultación)
Favicon

CSS3 (formato y maquetación)
Concepto de hojas de estilo: dónde declarar código css
Asociar hojas de estilo a documentos
Panel CSS
Tipos de selectores: redefinir, clase, id, contextules, grupo de selectores
Modelo de caja
Aplicar estilo a vínculos
Maquetación uso de etiquetas div:
Desde cero (concepto de float, clear)
Layouts predeterminados de DreamWeaver cs5.5

Inserción de elementos: multimedia, Flash (swf, flv)


Widgets de Spry:
Panel contraible
Acordeón
Paneles en fichas
Barra de menús
xml

Comportamientos: pop-menu, mostrar-ocultar, alert…,

Formularios

DreamWeaver cs5.5 Avanz-temario 26h


CSS2 avanzado
¿Dónde se escribe el código CSS? Cascada y herencia

▪, Selectores:
▪, Redefinir etiqueta
▪, Universal
▪, Identificador
▪, Clase
▪, Descendente
▪, Selector hijo
▪, De atributos
▪, Agrupación de selectores
▪, Pseudo-clases, Pseudo-elementos

▪, Sintaxis:
▪, Escritura abreviada de CSS
▪, Unidades de medida
▪, Creación layouts

Media Queries CSS
▪, Creación de layout
medias CSS2: impresión, dispositivos móviles antiguos
medias condiciones CSS3: detección de distintos anchos de pantalla escritorio, iPad, iPhone…,

CSS3
Modificadores para añadir compatibilidad con Mozilla, Webkit, Opera
Border-radius
Cantos romos a imágenes y cajas
Mismo y distintos valores para los cuatro vértices
Sombras: cajas, imágenes, texto
Fondos: escalables, múltiples
Transformaciones, transiciones, animaciones
Color HSL, HSLA, RGB, RGBA
Opacidad
Degradados: lineales, radiales
Selectores de atributos con expresiones regulares

Multi-columnas
Importación fuentes
Generadores CSS3
Saber la compatibilidad CSS3 y HTML5 con navegadores y versiones

Dreamweaver CS5.5
Validación desde DreamWeaver
JumpMenu y alternativa sin JavaSprit
Widgets
Anclas usando identificadores
Server-Side include
Sugerencias de código HTML5 y CSS3
Integración con jQuery
Configurar Preferencias para testear en el emulador iOS

Introducción a JavaScript + PHP
Variables, Array, funciones, eventos, objetos métodos propiedadess

HTML5
Etiquetas semánticas:
header, footer, nav, section, article, aside
Compatibilidad con navegadores antiguos
Trabajo off-line
Audio y video nativo
SVG archivo vectoriales nativos
Formularios mejorados
tipos de input: date, range, color, deslizadores
atributos: placeholder, requered, valid



Adobe Edge
Las animaciones generadas por Flash no están soportas por dispositivos iOS.
Adobe Edge permite crear animaciones nativas HTML5 (no requiere instalar plugins en el navegador con en Flash) y esta soportado por Tablets y smartPhones y navegadores de escritorio de última generación. Interficie similar a Adobe After Effects. También permite añadir interactidad y efectos especiales a tus páginas web.

Adobe Wallaby
Permite convertir animaciones Flash a animaciones HTML5.

Adobe Muse
Permite crear sitios web tan fácilmente como maquetar en InDesign para impresión. Sin escribir código permite diseñar y publicar páginas HTML, basados en los últimos estándar web. No requiere conocimientos de código. Interface similar a InDesign. Compatible con Photoshop, Illustrator. Creación y publicación sitios web fácil, simple y rápido.


-Planifica tu sitio (Arquitectura)
Mapa del sitio
Páginas maestras

-Diseñar herramientas Adobe familiares
Gestión de imágenes
Estilos de párrafo y carácter
Gestión de imágenes
Encabezamientos y Pies

-Interactividad
Auto-generar navegación: Menús
Incluir witgets (googleMaps, youTube…,)
Hipervínculos: absolutos, relativos, estilos de hipervinculos, anclas mejoradas
Galerias de imágenes

-Testear sitio en local
-Publicar. Alojar hosting (Business Catalyst)


jQuery+jQueryUI
jQuery es una librería gratuita y con amplia compatibilidad con navegadores y versiones. Nos ajuda a mejorar nuestras páginas web de una forma sencilla, incrementando la productividad y que el usuario obtenga una experiencia más dinámica. Con conocimientos de HTML, CSS y javaScript la curva de aprendizaje es muy rápida.

-Descarga personalizada y vinculación de ( jQuery + jQueryUI)
-Mostrar-ocultar con efectos
-Botones
-Objetos arrastrables, soltable, reordenables
-Tabbed (paneles de fichas)
-Acordeón
-Formularios mejorados
-Autocompletado
-DatePicker calendario
-Efectos
-Cuadro de diálogo