html5-css3
TRANSCRIPT
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 1/25
MASTER EN HTML 5, CSS3,
JQuery, Social Media y SEO
Consultor Especialista
Prepárate para ser un especialista en tecnolo-
gías webs de última generación orientados a
Aplicaciones Web, Desktop y dispositivosMóviles orientado a Web 2.0
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 2/25
PRESENTACION DEL CURSO
MASTER EN HTML 5, CSS3,
JQuery, Social Media y SEO
Consultor Especialista
Prepárate para ser un especialista en tecnolo-
gías webs de última generación orientados a
Aplicaciones Web, Desktop y dispositivos
Móviles orientado a Web 2.0
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 3/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
1
El HTML5 (HyperText Markup Language, versión 5) es la quinta revisión del
lenguaje de programación “básico” de la World Wide Web, el HTML.
Esta nueva versión pretende remplazar al actual (X)HTML, corrigiendo proble-
mas con los que los desarrolladores y diseñadores de web se encuentran día a
día, así como rediseñar el código actualizándolo a nuevas necesidades que
demanda la web de hoy en día.
Debido a que estos cambios que afectaran la forma de diseñar y desarrollar
páginas webs en un futuro inmediato, desde MGP Nuevas Artes, nos hemos
planteado en crear el Master en HTML 5, CSS3, JQuery, Social Media y SEO
Consultor Especialista, todo esto trabajado en plataforma Dreamweaver
CS5.5.
El HTML5 se convertirá el estándar en el campo de la creación de webs a partir
del 2012 ya muchas empresas están desarrollando sus páginas en esta versión
lenguaje. Los navegadores más usados como IE, Firefox, Opera, Chrome,
Safari están implementando tecnologías en su visor para que soporten las
nuevas sentencias tanto del HTML5 y CSS3. A diferencia de otras versiones de
HTML, los cambios en HTML5 comienzan añadiendo semántica y accesibilidad
implícitas, especificando cada detalle y borrando cualquier ambigüedad.
En el Curso HTML 5 en Dreamweaver CS5, explicaremos cómo desarrollar
sitios multi-navegador web compatible con el uso de las capacidades mejoradas
del HTML 5. Todos los detalles del curso HTML 5 en Dreamweaver CS5, inclu-
yendo plantillas, pistas adicionales de código y una vista previa de múltiplespantallas para el desarrollo de dispositivos móviles (celulares). Tutoriales sobre
la incorporación de audio nativo y reproductores de vídeo sin plug-ins (no más
Flash para videos), ahora también se podrá incorporar cualquier tipo de fuente
no-estándar en nuestra web usando @font-face, y la creación de formularios
con hilanderos, deslizadores y los calendarios.
Porque el JQuery para los que no lo saben, JQuery es una librería javascript
que nos permite de una manera rápida y sencilla acceder y manipular el HTML
DOM (Modelo de Objetos del Documento). Pero porque deberíamos de empe-
zar a usar JQuery? pues aquí van algunas razones: Podemos crear efectos y
animaciones de elementos al nivel de flash en nuestras webs pero 100% funcio-nal para las arañas de búsqueda.
Social Media Manager , en nuestra actualidad las redes sociales (Facebook,
Twitter, Youtube, Blogs) son herramientas fundamentales para posicionar
marcas de empresas, hacer marketing online y por ende generar trafico a nues-
tra página web. Aprende a administrar las redes sociales de pequeñas, media-
nas y grandes empresas, te enseñamos como obtener tu primer cliente.
Introducción al Curso
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 4/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
2
Aplicaciones Moviles, el curso tendrá un apartado que cubre especialmente la
creación de aplicaciones que se adaptaran en el IPHONE, ANDROID y IPAD
como por ejemplo la creación de animaciones para producir contenidos interacti-
vos de gran alcance, incluyendo una galería de fotos y un reproductor de vídeo.Técnicas de CSS3 para cambiar formato de tipo le letras, creación de menús y
botones.
SEO Consultor Especialista, en la actualidad no solo es crear una página web,
ahora es importante que dichas webs salgan en los primeros lugares de las
búsquedas de los principales buscadores como por ejemplo Google, Yahoo,
Bing, existen mucha técnicas y herramientas para hacer este trabajo y aquí te
preparamos para ser todo un experto.
Objetivo
El objetivo principal es preparar un profesional completo en la creación, optimi-
zación y promoción de aplicaciones webs en todos los medios existentes, lláme-
se navegadores webs, dispositivos móviles, buscadores y redes sociales,
utilizando para esto las últimas tecnologías como el HTML5, CSS3, Jquery y el
Dreamweaver CS5.5.
Requisitos
Es fundamental que el participante sepa manejar a la perfección los siguientes
puntos:
Manejo absoluto del Windows
Manejo absoluto de los navegadores de internet IE, Firefox, Chrome, Safari.
Conocimiento y manejo a la perfección del teclado en todas sus dimensiones.
Manejo de archivos en Windows (crear, copiar, renombrar, borrar, crear carpe-
tas).
Instructor
Abel Espinoza Herrera
Experto en creación, diseño y desarrollo de páginas web basadas en estándares
Master Animación 2D multimediaSEO Consultor Especialista
Social Media Manager
Desarrollador de aplicaciones web y juegos 2D
Desarrollo del Plan Curricular
Todos los puntos mencionados en el presente plan curricular son los que deben
aprender el alumno para poder ser un Master en Diseño, Maquetación, Social
Media y SEO Consultor Especialista. El desarrollo de cada tema no necesaria-
mente tiene que seguir el orden como se muestra sino de acuerdo al plantea-
miento del INSTRUCTOR.
Introducción al Curso
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 5/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
3
Los temas incluyen:
Diseños y nuevas tendencias en la web moderna
Creación de bocetos modernos, cuerpos simples y multicuerposDreamweaver CS5.5 y HTML5En desarrollo para dispositivos móviles y las tabletsMejor comprensión etiquetas estructuralesCrear un diseño de página de baseMaquetando directamente con HMTL5La aplicación de efectos CSS3 tipoLa creación de estilosHTML5 Hacer compatible con navegadores antiguosTrabajar con la opacidadConstrucción de las transiciones con CSS
Activación de las transiciones con gestosAnimación con fotogramas claveUso de fuentes personalizadasOrientación de los dispositivos y orientacionesViendo las imágenesEl juego y el control de audioReproducción de vídeoLa generación de contenido dinámicoUso de geolocalizaciónEfectos especiales y animación JQUERYManejo de redes sociales (Facebook, Twitter, Youtube, Blog)
Manejo de campañas en redes socialesOptimización de páginas web para los buscadoresSubmisión de páginas a los principales buscadores y directoriosPromoción y marketing online
Introducción al Curso
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 6/25
Plan de EstudiosCreación de Diseño para Web
Fireworks CS5.5
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 7/25
Fundamentos de Fireworks CS5.5
Conociendo la plataforma del FireworksAbriendo nuestro lienzo para crear un boceto webUso de las guías y reglasAjustando tamaños adecuados de acuerdos a los estándaresEstableciendo medidas de cabecera, menú, cuerpo, pie-pagina
Dibujo básico para maquetarCreando la primera maquetación de cuerpo simpleTraslado de elementos al DreamweaverMaquetación de dos o más cuerposMaquetación de columnasTrabajando con espacios entre cuerpos o espacios.Ejemplos prácticos
Dibujo con Fireworks CS5.5
Técnicas de dibujo.
Combinar Objetos (Unir, Recortar, Intersectar)Creación de Isotipos, LogotiposTrabajar con TipografíasDibujo a mano libre con la plumaCreación de una marca y/o logotipoMaquetando diseños modernos no clasicosEjemplos prácticos
Diseño Barras de navegación y Menús Desplegables
Barras de navegación clásicas.
Barras de navegación minimalistas.Barras de navegación moderna y artísticaAplicación de degradados, colores de relleno y bordes personalizadosDiseño de menús desplegablesFormas de menús desplegablesExportación de imágenes con estados rolloversEjemplos prácticos
Diseño Contenidos, títulos, marcos y adornos
Formas correctas de creación de contenidos
Diagramando columnas, cajas
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
5
Maquetación con Adobe Fireworks CS5.5
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 8/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
6
Maquetación con Adobe Fireworks CS5.5
Visores de videosDiseñando galería de imágenesEjemplos prácticos
Manejo de Imágenes y creación de banners
Edición de imágenes (cortar, copiar, borrar)Calidad de imágenes (color, niveles)Efectos de imagen con máscara de capasCreación de fondos de webEjemplos prácticos
Diseñar formularios
Diseñar elementos de formulariosDiseñar Cajas de textosDiseñar Botones enviar y borrarExportación de imágenesEjemplos prácticos
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 9/25
Plan de EstudiosHojas de Estilo en Cascada
CSS3
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 10/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
7
Hoja de Estilos en Cascada 3 (CSS3)
Fundamentos de CSS3
La base selectores CSS
Añadir estilos a una etiqueta HTMLAñadir estilos a una página webCreación de una hoja de estilos externaVinculación a una hoja de estiloImportación de una hoja de estilosDenición de etiquetas HTMLDenición de clases reutilizablesDenición de identicadores únicosDenición de estilos universalesAgrupando elementos que denen el mismo estiloAgregar comentarios a CSS
Estilo selectivo
El árbol de familia de elementosDenición de estilos en función del contextoEstilo descendientesEstilo sólo a los hijosEstilo de los hermanosTrabajar con pseudo-clasesEstilo de los enlacesEstilo de interacción
CSS3: Estilo especíco pseudo-clases con los hijos CSS3: No estilos a un elemento
Trabajar con los pseudo-elementosTrabajar con las primeras letras y líneasOpciones de conguración antes y después de un elementoDenición de estilos basados en atributos de las etiquetas
CSS3: Consulta en diferentes MediosLos consulta de medios de comunicaciónUsando la reglas para diferentes mediosLa herencia de las propiedades de sus padresGestión de valores de las propiedades existentes o heredados
Hacer una declaración! ImportanteLa determinación de la Orden de la cascada
Propiedades de fuente
Entender la tipografía en la webEspecicar el conjunto de caracteresLas familias genéricas de fuentesSímbolosHTML entidades de caracteresConguración de una fuente-Stack
Encontrar fuentesSeguros para la Web de fuentes
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 11/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
8
Hoja de Estilos en Cascada 3 (CSS3)
WebFonts descargableAjuste del tamaño de la fuente
CSS3: ajustar el tamaño de fuenteHacer texto en cursivaEstablecer Bold, Bolder, Boldest.
La creación de Small CapsEstablecimiento de valores para múltiples fuentes
Propiedades del texto
Ajustar el espaciado del textoAjuste del espacio entre letras (tracking)Ajuste el espacio entre las palabrasAjuste el espacio interlineado de texto
CSS3: Agregar sombras a los textosAlinear texto horizontalmenteAlinear texto verticalmenteSangría de los párrafosEl control de los espacios en blancoTexto de decoración
Color y Propiedades de fondos
Cambiando de los valores de colorPalabras clave de coloresValores RGB hexadecimalesValores RGB decimalesValores en porcentaje
CSS3: valores HSL CSS3: Valores de Color con alfa
CSS3: Colores de fondos DegradadosDegradados en Internet ExplorerDegradados en MozillaDegradados en WebkitElección de la paleta de coloresColores básicos del círculoHerramientas en línea del esquema de color
Conguración del color del textoEstablecimiento de un color de fondoEstablecer una imagen de fondo
Lista y Propiedades de la tabla
Establecer el estilo de viñetaCreación de una viñeta personalizadaAjuste de posiciones de las viñetasConguración de múltiples estilos de listasAjuste del diseño de la tabla
Ajuste del espacio entre las celdas
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 12/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
9
Hoja de Estilos en Cascada 3 (CSS3)El colapso de las bordes entre las celdasTratar con celdas de tabla vacíasAjuste de la posición de leyenda de las tablas
Interfaz de usuario y generar propiedades de contenido
Cambiar la apariencia del puntero del ratónAdición de contenido mediante CSSLa enseñanza del navegador con el contadorEspecicando el estilo de cita
Propiedades de las cajas
Comprensión de un elemento cajaPartes de la cajaViendo un elementoAjuste el ancho y alto de un elementoControl de contenidos de desbordamientoElementos otantes en la ventanaEliminación de un elemento otanteCómo ajustar los márgenes de un elementoEsquema de conguración de un elementoConguración borde de un elemento
CSS3: Trabajar con Bordes Redondeados CSS3: Conguración de una imagen en los bordes
Establecer relleno de un elemento
Cambiando Propiedades Visuales
Descripción de una ventana y un documentoAjuste del tipo de posicionamientoPosición estáticaPosición relativaPosición absolutoPosición joAjuste de posición de un elementoApilamiento de objetos en 3DConguración de la visibilidad de un elemento
Recorte de área visible de un elementoCSS3: Congurando la opacidad de un elementoCSS3: Congurando la sombra de un elemento
Propiedades de transformación y transición
CSS3: La transformación de un elementoTransformaciones en 2DTransformaciones 3DCSS3: Cómo añadir transiciones entre estado de elementoQué se puede hacer con la transición
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 13/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
10
Fijación CSS
Ajuste de CSS para Internet ExplorerIE condicional CSSLa jación de los de Internet Explorer en el modelo de cajaRestablecimiento de CSSReajuste simple de un CSSReajuste CSS YUI2Restablecer CSS según Eric Meyer
Técnicas esenciales de CSS
La creación de varias columnas con diseños de otantesEnlaces estilo Versus navegaciónUsando CSS SpritesCreación menú desplegable con CSS
Gestión de las Hojas de Estilo
Creación de hojas de estilo legibleIncluir una introducción y TOCDenir los colores, fuentes y otras constantesUso de la sección encabezadosElegir un esquema de organizaciónUsar la especicidad de jerarquíaLas bibliotecas CSS y FrameworksEl método agregadoEl método dinámicoSolución de problemas Código CSSDepuración de CSS en Firebug y Web InspectorFirebug para FirefoxInspector web en Safari y ChromeValidar su código CSS
Hoja de Estilos en Cascada 3 (CSS3)
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 14/25
Plan de EstudiosMaquetación Web Estandar
HMTL 5
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 15/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
12
Introducción
Htmly Css3: Historia, Presente Y Futuro De Las Paginas Web
Instalación De Navegadores Y HerramientasInstalación de Mozilla FirefoxInstalación de Google ChromeInstalación de OperaInstalación de Apple SafariInstalación de Gedit y Notepad
Estructura Y Semántica De Una Web En Html5
Estructura
DoctypeHeader y FooterNavArticle, Section y Aside
SemánticaWord Break TimeRubyMicrodatos
Trabajo Fuera De LíneaApp caché ManiestoActivar el contenido editable
Multimedia
VídeoMúltiples fuentesAudioMúltiples formatos
Parámetros adicionales
Grácos En Html5
CanvasContenedor y JavaScript asociadoCreación de trazadosCreación de círculosDegradados
SvgGrácos vectoriales con SVG
Algunas instrucciones de SVG
Maquetación Estandar en HTML5
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 16/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
13
Insertar código externo
Nuevos Tipos De Formularios
Campos requeridosCampos inválidosDateSlidersColorValor numérico
HMTL5 Y CSS3
BordesBorder RadiusCompatibilidad con FirefoxMúltiples radios en las esquinasShadow
FondosTamañoOrigenFondos Múltiples
Efectos De TextoSombraWord-wrapping
Fuentes
Conguración de fuentes personalizadasTransformaciones
Transformación de posiciónTransformación de rotaciónTransformación de escalaTransformación de distorsión
TransicionesPrimera transiciónVarios elementos simultáneos
AnimacionesPrimera animación
Múltiples fotogramas claveAnimación de posición
Columnas MúltiplesCreación de múltiples columnasSeparación entre columnasLínea separadoraInserción de imágenes
ColorColores predeterminadosTransparencia
Caso Práctico Del Curso: Diseñar Una Web Personal
Maquetación Estandar en HTML5
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 17/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
14
IntroducciónObjetivo de una web personalPrejos de compatibilidad con navegadores
PlanteamientoConguración del espacio de trabajoCreación de la estructura de archivos
EstructuraEsqueleto estructuralTruco Auto-refreshTítulo y metaetiquetasEtiquetas estructuralesEsbozo de contenido en el HeaderContenido inicial del Body y el FooterCambio de UTF a ISOAyudas para la estructuración con DIV
Añadido de contenido a la página índexSemántica
Marcado de tiempo con TimePreparación para microdatos: fotografíaAñadido de microdatosAñadido de microformatos: Tarjeta de visita virtual
MultimediaPreparación de archivos para su inclusiónInclusión de vídeoInclusión de audioPreload de audio y de vídeo
Contenido OineGuardado permanente de información en el servidorGuardado de información de sesión
Grácos Y EfectosIcono de navegación: canvasJavaScript asociadoTrucos de automatizaciónIcono de contactoIcono de inicioIcono de noticiasAñadir un logo con SVG
MaquetaciónCreación de una hoja de estilo externaUsar fuentes personalizadasMaquetación principalMaquetando Header y FooterMaquetando el bloque principal
Creando Un Estilo VisualEstilizando el HeaderEstilizando el Footer y el contenidoTítulo de la web 02:53Creación de un menú de navegaciónEstilización de canvasMaquetando artículos y aumento de compatibilidad con Firefox y
Maquetación Estandar en HTML5
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 18/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
15
OperaMaquetando fechasMaquetando el contenido tangencialMaquetación del DIV "sobre mí"Logotipos para los artículos
Transiciones, Animaciones Y EfectosTransiciones de opacidad y sombra de cajaTransición de escalaTransición de colorAnimaciónMúltiples fondos y transparenciasSombra en el textoCreación de un maniesto
Diseño De Formularios Con Html5 Y Css3
Duplicación de index.htmlFormulario de contactoNombre e e-mailÁrea de texto y propiedades HTML5Estilizado con elementos HTML5Estilizado del formularioTransparenciasCreación del archivo PHPConguración de las variablesEnviar el mail con PHP
Caso Práctico : Crear Web Empresarial con AnimacionesEstructura
Creación del índex y estructuraFormulario de entradaEstructura de la sección principal y el FooterContenido de la sección principal y el Footer
Estilo De La CabeceraEstilo para el bloque principalFuentes personalizadas
Inserción del logotipo vectorialMaquetación del logotipoMaquetación del formularioAnimación del logotipoRenado de la animaciónAnimación del enlace al registroTransiciones en los formularios
Creación De Un Banner Animado Sólo Con Css3Animación de cierre del bannerCreación de un fondo animadoTextos animadosRetoques en los tamaños de los objetos
Maquetación Estandar en HTML5
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 19/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
16
Estilizado De Las TablasEstilizado de tablasEfectos adicionales en la tablaEstilizado del FooterTransiciones en las etiquetasPruebas en columnas
Caso Práctico Del Curso: Integración De Aplicaciones Web 2.0
Deniendo Material de partidaFusión de las dos ramas del proyecto
Integración Del IndexExternalización del CSSSelección de los archivos de igual funciónAdaptación del formulario de usuarioIntegración del enlace a nuevo usuarioInserción del código PHP en la maquetación HTMLIntegración de la tabla de resultadosActualización del fondo del banner
Integración De La Página PrincipalObjetivoFusión del archivo html con el archivo phpCreación de elementos de sesión: saludo por usuarioCreación de elementos de sesión: cierre de sesiónInserción del código PHP en la maquetación HTML
Cambio de formato de la tabla principalInclusión de enlaces para actualizar y eliminar registrosTransformación de la tabla de favoritos propuestosAyuda visual para diferenciar las etiquetasUsando el formulario de tipo range
Ejercicios Varios HTML5 Y CSS3
Aplicar Acordeón A Una Web Con Html5Estructura básica en htmlInserción de contenido mixto
Estilo del body y el contenedorEstilizado de elementos de textoEstilizado de elementos visualesAñadido de títulos a los artículosCreación del acordeón animado
Creación De Una Galería Con Lightbox Puro Hmtl5Creación de la estructura y las seccionesContenido en las seccionesEstilo del body y de la secciónEstilo del texto, la imagen y el vídeo
Montaje del contenido encima de los botonesOpacidadAnimación
Maquetación Estandar en HTML5
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 20/25
Plan de EstudiosSocial Media Manager
SEO Consulto Especialista
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 21/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
18
Introducción
PresentaciónConceptos Básicos
Investigación y estrategia: Palabras Claves
Análisis competitivo de las palabras clavesLista palabras claves por frasesLista palabras claves por URLLista de palabras claves por fraseLista de CompetidoresRelación palabras claves y páginas webEjemplo obtención palabras claves
Evaluación completa de páginas SEO
Estructura semánticaUso del plugin Web Developer ToolsContenidos de nuestras páginas webTécnica para escribir contenidosCódigo HTMLCódigo de tablasUso indebido de tablas anidadas: TeoríaUso indebido de tablas anidadas: Práctica
Tiempo de bajada una página webUso del atributo NofollowAntigüedad del dominioGoogle Page Rank Tráco en AlexaDirectorio DMOZDensidad de palabras clavesValidación del código HTMLValidación del código CSSValidación webMeta Robots NOINDEX, NOFOLLOWNombre de los archivos HTMLEvaluación de combinación de palabras clave
Optimización de nuestras páginas SEO
IntroducciónTituloMetatagsMeta descriptionMeta keywordsAtributo AltContenidos de nuestras páginas SEOPáginas indexadas
Publicación, Posicionamiento, Promoción, Marketing Online y Web 2.0
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 22/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
19
Popularidad de Enlaces 1Popularidad de Enlaces 2Popularidad de Enlaces 3Enlaces internosEnlaces internos y externos: varias lenguas
Mapa del sitio web
Promocionando nuestra web
IntroducciónSumisión GoogleSumisión otros buscadoresSumisión a directorios: Yahoo y DMOZSumisión a otros directoriosPrograma de aliadosModelo HTML para intercambiar enlacesIntercambio de enlacesTécnicas para el intercambio de enlacesCreación de blogPromoción en un blogPromoción en un foroFirma en los forosPublicación de artículosTécnicas para escribir artículosComunicados de prensa
Informes de seguimientos y mejoras
IntroducciónCreación cuenta GoogleDensidad de Palabras ClavesArchivo robots.txtCreación Google SitemapCreación Google analíticasReglas de oro seguimiento SEODirectrices para webmasterExtensiones SEO para FirefoxGoogle Trends
Google Sitemap
IntroducciónAñadir el sitemapEl interfaz de Google sitemapDiagnóstico del sitemapEstadísticas Google sitemapEnlaces detectados por Google SitemapInformación acerca de mi sitemapHerramientas para webmaster
Publicación, Posicionamiento, Promoción, Marketing Online y Web 2.0
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 23/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
20
Google Analíticas
IntroducciónCreando una cuenta de analíticasPanel de analíticasUsuariosTrácoPáginas de destino y abandono
Trucos
Extensiones SEO QuakeFlash y la araña de búsqueda 1Flash y la araña de búsqueda 2Redirección 301 y página no encontrada 404
Redes sociales
IntroducciónCreación de cuenta en twitterCreación de BlogPersonalizar y crear entradas al blogCreación de Canal YoutubeCrear videos institucionales con sistema animoto
Google AdwordsIntroducciónCreación de cuenta en google adwordsPreparando el Landing Page para el google adwordsCreando nuestra primera campaña en google adwordsEvaluación de la campaña
Marketing On-Line One to One
Introducción
Inscripción a sistemas de envíos de boletines informativosCreación de lista de suscriptoresSubir listas de suscriptoresCrear un boletín informativo en Dreamweaver CS5.5 y CSS3Enviar boletines informativosReporte de nuestra campaña informativa
Publicación, Posicionamiento, Promoción, Marketing Online y Web 2.0
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 24/25
M a s t e r e n H T M L 5 ,
C S S 3 ,
J Q
u e r y ,
S o c i a l M e d i a y S
E O C
o n s u l t o r E s p e c i a
l i s t a
www.mgp-peru.com Area Diseño y Desarrollo de Aplicaciones Web y Moviles
21
Social Media Manager
Cómo obtener clientes en eventos localesCómo encontrar a tus primeros clientesCómo Vender Servicios a Empresas LocalesCómo Buscar Negocios LocalesCómo hacer branding personalCómo consultar ayuda sobre el tema de las redes socialesCómo hacer encuestas con las empresasCómo gestionar Facebook y YouTube semanalmenteCómo hacer planicación de vídeo marketingCómo Monitorizar la Reputación de la EmpresaCómo reservar nombres de usuarios para la empresaCómo crear presupuestos para dar servicio de social media
Facebook para Negocios
Introducción a las páginas de Facebook Cómo crear una página en Facebook Cómo personalizar la página de Facebook Cómo promocionar tu página de Facebook Cómo analizar las estadísticas de la página de Facebook Cómo analizar las estadísticas de la página de Facebook – parte IICómo generar tráco con el botón de me gustaCómo posicionar tu contenido en la página de inicio de Facebook
Cómo expandir tu network comercial en Facebook Cómo promocionar tus eventos en Facebook
YouTube para Negocios
Cómo utilizar YouTube para promocionar y mejorar la presencia de tuempresa en Internet.Cómo subir y optimizar los vídeos en YouTube de forma correcta y ecaz.Cómo combinar la aplicación de vídeo marketing con Social Media Marke-ting, a través de estrategias ecaces que implican compartir tus vídeos através de diversos canales como: Facebook, Twitter y en tu blog.
Cómo realizar la búsqueda de las palabras clave correctas para tu sector demercado de manera que las puedas utilizar de forma ecaz en relación contu vídeo.Técnicas avanzadas para aumentar el tráco de tus vídeos utilizando diferen-tes funcionalidades de YouTube.Ejemplos empresariales de éxito sobre cómo potenciar el uso de YouTube endiferentes sectores cómo turismo, pymes y para branding personal.Cómo analizar los resultados obtenidos con YouTube marketing e interpretarlas estadisticas que proporciona YouTube.Cómo sacar partido del editor de vídeo que proporciona YouTube.
Publicación, Posicionamiento, Promoción, Marketing Online y Web 2.0
5/12/2018 html5-css3 - slidepdf.com
http://slidepdf.com/reader/full/html5-css3-55a4d4fa0db30 25/25
MGP Nuevas ArtesCentro Especializado en Diseño y Desarrollo Web
Av. Conquistadores 146 San IsidroLima - Perú
Teléfonos: (511) 652.2242 / (511) 99.4126838 www.mgp-peru.com
Curricula Propuesta por
www.cursos-paginas-web.comLima - Perú
Teléfonos: (511) 99.3654170 / (511) 99.4011937