Modularización

Estructuración de elementos en módulos

En las revisiones del lenguaje XHTML el W3C, contribuye a trasladar a la comunidad de desarrolladores de contenido para internet las mejoras en el lenguaje, en la versión 1.0 de XHTML se propuso proporcionar una migración que fuera cómoda para los desarrolladores desde HTML y en las últimas revisiones se aplica ya la modularización del lenguaje, eliminando para ello los elementos y atributos en desuso del lenguaje del lenguaje XHTML que tenían una funcionalidad orientada a la presentación, sustituyendo así el uso de estos elementos por el de hojas de estilo o comportamiento.

El W3C basa los elementos del lenguaje en módulos aplicando así una estructura más funcional al mismo y permitiendo la portabilidad entre una amplia variedad de dispositivos cliente. De esta forma se asegura que la funcionalidad por módulos permite a los desarrolladores crear documentos que serán consistentes a la hora de portarlos a diferentes dispositivos que empleen XHTML.

Módulos del lenguaje XHTML

El W3C ha dividido los elementos que conforman en lenguaje en los siguientes módulos los cuales engloban ciertos elementos, tal como se muestra en la tabla siguiente:

Módulo estructural
html , head, title, body
Módulo de texto
abbr, acronym, address, blockquote, br, cite, code, dfn, div, em, h1, h2, h3, h4, h5, h6, kbd, p, pre, q, samp, span, strong, var
Módulo de hipertexto
a
Módulo de lista
dl, dt, dd, ol, ul, li
Módulo de objetos
object, param
Módulo de presentación
b, big, hr, I, small, sup, sub, tt
Módulo de edición
del, ins
Módulo de texto bidireccional
bdo
Módulo de formularios
button, fieldset, form, input, label, legend, select, optgroup, option, textarea
Módulo de tablas
caption, col, colgroup, table, tbody, td, tfoot, th, thead, tr
Módulo de imagen
img
Módulo de mapa de imagen lado del cliente
area, map
Módulo de mapa de imagen lado del servidor
Attribute ismap on img
Módulo de eventos intrínsecos
Events attributes
Módulo de metainformación
meta
Módulo de Scripting
noscript, script
Módulo de hoja de estilo
style element
Módulo del atributo style
style attribute
Módulo de link
link
Módulo de base
base

Módulo de texto

Elemento <p> – párrafos

Este elemento permite establecer los párrafos que componen un documento. Para especificar un párrafo se ha de realizar la apertura del elemento con la etiqueta de inicio de párrafo <p> , seguidamente escribir el texto que compone el párrafo y por ultimo escribir la etiqueta de final de párrafo </p>, el siguiente ejemplo muestra un documento con tres párrafos:

<!DOCTYPE html PUBLIC “-//W3C//DTD XTHML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” lang=”es” xml:lang=”es”>
<html>
<head>
<title>Practica párrafos – www.aprendoencasa.com</title>
</head>
<body>
<p>Esta práctica permite escribir un documento con tres párrafos, este es el primer párrafo del documento. </p>
<p>A continuación escribimos el segundo párrafo del documento</p>
<p>un saludo desde Aprendoencasa.com</p>
</body>
</html>


Una vez guardada y visualizada en el navegador el documento quedaría tal como se muestra en la siguiente imagen:

clip_image002

Los párrafos son elementos de bloque, lo que significa que cada uno de ellos ocupara el ancho máximo de la ventana del navegador. A continuación se muestran las características del elemento párrafo:

Elemento
<p>…</p>

Atributos comunes

Atributos básicos, de internacionalización (i18n) y eventos.

Atributos específicos
Tipo de elemento
Elemento en bloque
Descripción
Permite delimitar y establecer el texto que conforma un párrafo.

Elemento <h1>,<h2>,<h3>,<h4>,<h5>,<h6>

Los documentos xhtml y html suelen estructurarse como un libro en el cual encontramos capítulos o secciones de forma que se pueda identificar de una forma cómoda todos los apartados de los mismos. Los elementos <hn> permiten establecer estos títulos de sección en el documento, la etiqueta <h1>, es la que define una mayor categoría a la sección, y así sucesivamente con el resto de etiquetas estableciendo títulos de sección de mayor a menor importancia. Se ha de tener en cuenta que estas etiquetas no engloban a otras sino simplemente establecen solo el titulo de la sección para destacarlo en el documento. La definición de las etiquetas es exactamente igual para todas, así como sus atributos o características. A continuación se muestra un ejemplo de documento utilizando todas las etiquetas de titulo de sección:

<!DOCTYPE html PUBLIC “-//W3C//DTD XTHML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” lang=”es” xml:lang=”es”>
<html>
<head>
<title>Practica parrafos y titulos de seccion – aprendoencasa.com</title>
</head>
<body>
<h1>Frase celebre No. 1</h1>
<p>Lo pasado ha huido, lo que esperas esta ausente, pero el presente es tuyo. (Proverbio) </p>
<h2>Frase celebre No. 2</h2>
<p>La belleza que atrae, raramente coincide con la que enamora. ( Jose Ortega y Gasset) </p>
<h3>Frase celebre No. 3</h3>
<p>Comienza a manifestarse la madurez cuando sentimos que nuestra preocupacion es mayor por los demas que por nosotros mismos. ( Albert Einstein) </p>
<h4>Frase celebre No. 4</h4>
<p>El sabio no dice todo lo que piensa, pero siempre piensa todo lo que dice. (Aristoteles)</p>
<h5>Frase celebre No. 5</h5>
<p>Me gusta mi pierna, esta conmigo desde que era bebe. (Doctor House)</p>
<h6>Frase celebre No. 6</h6>
<p>La imaginacion es mas importante que el conocimiento. (Albert Einstein)</p>
</body>
</html>

Como puede observar de momento no se están tecleando los acentos al escribir el documento, este error es debido a que los navegadores para visualizar ciertos caracteres especiales correctamente, se han de insertar como un código especial dentro del documento. Siendo este un tema que se trata en el próximo capítulo, de momento no teclearemos acentos ni símbolos especiales en el documento.

Al guardar el documento y visualizarlo en un navegador la salida que se obtendría debe ser igual o parecida a la que se muestra en la siguiente imagen:

clip_image002[5]

Los títulos de sección son elementos de bloque, lo que significa que cada uno de ellos ocupara el ancho máximo de la ventana del navegador. A continuación se muestran las características de los elementos de titulo de sección:

Elemento
<h1>…</h1>
<h2>…</h2>
<h3>…</h3>
<h4>…</h4>
<h5>…</h5>
<h6>…</h6>

Atributos comunes
Atributos básicos, de internacionalización (i18n) y eventos.
Atributos específicos
Tipo de elemento
Elemento en bloque
Descripción
Indica los títulos de las secciones del documento, de mayor a menor importancia.

Etiquetas de Technorati: ,,,,

2 Comentarios

  1. GarykPatton

    I have been looking looking around for this kind of information. Will you post some more in future? I’ll be grateful if you will.

  2. admin

    Si voy a escribir el resto de articulos que faltan hasta completar el curso, pero actualmente estoy saturado de trabajo y al escribir yo solo me cuesta bastante encontrar tiempo para escribir. Gracias por tu visita y espero actualizar muy pronto los modulos.

    Disculpa la traducción pero mi ingles es bastante pesimo.

    If I go to write the rest of the missing items to complete the course, but now I am overwhelmed by work and I write only for me to find enough time to write. Thanks for your visit and I hope very soon to update the modules.

    Sorry but my English translation is rather pessimistic.

Enviar comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.plugin cookies

ACEPTAR
Aviso de cookies