SlideShare une entreprise Scribd logo
1  sur  13
Télécharger pour lire hors ligne
C
Qué es?
• Son plantillas que contienen controles
destinados a que el usuario introduzca
datos que serán enviados. Es un punto
de interacción entre el usuario y la web,
un formulario puede contener texto,
controles y etiquetas.
Para que sirve?
• La principal utilidad de los formularios es la posibilidad recolectar
información mediante la creación de cuestionarios, encuestas,
páginas de comentarios o cualquier documento en la que se
desee una interacción por parte del usuario, esta será enviada
nuevamente al servidor.
Tipos de Etiquetas:
• Form: Es el que contiene todos los elementos del
formulario.
• INPUT: es esencial ya que se usa para crear elementos
interactivos.
• TEXTAREA: Se utiliza para escribir comentarios mas largos.
• SELECT: Sirve para crear una lista desplegable de
elementos .
• LABEL: Se utiliza par definir el nombre visible a cada uno
de los campos.
TIPOS DE CONTROLES
Botones de envío (submit buttons):
Cuando se activa, un botón de envío.
Un formulario puede contener más de
un botón de envío.
Botones de reinicialización
(reset buttons): Cuando se activa,
un botón de reinicialización
reinicializa todos los controles a
sus valores iniciales.
Botones pulsadores (push buttons): Los
botones pulsadores no tienen un
comportamiento por defecto. Cada botón
pulsador puede tener asociados scripts a
través del atributo event del elemento.
Cuando ocurre un evento (p.ej., el usuario
aprieta el botón, lo suelta, etc.), se acciona
el script asociado.
BOTONES
Casillas de verificación (checkboxes)
Las casillas de verificación son interruptores de encendido/apagado
que pueden ser conmutados por el usuario. Una casilla de
verificación está "marcada" cuando se establece el atributo checked
del elemento de control. Cuando se envía un formulario, solamente
pueden tener éxito los controles de casillas de verificación que estén
marcadas.
Radiobotones (radio buttons)
Los radiobotones son como las casillas de verificación, excepto en
que cuando varios comparten el mismo nombre de control, son
mutuamente exclusivos: cuando uno está "encendido", todos los
demás con el mismo nombre se "apagan". Para crear un control de
radiobotón se usa el elemento INPUT.
Menúes (menus)
Los menúes ofrecen al usuario opciones entre las cuales
elegir. El elemento SELECT crea un menú, en
combinación con los elementos OPTGROUP y OPTION.
Entrada de texto (text input)
Hay dos tipos de controles que permiten a los usuarios
introducir textos. El elemento INPUT crea un control de
entrada de una sola línea, y el elemento TEXTAREA
crea una control de entrada de varias líneas. En ambos
casos, el texto introducido se convierte en el valor actual
del control.
Selección de ficheros (file select)
Este tipo de control permite al usuario elegir ficheros de
modo que sus contenidos puedan ser enviados con un
formulario. Se usa el elemento INPUT para crear un
control de selección de ficheros.
C
ATRIBUTOS DE ETIQUETAS
Una etiqueta se emplea para incluir un
enlace en una página. Utilizando sólo la
etiqueta no es posible establecer la
dirección a la que apunta cada enlace.
Como no es viable crear una etiqueta por
cada enlace diferente, la solución consiste
en personalizar las etiquetas HTML
mediante cierta información adicional
llamada atributos.
De esta forma, se utiliza una
misma etiqueta para todos los
enlaces de la página y se utilizan
los atributos para indicar la
dirección a la que apunta cada
enlace.
De esta forma, es habitual explicar por separado los atributos comunes de las etiquetas para no tener que
volver a hacerlo cada vez que se explica una nueva etiqueta. Los atributos comunes se dividen en cuatro
grupos según su funcionalidad
Atributos básicos: se pueden utilizar prácticamente en
todas las etiquetas HTML.
Atributos para internacionalización: los utilizan
las páginas que muestran sus contenidos en varios
idiomas y para aquellas que quieren indicar de
forma explícita el idioma de sus contenidos
Atributos de eventos: sólo se utilizan
en las páginas web dinámicas creadas
con JavaScript para realizar acciones
dinámicas sobre los elementos de la
página. Cada vez que el usuario pulsar
una tecla, mueve su ratón o pulsa
cualquier botón del ratón, se produce
un evento dentro del navegador.
Atributos de foco: relacionados principalmente con la
accesibilidad de los sitios web, Los elementos de las
páginas web también pueden obtener el foco de la
aplicación (en este caso, el foco del navegador) y HTML
define algunos atributos específicos para controlar cómo
se seleccionan los elementos.

Contenu connexe

Tendances

Formularios de-excel-
Formularios de-excel-Formularios de-excel-
Formularios de-excel-
brylejo
 
DESARROLLA APLICACIONES DE ESCRITORIO CON BASES DE DATOS
DESARROLLA  APLICACIONES DE ESCRITORIO CON BASES DE DATOS DESARROLLA  APLICACIONES DE ESCRITORIO CON BASES DE DATOS
DESARROLLA APLICACIONES DE ESCRITORIO CON BASES DE DATOS
mariavaargas
 
empleo de los controles de las herramientas de visual basic
empleo de los controles de las herramientas de visual basicempleo de los controles de las herramientas de visual basic
empleo de los controles de las herramientas de visual basic
Diana Peragallo
 

Tendances (13)

Clase swing
Clase swingClase swing
Clase swing
 
10 Herramientas Visual Basic
10 Herramientas Visual Basic 10 Herramientas Visual Basic
10 Herramientas Visual Basic
 
Visual Basic 6.0
Visual Basic 6.0Visual Basic 6.0
Visual Basic 6.0
 
Visual basic
Visual basicVisual basic
Visual basic
 
Visual basic ..!
Visual basic ..!Visual basic ..!
Visual basic ..!
 
Curso de Android 4.x: Unidad 05 Manejo de Formularios
Curso de Android 4.x: Unidad 05 Manejo de FormulariosCurso de Android 4.x: Unidad 05 Manejo de Formularios
Curso de Android 4.x: Unidad 05 Manejo de Formularios
 
CONTROLES COMUNES VISUAL BASIC
CONTROLES COMUNES VISUAL BASICCONTROLES COMUNES VISUAL BASIC
CONTROLES COMUNES VISUAL BASIC
 
Visual Basic
Visual BasicVisual Basic
Visual Basic
 
Formularios de-excel-
Formularios de-excel-Formularios de-excel-
Formularios de-excel-
 
App web cap4 (2)
App web cap4 (2)App web cap4 (2)
App web cap4 (2)
 
DESARROLLA APLICACIONES DE ESCRITORIO CON BASES DE DATOS
DESARROLLA  APLICACIONES DE ESCRITORIO CON BASES DE DATOS DESARROLLA  APLICACIONES DE ESCRITORIO CON BASES DE DATOS
DESARROLLA APLICACIONES DE ESCRITORIO CON BASES DE DATOS
 
empleo de los controles de las herramientas de visual basic
empleo de los controles de las herramientas de visual basicempleo de los controles de las herramientas de visual basic
empleo de los controles de las herramientas de visual basic
 
DISEÑO MENU
DISEÑO MENUDISEÑO MENU
DISEÑO MENU
 

Similaire à Diseño de formularios (2)

Curso De Microsoft Visual Fox Pro For Windows
Curso De Microsoft Visual Fox Pro  For WindowsCurso De Microsoft Visual Fox Pro  For Windows
Curso De Microsoft Visual Fox Pro For Windows
rtinoco89
 
Aplica los fundamentos de programacion web
Aplica los fundamentos de programacion webAplica los fundamentos de programacion web
Aplica los fundamentos de programacion web
miguel9728
 
Controles de formularios e informes
Controles de formularios e informesControles de formularios e informes
Controles de formularios e informes
Gata Stefania
 
Controles de formularios e informes
Controles de formularios e informesControles de formularios e informes
Controles de formularios e informes
Gata Stefania
 
Controles formulario e informe (3) tics
Controles formulario e informe (3) ticsControles formulario e informe (3) tics
Controles formulario e informe (3) tics
Gata Stefania
 

Similaire à Diseño de formularios (2) (20)

Curso De Microsoft Visual Fox Pro For Windows
Curso De Microsoft Visual Fox Pro  For WindowsCurso De Microsoft Visual Fox Pro  For Windows
Curso De Microsoft Visual Fox Pro For Windows
 
Aplica los fundamentos de programacion web
Aplica los fundamentos de programacion webAplica los fundamentos de programacion web
Aplica los fundamentos de programacion web
 
Manual visual studio 2010
Manual visual studio 2010Manual visual studio 2010
Manual visual studio 2010
 
Trabajo de desarrollo
Trabajo de desarrolloTrabajo de desarrollo
Trabajo de desarrollo
 
manual visual_studio_2010_
manual visual_studio_2010_manual visual_studio_2010_
manual visual_studio_2010_
 
visual basic
visual basicvisual basic
visual basic
 
IntroduccióN Bea
IntroduccióN BeaIntroduccióN Bea
IntroduccióN Bea
 
Visual Basic
Visual BasicVisual Basic
Visual Basic
 
Visual basic
Visual basicVisual basic
Visual basic
 
Visual basic
Visual basicVisual basic
Visual basic
 
Visual basic
Visual basicVisual basic
Visual basic
 
programacion. visual basic 6.0
programacion. visual basic 6.0programacion. visual basic 6.0
programacion. visual basic 6.0
 
Html 5: formularios
Html 5: formulariosHtml 5: formularios
Html 5: formularios
 
Herramientas y Desarrollo de Software
Herramientas y Desarrollo de SoftwareHerramientas y Desarrollo de Software
Herramientas y Desarrollo de Software
 
Paso a paso para crear un formulario en dreamweaver.
Paso a paso para crear un formulario en dreamweaver.Paso a paso para crear un formulario en dreamweaver.
Paso a paso para crear un formulario en dreamweaver.
 
Controles de formularios e informes
Controles de formularios e informesControles de formularios e informes
Controles de formularios e informes
 
Que es dreamweaver
Que es dreamweaverQue es dreamweaver
Que es dreamweaver
 
Controles de formularios e informes
Controles de formularios e informesControles de formularios e informes
Controles de formularios e informes
 
Controles formulario e informe (3) tics
Controles formulario e informe (3) ticsControles formulario e informe (3) tics
Controles formulario e informe (3) tics
 
Introducción a HTML
Introducción a HTMLIntroducción a HTML
Introducción a HTML
 

Plus de paulcuenca9

Plus de paulcuenca9 (20)

Informe grupal f_arinango_ cuenca
Informe grupal f_arinango_ cuencaInforme grupal f_arinango_ cuenca
Informe grupal f_arinango_ cuenca
 
Chatbot convertido compressed (1)-comprimido (3)-convertido
Chatbot convertido compressed (1)-comprimido (3)-convertidoChatbot convertido compressed (1)-comprimido (3)-convertido
Chatbot convertido compressed (1)-comprimido (3)-convertido
 
Chatbot convertido compressed (1)-comprimido (3)
Chatbot convertido compressed (1)-comprimido (3)Chatbot convertido compressed (1)-comprimido (3)
Chatbot convertido compressed (1)-comprimido (3)
 
18
1818
18
 
017
017017
017
 
016
016016
016
 
Jefferson cuenca practica_b#7
Jefferson cuenca practica_b#7Jefferson cuenca practica_b#7
Jefferson cuenca practica_b#7
 
Jefferson cuenca practica_b#6
Jefferson cuenca practica_b#6Jefferson cuenca practica_b#6
Jefferson cuenca practica_b#6
 
Jefferson cuenca practica_b#5
Jefferson cuenca practica_b#5Jefferson cuenca practica_b#5
Jefferson cuenca practica_b#5
 
Jefferson cuenca practica_b#4
Jefferson cuenca practica_b#4Jefferson cuenca practica_b#4
Jefferson cuenca practica_b#4
 
Jefferson cuenca practica_b#3
Jefferson cuenca practica_b#3Jefferson cuenca practica_b#3
Jefferson cuenca practica_b#3
 
Jefferson cuenca practica_b#2
Jefferson cuenca practica_b#2Jefferson cuenca practica_b#2
Jefferson cuenca practica_b#2
 
Jefferson cuenca practica_b#1
Jefferson cuenca practica_b#1Jefferson cuenca practica_b#1
Jefferson cuenca practica_b#1
 
Base de datos_-_php_myadmin_(3)
Base de datos_-_php_myadmin_(3)Base de datos_-_php_myadmin_(3)
Base de datos_-_php_myadmin_(3)
 
Vector
VectorVector
Vector
 
15
1515
15
 
14
1414
14
 
Jefferson cuenca trabajos_individuales#13
Jefferson cuenca trabajos_individuales#13Jefferson cuenca trabajos_individuales#13
Jefferson cuenca trabajos_individuales#13
 
Jefferson cuenca trabajos_individuales#12
Jefferson cuenca trabajos_individuales#12Jefferson cuenca trabajos_individuales#12
Jefferson cuenca trabajos_individuales#12
 
Jefferson cuenca trabajos_individuales#11
Jefferson cuenca trabajos_individuales#11Jefferson cuenca trabajos_individuales#11
Jefferson cuenca trabajos_individuales#11
 

Dernier

Unidad V. Disoluciones quimica de las disoluciones
Unidad V. Disoluciones quimica de las disolucionesUnidad V. Disoluciones quimica de las disoluciones
Unidad V. Disoluciones quimica de las disoluciones
chorantina325
 

Dernier (6)

PPT-HISTORIA-6°-ABC.pptxjjjjjjjjjjjjjjjjjjjjjj
PPT-HISTORIA-6°-ABC.pptxjjjjjjjjjjjjjjjjjjjjjjPPT-HISTORIA-6°-ABC.pptxjjjjjjjjjjjjjjjjjjjjjj
PPT-HISTORIA-6°-ABC.pptxjjjjjjjjjjjjjjjjjjjjjj
 
¡Descubre el Poder del Masaje Holístico en nuestra Primera Sesión del Seminar...
¡Descubre el Poder del Masaje Holístico en nuestra Primera Sesión del Seminar...¡Descubre el Poder del Masaje Holístico en nuestra Primera Sesión del Seminar...
¡Descubre el Poder del Masaje Holístico en nuestra Primera Sesión del Seminar...
 
PSICOPATOLOGIA I.pptxdhehehehehehehehehe
PSICOPATOLOGIA I.pptxdhehehehehehehehehePSICOPATOLOGIA I.pptxdhehehehehehehehehe
PSICOPATOLOGIA I.pptxdhehehehehehehehehe
 
Unidad V. Disoluciones quimica de las disoluciones
Unidad V. Disoluciones quimica de las disolucionesUnidad V. Disoluciones quimica de las disoluciones
Unidad V. Disoluciones quimica de las disoluciones
 
Corte de luz 2024 Guayaquil Guayas ecuad
Corte de luz 2024 Guayaquil Guayas ecuadCorte de luz 2024 Guayaquil Guayas ecuad
Corte de luz 2024 Guayaquil Guayas ecuad
 
Las redes sociales en el mercado digital
Las redes sociales en el mercado digitalLas redes sociales en el mercado digital
Las redes sociales en el mercado digital
 

Diseño de formularios (2)

  • 1. C
  • 2. Qué es? • Son plantillas que contienen controles destinados a que el usuario introduzca datos que serán enviados. Es un punto de interacción entre el usuario y la web, un formulario puede contener texto, controles y etiquetas.
  • 3. Para que sirve? • La principal utilidad de los formularios es la posibilidad recolectar información mediante la creación de cuestionarios, encuestas, páginas de comentarios o cualquier documento en la que se desee una interacción por parte del usuario, esta será enviada nuevamente al servidor.
  • 4. Tipos de Etiquetas: • Form: Es el que contiene todos los elementos del formulario. • INPUT: es esencial ya que se usa para crear elementos interactivos. • TEXTAREA: Se utiliza para escribir comentarios mas largos. • SELECT: Sirve para crear una lista desplegable de elementos . • LABEL: Se utiliza par definir el nombre visible a cada uno de los campos.
  • 5. TIPOS DE CONTROLES Botones de envío (submit buttons): Cuando se activa, un botón de envío. Un formulario puede contener más de un botón de envío. Botones de reinicialización (reset buttons): Cuando se activa, un botón de reinicialización reinicializa todos los controles a sus valores iniciales. Botones pulsadores (push buttons): Los botones pulsadores no tienen un comportamiento por defecto. Cada botón pulsador puede tener asociados scripts a través del atributo event del elemento. Cuando ocurre un evento (p.ej., el usuario aprieta el botón, lo suelta, etc.), se acciona el script asociado. BOTONES
  • 6. Casillas de verificación (checkboxes) Las casillas de verificación son interruptores de encendido/apagado que pueden ser conmutados por el usuario. Una casilla de verificación está "marcada" cuando se establece el atributo checked del elemento de control. Cuando se envía un formulario, solamente pueden tener éxito los controles de casillas de verificación que estén marcadas. Radiobotones (radio buttons) Los radiobotones son como las casillas de verificación, excepto en que cuando varios comparten el mismo nombre de control, son mutuamente exclusivos: cuando uno está "encendido", todos los demás con el mismo nombre se "apagan". Para crear un control de radiobotón se usa el elemento INPUT.
  • 7. Menúes (menus) Los menúes ofrecen al usuario opciones entre las cuales elegir. El elemento SELECT crea un menú, en combinación con los elementos OPTGROUP y OPTION. Entrada de texto (text input) Hay dos tipos de controles que permiten a los usuarios introducir textos. El elemento INPUT crea un control de entrada de una sola línea, y el elemento TEXTAREA crea una control de entrada de varias líneas. En ambos casos, el texto introducido se convierte en el valor actual del control.
  • 8. Selección de ficheros (file select) Este tipo de control permite al usuario elegir ficheros de modo que sus contenidos puedan ser enviados con un formulario. Se usa el elemento INPUT para crear un control de selección de ficheros.
  • 9. C ATRIBUTOS DE ETIQUETAS Una etiqueta se emplea para incluir un enlace en una página. Utilizando sólo la etiqueta no es posible establecer la dirección a la que apunta cada enlace. Como no es viable crear una etiqueta por cada enlace diferente, la solución consiste en personalizar las etiquetas HTML mediante cierta información adicional llamada atributos. De esta forma, se utiliza una misma etiqueta para todos los enlaces de la página y se utilizan los atributos para indicar la dirección a la que apunta cada enlace. De esta forma, es habitual explicar por separado los atributos comunes de las etiquetas para no tener que volver a hacerlo cada vez que se explica una nueva etiqueta. Los atributos comunes se dividen en cuatro grupos según su funcionalidad
  • 10. Atributos básicos: se pueden utilizar prácticamente en todas las etiquetas HTML.
  • 11. Atributos para internacionalización: los utilizan las páginas que muestran sus contenidos en varios idiomas y para aquellas que quieren indicar de forma explícita el idioma de sus contenidos
  • 12. Atributos de eventos: sólo se utilizan en las páginas web dinámicas creadas con JavaScript para realizar acciones dinámicas sobre los elementos de la página. Cada vez que el usuario pulsar una tecla, mueve su ratón o pulsa cualquier botón del ratón, se produce un evento dentro del navegador.
  • 13. Atributos de foco: relacionados principalmente con la accesibilidad de los sitios web, Los elementos de las páginas web también pueden obtener el foco de la aplicación (en este caso, el foco del navegador) y HTML define algunos atributos específicos para controlar cómo se seleccionan los elementos.