Mostrando entradas con la etiqueta HTML. Mostrar todas las entradas
Mostrando entradas con la etiqueta HTML. Mostrar todas las entradas

Aprendiendo HTML, CSS y JavaScript

HTML: (Clase 1)
- Breve repaso de HTML.
- Estructura de un documento HTML.
- Formateado de texto.
- Links.
- Imagenes.
- Tablas.
- Formularios.

CSS: (Clases 2 y 3)
- Introduccion a CSS.
Proposito. Elementos y atributos. Sintaxis. Palabras reservadas. Propiedades. Etiquetas LINK y STYLE. Comentarios.
Mecanismos de colaboracion HTML-CSS: Propiedades STYLE, ID y CLASS. Etiquetas LINK y STYLE. Selectores: Sintaxis. Tipos de selectores: De atributos, de clase y de ID. Archivos CSS externos.
- Propiedades de texto:
- Colores, fondos y bordes:
- Propiedades de posicionamiento y visibilidad:


JAVASCRIPT: (Clases 4 y 5)
- Rudimentos del lenguaje.
- Mecanismos de colaboracion HTML-JavaScript:
- Etiqueta SCRIPT: Insercion en la pagina. Seleccion del lenguaje y de la version. Uso de archivos externos.
- Escritura de instrucciones, para la regulacion de eventos.
- Instrucciones: Propositos. Secuenciacion.
- Literales: Numeros. Textos. Booleanos.
- Salidas por pantalla: Ventana alert. Metodo document.write.
- Variables: Declaracion. Asignacion de valores.
- Entrada de datos: Ventanas prompt y confirm.
- Operadores y expresiones.
- Estructuras de decision y de repeticion: if. switch. for. while.
- Funciones internas

El Club de Programadores- Asociacion Civil, invita a participar del curso 'Aprendiendo HTML, CSS y JavaScript' que se dictara los dias Miercoles de 18.30 a 21.30 hs. a partir del 28 de Octubre de 2009, en Auditorio Congreso, Entre Rios 166

Curso 'Dreamweaver CS3 desde 0 con RSS y Spry

Curso 'Dreamweaver CS3 desde 0 con RSS y Spry'
los dias Martes de 18.30 a 21.30 hs. a partir del 12 de Mayo de 2009, en Laboratorio Congreso, Entre Rios 166

Al finalizar el curso, el alumno debera ser capaz de planificar, disenar graficamente y desarrollar sitios Web comerciales, aplicando RSS que son archivos que contienen informacion de una pagina Web con las ultimas actualizaciones que se han hecho en ella, tambien aprendera a incluir elementos dinamicos en las paginas HTML. Por ejemplo se pueden incluir acordeones, barras de menus, validacion de formularios, acceso a datos XML, etc.

Requisitos: No es necesario que se posea ningun conocimiento especifico previo del tema.Ç

1- Temario a desarrollar

.. Conceptos basicos de Dreamweaver
o Que es Dreamweaver
o HTML basico
o Novedades de Dreamweaver CS3
o Editar paginas Web
o Como tener una pagina en Internet
o Arrancar y cerrar Dreamweaver
o Abrir y guardar documentos
o Mi primera pagina

.. El entorno de trabajo
o La pantalla inicial
o Las barras
o Los paneles e inspectores
o Personalizar el area de trabajo
o Vistas de un documento

.. Configuracion de un sitio local
o Introduccion
o Crear o editar un sitio Web sin conexion a Internet
o Vistas del sitio
o Subir archivos al servidor
o Comprobar tamano para optimizar la carga
o Propiedades del documento
o Los colores

.. El texto
o Caracteristicas del texto
o Listas
o Caracteres especiales
o Estilos CSS. Introduccion

.. Hiperenlaces
o Introduccion
o Tipos de enlaces
o Crear enlaces
o Personalizar nuevos enlaces
o Destino del enlace
o Formato del enlace
o Enlace a correo electronico
o Vinculos rotos

.. Imagenes
o Introduccion
o Tipos de imagenes para una Web
o Insertar una imagen
o Cambiar el tamano de una imagen
o Mapas de imagen
o Imagen de sustitucion. Rollover
o Botones Flash
o Texto Flash
o Barra de navegacion

.. Tablas
o Introduccion
o Insertar una tabla
o Rellenar las celdas
o Seleccionar elementos de una tabla
o Formato de tabla
o Cambiar tamano de tabla y celdas
o Anadir y eliminar filas y columnas
o Anidar, dividir y combinar celdas
o Modos de tabla
o Adaptar Webs a distintas resoluciones

.. Formularios
o Introduccion
o Elementos de formulario
o Crear formularios
o Validar formularios

.. Multimedia
o Peliculas Flash
o Sonido
o Videos

.. Las plantillas
o Introduccion
o Crear plantillas
o Establecer regiones editables en una plantilla
o Basar paginas en una plantilla

.. Otros elementos
o Marquesinas
o Fecha
o Regla horizontal
o Codigo de otras paginas

.. Capas
o Introduccion
o Insertar una capa
o Formato de una capa

.. Comportamientos
o Introduccion
o Insertar un comportamiento
o Mostrar-Ocultar capas

.. Comportamientos Avanzados
o Mensajes Emergentes
o Texto de la Barra de Estado
o Carga Previa de Imagenes
o Abrir una Ventana del Navegador
o Comprobar Navegador
o Comprobar Plug-ins
o Menus de Salto
o Menus Emergentes

.. Sitios Remotos
o Configurar un Sitio Remoto
o El Panel Archivos

.. XML y RSS
o Introduccion
o Importar datos de un Archivo Externo
o Trabajar con elementos XML
o Crear Repeticiones
o Ordenar elementos
o Sentencias condicionales
o Insertar un fragmento XSLT
o Paso de parametros

.. Acceso a datos con Spry
o Introduccion
o Conjunto de datos XML
o Crear una Region de Spry
o Repeticion de Elementos
o Listas de Repeticion
o Tablas de Datos
o Mostrar Maestro/Detalle

.. Spry y Formularios
o Introduccion
o Validacion de Campos de Texto
o Estados de Validacion
o Validacion de Campos Desplegables
o Casillas de Verificacion
o Areas de Texto

.. Controles Spry Avanzados
o Introduccion
o Barra de menus
o Navegacion por Fichas
o Control Acordeon
o Panel con Contraccion
o Cambiar Estilos CSS

Adobe AIR 1.5

Adobe AIR 1.5 es un componente clave de la Plataforma Adobe Flash, que permite que los desarrolladores Web usen HTML, JavaScript, ActionScript y el marco de trabajo de fuente abierta Flex para entregar aplicaciones web fuera del explorador.

La plataforma para desarrollo de aplicaciones de Adobe también cuenta con funcionalidades incluidas en Adobe Flash Player 10, como soporte para filtros y efectos personalizados, transformación y animación 3D nativa y diagramación de texto rico extensible.

Además, Adobe AIR 1.5 incorpora el motor de fuente abierta WebKit HTML, acelera el funcionamiento de la aplicación con “SquirrelFish”, el nuevo intérprete de WebKit JavaScript, e integra una base de datos encriptada que cumple con los requisitos de seguridad empresarial al tiempo que almacena datos de manera más segura en las computadoras de los clientes.

CSS: Selector de Tipo Etiqueta

Se aplica a los elementos HTML que coinciden con esa etiqueta.
Simplemente se coloca el nombre y entre llaves la propiedad y el valor o los conjuntos de propiedad valor sin son varios

h1 {
margin: 0 0 0.5em;
font-size: 1.8em;
line-height: 1.2;
}
Los selectores se pueden separar por comas y unificar diferentes etiquetas

h1,h2,p {
margin: 0 0 0.5em;
font-size: 1.8em;
line-height: 1.2;
}
En


En la practica conviene agrupar distintas etiquetas con propiedades comunes y luego hacer las propiedades especificas para cada uno.

Por ejemplo:
h1, h2, h3 {
color: #8A8E27;
font-weight: normal;
font-family: Arial, Helvetica, sans-serif;
}

h1 { font-size: 2em; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.2em; }

Que es CSS?

CSS (Cascade Stylee Sheet) es un lenguaje de hojas de estilos creado para controlar la presentación de los documentos electrónicos definidos con HTML y XHTML (paginas web).

CSS separa los contenidos y su presentación

Ventajas:
  1. Obliga a crear documentos HTML/XHTML bien definidos y con significado completo
  2. Mejora la accesibilidad del documento
  3. Reduce la complejidad de su mantenimiento
  4. Permite visualizar el mismo documento en infinidad de dispositivos diferentes

HTML/XHTML se utiliza para marcar los contenidos (para designar lo que es un párrafo, lo que es un titular o lo que es una lista de elementos)

CSS se utiliza para definir el aspecto de todos los contenidos, es decir, el color, tamaño y tipo de letra de los párrafos de texto, la separación entre titulares y párrafos, la tabulación con la que se muestran los elementos de una lista, etc.

Herramientas para programar HTML

Que herramientas o programas necesitamos para programar HTML se preguntara...

Respuesta: Ninguna herramienta es espacial. Cualquier editor de texto simple como el Bloc de Notas de Windows (Notepad) servira ya que el HTML es texto puro, no necesita compilarse ni agregarse nada especial.

Siemplemente escribimos el codigo en el Bloc de Notas y lo guardamos con la extension HTM o HTML y listo.
mas info en http://curso-html.blogspot.com

Curso de HTML

Un curso HTMl dictado por un destacdo profesional Universitario comenzo en CURSO-HTML.BLOGSPOT.COM

Sin duda un curso para aprovechat todos aquellos que se inician en la programacion Web

Aprender HTML - XHTML

HTML, XHTML, diferencias notables y como crearlos



Existe un mundo de diferencias entre HTML y XHTML, pero actualmente es complicado explicarlas todas. Para empezar una gran diferencia es la necesidad de usar minúsculas en todas las etiquetas con XHTML. La siguiente diferencia es la desaparición de algunas etiquetas y el reajuste de otras


El código es mucho más limpio y legible, por lo que aparte de que el W3C, aprueba el XHTML y da por extinguido el HTML, será mucho más fácil la programación de una pagina.

A continuación muestro como crear una página de XHTML, y explico en que consiste este código.





Por fin me entero que es todo este royo




  • Mi nombre es Ignacio Santos




Explicación del codigo:
  • DOCTYPE: es la manera en que el W3C indica, deben comenzar todos los documentos XHTML, sirve para que tanto el servidor como el explorador que usemos, sepan que clase de documento es.
  • Html PUBLIC: Este documento es publico
  • W3C: Es quién gestiona el documento, quien lo aprueba (digamos que es el patrocinador)
  • DTD XHTML 1.0 Transitional: Viene a decirnos que versión y tecnología utilizamos.
  • EN: Idioma (English), ingles.
  • http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd: Documento que explica diferencias y mejoras con el HTML 4.0, que era la versión utilizada hasta ahora.
  • : Forma de comienzo de una página XHTML, el enlace lleva a la explicación del W3C, de en que consiste una página XHTML.
  • , sirve para ponerle un titulo a la página como veis el titulo de la página que estamos estudiando es: “Por fin me entero que es todo este royo” : Encabezado ya lo dice la palabra, dentro del encabezado encontramos los “meta”, que se explicaran mas adelante. También encontramos la etiqueta
  • fin del encabezado
  • Cuerpo de la página, en esta zona irá todo el contenido de la página, como veis en esta página aparece “Mi nombre es Ignacio Santos”.
  • : Fin del cuerpo de la página. A partir de aquí no se mostrará nada de lo que pongamos en la pagina.
  • : Fin del documento, es el cierre (Viene a decir hemos terminado).


Todo esto es una página Web, con lo que todo el mundo puede hacerse una propia, una pagina estática en XHTML, no tiene porque ser algo que venda, puede ser un diario (blogs), un sitio donde colgar fotografías de tus amigos y tuyas, un libro de cocina, etc…

Tiene un gran abanico de posibilidades que quedan en la mente de cada diseñador / programador.

Ver ejemplo en funcionamiento

Autor: Ignacio Santos
Escrito para: http://www.webspacesite.com

Fuente: Articulo.org