Máster Avanzado de Diseño y Desarrollo Web -Frontend

• Durante el módulo de diseño web aprenderemos a manejar los lenguajes base de cualquier programación web, HTML5 y CSS3, esenciales para empezar a darle forma a lo que llamaremos el esqueleto, la maqueta o la estructura de cualquier página web.

• En el último módulo de nuestro Máster Avanzado en Diseño y Desarrollo Web el alumno adquiere los conocimientos necesarios para profundizar en el mundo del desarrollo frontend, que aumentan el abanico de posibilidades de cara al desarrollo y puesta en marcha de proyectos web del lado del cliente: Javascript y jQuery. Estos nos permiten crear páginas web dinámicas, dotando a nuestro sitio web de efectos y funciones que extienden las posibilidades que nos ofrece HTML5. Además, librerías como jQuery facilitan mucho la creación de funciones complejas y efectos visuales espectaculares.

Salidas profesionales

•Diseñador gráfico
•Director de arte en revistas, productoras y agencias de publicidad
•Maquetador editorial
•Creativo publicitario
•Experto en packaging
•Especialista en tratamiento y retoque digital de imágenes
•Experto en diseño publicitario
•Experto en branding e identidad corporativa
•Diseñador web
•Visual designer
•Desarrollador front-end
•Programador de aplicaciones web Javascript
•Programador de aplicaciones web jQuery
•Programador de aplicaciones servidor
•Gestor de bases de datos con MySQL
•Diseñador y programador de páginas web dinámicas
•Programador web backend

Temario:

Diseño Grafico(ADOBE TOOLS)

01- ADOBE ILLUSTRATOR

· Modos de color
· Mesas y espacios de trabajo
· Formas básicas
· El color
· Pinceles
· El lápiz
· La pluma
· Trazos
· Girar/Reflejo
· Efectos
· Texto
· Borrador/Tijeras/Cuchilla
· Insertar imágenes
· Calco interactivo
· Pintura interactiva
· Mallas de degradado
· Máscara de recorte
· Buscatrazos
· Motivos
· Transparencia
· Símbolos
· Panel de apariencia
· Expandir objetos
· Cuadrículas de perspectiva
· Objetos en 3D
· Impresión y salida

02- ADOBE PHOTOSHOP

· Modos de color
· Espacios de trabajo
· El pÍxel
· Capas
· Formas básicas
· Herramientas de selección
· El color
· Varita mágica
· Cuentagotas
· Pinceles
· El lápiz
· Tapón de clonar
· La pluma
· Texto
· Tratamiento de las imágenes (ajustes)
· Panel corrector
· Desenfocar
· Sobreexponer/Subexponer
· Objeto inteligente
· Escala
· Mockups
· Impresión y salida

03- ADOBE INDESIGN

· Nuevo documento
· Márgenes y columnas
· Página maestra
· Capas
· Columnas
· Guías (retícula)
· El color
· Trazo
· Vínculos
· Texto
· Trabajo con estilos
· Tablas
· Tipos de alineación
· Trabajo con objetos
· Símbolos y caracteres especiales
· Impresión y salida

DISEÑO WEB CON HTML5 Y CSS3

01- DISEÑO WEB
· Principios básicos del diseño web
· Principios de usabilidad
· Principios de accesibilidad
· Creación y optimización de imágenes para web
· Piezas básicas publicitarias: banners, redes sociales HTML + CSS: estándares web
· Introducción a la web: navegadores, motor de navegaciones, sistemas operativos
· Preparación del entorno para el desarrollo
· HTML: versiones y diferencias
· Etiquetas y atributos
· Semántica de las etiquetas
· Uso de las etiquetas
· DOCTYPE y codificación de caracteres (Charset)
· Head y Title
· Párrafos
· Imágenes
· Tablas
· Enlaces: hipervínculos y anclas
· Listas: ordenadas, desordenadas y de definiciones
· Etiquetas meta
· Uso de iFrames
· Formularios
· Rutas y direcciones: relativas y absolutas
· Propiedades CSS
· Enlazar CSS
· Selectores CSS
· Pseudoselectores y pseudoelementos
· Vídeo en HTML5
· Audio en HTML5Responsive design (diseño web adaptable a tablet/móvil)
· Vídeo en HTML5
· Audio en HTML5Edición web
· Creación del entorno de desarrollo: Editor de Texto + Navegador
· Complementos y herramientas útiles para la edición web
· Estructuración de un sitio web
· Uso avanzado de nuestro entorno de desarrollo
· Conexión a un servidor remoto y sincronización
· Gestión de archivos mediante FTP
· Servidores y registro de dominios Desarrollo Front-End (Javascript y jQuery)
· Introducción a JavaScript y jQuery
· Conceptos básicos para el uso de plugins jQuery
· Creación de ejemplos prácticos: desplegables, galerías, sliders
· Introducción a CMS: Wordpress Desarrollo Back-End
· Introducción a servidores
· Introducción a lenguajes de servidor (PHP y MySQL)Posicionamiento web: SEO
· Entendiendo los motores de búsqueda
· Usabilidad web
· Introducción al SEO On Page
· Marketing web

FRONTEND CON JAVASCRIPT Y JQUERY

01- DESARROLLO WEB(FRONTEND)

Primeros pasos con JavaScript
· Introduccion a la programación de frontend
· JavaScript. Sintaxis general
· Incluir JavaScript en documentos HTML
· JavaScript en archivos adjuntos
· JavaScript dentro del código HTML
· JavaScript. Variables y operadores
· Variables locales y variables globales
· Variables numéricas
· Métodos para variables numéricas
· Operadores de asignación
· Operadores de incremento y decremento
· Operadores matemáticos
· Cadenas de texto (strings)
· Métodos para cadenas de texto
· Variables Undefined
· Variables NULL
· Variables NaN
· Operadores lógicos en JavaScript
· Operadores relacionales

Estructuras de control de flujo y variables complejas
· JavaScript. Tipos variables complejas
· Arrays en JavaScript
· Métodos para Arrays
· Condicionales en JavaScript
· If / else
· Switch
· Bucles en JavaScript
· Ciclo for
· Ciclo while

Funciones en JavaScript
· Funciones en JavaScript
· Sintaxis y uso
· Scope de JavaScript
· Trabajo con funciones

El DOM
· JavaScript. El DOM
· Introducción al DOM
· Objeto Notation
· Crear nodos
· Agregar nodos
· Modificar, reemplazar y eliminar nodos
· Acceso a los atributos del DOM
· Modificar estilos de elementos
· Eventos del DOM

JavaScript avanzado. Objetos
· Definicion de objeto
· Arrays asociativos
· Propiedades
· Métodos
· Métodos apply() y call()
· Introducción a la notación JSON
· Trabajo con JSON en JavaScript (I)
· Trabajo con JSON en JavaScript (II)

AJAX en JavaScript
· AJAX en JavaScript
· Primeros pasos
· Primera aplicación
· Funcionamiento de una aplicación AJAX
· Métodos y propiedades del objeto XMLHttpRequest
· Objetos para AJAX
· Trabajo con AJAX. Listas desplegables
· Trabajo con AJAX. Autocompletar formulario
· Trabajo con AJAX. Lector RSS
· Trabajo con AJAX. Google maps

jQuery básico
· Introducción a Jquery
· Pasos para utilizar jQuery
· Primer script con jQuery
· Básicos de jQuery: añadir y quitar clases CSS
· Básicos de jQuery: mostrar y ocultar elementos de la página
· Básicos jQuery: efectos rápidos con jQuery
· Básicos jQuery: callback de funciones jQuery
· Básicos jQuery: uso de Ajax básico con jQuery
· Básicos jQuery: Ajax jQuery con mensaje de carga

jQuery Avanzado
• El 3 de jQuery. Metodos esenciales
• Función jQuery o función $()
• Core/each: each del core de jQuery.
• Método size() y propiedad length del core de jQuery.
· Método data() core jQuery
· Selectores de jQuery
· Selectores de jerarquía en jQuery
· Métodos de atributos en jQuery
· Acceder y modificar atributos HTML desde jQuery
· Método attr() de jQuery, otros usos y removeAttr()
· Método prop() de jQuery y diferencias con attr()
· Métodos de CSS de jQuery
· Método css() de jQuery
· Funciones CSS de jQuery para conocer el tamaño y posición de elementos
· Eventos en jQuery
· Manejadores de eventos en jQuery
· Introducción de Objeto evento en jQuery
· Eventos de ratón en jQuery mouseenter y mouseleave
· Eventos de teclado en jQuery
· Definir eventos con bind() y eliminarlos
· Eventos definidos con live() en jQuery
· Delegated events en jQuery
· Efectos en jQuery
· jQuery animate(): animación de propiedades CSS
· Animaciones de color con jQuery.
· Fading en jQuery
· Colas de efectos en jQuery
· Método queue() para acceder a una cola de efectos
· Meter funciones en una cola de efectos jQuery
· Parar la ejecución de una cola de efectos jQuery
· Método delay() para retrasar la ejecución de efectos de la cola
· Cola de efectos personal (no predeterminada) en jQuery
· Desarrollo de plugins en jQuery
· Introducción al desarrollo de plugins en jQuery

Titulación:

CEI es un Centro de Formación Autorizado por Apple. Por ello, nuestros alumnos podrán obtener la certificación profesional de Apple e impulsar su carrera en tecnologías del diseño y de la información, entornos empresariales y mercados B2B.

IBM confía en nosotros y por ello nos ha otorgado la insignia IBM Education Partner. Este sello premia a centros de enseñanza que mantienen y fomentan una formación de calidad.

Nuestra escuela se consolida como Centro de Formación de referencia de Maxon en España y nos convertimos en la 1ª escuela de Europa en ser Maxon Training Provider for R18.

Duración:

540 H. (9 MESES)

Fechas:

Próxima fecha de inicio: 21 de enero de 2019.

Lunes a viernes

HORARIOS MAÑANAS
09.00 - 12.00 H.
12.00 - 15.00 H.

TARDES
16.00 - 19.00 H.
19.00 - 22.00 H.