Miniatura
0

Fast HTML5: 17, Output

La anterior entrega, Vídeo, en esta… hablaremos sobre el elemento <output>.

Hace algunos posts, hablamos de tags específicos para formularios, pues bien, este es otro de ellos (y aún quedan algunos por salir), si podéis pegad un ojo a los anteriores posts con elementos de formularios, como fueron:

Vamos pues como siempre a la descripción de output en la documentación:

The output element represents the result of a calculation.

Esta es sencilla, ¿verdad?

No deja lugar a mucho que hablar, aunque como es algo nuevo tenemos que hacerlo, obviamente ;-)

<body>
...
    <form>
        <input name="edad" id="edad" type="range" min="0" max="40">
        <output for="edad" onforminput="edad.value">0</output>
    </form>
...
</body>

En el “for” (del input ;-)) colocaremos una lista de ID’s de los elementos que serán calculados, y onforminput es un nuevo atributo, y cuidado porque en algunos casos está deprecated.

Vamos a por una suma sencilla para que veáis cómo funciona (fijaos en el type number):

<body>
...
    <form oninput="resultado.value = parseInt(valor1.value) + parseInt(valor2.value)">
        <input type="number" name="valor1" />
        <input type="number" name="valor2" />
        <output name="resultado">0</output>
    </form>
...
</body>

Cuando pongamos valores a valor1 y valor2, en resultado se visionará la suma (evidentemente, si el navegador reconoce todos los elementos y atributos, recordad la página Can I Use).

Seguiremos con más elementos de formulario para montar uno grande incluyendo todos los nuevos tags y atributos ;-) Pero para abrir boca aquí tenéis algunos ejemplos avanzados utilizando output.

Deja un comentario

Loader
Una web debe ser...

Una web
debe ser

Usable

Un usuario aprende cada día. Navega y utiliza servicios web acostumbrándose a tener algunos elementos en determinado lugar y a utilizarlos de cierta manera. Una aplicación es usable si antes de hacer una determinada acción se puede predecir lo que sucederá.

Universal

El punto de mayor incidencia en la universalidad es que la aplicación sea multidispositivo. Poder visualizar desde cualquier dispositivo, lugar, y momento. Y además, disfrutar de una experiencia de usuario plena.

Encontrable

Hablamos de un conjunto de normas, pautas o guías por las que el usuario llega a la aplicación. Debe encontrar la aplicación, pero puede llegar mediante buscadores (SEO), también con recomendaciones, lecturas en medios, desde redes sociales (SMO), y otros métodos (SEM, etc)

Veloz

Como dijo David Cheriton: "Si es rápido y feo, lo utilizarán y te maldecirán, y si es lento, no lo utilizarán". Si una web es rápida repercute en menos gasto mensual, más satisfacción del usuario, y mayor posibilidad de conversión por parte del mismo.

Útil

Un sitio web tiene que ser útil en vistas al usuario para el que está concebido. Hay que entender la necesidad del usuario y poder ofrecer lo que busca. Contenidos, traducciones, herramientas, comparativas, utilidades, etcétera...

Cerrar