Este documento presenta la visión y misión del Instituto de Educación Superior Tecnológico Privado "TECNOTRONIC" de Computación e Informática. El documento también describe los pasos para maquetear una página web utilizando CSS externo, incluyendo la creación de diferentes divisiones para la cabecera, navegación, contenido, lista de enlaces y pie de página.

1. “Año de la diversificación productiva y del fortalecimiento de la educación”
INSTITUTO DE EDUCACIÓN SUPERIOR
TECNOLÓGICO PRIVADO
“TECNOTRONIC”
COMPUTACIÓN E INFORMÁTICA
UNIDAD DIDACTICA : DISSEÑO WEB
DOCENTE : HANCCO QUISPE, Elar E.
ESTUDIANTE : MAMANI QUISPE, Elizabeth.
CICLO ACADÉMICO : V
SEMESTRE : 2015 III
Juliaca - Puno – Perú.
2015

2. VISIÓN
En el 2018, El IESTP TECNOTRONIC es un Modelo Empresarial
Educativo de Excelencia Académica que lidera la
Educación Superior Tecnológica de la región sur del país.
MISIÓN
Formar profesionales competitivos en un ambiente de
Emprendimiento, Innovación, Eficiencia y Valores.

3. EJERCICIO 1:Maquete utilizando CSS externo.
Primero lo tenemos abierto el programa dreamweaver para así podertrabajar,
los pasos sonlos siguientes.
Paso N°1:abrimos nuevo HTML
PASO N° 2: Lo primero hacerlo la cabecera del cuadro para eso lo primero
ponemos el siguiente código
que es:
<style type="text/css">
Luego asemos los siguientes
códigos para la cabecera los
cuales son:
#cabecera{
background:#F03;

4. PASO N° 3: Ahora hacerlo el cuadro izquierdo (margen izquierdo) para ello
son los siguientes códigos.
PASO N° 4: Ahora hacerlo el cuadro centro (margen-centro) para ello sonlos
siguientes códigos.
Paso N° 5: Ahora hacerlo el cuadro derecho (margen-derecho) para ello son
los siguientes códigos.

5. Paso N° 6: Ahora hacerlo el cuadro donde ira del footer (parte de abajo) para
ello sonlos siguientes códigos.
Paso N° 7: Ahora cerrarlo el cogido del (style) para ello es el siguiente
código.
</style>
Paso N° 8: Ahora colocamos los siguientes códigos dentro de (body), para
finalizar el primer ejercicio.
<div id="cabecera"> HEADER</div>
<div id="margen-izquierdo"> NAVIGATION</div>
<div id="margen-centro"> CONTENT</div>
<div id="margen-derecho">LINKLIST</div>
<div id="footer">FOOTER</div>

6. </div>
</body>
</html>
Paso N° 9: El resultado del ejercicio N° 1 ejecutado en el navegador.