Posts tagged ‘HTML’

Curso básico de HTML: 5 – Aplicar formato usando etiquetas

En el capítulo anterior explique el uso del atributo style el cual es genial porque es un punto intermedio entre los atributos comunes y el presente del diseño web: CSS (aunque Internet Explorer no lo soporte). Por cierto, creo que aún no lo dije, si estás siguiendo este curso no uses IE, estaras desperdiciando tu trabajo y tus horas de aprendizaje.

Bueno, volvamos a lo nuestro. El atributo style es genial para aplicar formatos como color, alineación, tamaño, etc. Sin embargo, a veces es bastante largo de escribir si lo que queremos es algo muy específico. Por ejemplo, si dentro de un párrafo queremos que solo una palabra esté subrayada, el método correcto sería:

1
2
<p>Este es un parrafo en el cual la palabra
que estara subrayada es <span style="text-decoration:underline">esta</span></p>

Continue reading ‘Curso básico de HTML: 5 – Aplicar formato usando etiquetas’ »



Si este artículo te gustó también puedes leer:

Curso básico de HTML: 4 – El atributo “style”

En el capítulo anterior, expiqué qué son los atributos. También explique que hay atributos obligatorios (exigidos por ciertas etiquetas) y atributos opcionales (que se usan para dar formato como color, tamaño, posición, etc). Dije también que no te acostumbres a depender de los atributos porque están en vías de extinción (no es broma, es muy en serio) y que los diseñadores prefieren usar Hojas de estilo CSS antes que atributos. Explicar en qué consisten las hojas de estilo es tan largo que es tema para un curso completo (quizás más extenso que el de HTML), sin embargo, dejé claro que existe un punto intermedio entre los atributos y las hojas de estilo: el atributo style.

Continue reading ‘Curso básico de HTML: 4 – El atributo “style”’ »



Si este artículo te gustó también puedes leer:

Curso básico de HTML: 3 – Atributos y valores

En la sesión anterior vimos las etiquetas básicas en el aprendizaje de HTML. Ahora bien, dichas etiquetas indican “algo” (un párrafo, una línea, un título, etc.) y eso que indican puede enriquecerse; por ejemplo podemos dibujar una línea con la etiqueta

1
<hr />

Pero quizás nos interese que la línea fuera azul, de 2 pixeles de grosor, que ocupe solo la mitad del ancho en pantalla y que este pegada a la izquierda. ¿Muchas propiedades?, sí, son muchas, pero se pueden indicar en la etiqueta anterior. Para eso usamos atributos y valores.

Continue reading ‘Curso básico de HTML: 3 – Atributos y valores’ »



Si este artículo te gustó también puedes leer:

Curso básico de HTML: 2 – Etiquetas básicas

En la sesión anterior vimos la estructura básica de un documento HTML. Repasemos rápidamente lo visto en esa sesión:

  1. El código HTML se usa para crear páginas web. El navegador interpreta el código y muestra el resultado en forma de página web.
  2. Para escribir código HTMl debemos usar un editor de texto plano. Para Windows, el mejor sin duda es NotePad ++
  3. Al trabajar escribiendo código HTML debemos tener dos programas abiertos: el editor de textos para escribir el código y un navegador (que no sea Internet Explorer, por favor, porque muestra mal el diseño) para ver los cambios en la pagina web.
  4. Los códigos HTML se marcan con etiquetas que se encierran entre los símbolos menor y mayor (< >).
  5. Algunas etiquetas son de dos lados (apertura <etiqueta> y cierre </etiqueta>) y otras son de un solo lado y se cierran en sí mismas (<etiqueta/>).
  6. Los comentarios no se muestran en la página web y deben ir encerrados entre < ! – - y - ->
  7. La estructura básica de una página web es:

Continue reading ‘Curso básico de HTML: 2 – Etiquetas básicas’ »



Si este artículo te gustó también puedes leer:

Curso básico de HTML 1 – Introducción a HTML

HTML significa HyperText Markup Language; es decir, lenguaje de marcas de hipertexto. Sin embargo, es posible que aún con esa explicación más de uno se quede sin entender lo que significa. Para hacerlo más sencillo: HTML es el lenguaje que se utiliza para la creación de páginas web estáticas. Las páginas web estáticas son documentos escritos en HTML que se conectan unos con otros a través de enlaces. Esta conexión abarca de una página web a otra abarca todo el mundo y se conoce como web. Por último, para que la web funcione, se necesita de un protocolo que permita que funcionen los enlaces y se transfieran documentos HTML. Ese protocolo es HTTP,  que significa HyperText Transference Protocol, es decir, Protocolo de Transferencia de Hipertexto.

Página web estática y página web dinámica

Una página web estática es aquella cuyo contenido se verá siempre igual a menos que se modifique directamente el código que la genera (código html). Mientras que una página web dinámica es aquella cuyo contenido es generado por fórmulas que hacen llamados a una base de datos para imprimir la información en pantalla. En otras palabras, es como si una página web estática ya estuviera creada desde antes de acceder a ella y una página web dinámica se construyera “al vuelo” cuando la ejecutamos.

Un ejemplo de web dinámica sería este blog. Si escribes un comentario aquí, el contenido variará sin haber tocado el código.

Continue reading ‘Curso básico de HTML 1 – Introducción a HTML’ »



Si este artículo te gustó también puedes leer:

Menu desplegable en Moodle (tutorial)

Quienes usen Moodle (el mejor sistema de gestión de e-learning) saben que el mayor problema de este LMS (junto con su espantoso editor HTML) es que sus temas (plantillas) tienen diseños pobres, poco atractivos y que hacen que un sistema tan potente parezca ser una especie de web 1.0

Por suerte, en estos últimos años han empezado a salir diseños variados y plantillas de apariencia profesional. Pero aún así son pocos y los más o menos buenos (ni siquiera realmente sorprendentes) son de pago.

Pero vamos al grano, un sitio web se ve definitivamente mejor si cuenta con un menú desplegable (de esos que despliegan sus contenidos con solo colocar el cursor encima de cada ítem), y si pudiéramos añadir uno a Moodle sería estupendo.

De hecho ya existen plantillas que cuentan con menús desplegables, aquí las que me han gustado:

Sin embargo, son pocos, y sería genial poder añadir un menú desplegable a cualquier tema de Moodle, ya que hay varios temas bastante atractivos y si le podemos añadir el menú quedará de lo lindo. Vamos al hecho.
Continue reading ‘Menu desplegable en Moodle (tutorial)’ »



Si este artículo te gustó también puedes leer: