Scribd Logo
Încărcați

Bine ați venit la Scribd!

  • Tema 1

    Încărcat de

    pocho1982
    27 vizualizări12 pagini

    Titlu original

    Tema1

    Drepturi de autor

    © Attribution Non-Commercial (BY-NC)

    Formate disponibile

    PDF, TXT sau citiți online pe Scribd

    Vi se pare util acest document?

    Este necorespunzător acest conținut?

    Raportați acest document

    Drepturi de autor:

    Attribution Non-Commercial (BY-NC)
    Descărcați ca PDF, TXT sau citiți online pe Scribd
    Indicator pentru conținut neadecvat
    27 vizualizări12 pagini

    Tema 1

    Încărcat de

    pocho1982

    Drepturi de autor:

    Attribution Non-Commercial (BY-NC)
    Descărcați ca PDF, TXT sau citiți online pe Scribd
    Indicator pentru conținut neadecvat
    din 12

    Definicin de Lenguaje de Marcas

    Son aquellos que combinan la informacin (texto, imgenes, sonido,etc) con marcas (etiquetas) que indican la estructura del texto o la forma de representarlo. <etiqueta de apertura> contenido</etiqueta de cierre> En Html <h1>hola</h1> En Xml <telefono> 111111111</telefono> Siendo las etiquetas h1 y telefono Siendo el contenido hola y 111111111 Otro concepto son los atributos se encuentran dentro de la etiqueta de inicio e indica las propiedades que pueden llevar asociadas las etiquetas. <etiqueta de apertura atributo1=valor1 atributo2=valor2..> contenido </etiqueta de cierre> A todo se llama elemento, es decir representan estructuras mediante las que se organizar el contenido del documento o acciones que desencadenan cuando el programa navegador interpreta el documento En Html <body bgcolor=yellow >contenido</body> En Xml <telefono tipo=fijo> 111111111</telefono> Siendo los atributos bgcolor y tipo

    Tipos de Lenguajes en el desarrollo de Software


    Existen bsicamente dos tipos de lenguajes de desarrollo: Lenguajes Interpretados: Se conoce como lenguaje interpretado a un lenguaje de programacin que fue diseado para ser ejecutado por medio de un intrprete, en contraste con los lenguajes compilados. Tambin se les conoce como lenguajes de script. Pagina web Hojas de estilos html. JavaScript - html. - Son ficheros de cdigo que dan estilo a las etiquetas - Es un lenguaje interpretado orientado a las pginas web, con una sintaxis semejante a la del lenguaje Java.

    Lenguajes compilados: Un lenguaje compilado es trmino un tanto impreciso para referirse a un lenguaje de programacin que tpicamente se implementa mediante un compilador. Esto implica que una vez escrito el programa, ste se traduce a partir de

    Roco Manso Gil

    Pgina 1 de 12

    su cdigo fuente por medio de un compilador en un archivo ejecutable para una determinada plataforma (por ejemplo Solaris para Sparc, Windows para Intel, etc.). Diferencias? Los lenguajes compilados son lenguajes de alto nivel en los que las instrucciones se traducen del lenguaje utilizado a cdigo mquina para una ejecucin rpida. Por el contrario un lenguaje interpretado es aquel en el que las instrucciones se traducen o interpretan una a una siendo tpicamente unas 10 veces ms lentos que los programas compilados.

    Nuestros lenguajes de marcas necesitan un intrprete y es cualquier navegador (Explorer, Firefox, Crome) Es diferente los lenguajes de programacin que los lenguajes de marcas, stos no tienen funciones, variables, etc Los lenguajes de programacin se pueden dividir: Sirven para crear una aplicacin: C++, Java Asociales al desarrollo web: JavaSript (del lado del cliente, quiere decir que el intrprete est en tu mquina, en nuestro caso en el navegador) Php (del lado del servidor), tiene que ser el servidor que llama al compilador de php que est alli y desde el servidor lo realice.

    Organizaciones desarrolladoras
    Podemos definir la normalizacin como el proceso de especificacin de normas, para garantizar el correcto funcionamiento de elementos construidos de forma independiente. Para la definicin de estas normas existen organismos internacionales, nacionales incluso organizaciones privadas.. Las organizaciones ms importantes son: ISO, W3C y Open Source Organizacin Internacional para la Estandarizacin (ISO), es el organismo encargado de promover el desarrollo de normas internacionales de fabricacin, comercio y comunicacin . Su funcin principal es la de buscar la estandarizacin de normas de productos y seguridad para las empresas u organizaciones a nivel internacional. No se gubernamental, por tanto no tiene autoridad para imponer sus normas a ningn pas. El contenido de los estndares est protegido por derechos de copyright y para acceder a ellos el pblico en general ha de comprar cada documento. World Wide Web Consortium (W3C) Su funcin principal es tutelar y el crecimiento y organizacin de la web. Su primer trabajo fue normalizar el lenguaje HTML, el lenguaje de marcas con el que se escriben las pginas web. Al crecer el uso de la web, crecieron las presiones para ampliar el HTML. EL W3C decidi que la solucin no era ampliar el HTML, sino crear una reglas para que cualquiera pudiera crear lenguajes de marcas adecuados a sus necesidades, pero manteniendo unas estructuras y sintaxis comunes que permitieran compatibilizarlos y tratarlos con las mismas herramientas . Este conjunto de reglas es el XML, cuya primera versin se public en 1998 http://validator.w3.org (elegir la opcin validate_by_upload) Open Source

    Roco Manso Gil

    Pgina 2 de 12

    SGML

    HTML

    XML

    XHTML

    Surgi primero el lenguaje de marcas SGML (dcada de los 60) el cual era complejo de construir , surgi luego HTM (finales de los 80)que se basaba en algunos principios de SGML, que se caracterizaba por la sencillez de su programacin pero de pocas normas (era igual cerrar que no cerrar un etiqueta) A mediados de los 90 el consorcio W3C comenz una iniciativa para intentar dotar a la web de un lenguaje ms potente y que pudiera dar una estructura semntica a la misma. Para ello marcaron el objetivo de crear un nuevo lenguaje de marcas basado en SGML y que fuera sencillo como HTML , surgiendo en el 1998 XML XML estableci una nueva normalizacin para HTML dando lugar a XHTML, lo que constituye hoy en da el esqueleto de cualquier documento web Los navegadores actuales aun son compatibles con HTML4.0 aunque puede que no funcionen igual en todos los navegadores o que las versiones nuevas dejen de soportar HTML puro y duro, obligando a los programadores a hacer en XHTML

    XHTML HTML
    Necesitamos: Un editor de texto plano (bloc de notas, notepad (http://notepad-plus-plus.org/), etc) La extensin de todo fichero es .htm .html Un navegador

    Estructura del documento <! Declaracion de Tipo de Documento> <html> <head> <title> Titulo de la pgina </title> Elementos opcionales de la cabecera </head>
    Roco Manso Gil Pgina 3 de 12

    <body> Contenido del cuerpo </body> </html>


    Tanto la declaracin de tipo de documento, como las etiquetas html, head y body son opcionales, pero deben incluirse para que el documento sea correcto y legible. La declaracin del tipo de documento (DTD) es un conjunto de reglas que comprueban si el documento con el que trabajamos es correcto. Al indicar la DTD al principio del documento le decimos al navegador cmo interpretar adecuadamente el cdigo. Existen tres posibilidades: estricta, de transicin y con marcos Cabecera <head> </head> Lo que va entre <head> y </head> (cabecera) determina el comportamiento general de la pgina en relacin al navegador, servidor y buscadores El contenido de titulo es lo que aparece en la barra de ttulo, es importante el nombre para que los buscadores la localicen y debe ir lo primero en la cabecera. El resto de elementos de la cabecera se pueden considerar en tres grupos: -Metainformacin: intrucciones que definen aspectos claves del documento <meta> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> Solo aparecen caracteres del alfabeto ingls <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> Aparecen caracteres en espaol, como la , los acentos, etc -Referencias a archivos externos: se emplean para cargar, junto a nuestro documento, archivos que definen por ejemplo el aspecto final de la pgina, un css <link rel=stylesheet type=text/css href=fichero.css/> -Scripts en el lado del cliente <script languaje=javascript> Cuerpo <body> </body> Va el contenido de la pgina

    Plantilla en XHTML
    DTD Strict dar un error cualquier regla que se infrinja <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Nuevo documento</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> Roco Manso Gil Pgina 4 de 12

    </head> <body> </body> </html> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" se usa para indicarle al navegador que el documento debe validarse conforme a un archivo de definicin DTD para xhtml xmlns="http://www.w3.org/1999/xhtml se emplea para definir el espacio de nombres, es decir en XML permite indicar cada etiqueta a qu lenguaje pertenece, ya que pueden en un mismo documento confluir etiquetas de diferentes lenguajes DTD Transitional, si se incumple ciertas reglas hace la vista gorda <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Nuevo documento</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head> <body> </body> </html> DTD frameset cuando nuestra pgina sea una estructura de marcos. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- frameset.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Nuevo documento</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head> <body> </body> </html>

    Plantilla en HTML 4.01


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html > <head> <title>Nuevo documento</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> Roco Manso Gil Pgina 5 de 12

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> </head> <body> </body> </html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html > <head> <title>Nuevo documento</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> </head> <body> </body> </html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html > <head> <title>Nuevo documento</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> </head> <body> </body> </html>

    Plantilla en HTML 5
    <!DOCTYPE html> <html lang="es"> <head> <title>Html5</title> <meta charset="iso-8859-1"/> </head> <body> contenido.. </body> </html> Roco Manso Gil Pgina 6 de 12

    <!DOCTYPE html> <html lang="es"> <head> <title>Html5</title> <meta charset="iso-8859-1"/> </head> <body> contenido.. </body> </html>

    Sintaxis del lenguaje XHTML


    Norma nmero 1: Hay que hacer una declaracin del tipo de documento (doctype) En HTML tambin se puede hacer pero no es obligatorio. En XHTML es obligatorio. Al comienzo del documento por encima de la etiqueta <html> hay que escribir la siguiente declaracin:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/ xhtml1-transitional.dtd">

    A propsito, hacemos una simplificacin. Nos quedamos con el tipo Transitional. Hay otros dos tipos, el estricto y el frameset. Es importante escribir el texto de la declaracin tal cual est respetando maysculas y minsculas. Norma nmero 2: La etiqueta <html> debe llevar el namespace declarado en el atributo xmlns. El siguiente texto:
    <html xmlns="http://www.w3.org/1999/xhtml">

    Norma nmero 3: Todas las etiquetas (exceptuando la declaracin, norma 1) y sus atributos, tienen que escribirse con letras minsculas. En HTML se pueden escribir con maysculas o minsculas. En XHTML todas deben ser minsculas. Norma nmero 4: La etiqueta <head> (y por supuesto la <body>) son absolutamente obligatorias. En HTML si no ponamos la <head> no pasaba nada... Norma nmero 5: La anidacin de las etiquetas y sus cierres debe hacerse respetando las simetras correspondientes: Lo que primero se abre, se cierra lo ltimo. Por ejemplo:
    <p> Marcar con <b> negrita <u> subrayado y <i> cursiva</i></u></b></p>

    Norma nmero 6: Todas las etiquetas (todas) se deben cerrar. En HTML, por ejemplo, la etiqueta <p> era opcional que se cerrase. Aqu es obligatorio.

    Roco Manso Gil

    Pgina 7 de 12

    Haba etiquetas que no se cerraban nunca como <br>. En XHTML las etiquetas que no se cerraban en HTML tienen que escribirse con un espacio y la barra de cerrado dentro de la etiqueta. As: <br> pasa a ser <br /> La inclusin de una imagen, por ejemplo: <img src="imagenes/logo.png" width="50" height="30"> tiene que escribirse ahora as <img src="imagenes/logo.png" width="50" height="30" /> Observa el espacio de separacin antes de la barra de cierre. Lo anterior es vlido para todas las etiquetas similares. Includo las etiquetas <meta> de la <head>. Norma nmero 7: Todos los valores de los atributos deben entrecomillarse. En HTML era opcional. Por ejemplo <table border=2> que se permita en HTML, pasara a escribirse obligatoriamente <table border="2"> Norma nmero 8: Todos los atributos deben tener un valor, aunque el nombre del atributo y su valor sean el mismo. En HTML es correcto poner <hr noshade /> <hr noshade=noshade /> En XHTML solo es correcto la <hr noshade=noshade />

    Comentarios
    Sirven para insertar una o varias lneas que no sern interpretados por el navegador. No se pueden anidar <!---> Un comentario no afecta al funcionamiento de la pgina pero si al mismo tamao final del archivo, El aumento de texto no es significativo si las imgenes u otros archivos

    Elementos de HTML XHTML


    <etiqueta atributo1=valor1 atributo2=valor2>contenido </etiqueta > del elemento

    Etiqueta html Definicin: Delimita el contenido del documento Atributos: dir, lang Dir: indica el sentido de lectura de texto cuando no corresponde al habitual Valores: ltr (de izquierda a derecha) Rtl (de derecha a izquierda) Lang: indica el idioma por defecto del documento Valores: es (espaol) de (aleman) en (ingls) Etiqueta head Definicin: Delimita la cabecera del documento Atributos: dir, lang Contenido de la cabecera: <title> <base> <meta> <link> <object> <script> <style> Etiqueta body Definicin: Delimita el cuerpo del documento Atributos:

    Roco Manso Gil

    Pgina 8 de 12

    scroll : hace referencia a la barra de desplazamiento no no aparece y si no cabe en la pantalla nuestra pgina no lo vemos auto solo aparece si es necesario Es igual a no poner el atributo bgcolor: color de fondo de la pantalla (aunque es mejor con css) Bgcolor=#FFFF00 (Red, green, blue es un valor entre 0 255) Bgcolor=yellow Bgcolor=#FF0 Existen colores seguros para la web y son los formados por cualquier combinacin de los valores 00, 33, 66, 99, CC, FF background: poner una imagen como fondo (aunque es mejor con css) background=ruta/archivo.gif background=imagenes/archivo.gif background= archivo.gif text: hace referencia al color del texto para toda la pgina (aunque es mejor con css)

    Text=yellow link: color de los enlaces no visitados(aunque es mejor con css) link=yellow vlink: color de los enlaces visitados (aunque es mejor con css) alink: color de los enlaces activos(el momento de pulsar) (aunque es mejor con css)

    leftmargin: el margen izquierdo indicado en pixels, sino por defecto aparece casi pegado al borde. En Explorer leftmargin=10 marginwidth: el margen izquierdo indicado en pixels, sino por defecto aparece casi pegado al borde. En Netscape marginwidth =10 topmargin: el margen de arriba indicado en pixels, sino por defecto aparece casi pegado al borde. En Explorer topmargin =10 marginheight: el margen de arriba indicado en pixels, sino por defecto aparece casi pegado al borde. En Netscape marginheight =10 Lo mejor es poner todo para que se vea en todos los navegadores <body leftmargin=10 marginwidth =10 topmargin =10 marginheight =10 HTML o XHTML clasifica a todos los elementos en dos grupos: elementos en linea y elementos en bloque Elementos en lnea ocupan solo el espacio necesario para mostrar sus contenidos Ejemplo <a href=http://www.google.com>google</a> Roco Manso Gil Pgina 9 de 12

    Los elementos de bloque siempre empiezan en una nueva lnea y ocupan todo el espacio disponible hasta el final de la lnea, aunque sus contenidos no lleguen hasta el final de ella Ejemplo <p>esto es un parrafo</p> La mayora de los elementos de bloque pueden contener en su interior elementos en lnea y otros elementos de bloque. Los elementos en lnea slo pueden contener texto u otros elementos en lnea. Resto de elementos que pertenecen a la etiqueta body <br> </br> <br/> Salto de linea y no tiene atributos. Es un elemento de bloque Si no insertamos saltos de lnea todo el texto saldr en la misma lnea (Salvo que no quepa de ancho en la pantalla) Saltos de linea.html Varios saltos.html <p>texto</p> delimita un prrafo, tiene que estar todo lo del prrafo solo en una lnea o varias. Es un elemento de bloque. Atributos: align (center, right, left, justify) Usar-prrafos1.html <div> </div> marca divisiones en las que definimos un mismo tipo de alineado. Es un elemento de bloque Atributos: align (center, right, left, justify) Es lo mismo: <p align=right> parrafo1</p> <p align=right> parrafo2</p> Que <div align=right> <p> parrafo1</p> <p> parrafo2</p> </div> Alinear-2.html <h1> texto grande y en negrita</h1> elemento en bloque <h2> texto ms pequeo y en negrita </h2> .. <h6> texto m pequeo y en negrita </h6> Atributos: align (center, right, left, justify) <center> texto </center> es una etiqueta que est desaprobada. Es un elemento de bloque. <b>texto en negrita </b> en negrita (bold) Elemento en linea <strong> texto en negrita </strong> (fuerte) Elemento en linea <i>texto en cursiva</i> (Italic) Elemento en linea <em>texto en cursiva</em> ((emphatize) Elemento en linea <u>texto subrayado </u> (underline) Elemento en linea <s> texto tachado </s> (strike) Elemento en linea <sup>texto superndice </sup> Elemento en linea <sub>texto subndice </sub> Elemento en linea

    Roco Manso Gil

    Pgina 10 de 12

    Para indicar de forma clara el texto que ha sido eliminado y el texto que ha sido aadido a un texto original . <ins>texto insertado</ins> Lo subraya Elemento en linea <del> texto eliminado</del> Lo tacha Elemento en lnea Los siguientes sirven para marcar las abreviaturas de texto, siglas, definiciones, cita <abbr>texto </abbr>.Se usa para marcar las abreviaturas de un textoElemento en lnea Atributo title=texto que sale cuando pongo el cursor encima del texto <acronym>texto </ acronym >.Se usa para marcar las siglas o acrnimos de un texto de un texto Elemento en lnea Atributo title=texto que sale cuando pongo el cursor encima del texto Ejm <acronym title=Hyper Text Markup Language>HTML</acronym> <dfn>texto </dfn>.Se usa para definir una palabra Elemento en lnea Atributo title=texto que sale cuando pongo el cursor encima del texto <abbr>texto </abbr>.Se usa para marcar un texto con una citacin. Elemento en lnea Atributo title=texto que sale cuando pongo el cursor encima del texto <cite>texto </cite>.Se usa para marcar un texto con una citacin. Elemento en lnea Atributo title=texto que sale cuando pongo el cursor encima del texto Ms elementos <blink> texto parpadeo </blink> Elemento en linea. Solo funciona en algunos navegadores(Firefox) &nbsp; Espacios en blanco <fieldset> texto enmarcado</fieldset> elemento en bloque. <legend > etiqueta ></legend> Atributos: align (center, right, left) <fieldset> <legend align=center>esto es una etiqueta>/legend> vamos a enmarcar esto </fieldeset> <blockquote> texto </blockquote>. Sangrado Elemento en bloque <address>texto </address> El elemento address debe de ser utilizado por los autores para proporcionar informacin de contacto de un documento. Sale en cursiva y es un elemento en bloque.

    <address>Victor Cuervo <br> Alferez Provisional 14 2B <br> 05003 Avila <br> Tlfno: +34 920 22 22 27</address>

    <pre>texto</pre> Muestra el texto que encierra tal y como est escrito (respetando los espacios en blanco). Elemento en bloque

    Roco Manso Gil

    Pgina 11 de 12

    <font> texto</font> modifica color de la letra, tipo de letra y tamao de un texto.Elemento en lnea Atributos: color face por defecto es el tipo de letra Times New Roman, y se puede proporcionar alternativas de tipo de letra al ordenador poniendo varias , si no existiese la 1 cogera la 2, y as sucesivamente size (valores del 1(ms pequeo) al 7(ms grande)) <hr /> Escribe una lnea horizontal. Cubre el ancho de la pgina excepto los mrgenes. Elemento en bloque Atributos: width (indica elporcentaje de cubrir la lnea, en pixels o en porcentaje <hr width=400/> <hr width=50%/> Si cambia el tamao de la ventana durante la ejecucin tambin cambia el tamao de la lnea.) align (se puede cambiar la alineacin, por defecto es centrada y puede tomar los valores: left, center, right size (el espesor de la lnea, pudiendo recibir solo un valor en pixels) noshade si queremos que la lnea sea opaca, ya que por defecto es transparente y su valor es el mismo nombre noshade=noshade color (color de la lnea. Si empleamos color es indiferente que usemos el sombreado hoshade o no)

    Roco Manso Gil

    Pgina 12 de 12

    S-ar putea să vă placă și