Lenguaje de Presentacin: SintaxisEquipo 318/03/1519/03/2015Lenguaje de presentacin: SintaxisEsta plantilla se puede usar como archivo de inicio para proporcionar actualizaciones de los hitos del proyecto.

SeccionesPara agregar secciones, haga clic con el botn secundario del mouse en una diapositiva. Las secciones pueden ayudarle a organizar las diapositivas o a facilitar la colaboracin entre varios autores.

NotasUse la seccin Notas para las notas de entrega o para proporcionar detalles adicionales al pblico. Vea las notas en la vista Presentacin durante la presentacin. Tenga en cuenta el tamao de la fuente (es importante para la accesibilidad, visibilidad, grabacin en vdeo y produccin en lnea)

Colores coordinados Preste especial atencin a los grficos, diagramas y cuadros de texto. Tenga en cuenta que los asistentes imprimirn en blanco y negro o escala de grises. Ejecute una prueba de impresin para asegurarse de que los colores son los correctos cuando se imprime en blanco y negro puros y escala de grises.

Grficos y tablasEn breve: si es posible, use colores y estilos uniformes y que no distraigan.Etiquete todos los grficos y tablas.

1

ISC 2010/01Febrero de 2015Programacin WebCARRERA:Ingeniera en Sistemas ComputacionalesFECHA19 de Marzo del 2015PRESENTA:Carlos Concepcin Merln CruzKaren Amaro CastilloWendy de Jess Ronquillo HerreraCarlos Gregorio Guzmn GalnDaniel Tello Cruzngel Ortiz Salinas8 Semestre Grupo ADOCENTE:L.I. Mara de Los ngeles Martnez Morales S.E.P. D.G.E.S.T. S.N.E.S.T.

INSTITUTO TECNOLGICO de Tuxtepec

IntroduccinActualmente los lenguajes de presentacin y su sintaxis son utilizados para: desarrollar contenidos interactivos para la webdependiendo del medio y del contenido que se desea desarrollar, la sintaxis puede cambiar en pequeas instrucciones pues los medios de renderizado y/o compilacin cambian.19/03/2015Lenguaje de presentacin: Sintaxis3

Sobre qu es el proyecto ?Defina el objetivo del proyectoEs similar a otros proyectos anteriores o es nuevo?Defina el mbito del proyectoEs un proyecto independiente o est relacionado con otros proyectos?

* Tenga en cuenta que no se necesita esta diapositiva para las reuniones semanales

3Cmo funciona un lenguaje de presentacin?Funciona por medio de reglas especificas las cuales presentan un soporte adecuado para la correcta interpretacin y estructuracin de un documento en el que se exprese la informacin necesaria solicitada. En este lenguajes se expresan los atributos de los elementos de tal forma que se definen los diseos y contenidos, por ejemplo:MrgenesTipo de ttulosColor de fondo Tipo de letra Etc19/03/2015Lenguaje de presentacin: Sintaxis4

* Si alguno de estos problema causaron una demora en el programa o se deben analizar en profundidad, coloque los detalles en la siguiente diapositiva.

4Cmo funciona un lenguaje de presentacin?Actualmente en el mundo de la web debido a la evolucin del mundo electrnico y de comunicacin hacen falta lenguajes de presentacin con la finalidad de sealar elementos, estos funcionan en estructuras de programacin como los navegadores web, la importancia de los lenguajes es para que los elementos web se muestren correctamente, los lenguajes mas utilizados son:XHTML para el marcado CSS para la presentacin 19/03/2015Lenguaje de presentacin: Sintaxis5

Si hay ms de un problema, duplique esta diapositiva tantas veces como sea necesario.sta y las diapositivas relacionadas se pueden colocar en el apndice u ocultarlas si fuera necesario.5Presentacin19/03/2015Lenguaje de presentacin: Sintaxis6

SintaxisCuando se habla de la sintaxis de un lenguaje se trata de un elemento que se le conoce como etiqueta, la cual alberga instrucciones especificas del lenguaje de programacin, estas sealizaciones se determinan encapsulando las palabras reservadas entre un smbolo de mayor y uno de menor que se ubican al principio y al final de la palabra respectivamente. 19/03/2015Lenguaje de presentacin: Sintaxis7

SintaxisLas etiquetas funcionan para instrucciones como:Letras cursivas, negritas, subrayadas Alineacin del textoSalto de lneaSalto de prrafoInsercin de nombre de pagina (ttulo)Inicio y final del cuerpo del documento Etc

19/03/2015Lenguaje de presentacin: Sintaxis8

SintaxisLa etiqueta presenta frecuentemente dos partes: Una apertura de forma general Un cierre de tipo Todo lo incluido en el interior de esa etiqueta sufrir las modificaciones que caracterizan a esta etiqueta. As por ejemplo: Las etiquetas y definen un texto en negrita. Si en nuestro documento HTML escribimos una frase con el siguiente cdigo: Esto est en negrita

19/03/2015Lenguaje de presentacin: Sintaxis9

SintaxisEl resultado Ser: Esto est en negrita Las etiquetas y definen un prrafo. Si en nuestro documento HTML escribiramos: Hola, estamos en el prrafo 1 Ahora hemos cambiado de prrafo El resultado sera: Hola, estamos en el prrafo 1 Ahora hemos cambiado de prrafo

19/03/2015Lenguaje de presentacin: Sintaxis10

SelectoresLos selectores son los encargados de identificar los elementos dentro de un sitio web para poder identificar sus atributos y/o propiedades, o elementos pueden ser, texto, imagen, video, animacin, etc. 19/03/2015Lenguaje de presentacin: Sintaxis11

SelectoresLos selectores en su variedad comprenden del nombre de las etiquetas utilizadas dentro de los documentos HTML, por ejemplo; Body PCode Table UlEtc 19/03/2015Lenguaje de presentacin: Sintaxis12

Css (Cascading Style Sheets)CSS permite separar los contenidos de la pgina y la informacin sobre su aspecto.Utilizando CSS, se pueden establecer los mismos estilos con menos esfuerzo y sinensuciarel cdigo HTML de los contenidos con etiquetas.19/03/2015Lenguaje de presentacin: Sintaxis13Css (Cascading Style Sheets)Para qu sirve CSS? Permite elegir el color de tu texto. Permite seleccionar el tipo de letra utilizado en tu sitio. Establece el tamao, bordes, fondo ... Adems, puede hacer el diseo un sitio. Se le puede decir: quiero que mi men est a la izquierda y ocupe una anchura tal que la cabecera de mi sitio siempre sea visible, etc. 19/03/2015Lenguaje de presentacin: Sintaxis14

Css (Cascading Style Sheets)Glosario bsicoCSS define una serie de trminos que permiten describir cada una de las partes que componen los estilos CSS. El siguiente esquema muestra las partes que forman un estilo CSS muy bsico:

19/03/2015Lenguaje de presentacin: Sintaxis15

Css (Cascading Style Sheets)Los diferentes trminos se definen a continuacin: Regla: cada uno de los estilos que componen una hoja de estilos CSS. Cada regla est compuesta de una parte de"selectores", un smbolo de"llave de apertura"({), otra parte denominada"declaracin"y por ltimo, un smbolo de"llave de cierre"(}). Selector: indica el elemento o elementos HTML a los que se aplica la regla CSS. Declaracin: especifica los estilos que se aplican a los elementos. Est compuesta por una o ms propiedades CSS.

19/03/2015Lenguaje de presentacin: Sintaxis16Css (Cascading Style Sheets) Propiedad: caracterstica que se modifica en el elemento seleccionado, como por ejemplo su tamao de letra, su color de fondo, etc. Valor: establece el nuevo valor de la caracterstica modificada en el elemento.Un archivo CSS puede contener un nmero ilimitado de reglas CSS, cada regla se puede aplicar a varios selectores diferentes y cada declaracin puede incluir tantos pares propiedad/valor como se desee.

19/03/2015Lenguaje de presentacin: Sintaxis17CSS: soporte de los navegadoresAl igual que HTML, CSS ha evolucionado. Ha habido cuatro versiones principales de CSS: CSS 1 CSS 2.0 CSS 2.1 CSS 319/03/2015Lenguaje de presentacin: Sintaxis18

19/03/2015Lenguaje de presentacin: Sintaxis19

Dnde se escribe el cdigo CSS? Se tienes que elegir una opcin, porque se puede escribir cdigo en CSS en tres lugares diferentes:Forma 1: en un archivo con extensin css (el mtodo ms recomendado).Forma 2: en la cabecera del archivo HTML.Forma 3: directamente en las etiquetas del archivo HTML a travs de un atributo de estilo (el mtodo menos recomendable).

19/03/2015Lenguaje de presentacin: Sintaxis20

Forma 1

Primera prueba de CSS

Mi supersitioBienvenidos!Por el momento est casi vaco.Tenpaciencia!

estilo.cssp { color: blue } Este cdigo se crea en un archivo separado junto a los html19/03/2015Lenguaje de presentacin: Sintaxis21

Forma 2

p{color: blue}

Prueba de CSS

Mi supersitioBienvenidos!Por el momento est casi vaco.Tenpaciencia!

El cdigo se integra en el mismo html pero en la parte del encabezado19/03/2015Lenguaje de presentacin: Sintaxis22

Forma 3

Prrueba de CSS

Mi supersitio

Bienvenidos!Por el momento est casi vaco.Tenpaciencia!

Aqu podemos ver que el cdigo css se integra directamente en la etiqueta19/03/2015Lenguaje de presentacin: Sintaxis23

23ConclusinPara que una pagina Web funcione sin colapsar, es necesario contar con una buena arquitectura de elementos y ubicacin de informacin, pues depende de varias herramientas que al momento de su ejecucin pueden mejorar el funcionamiento del servicio que se ofrece a los usuarios.19/03/2015Lenguaje de presentacin: Sintaxis24

24