¿Colocar el input fuera de su label es una mala practica?

Lo importante es que el id del input tenga el for del label. Como en el siguiente ejemplo:

// Ejemplo 1
<label for="name">
	<input id="name" type="text">
</label>

// Ejemplo 2
<label for="name"></label>
<input id="name" type="text">

Gracias PatUgarte y RetaxMaster. Me quedo claro con esto.

¡Hola, Anfervalera!

En realidad no es ni mala ni buena práctica, depende más de la costumbre de el/la desarrollador/a.

Se utiliza para que estén ligadas entre sí el label y el input. Uno de los efectos que esto logra dentro del navegador es que si se hace click sobre el label el cursor se posiciones directamente haciendo foco en el input ++asociado++.

Esta ++asociación++ se logra tanto si el input está contenido dentro de la etiqueta label, como si se hacen coincidir el atributo for en el label con el id en el input.

Si se colocan ambos atributos y no coinciden, aunque estén anidados se pierde el efecto.

Opción 1:

<label for="firstname">First name:</label> 
<input type="text" name="firstname" id="firstname" />

Opción 2:

<label>Last name:
		<input type="text" name="lastname" />
</label> 

Opción no válida: <label ++for=“email”++>Last name: <input type=“text” name=“firstname” ++id=“address”++ /> </label>

Fuente: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label

Espero que sirva la respuesta :)

Hola, no, de hecho es raro colocar un input dentro de un label, usualmente el input y el label suelen ir juntos, si puede ir dentro, pero es más común verlo juntos