Semana 7 programacion
Enviado por Bhruguen • 4 de Octubre de 2021 • Trabajo • 813 Palabras (4 Páginas) • 1.092 Visitas
Formularios
Michael Bustamante
Programación
Instituto IACC
05/10/2020
Desarrollo
INSTRUCCIONES:
1. Una empresa que ofrece servicios de salud le pide a usted que programe en su página
web un formulario de contacto como el que se muestra en la imagen:
[pic 1]
¿Qué propuesta de mejora considera que se le pueda plantear a este formulario? ¿Con qué
comandos -tanto HTML como de PHP- se puede generar este requerimiento? Describa la
programación que implementaría en cada uno de los elementos del formulario a su criterio.
Las recomendaciones que yo daría son las siguientes:
- Dice Obligatorio, se cambia a: Campos Obligatorios y el símbolo sería “*” que es el más usado.
- Bajo de nombre dice: firstname, yo le pondría Apellido.
- Donde dice ciudad y país, yo pondría dirección. Donde especifique su calle, comuna y región.
- La inserción de imagen debe ser alguna que sea coherente con él , acá no hay código, más bien se debe consultar imagen a fin.
- También agregaría una separación entre las casillas, solo para que visualmente sea ordenado.
Los códigos para las mejoras anteriores:
(destacado es el código que se usa para implementar la recomendación, y letras azules indican que mejora es la que corresponde.)
<html>
<head>
<title>formulario</title>
<link rel="stylesheet" type="text/css" href="estilo formulario.css">
</head>
<body>
<div class="from">
<form action="formulario.php" method="POST">
<p>Formulario</p>
llene sus datos para contactos
campos obligatorios * // esta es la primera mejora
<p>Nombre</p>
<input type ="text" placeholder="nombre" size= "20" maxlength "50" name="nombre" required><br>
<p>Apellido</p>
<input type ="text" placeholder="apellido" size= "20" maxlength "50" name= "apellido" required><br> // acá es donde está la siguiente mejora.
<p>E-mail</p>
<input type ="text" placeholder="xxxxx@xxxxxx" size="20" maxlength "50" name="email" required><br>
<p>Numero Telfonico</p>
<input type="text" placeholder="+569xxxxxxxx" size="20" maxlength "50" name="telefono" required><br>
<p>Direccion</p>
<input type="text" placeholder="Calle, Comuna, Ciudad, Region" size="20" maxlength "70" name=direccion><br>// recomendación en dirección.
<br><textarea name="Mensaje" placeholder="escribe aqui tu mensaje" required></textarea><br>
<br><input type= "submit" size="30" value="Enviar" name="enviar"><br>
<br><input type="checkbox" name="enviar copia" checked= />enviar copia</br>
</form>
</div>
</body>
</html>
La separación entre casillas se da con el <br> después de cada input.
Codigo para formato.
form{
position:relative;
width:500px;
height:900px;
padding-left:20px;
padding-top: :15;
background-color: #e5dfcd;
border-radius: 20px;
margin:auto;
}
input[type=text],[type=email]{
width: 470px;
height:35px;
font:14px normal normal uppercase helvetica, arial,serif;
}
textarea{
width: 470px;
height:110px;
font:14px normal normal uppercase helvetica, arial,serif;
}
input[type=submit]{
...