Mastertutos Antarsays - César Esquivel

Vista previa del material en texto

Mastertutos Antarsays ~ Como aprovar el examen de programacion web y no 
morir en el intento...
Mastertutorials Antarsays ~ How to pass the web programming exam and not die 
in the attempt...
Part I ~ HTML
1.- Organize files and folders.
2.- HTML:5, add links and scripts.
3.- Define main classes:
div#container>header#header+div#slideshow+div#main+footer#footer
div#modal>div.popup>h2+p+button.cls
3.- Define the elements and classes required for the drop-down menu (Header).
4.- Define the elements and classes needed for the Slideshow.
5.-Define the elements and classes needed for the main content (Notice, Gallery, 
Banner, etc...)
6.- Define the elements and classes needed for the final footer (Logo, Copy, 
Address, Select - options, SNS, etc...)
8.- Design logo in photoshop
9.- Add the logo in HTML
10.-Add text for the drop-down menu
11.- Seleccionar y verificar el tamano de las imagenes para el Slideshow
12.- Agregar las imagenes y el texto al html
13.- Anadir el contenido al main menu (Notice, Gallery, Banner, etc...)
14.- Agregar el contenido al footer (logo grayscale, address, copy, menu, etc...)
15.- Crear los archivos “.CSS” y definir la estructura principales de nuestra 
pagina.
16.- Definir las medidas de las clases principales para dar estructura a la pagina
 
17.- Definir medidas y estilo para el primer logo (Header)
18.- Definir medidas y estilo para la barra de navegacion principal (Header)
19.- Definir medidas y estilo para la barra de navegacion secundaria (Header)
20.- Agregar al html un div class nav-bg y definir estilo al background del 
navegador
21.- Definir medidas y estilo de las imagenes del Slideshow
22.- Definir medidas y estilo del texto en las imagenes del Slideshow
22.- Definir las medidas y estilo de la seccion de Notice, Gallery y Banner
23.- Definir las medidas y estilo de la seccion de Notice
24.- Definir las medidas y estilo de la seccion de Notice
25.-Definir las medidas y estilo de la seccion de Gallery
26.- Modificar los iconos del Banner en photoshop
27.- Definir las medidas y estilo de la seccion del Banner
28.- Definir las clases para el Footer
29.- Definir las medias y estilo del logo_gray en el Footer (se puede copiar del 
logo del header)
30.- Definir las medias y estilo del Copy en el Footer
31.- Definir las medias y estilo del Site Select en el Footer
31.- Agregar el texto del popup al html (y definir formato)
32.- Definir las clases del popup en el Css
33.- Definir las medias y estilo del Popup
34.- Programar el JS para el menu desplegable
35.- Programar el JS para el Slideshow
36.- Programar el JS para el Popup
Important notes:
Programming the classes, ej: “div.site>select>option*4”
Ctrl + H ~ To replace text in html