Tecnología

Inicio

Cómo hacer un formulario de contacto en HTML5

HTML 5 es la quinta revisión del lenguaje de diseño Web universalmente aceptado, el lenguaje de marcado de hipertexto o HTML. Un formulario de contacto le permite colocar los campos vacíos en su sitio web que un visitante puede rellenar y enviar. Desarrolladores o propietarios de los sitios pueden utilizar formularios de contacto para recibir información útil, preguntas u otra información de los visitantes. HTML 5 ofrece nuevos tipos de entrada para las formas de contacto que se integran bien con muchos navegadores móviles teléfonos inteligentes y tabletas.

Instrucciones

1 Abra el archivo HTML que desea crear un formulario de contacto en el Bloc de notas o su editor HTML preferido.

2 Introducir el código siguiente en la página donde desea que el formulario de contacto que aparezca, para iniciar el formulario:

<Fieldset>

3 Inserte el siguiente código debajo de la etiqueta "<fieldset>" para crear la apertura de la primera forma:

<Label> Nombre </ label>

<Input type = "text" marcador de posición = "Escribe aquí">

4 Cambiar "Nombre" de la etiqueta que desea que aparezca por encima del campo de formulario. Por ejemplo, se podría especificar "Dirección de correo electrónico" o "Número de teléfono".

5 Cambiar "<input type =" text "para el tipo de campo que se desea crear. De uso general HTML 5 campos incluyen" texto "," e-mail "y" URL ". Cada tipo permite a los usuarios de entrada diferentes tipos de información. Texto campos permiten a los usuarios a las cadenas de entrada de texto, campos de correo electrónico permiten a los usuarios introducir texto y números en la forma de una dirección de correo electrónico y el URL permite a los usuarios introducir texto en formato de dirección web.

6 Reemplazar "Escribe aquí" con el texto de marcador de posición o instrucciones que desea que aparezca rellenado previamente en el campo. Por ejemplo, en un campo de correo electrónico, se puede insertar el texto "Introducir dirección de correo electrónico" marcador de posición.

7 Añadir tantas formas como desee, utilizando el código de ejemplo en el paso 3. Por otra parte, si desea agregar un cuadro de área de texto que permite a los usuarios introducir grandes cantidades de texto, añada la siguiente cadena de código:

<Label> Comentarios </ label>

<Tipo de área de texto = "mensaje" de marcador de posición = "Comentarios extra aquí"> </ textarea>

Realizar cambios en "Comentarios" para cambiar el texto de la etiqueta y "extra comentarios aquí" para cambiar el texto de marcador de posición en el cuadro de texto.

8 Agregue el código siguiente en la parte inferior de la totalidad de las formas para crear un botón de envío:

<Input type = "submit" value = "Enviar">

Cambiar "Enviar" para el texto que desea que aparezca en el botón de envío.

9 Introducir la siguiente etiqueta de cierre por debajo de todas las formas:

</ Fieldset>

10 Guarde el archivo y subirlo a su servidor.

Consejos y advertencias

  • Usar PHP con la forma de procesar y validar la información presentada por los visitantes en el formulario.
  • Añadir estilo CSS a las formas de cambiar la forma cómo se ve en el navegador del visitante.