lunes, 21 de enero de 2013

SALUDOS Y BIENVENIDA

Amigos bloggeros:
En este Blog usted encontrará algunos tips para personalizar los Blogs mediante plantillas, modificación de código HTML y uso de recursos de la Web 2.0 Esperamos compartir y al mismo tiempo aprender de ustedes, para mejorar el rendimiento y apariencia de nuestros Blogs.

Entonces a...bloggear.. se ha dicho Su amigo e Instructor,

Fernando Proaño

NOTA: Este BLOG es complemento didáctico del Blog principal en:
blogs-educativos.blogspot.com

TAREAS PRÓXIMA SEMANA

1) COMPLETAR SU BLOG PRINCIPAL CON LAS SIGUIENTE OPCIONES

a. PAGINA PRINCIPAL

b. CONTENIDO O PROGRAMA DEL CURSO (que usted dicta o podria dictar)

c. ACERCA DE MI

d. CONTENIDO TEORICO (CAPITULO 1)

e. EJERCICIOS (EJ USAR UN GADGET)

f. EVALUACIONES (EJ. PREGUNTAS Y RESPUESTAS O LINKS A EXTERNOS)
g. INVESTIGACIÓN
h. TRUCOS Y CONSEJOS (blogs / flash / sketchup)

2) COMPLETAR EL BLOG ALTERNO Y COMPARTIRLO AL PROFESOR, MEDIANTE UN LINKS DESDE EL BLOG PRINCIPAL

3) EN EL BLOG ALTERNO, CREAR LAS SIGUIENTES PAGINAS

a. SALUDO

b. GUIA BASICA DE HTML (propia)

c. EJEMPLO DE CODIGO HTML

4) CONTINUAR CON LA INVESTIGACIÓN DE FLASH Y SKETCHUP EN LO POSIBLE CON EL USO BASICO DE ESTAS HERRAMIENTAS Y PONER EJEMPLOS EN UNA PAGINA NUEVA DE SU BLOG PRINCIPAL ( FLASH / SKETCHUP)

NOTA: Los que envian comentarios, a mi Blog estan bien, solo indiquen donde estan los ejercicios sobre HTML.

PLAZO: VIERNES 25 ENERO 23H50

sábado, 19 de enero de 2013

EJEMPLO DOCUMENTO HTML

Mi primer titulo en la Web

BIENVENIDOS A LA UNIVERSIDAD CATOLICA SEDE AMBATO

PUCESA

Ambato 2013

Fernando Proaño

Instructor

... buen trabajo ....

CONSORCIO INTERNACIONAL

viernes, 18 de enero de 2013

INTRODUCCIÓN AL HTML

INTRODUCCIÓN

El lenguaje HTML es un estandard del Consorcio W3C (http://www.w3.org) , que permite programar las plantillas de los Blgos. La estructura básica de un documento en HTML es:

Document Type	`<HTML></HTML>`	(inicio y fin de un archivo HTML)
Title	`<TITLE></TITLE>`	(definición de un titulo o encabezado)
Header	`<HEAD></HEAD>`	(definición de una descripción )
Body	`<BODY></BODY>`	(cuerpo del documento)

HTML es el lenguaje oficial de la WWW (World Wide WEb). Es un lenguaje no propietaario y puede ser porcesado en una amplia gama de procesadores, desde editores basicos a herramientas complejas de autoría.
Cada instrucción o bloque esta enmarcada en "tags" como <h1> y </h1> , dentro del cual se editan instrucciones, textos, links, etc.
En el caso de paginas Web, los navegadores o browser (Ej. Mozilla Firefox), el HTML es el lenguaje de tipo texto para presentar las paginas Web. La mayoria de navegadores presentan una opción para visualziar el "código fuente" en formato HTML.
La información que vemos a diario en el Internet, son producidas "internamente" y de manera "invisible" al usuario en lenguaje HTML.

COMANDOS DE HTML ( TAGS)

TITULOS

<title>Aqui va el titulo de mi pagina </title>

El titulo debe ir al inicio del documento HTML

ENCABEZADOS Y PÁRRAFOS

Como en Word, en HTML se pueden crear hasta seis (6) tipos de estilos.

<h1>ENCABEZADO MAS IMPORTANTE O PRINCIPAL </h1>

<h2>MENOS IMPORTANTE </h2> .... y asi sucesivamente.

Para los párrafos, se usan los siguientes tags:

<p>Este es mi primer párrafo.</p> <p>Este es mi segundo párrafo.</p>

LAS IMAGENES EN EL DOCUMENTO HTML

Se pueden insertar imágenes en cualquier sitio del documento HTML con la instrucción:

<img src="peter.jpg" width="100" height="170">

Nombre del archivo: blog.jpg
ancho: 100 pixels
alto: 170 pixels
NOTA: La imagen debe estar guardada en el misma carpeta donde esta el documento Html

Se puede añadir un texto alteernativo con:

<img src="peter.jpg" width="100" height="170"
alt = " Introduccion a los Blogs >

VINCULOS O LINKS

Se utilizan los tags <a>, ejemplo:

<a href="calculos.html">Peter's page</a>. es un link a un archivo calculos que debe estar en el mismo directorio del documento HTML

<a href="http://www.w3.org/">W3C</a>.

Se puede crear un links desde un grafico con:

<a href="/"><img src="inicio.gif" alt="ir pagina de inicio"></a>

... a continuación por favor ingresar sus aportes de codigo HTML y el link a su Blog alterno

Buen trabajo...

EJEMPLO DE DOCUMENTO HTML

EJERCICIO
PASOS
1.- En el procesador WordPad escribimos el siguiente código:

<title>Mi primer titulo en la Web</title>
<h1>BIENVENIDOS A MI PAGINA HTML</h1>
<h2>PUCESA</h2>
<h3>Ambato 2013</h3>
<h4>Fernando Proaño </h4>
<h5>Instructor</h5>
<h6>... buen trabajo ....</h6>

2.- Guardamos en nuestro disco duro, como:

documento2.html

3.- Vamos al navegador y cargamos el archivo antes creado, el resultado debe ser: