Visita Encydia-Wikilingue.com

HTML

html - Wikilingue - Encydia

HTML (HyperText Markup Language)
HTML.svg
Desarrollador
World Wide Web Consortium & WHATWG
Información xeral
Extensión de arquivo.html, .htm
Tipo de CONSINTAtext/html
Type codeTEXT
Uniform Type Identifierpublic.html
Tipo de formatoLinguaxe de marcado
Estendido deSGML
Estendido aXHTML
Estándar(é)W3C HTML 4.01, W3C HTML 3.2

HTML, siglas de HyperText Markup Language (Linguaxe de Marcado de Hipertexto), é a linguaxe de marcado predominante para a elaboración de páxinas web. É usado para describir a estrutura e o contido en forma de texto, así como para complementar o texto con obxectos tales como imaxes. HTML escríbese en forma de "etiquetas", rodeadas por corchetes angulares (<,>). HTML tamén pode describir, ata un certo punto, a aparencia dun documento, e pode incluír un script (por exemplo Javascript), o cal pode afectar o comportamento de navegadores web e outros procesadores de HTML.

HTML tamén é usado para referirse ao contido do tipo de CONSINTA text/html ou aínda máis ampliamente como un término genérico para o HTML, xa sexa en forma descendida do XML (como XHTML 1.0 e posteriores) ou en forma descendida directamente de SGML (como HTML 4.01 e anteriores).

Contido

Historia de HTML

Primeiras especificaciones

A primeira descrición de HTML dispoñible públicamente foi un documento chamado HTML Tags (Etiquetas HTML), publicado por primeira vez en Internet por Tim Berners-Le en 1991.[1] [2] Describe 22 elementos comprendendo o deseño inicial e relativamente simple de HTML. Trece destes elementos aínda existen en HTML 4.[3]

Berners-Le consideraba a HTML unha ampliación de SGML, pero non foi formalmente recoñecida como tal ata a publicación de mediados de 1993, pola IETF, dunha primeira proposición para unha especificación de HTML: o boceto Hypertext Markup Language de Berners-Le e Dan Connolly, o cal incluía unha Definición de Tipo de Documento SGML para definir a gramática.[4] O boceto expiró logo de seis meses, pero foi notable polo seu recoñecemento da etiqueta propia do navegador Mosaic usada para inserir imaxes sen cambio de liña, reflectindo a filosofía do IETF de basear estándares en prototipos con éxito. [5] Similarmente, o boceto competidor de Dave Raggett HTML+ (Hypertext Markup Format) (Formato de marcaje de hipertexto), de 1993 tardío, suxería, estandarizar características xa implementadas tales como táboas.[6]

Marcado HTML

HTML consta de varios compoñentes vitais, incluíndo elementos e os seus atributos, tipos de data, e a declaración de tipo de documento.

Elementos

Os elementos son a estrutura básica de HTML. Os elementos teñen dúas propiedades básicas: atributos e contido. Cada atributo e contido ten certas restricciones para que se considere válido ao documento HTML. Un elemento generalmente ten unha etiqueta de inicio (p.ej. <nome-de-elemento>) e unha etiqueta de pechadura (p.ej. </nome-de-elemento>). Os atributos do elemento están contidos na etiqueta de inicio e o contido está situado entre as dúas etiquetas (p.ej. <nome-de-elemento atributo="valor">Contido</nome-de-elemento>). Algúns elementos, tales como <br>, non teñen contido nin levan unha etiqueta de pechadura. Debaixo se listan varios tipos de elementos de marcado usados en HTML.

Estrutura xeral dunha liña de código na linguaxe de etiquetas HTML.

O marcado estructural describe o propósito do texto. Por exemplo, <h2>Golf</h2> establece a "Golf" como un encabezamiento de segundo nivel, o cal mostraríase nun navegador dun xeito similar ao título "Marcado HTML" ao principio desta sección. O marcado estructural non define como se verá o elemento, pero a maioría dos navegadores web han estandarizado o formato dos elementos. Un formato específico pode ser aplicado ao texto por medio de follas de estilo en cascada.

O marcado presentacional describe a aparencia do texto, sen importar a súa función. Por exemplo, <b>negrita</b> indica que os navegadores web visuales deben mostrar o texto en negrita , pero non indica que deben facer os navegadores web que mostran o contido doutro xeito (por exemplo, os que len o texto en voz alta). No caso de <> b negrita</b> e <i>itálica</i>, existen elementos que se ven da mesma xeito pero teñen unha natureza máis semántica: <strong>enfásis forte</strong> e <em>énfasis</em>. É fácil ver como un lector de pantalla debería interpretar estes dous elementos. Con todo, son equivalentes aos seus correspondentes elementos presentacionales: un lector de pantalla non debería dicir máis forte o nome dun libro, aínda que este estea en itálicas nunha pantalla. A maioría do marcado presentacional foi desechada con HTML 4.0, en favor de Follas de estilo en cascada.

O marcado hipertextual utilízase para enlazar partes do documento con outros documentos ou con outras partes do mesmo documento. Para crear un enlace é necesario utilizar a etiqueta de ancora <a xunto> co atributo href, que establecerá a dirección URL á que apunta o enlace. Por exemplo, un enlace á Wikipedia sería da forma <a href=”é.wikipedia.org”>Wikipedia</a .>Tamén se poden crear enlaces sobre outros obxectos, tales como imaxes <a href=”enlace”><img src=”imaxe” /></a ..>

Atributos

A maioría dos atributos dun elemento son pares nomee-valor, separados por un signo de igual "=" e escritos na etiqueta de comezo dun elemento, despois do nome deste. O valor pode estar rodeado por comillas dobres ou simples, aínda que certos tipos de valores poden estar sen comillas en HTML (pero non en XHTML).[7] [8] De todas as maneiras, deixar os valores sen comillas é considerado pouco seguro.[9] En contraste cos pares nomee-elemento, hai algúns atributos que afectan ao elemento simplemente pola súa presenza[10] (tal como o atributo ismap para o elemento img).[11]

Códigos HTML básicos

  • <html>: define o inicio do documento HTML, indícalle ao navegador que o que vén a continuación debe ser interpretado como código HTML. Isto é así de facto, xa que en teoría o que define o tipo de documento é o DOCTYPE , significando a palabra xusto tras DOCTYPE o tag de raíz, por exemplo: 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN http://www.w3.org/TR/html4/strict.dtd." "">
  • <script>: incrusta un script nunha web, ou se chama a un mediante src="uri do script" Recoméndase incluír o tipo CONSINTA no atributo type, no caso de JavaScript text/javascript.
  • <head>: define a cabecera do documento HTML, esta cabecera adoita conter información sobre o documento que non se mostra directamente ao usuario. Por exemplo o título da fiestra do navegador. Dentro da cabecera <head> podemos atopar:
Un exemplo de código HTML con coloreado de sintaxis.
  • <title>: define o título da páxina. Polo xeral, o título aparece na barra de título encima da fiestra
  • <link>: para vincular o sitio a follas de estilo ou iconos Por exemplo:<link rel="stylesheet" href="/style.css" type="text/css">
  • <style>: para colocar o estilo interno da páxina; xa sexa usando CSS, ou outras linguaxes similares. Non é necesario colocalo si vaise a vincular a un arquivo externo usando a etiqueta <link>
  • <meta>: para metadatos como a autoría ou a licenza, ata para indicar parámetros http (mediante http-equiv="") cando non se poden modificar por non estar dispoñible a configuración ou por dificultades con server-side scripting.
  • <body>: define o contido principal ou corpo do documento. Esta é a parte do documento html que se mostra no navegador; dentro desta etiqueta poden definirse propiedades comúns a toda a páxina, como cor de fondo e marxes. Dentro do corpo <body> podemos atopar numerosas etiquetas. A continuación indícanse algunhas a modo de exemplo:
  • <h1> a h6 <>: encabezados ou títulos do documento con diferente relevancia.
  • <table>: define unha táboa
  • <tr>: fila dunha táboa
  • <td>: columna de dunha táboa
  • <a :> Hipervínculo ou enlace, dentro ou fóra do sitio web. Debe definirse o parámetro de pasada por medio do atributo href. Por exemplo: <a href="http://www.wikipedia.org">Wikipedia</a represéntase como Wikipedia)
  • <div>: división da páxina. Recoméndase, xunto con css, no canto de <table> cando se desexa alinear contido
  • <img>: imaxe. Require do atributo src, que indica a ruta na que se atopa a imaxe. Por exemplo: <img src="./imagenes/mifoto.jpg" />. É conveniente, por accesibilidad, poñer un atributo alt="texto alternativo".
  • <li><ol><ul>: Etiquetas para listas.
  • <b>: texto en negrita (Etiqueta desaprobada. Recoméndase usar a etiqueta <strong>)
  • <i>: texto en cursiva (Etiqueta desaprobada. Recoméndase usar a etiqueta <em>)
  • <s>: texto tachado (Etiqueta desaprobada. Recoméndase usar a etiqueta <do>)
  • <ou>: texto subliñado

A maioría de etiquetas deben pecharse como se abren, pero cunha barra ("/") tal como móstrase nos seguintes exemplos:

  • <table><tr><td>Contido dunha cela</td></tr></table>
  • <script>Código dun [[script]] integrado na páxina</script>.


Nocións básicas de HTML

A linguaxe HTML pode ser creado e editado con calquera editor de textos básico, como pode ser Gedit en Linux , o Bloc de Notas de Windows, ou calquera outro editor que admita texto sen formato como GNU Emacs, Microsoft Wordpad, TextPad, Vim, Notepad++, entre outros.

Existen ademais, outros editores para a realización de sitios Web con características WYSIWYG (What You See Is What You Get, ou en español: “o que ves é o que obtés”). Estes editores permiten ver o resultado do que se está editando en tempo real, a medida que se vai desenvolvendo o documento. Agora ben, isto non significa un xeito distinto de realizar sitios web, senón que unha forma un tanto máis simple xa que estes programas, ademais de ter a opción de traballar coa vista preliminar, ten a súa propia sección HTML a cal vai xerando todo o código a medida que se vai traballando. Algúns exemplos de editores WYSIWIG son Macromedia Dreamweaver, ou Microsoft FrontPage.

Combinar estes dous métodos resulta moi interesante, xa que dalgún xeito axúdanse entre si. Por exemplo; si edítase todo en HTML e de súpeto esquécese algún código ou etiqueta, simplemente diríxome ao editor visual ou WYSIWYG e continúase aí a edición, ou viceversa, xa que hai casos en que sae máis rápido e fácil escribir directamente o código dalgunha característica que queiramos adherirlle ao sitio, que buscar a opción no programa mesmo.

Existe outro tipo de editores HTML chamados WYSIWYM (O que ves é o que queres dicir) que dan máis importancia ao contido e ao significado que á aparencia visual. Entre os obxectivos que teñen estes editores é a separación do contido e a presentación, fundamental no deseño Web.

HTML utiliza etiquetas ou marcas, que consisten en breves instrucións de comezo e final, mediante as cales determínase a forma na que debe aparecer na súa navegador o texto, así como tamén as imaxes e os demais elementos, na pantalla do ordenador.

Toda etiqueta identifícase porque está encerrada entre os signos menor que e maior que (<>), e algunhas teñen atributos que poden tomar algún valor. En xeral as etiquetas aplicaranse de dúas formas especiais:

  • Ábrense e péchanse, por exemplo: <b>negrita</b> que se vería no seu navegador web como negrita.
  • Non poden abrirse e pecharse, como <hr> que se vería no seu navegador web como unha liña horizontal.
  • Outras que poden abrirse e pecharse, por exemplo <p>.
  • As etiquetas básicas ou mínimas son: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN http://www.w3.org/TR/html4/strict.dtd" ""> 
 <html lang="é">
   <head>
     <title>Exemplo</title>
   </head>
   <body>
     <p>exemplo</p>
   </body>
 </html>

Saber máis

Seleccionando a opción Ver código fonte no navegador, pódese ver realmente a información que está recibindo este e como a está interpretando. Por exemplo: en Internet Explorer ou en Firefox , simplemente hai que despregar o menú Ver e logo elixir Código fonte. Desta forma, abrirase o editor de texto configurado como predeterminado no sistema co código fonte da páxina que se estea vendo nese momento no explorador. Outra forma máis rápida consiste en facer clic co botón dereito do ratón en calquera punto do área onde o navegador mostra a páxina web e elixir Ver código fonte.

Para o navegador Firefox existe o plugin FireBug, un depurador que permite entre outras cousas visualizar o código HTML da páxina que estamos visualizando de forma dinámica, e que ata resalta o anaco de código polo que está pasando o ratón en cada momento, polo que é unha ferramenta moi útil para aprender diversos conceptos desta linguaxe.

Historia do estándar

En 1989 existían dúas técnicas que permitían vincular documentos electrónicos, por unha banda os hipervínculos (links) e doutra banda unha poderosa linguaxe de etiquetas denominado SGML. Por entón, Tim Berners-Le dá a coñecer á prensa que estaba traballando nun sistema que permitirá acceder a ficheros en liña, funcionando sobre redes de computadoras ou máquinas electrónicas baseadas no protocolo TCP/IP.

A principios de 1990, Tim Berners-Le define por fin o HTML como un subconjunto do coñecido SGML e crea algo máis valioso aínda, o World Wide Web. En 1991, Tim Berners-Le crea o primeiro navegador web, que funcionaría en modo texto e sobre un sistema operativo UNIX.

Os traballos para crear un sucesor do HTML, denominado HTML +, comezaron a finais de 1993. HTML+ deseñouse originalmente para ser un superconjunto do HTML que permitise evolucionar gradualmente desde o formato HTML anterior. Á primeira especificación formal de HTML+ déuselle, polo tanto, o número de versión 2 para distinguila das propostas non oficiais previas. Os traballos sobre HTML+ continuaron, pero nunca se converteu nun estándar, malia ser a base formalmente máis parecida ao aspecto compositivo das especificaciones actuais.

O borrador do estándar HTML 3.0 foi proposto polo recentemente formado W3C en marzo de 1995. Con el introducíronse moitas novas capacidades, tales como facilidades para crear táboas, facer que o texto fluíse ao redor das figuras e mostrar elementos matemáticos complexos. Aínda que se deseñou para ser compatible con HTML 2.0, era demasiado complexo para ser implementado coa tecnoloxía da época e, cando o borrador do estándar expiró en setembro de 1995, abandonouse debido á carencia de apoios dos fabricantes de navegadores web. O HTML 3.1 nunca chegou a ser proposto oficialmente, e o estándar seguinte foi o HTML 3.2, que abandonaba a maioría das novas características do HTML 3.0 e, a cambio, adoptaba moitos elementos desenvolvidos inicialmente polos navegadores web Netscape e Mosaic. A posibilidade de traballar con fórmulas matemáticas que se propuxo no HTML 3.0 pasou a quedar integrada nun estándar distinto chamado MathML.

O HTML 4.0 tamén adoptou moitos elementos específicos desenvolvidos inicialmente para un navegador web concreto, pero ao mesmo tempo comezou a limpar o HTML sinalando algúns deles como «desaprobados» ou deprecated en inglés.

Accesibilidad Web

Artigo principal: accesibilidad web

O deseño en HTML separadamente de cumprir coas especificaciones propias da linguaxe debe respectar uns criterios de accesibilidad web, seguindo unhas pautas, ou as normativas e leis vigentes nos países onde se regule devandito concepto. Atópase dispoñible e desenvolvido polo W3C a través das Pautas de Accesibilidad ao Contido Web 1.0 WCAG (actualizadas recientemente coa especificación 2.0[12] ), aínda que moitos países teñen especificaciones propias, como é o caso de España coa Norma UNE 139803.[13]

Entidades HTML

Os carácteres especiais como signo de puntuación, letras con acentúe ou diéresis, ou símbolos da linguaxe; débense converter en entidade HTML para mostrarse nun navegador. A seguinte é unha lista de carácteres españois e a súa correspondente entidade HTML:

Carácter Entidade HTML Carácter Entidade HTML
á &aacute; Á &Aacute;
é &eacute; É &Eacute;
í &iacute; Í &Iacute;
ó &oacute; Ó &Oacute;
ú &uacute; Ú &Uacute;
ü &uuml; Ü &Uuml;
ñ &ntilde; Ñ &Ntilde;
¡ &iexcl; &iquest;

Véxase tamén

Referencias

  1. ↑ «HTML Tags». World Wide Web Consortium. Consultado o 08-04-2007.
  2. ↑ «First mention of HTML Tags on the www-talk mailing list». World Wide Web Consortium (1991-10-29). Consultado o 08-04-2007.
  3. ↑ «Index of elements in HTML 4». World Wide Web Consortium (1999-12-24). Consultado o 08-04-2007.
  4. ↑ Tim Berners-Le (1991-12-09). «Re: SGML/HTML docs, X Browser (archived www-talk mailing list post)». Consultado o 16-06-2007. «SGML is very xeral. HTML is a specific application of the SGML basic syntax applied to hypertext documents with simple structure.»
  5. ↑ Raymond, Eric. «IETF and the RFC Standards Process», The Art of Unix Programming. «In IETF tradition, standards have to arise from experience with a working prototype implementation — but once they become standards, code that does not conform to them is considered broken and mercilessly scrapped. …Internet-Drafts are not specifications, and software implementers and vendors are specifically varrede from claiming compliance with them as if they were specifications. Internet-Drafts are focal points for discussion, usually in a working group… Once an Internet-Draft has been published with an RFC number, it is a specification to which implementers may claim conformance. It is expected that the authors of the RFC and the community at large will begin correcting the specification with field experience.»
  6. ↑ «HTML+ Internet-Draft - Abstract». «Browser writers are experimenting with extensions to HTML and it is now appropriate to draw these ideas together into a revised document format. The new format is designed to allow a gradual roll over from HTML, adding features like tables, captioned figures and fill-out forms for querying remote databases or mailing questionnaires.»
  7. ↑ «www.w3.org/TR/html401/intro/sgmltut.html#h-3.2.2».
  8. ↑ «www.w3.org/TR/xhtml1/diffs.html#h-4.4».
  9. ↑ «www.cs.tut.fi/jkorpela/qattr.html».
  10. ↑ «www.w3.org/History/19921103-hypertext/hypertext/WWW/MarkUp/Tags.html».
  11. ↑ «www.w3.org/TR/1999/REC-html401-19991224/struct/objects.html#adef-ismap».
  12. ↑ «Web Content Accessibility Guidelines (WCAG) 2.0».
  13. ↑ Norma UNE 139803

Enlaces externos

Wikilibros

Obtido de" http://ks312095.kimsufi.com../../../../articles/a/t/e/Ate%C3%ADsmo.html"
Your Ad Here