Camilo diaz

  • View
    399

  • Download
    0

Embed Size (px)

DESCRIPTION

 

Text of Camilo diaz

Diapositiva 1

A HTML Y

Ing. Diego J. Arcusin

darcusin@cema.edu.ar

INTRODUCCION

JAVASCRIPT

1

Proveer al asistente de conceptos fundamentales que le permitan utilizar los lenguajes HTML y Javascript en sus proyectos informticos.

Internet y la WWW.

HTML.

Historia del HTML.

HTML CSS Javascript.

Elementos HTML.

Tipos

Atributos

Estructura

Contenedores

Tablas

Hipervnculos

Imgenes

Formularios

Estilos CSS.

Javascript.

El Futuro.

Conclusiones.

Internet

WWW. Sitios Web y pginas Web.

Otros objetos en la Web.

Cmo funciona?

HTML (Hypertext Markup Language)

HTML = Hypertext + MarkUp

Hypertext

Es texto ordinario al que se le incorporan funcionalidades adicionales como:

Formato,

Imgenes,

Multimedia

Y enlaces a otros documento.

MarkUp

Es el proceso de tomar el texto ordinario e incorporarle smbolos adicionales. Cada uno de estos smbolos identifica a un comando que le indica al navegador como mostrar ese texto.

El W3C (World Wide Web Consortiun) es un consorcio internacional donde Organizaciones miembro, Personal Full-time y el pblico en general trabajan para desarrollar Estndares Web.

La misin del W3C es la de maximizar el potencial de la WWW desarrollando protocolos y guas que aseguren el crecimiento futuro de la Web.

Algunas Organizaciones miembro del W3C

AdobeEricssonNokia

AppleGoogle, inc.Opera Software

AT&THPSun Microsystems

CiscoIBM CorporationTelefnica de Espaa

Citigroup MicrosoftYahoo, inc.

Deutsche TelekomMozilla FoundationVeriSign

Y decenas de universidades de todo el mundo

Pgina Web

Estructura

Prrafos

Encabezados

Listas

Tablas

Capas

Etc.

Contenido

Textos

Imgenes

Enlaces

Apariencia

Colores

Tipografas

Alineacin

Fondos

Tamaos

Etc.

Comportamiento

Efectos

Validaciones

Automatizacin

HTML

CSS

Javascript

Elementos HTML

Los elementos son los componentes fundamentales del HTML

Cuentan con 2 propiedades bsicas:

Atributos

Contenido

En general se conforman con una Etiqueta de Apertura y otra Cierre.

Los atributos se colocan dentro la etiqueta de apertura, y el contenido se coloca entre la etiqueta de apertura y la de cierre.

Elemento

Etiqueta de Apertura

Etiq. de Cierre

Contenido

Curso HTML CEMA

Nombre

Valor

Atributo

7

Objetivos del Curso

Proveer al asistente de conceptos fundamentales que le permitan utilizar los lenguajes HTML y Javascript en sus proyectos informticos.

8

Temas del Curso

Internet y la WWW.

HTML.

Historia del HTML.

HTML CSS Javascript.

Elementos HTML.

Tipos

Atributos

Estructura

Contenedores

Tablas

Hipervnculos

Imgenes

Formularios

Estilos CSS.

Javascript.

El Futuro.

Conclusiones.

9

Internet y la WWW

Internet

WWW. Sitios Web y pginas Web.

Otros objetos en la Web.

Cmo funciona?

10

HTML

HTML (Hypertext Markup Language)

HTML = Hypertext + MarkUp

Hypertext

Es texto ordinario al que se le incorporan funcionalidades adicionales como:

Formato,

Imgenes,

Multimedia

Y enlaces a otros documento.

MarkUp

Es el proceso de tomar el texto ordinario e incorporarle smbolos adicionales. Cada uno de estos smbolos identifica a un comando que le indica al navegador como mostrar ese texto.

11

Historia del HTML

En 1986 la organizacin internacional de Estndares publica el SGML (Standard Generalized Markup Language)

En 1990 Tim Berners-Lee crea la WWW y el HTML con base en un subconjunto del SGML.

En 1993 se crea el HTML 2.0 (o HTML+)

En 1995 el W3C (World Wide Web Consortium) define el HTML 3.0

El HTML 3.2 abandona las sugerencias del HTML 3.0 y adopta elementos desarrollados por Netscape. (Incorpora Tablas, Applets, Texto alrededor de imgenes)

En 1997 se define el estndar HTML 4.0

En 1999 aparece el estndar actual HTML 4.01

Ms informacin en: http://www.w3.org/

Tim Berners-Lee

Director del W3C

12

El W3C

El W3C (World Wide Web Consortiun) es un consorcio internacional donde Organizaciones miembro, Personal Full-time y el pblico en general trabajan para desarrollar Estndares Web.

La misin del W3C es la de maximizar el potencial de la WWW desarrollando protocolos y guas que aseguren el crecimiento futuro de la Web.

Algunas Organizaciones miembro del W3C

AdobeEricssonNokia

AppleGoogle, inc.Opera Software

AT&THPSun Microsystems

CiscoIBM CorporationTelefnica de Espaa

Citigroup MicrosoftYahoo, inc.

Deutsche TelekomMozilla FoundationVeriSign

Y decenas de universidades de todo el mundo

13

Elementos HTML

Los elementos son los componentes fundamentales del HTML

Cuentan con 2 propiedades bsicas:

Atributos

Contenido

En general se conforman con una Etiqueta de Apertura y otra Cierre.

Los atributos se colocan dentro la etiqueta de apertura, y el contenido se coloca entre la etiqueta de apertura y la de cierre.

Elemento

Etiqueta de Apertura

Etiq. de Cierre

Contenido

Curso HTML CEMA

Nombre

Valor

Atributo

14

Atributos

Los atributos de un elemento son pares de nombres y valores separados por un = que se encuentran dentro de la etiqueta de apertura de algn elemento. Los valores deben estar entre comillas.

Ejemplos:

Curso de HTML

Universidad del Cema

15

Tipos de Elementos

Algunos tipos de Elementos

Estructurales

Describen el propsito del texto y no denotan ningn formato especfico.

Por ejemplo:

Curso HTML

De Presentacion

Describen la apariencia del texto, independientemente de su funcin.

Por ejemplo:

Curso HTML

Los elementos de presentacin se encuentran obsoletos desde la aparicin del CSS.

De HiperTexto

Relaciona una parte del documento a otros documentos.

Por ejemplo:

Universidad del Cema

16

Estructura de un Documento HTML

Delimita el Documento HTML

Delimita el encabezado del Documento HTML

En general incluye los metadatos del documentos y Scripts.

Delimita el Cuerpo del Documento HTML.

Es donde se incluyen los contenidos visibles del documento.

Ejemplo

Aqu se incluyen os distintos elementos del encabezado

Aqu se incluyen los distintos elementos contenedores o scripts

17

Elementos del HEAD

Alguno de los elementos factibles de incluir en el HEAD son:

Define el ttulo del documento HTML

Se utiliza para incluir programas al documento. En general se tratan de Javascripts.

Especifica un estilo CSS para ser utilizado en el documento.

Permite especificar informacin de inters como: autor, fecha de publicacin, descripcin, palabras claves, etc.

18

Contenedores (Block-Level Elements)

Parrafos

Es el contenedor mas comn.

Su sintaxis es:

Encabezados

Indican una jerarqua de secciones dentro del documento

Su sintxis: , , ,.. ,

Listas

Listas de Definiciones (consistente de pares de trminos y definiciones)

Crea la lista

Crea un nuevo trmino

Crea una nueva definicin

Lista Ordenada Enumerada

Crea una nueva lista Crea un nuevo tem en la lista

Lista Ordenada No Enumerada

Crea una nueva lista Crea un nuevo tem en la lista

Capas

Permiten agrupar y diagramar contenidos en los documentos.

Su sintaxis es:

19

Contenedores (Tablas)

Crea la tabla

Crea una nueva fila

Crea una nueva celda dentro de la fila

Por ejemplo: Creacin de una tabla de 2 x 2

20

Tablas

Qu son y para qu sirven.

Atributos de las Tablas

Atributos de las Celdas y Filas

Prioridades en los formatos

Tablas anidadas

Tablas Irregulares (Atributos colspan y rowspan)

Anchos (Pixels Vs. Porcentajes)

21

Hipervnculos

Qu es un hipervnculo?

Ubicacin y rutas de documentos.

Rutas Absolutas

Rutas Relativas

Rutas relativas a la raz del sitio

Vnculos a otras pginas. Etiqueta .

Uso del atributo target (Destino).

Anclaje de nombre. Atributo name.

Comportamientos del Navegador ante distintos tipos de archivos enlazados.

22

Imgenes

Elemento

Qu imgenes se pueden usar?

Ventajas y desventajas de cada formato.

Imgenes e Hipervnculos

23

Formularios

Para qu sirven?

Elementos para Formularios

Campos de Texto

Casillas de Verificacin

Botones de opcin

Mens

Botones

Campos ocultos

Campos de carga de archivos

Cmo se enva la informacin?

Se pueden validar los Campos?

24

Formularios