SILABO

I.-

GENERALIDADES:
1.1

Denominacin de la Asignatura : Taller Web Site

1.2

Fecha de aprobacin

: 10 / 02 / 2014

1.3

Aplicado en el periodo

: 2014 - I

1.4

Versin

:3

1.5

Autor

: Profesor Jos Morales

1.6

Programa

: Diseo Grfico

1.7

Carrera

: Diseo Grfico

1.8

Ciclo Acadmico

: SIDET DG - Titulacin

1.9

Total de horas semanales

: 05 horas

1.10 Duracin

II.-

: 19 semanas

SUMILLA:

El aumento del uso de Internet en el Per y el mundo, como principal medio de consulta de
informacin, productos y servicios, siendo adems el segundo medio o canal publicitario en
importancia gracias a su cobertura y fcil acceso, hacen imprescindible la participacin de
toda empresa que quiera estar ms cerca de sus clientes y de sus potenciales
consumidores.
Hoy los consumidores son mucho ms selectivos no slo en la bsqueda de calidad en el
producto, sino tambin en el servicio, en la forma como se le ofrece el mismo, y sobre todo,
la forma de acceder a l. Para un profesional en comunicaciones, es de suma importancia
disear y maquetar Sitios y Pginas Web, con gran atraccin visual y con alta funcionalidad
para el usuario. Qu mejores manos para la creacin de estos sitios web que las de un
Diseador Grfico, profesional que para cumplir con estos requerimientos constantemente
debe actualizar sus conocimientos en este campo de la especialidad, con lo ltimo en
aplicaciones y tecnologas; y que adems debe incluir estndares de funcionalidad y
optimizacin, reguladas por la entidad internacional W3C, encargada de velar por su mejor
uso y rendimiento.
El Taller Web Site del SIDET comprende la aplicacin de los aspectos terico-prcticos del
diseo web, para su aplicacin en la creacin de proyectos web que le permitirn al
alumno visualizar, comprender y aplicar los temas tratados en el curso en pginas que
cumplan con ser creativas, funcionales y que estn dentro del estndar actual, usando y
aplicando para ello las diversas herramientas del Diseo Web.

III.-

COMPETENCIAS:

El alumno aplica y desarrolla el diseo y maquetacin web, utilizando los conocimientos y

dominio terico-prctico de las herramientas de los Software de Diseo y Maquetacin
Web, cumpliendo responsablemente y con criterio los estndares y normas web
internacional.

IV.-

METODOLOGA:

Participacin individual y en grupo.

Exposiciones y demostraciones audiovisuales.
Prcticas calificadas.
Trabajos prcticos individuales.
Trabajos de investigacin.
Trabajos grupales

V.-

CALENDARIO:

SEMANA 1
Diseo y maquetacin web conceptos:
Manejo de las marcas off y online
Ecosistemas digitales
Frontend y Backend
La W3C y los estndares web
Sitios web, micrositios y landing page
Elementos del diseo web: contenido, apariencia y comportamiento
Creacin y edicin de sitios web
Estilos web: flat design, minimal design, scrolling, etc.
Evolucin de la web: la web semntica
Estructura html5
SEMANA 2
Estructuracin de un sitio web y propotipado:
Gestin del contenido, apariencia y comportamiento
Manejo de archivos y carpetas del sitio
Edicin y actualizacin del sitio.
Administracin del sitio web.
Mapa del sitio.
Prototipo web: wireframes y mockups
UX (Experiencia de usuario)
Usabilidad y navegabilidad web
Creacin de un mockup
SEMANA 3
Lenguaje html y estilos css:
Estructura de una caja y sus reglas css
Reglas y propiedades css.
Selectores css
Definicin de propiedades css
Compatibilidad de navegadores
Estructura bsica de una maquetacin semntica

SEMANA 4
Definicin de favicon y cursores personalizados. Barras de navegacin:
Qu es un favicon.
Caractersticas y creacin de un favicon
Tipos de cursores, formatos
Insercin de un cursor personalizado
Opciones para la creacin de cursores
Barras de navegacin:
Botoneras basadas en imgenes: rollovers
Listas a botoneras
Estilos css para botoneras
Botoneras animadas bsicas
SEMANA 5
Barra de navegacin avanzada:
Botoneras horizontales y verticales
Cambio y edicin de botoneras
Aplicacin de transiciones a botoneras.
Aplicacin de transformaciones a botoneras.
Botonera desplegable bsica
SEMANA 6
Barra de navegacin desplegables:
Tipos de botoneras desplegables.
Botonera desplegable css
Uso de spry Ajax para desplegables
Edicin de spry
Frameworks para mens deplegables
SEMANA 7:
Manejo de fondos, color y opacidad:
Tipos de fondos
Formatos y tamaos de imagen ptimos
Fondos adaptables
Fondos animados
Aplicacin de color a objetos
Los colores hexadecimales: cmo usarlos
Manejo del color y la opacidad del fondo
Opacidad de elementos
Infografa animada
SEMANA 8:
Creacin de un micrositio, maquetaciones semnticas.
Maquetaciones semnticas
Display, Mostrando los elementos de forma lineal o en bloque.
Modelo de caja, Control del tamao de una caja con las propiedades que
afectan al modelo de caja: margin, border y padding.
Position: el posicionamiento y el flujo de elementos.
Propiedades de elementos.
Trabajo Parcial: Elaboracin de un micrositio
SEMANA 9
Trabajar con formularios.
Diseo de formularios.

Creacin de formularios.
Ajuste de propiedades de formulario.
Las etiquetas fieldset y la leyenda.
Insercin de elementos de formulario.
SEMANA 10
Evaluaciones parciales.
SEMANA 11
Maquetaciones web.
Maquetaciones usando elementos con Posicionamiento Absoluto: PA
Etiquetas semnticas y Divs con PA
Insercin y anidacin de elementos PA
Edicin y ajustes de los PA
Desarrollo de una maquetacin PA
SEMANA 12
Transiciones y Animaciones
Transiciones, opciones y propiedades.
Compatibilidad de las transiciones
Animacin CSS opciones y propiedades
Definicin de las animaciones
Desarrollo de banner con animaciones
SEMANA 13
Selectores CSS avanzados.
Selectores universales
Selectores de atributo
Seleccin por el valor de atributo
Selectores de pseudo clases y pseudo elementos.
Selectores padre-hijos
Selectores compuestos
Aplicaciones para edicin de contenido, texto e imgenes
SEMANA 14
Introduccin a Web Responsive.
Qu es web responsive y web adatativa
Los viewports de los dispositivos
Tamaos de referencia
Los media queries
Uso y aplicacin de los media queries
Ajustando estilos segn el dispositivo
SEMANA 15
Diseo por cuadrcula fluida
Retculas fluidas: uso y definiciones
Uso de retculas fluidas para diseo adaptativo
Ajustando imgenes y contenidos a la retcula
Control de estilos y elementos bajo el modelo de cuadrcula fluida
Aplicacin de maquetacin con cuadrcula fluida
SEMANA 16
Modelo de maquetacin con caja flexible: Flex box model.

Concepto de cajas flexibles

Consideracin de elementos flexibles
Estilos CSS que se pueden definir y manejar
Propiedades CSS de las cajas flexibles
Aplicacin de cajas flexibles para contenido dinmico
Aplicacin de cajas flexibles para mens y maquetaciones
SEMANA 17
Evaluaciones Finales del curso.
SEMANA 18 y 19
Jurado Final.

VI.-

COMPETENCIAS
6.1

VII.-

Introduce al alumno en el desarrollo de aplicaciones web y en la

creacin de sitios web dinmicos, mediante el uso de lenguajes de
programacin orientado a objetos, potenciando y desarrollando su
razonamiento lgico estructural.
Conoce los fundamentos de la programacin orientada a objetos web.
Conoce y aplica los lenguajes de programacin para la creacin de
aplicaciones web.
Crea y desarrolla proyectos de aplicaciones web de mbito comercial,
empresarial y ldico.
Selecciona y aplica contenidos tcnicos y conceptuales de desarrollo
web para la realizacin de sus proyectos grficos.

EVALUACIN:
7.1.- El sistema de evaluacin ser constante y abarcara las siguientes
evaluaciones:
Evaluaciones de trabajo en taller/aula (procedimental) (E1): estarn
dadas por la realizacin de avances, ejercicios y /o prcticas en clase,
las mismas que tendrn una nota semanal.
Evaluaciones de trabajo en casa (E2): ser la presentacin de todas
las prcticas o trabajos planteados para ser realizadas o terminadas en
casa y presentndose en la fecha indicada por el profesor, se
considerara el orden, limpieza y puntualidad en la presentacin.
Evaluacin actitudinal (E3): Se calificar el comportamiento y
predisposicin al curso as como el compromiso y desarrollo en su
formacin profesional.
Para poder acceder a la aprobacin del curso el docente tomar en
cuenta la asistencia del alumno al 70% o ms de las clases
programadas.

La evaluacin de los alumnos, inherente al proceso de AprendizajeEnseanza es integral, continua y permanente. En la ponderacin de la
nota final se tomar en cuenta los siguientes criterios, de acuerdo al
sistema vigesimal:
PR
PC
IM
PPP

Prcticas
Participacin en clase y avances del proyecto
Trabajos de Investigacin Monogrfica (Reporte)
Proyecto de Prcticas Pre Profesionales (Informe)

VIII.- BIBLIOGRAFIA:
- Colin Moock. (2011) Actionscript 3.0, Madrid: Editorial Anaya Multimedia.
-

Sawyer McFarland, David (2009) Javascript, Madrid: Editorial Anaya

Multimedia.

Adobe Press. (2011) Actionscript 3.0 para Flash CS5 Professional, Madrid:
Editorial Anaya Multimedia.

David Chura (2011) Actionscript 3.0 Advance, Lima: Editorial Macro.

Bear Bibeault, Yehuda Katz (2011) Jquery 1.4, Madrid: Editorial Anaya.

William b. Sanders (2009) Diseo Con Javascript (Diseo Y Creatividad) ,

Madrid: Editorial Anaya Multimedia.

Lopez Quijado, Jose (2010) Domine Javascript. Madrid: Editorial RA MA

Ferrer Martnez, Juan (2012) Aplicaciones Web. Madrid: Editorial RA MA