etiqueta p dentro de una imagen

[esaenz22]

buenas tardes. me informaron que ahora es obligatorio colocar dentro de una etiqueta <p> parrafo una imagen, ya que cuando se maqueta en divs el navegador (supongo que en explorer o firefox) lo interpretara como error.

mi pregunta es por que se debe colocar la imagen dentro de un parrafo ?.

saludos.

[ElJavista]

Es una broma? no le veo el sentido, donde te han informado eso? suena a un disparate.

[esaenz22]

no es broma. asi me contaron. o habre entendido mal.

bueno. si me equivoque emi post, mejor borrenlo. asi me evitare problemas.

saludos.

[ElJavista]

A ver, no creo que hayas entendido mal, mas bien parece que un desinformado te lo dijo. Mencionas que cuando se maquetea con divs lo interpreta como error. Eso es absurdo, se debe maquetear con divs y CSS más bien. Lo que debe suceder es que tal vez alguien intentó hacerlo y no le resultó por algún motivo, desconocimiento a lo mejor y recurrió al viejo truco del la imagen transparente, la cual antes se usaba para dar espacios, digamos ayudaba a maquetear.

A lo mejor te quiso decir eso, que no podía hacerlo con divs y CSS y por eso recurría a ese truco tan viejo y desusado.

[esaenz22]

no es eso. mejor investigare de nuevo y asi volvere a replantear mi pregunta. de todas maneras, gracias por tu respuesta.

saludos.

[ElJavista]

Mejor preguntale a ese tío que te dijo eso exactamente a qué se refería y nos los expones aquí.

[ArturoGallegos]

Iniciado por ElJavista

Es una broma? no le veo el sentido, donde te han informado eso? suena a un disparate.

pues yo tampoco le veía sentido hasta que hice una prueba he intente validar

y la w3c me arroja esto cuando tu doctype es XHTML 1.0 Strict

document type does not allow element "img" here; missing one of "p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "address", "fieldset", "ins", "del" start-tag

insertando la imagen dentro de un div

Código HTML:

<div><img src="img/logo.png" alt="nombre de mi empresa" /></div>
 

validación exitosa


el porque ocurre... alguno de los expertos que nos informe o pase link donde se hable al respecto

me parece el compañero kseso? trabaja con ese doctype haber si viene por aquí y nos informa

Nota: aclaro el error solo lo aprecie con XHTML 1.0 stric
en XHTML 1.0 Transitional no arrojo error alguno

[Portgaz]

Asi que el elemento <del> ya no es valido en strict, ya lo estan dando para fuera.
Si mal no estoy, este fue reemplazado por <S>.

lo de los titulos <h1 - h6>, creo que es mejor poniendo texto narutal dentro de un div y dandole propiedades con css, font-size y text-decoration. o Bien la etiqueta <strong>

Por que la vida no es tan sencilla xD

[Portgaz]

Iniciado por esaenz22

buenas tardes. me informaron que ahora es obligatorio colocar dentro de una etiqueta <p> parrafo una imagen, ya que cuando se maqueta en divs el navegador (supongo que en explorer o firefox) lo interpretara como error.

mi pregunta es por que se debe colocar la imagen dentro de un parrafo ?.

saludos.

Creo que ahi tienen algunas claves.
Con lo que dijo Ag666 y estas claves, se puede entender mas claro.

Etiquetas <P>, Etiquetas <img>, entre otras, deben estar dentro de divs

[ElJavista]

Genial, pero si no es válido poner un img dentro de un p en Strict pues al hombre le informaron precisamente lo contrario:

me informaron que ahora es obligatorio colocar dentro de una etiqueta <p> parrafo una imagen

[Portgaz]

Es lo que veia, pero yo aclaro unos puntos, y seguro, esa informacion esta mal.
Asi que en vez de...

Una imagen dentro de <p>, seria.
Imagenes y p, dentrode un div

p.d: es por de mas esto, ya que nosotros o algunos que si lo comprendimos ya, y sabems que esta informacion esta mal. Nos la pasamos por abajo, pero, aqui tratamos de aclararle el punto al creador del tema, haber si ya se a aclarado :)

[ElJavista]

Si, es un buen ejercicio mental intentar descubrir de donde viene tamaño disparate y honestamente me gustaría que quien inició el tema participaría un poco, talvez lo podamos aclarar con su ayuda, pero parece que se avergonzó. Que mal! él no tiene la culpa de haber escuchado cosas sin sentido. :(

[esaenz22]

gracias por las respuestas. Eljavista. no me avergonze.

solo tenia esa duda. como lo repeti antes, volvere a investigar mas.

saludos.

[ElJavista]

Pero por qué no le preguntas al tio que te dijo eso exactamente qué quizo decir? Y nos los dices a nosotros?

[Portgaz]

<p><img src="img/image.ext" width="00px" height="00px" /></p>

Una img dentro de una P.
Muchos lo usan, debido a que <P> lo utilizar para resaltar textos (No para parrafos)
E inclusive con lo obsoleto de las etiquetas H1 - H6 en strict, muchos utilizan la <P>para poner titulos.

Y unos ponen atributos en el CSS a <P> como por ejemplo, un flota:left.

Y entonces hay algunas imagenes que las usan como cabezeras, o imgtitles (imagen de titulo) y la incluyen dentro de unas etiquetas <P> para que tambien obtengan estos atributos que le han aplicado mediante CSS y asi se ahorran codigo.

P.D: Tu has de estar mal, o entendido mal, no es P dentro de IMG, es alreves



AGREGO:

dices algo como lo siguiente:

obligatorio colocar dentro de una etiqueta <p> parrafo una imagen

Ps es exactamente lo que te he explicado.

Pero el titulo lo tienes mal. ahi dices lo contrario, meter <P> dentro de <IMG>
Cuando en realidad debe de ser:, meter <IMG> dentro de <P>, como te lo he explicado. (lo digo nuevamente)

Saludos

[ArturoGallegos]

Iniciado por Portgaz

<p><img src="img/image.ext" width="00px" height="00px" /></p>

Una img dentro de una P.
Muchos lo usan, debido a que <P> lo utilizar para resaltar textos (No para parrafos)
E inclusive con lo obsoleto de las etiquetas H1 - H6 en strict, muchos utilizan la <P>para poner titulos.

Y unos ponen atributos en el CSS a <P> como por ejemplo, un flota:left.

Y entonces hay algunas imagenes que las usan como cabezeras, o imgtitles (imagen de titulo) y la incluyen dentro de unas etiquetas <P> para que tambien obtengan estos atributos que le han aplicado mediante CSS y asi se ahorran codigo.

la etiqueta <p></p> no tiene nada que ver con querer resaltar textos su función es la de contener párrafos y punto. si alguien le quiere dar un uso distinto no hay nada que se lo impida mas no por ello deja de ser una etiqueta que contendrá un parrafo, si deseas resaltar un texto para eso esta la etiqueta <strong></strong> si se desea un titulo están las h1 - h6

que tu mencionas obsoletas pero me pregunto yo ?¿ que tiene de obsoletas la etiquetas h1 - h6 ??? si puedes fundamentar el porque son obsoletas te lo agradeceré, de lo contrario me mantengo en que cuando se utiliza una imagen en lugar de un titulo regularmente es por el tipo de letra o desean colocarlo como un icono

[esaenz22]

gracias por las respuestas muchachos. al final estuve investigando y me decia que ahora es necesario colocar una imagen dentro de un parrafo, por estandarizacion del html. ya que saldria errores.

Portgaz, tienes razon. escribi mipost al revez. deberia decir:

colocar una imagen dentro de un parrafo por regla estandar html.

saludos.

[ElJavista]

Nunca dijiste un p dentro de un img, dijiste un img dentro de un p y la verdad alguien me podría confirmar que es NECESARIO colocar una imagen dentro de un párrafo por estándarización de HTML, ya que saldría errores. Me sigue pareciendo de los más absurdo.

[TutexMdz]

Es totalmente válido colocar una imágen dentro de las etiquetas <p></p> A veces hasta necesario, como por ejemplo para hacer que la imágen ancle visualmente a un texto. Pero no es obligatorio.

Es un error intentar contener un párrafo dentro de una imágen. Totalmente inválido, que es lo que el titulo de éste post indica.

Por otro lado...

Iniciado por Portgaz

E inclusive con lo obsoleto de las etiquetas H1 - H6 en strict, muchos utilizan la <P>para poner titulos.

Por Dios! que clase de afirmación es ésta??? Gente las etiquetas <Hx> son, junto con las etiquetas <a>, unas de las etiquetas más importantes del HTML y no son obsoletas. Probablemente nunca lo serán! Se que Portgaz estudiará más para la próxima antes de dar su opinión.

[ArturoGallegos]

como prueba te invito a validar el siguiente código, observa el error que te arroja ñ.ñ

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 
<head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <title>Sin título 1</title>
</head>
 
<body>
 
<img src="http://www.forosdelweb.com/customavatars/avatar171379_2.gif" alt="Avatar" />
 
</body>
</html>
 

y como ya mencione antes el error de validación solo se presenta cuando usas xhtml stric si usas Transitional nunca tendrás ese problema

[ElJavista]

Que alivio, pero mi pregunta era si esto era necesario y si no daba error. Lo cual es no es correcto. Bien, era lógico. Además podría agregar que las etiquetas hx no solamente son válidas e importantes sino que tienen una gran carga semántica, por lo cual también han pasado a formar parte del HTML5, honestamente no sé de donde sacó que son obsoletas.

[Portgaz]

Iniciado por ElJavista

Que alivio, pero mi pregunta era si esto era necesario y si no daba error. Lo cual es no es correcto. Bien, era lógico. Además podría agregar que las etiquetas hx no solamente son válidas e importantes sino que tienen una gran carga semántica, por lo cual también han pasado a formar parte del HTML5, honestamente no sé de donde sacó que son obsoletas.

Recuerdo haber leido que ya no las validaba la w3 y que ahora tenian que agregar propiedades con CSS como font-size- font-color o <strong>

de hecho yo no las utilizo, será que no me ha dado la circunstacia de utilizarlas hasta hoy.

Pero bueno me alegra saber que no son obsoletas y que me equivoque y sobre todo que lo tendre en cuenta para proximas, Que si sirven

Saludos y disculpas

[Portgaz]

Me Intriga, me Intriga XD

El Javista y Ag666.
Debido a sus respuestas hay una conclusion a este tema:
Necesario poner una imagen dentro de etiquetas <p>

Entonces resumire y hare uso de sus respuestas para dejar claro:

-En XHTML 1.0 Strict.
Es necesario colocar las imagenes dentro de las etiquetas <p>, si no, te dara error de validacion.

-En XHTML 1.0 Transitional (-).
No dara ningun problemas si solo usas la etiqueta img sin meterla dentro de otras.

Las etiquetas Hx no son obsoletas (lo acabo de aprender)

[ArturoGallegos]

Iniciado por Portgaz

de hecho yo no las utilizo, será que no me ha dado la circunstacia de utilizarlas hasta hoy.

pero como que no se te ha dado la circunstancia de utilizarlas si son indispensables, que no usas títulos en tus párrafos?

que precisamente eso son
h1 -> titulo 1 (principal)
h2 -> subtitulo (titulo secundario)
h3 ...
etc

[Portgaz]

Iniciado por Ag666

pero como que no se te ha dado la circunstancia de utilizarlas si son indispensables, que no usas títulos en tus párrafos?

No!!

Utilizo codigos como:

<div id="dddd"><strong>Titulo</strong></div>
texto o parrafos, aqui hablaremos de bla bla bla bla...

*CSS
#ddd {background: url('img/bg'); repeat-x;}

Agrego un ejemplo:


Saludos

[ArturoGallegos]

pues ya me estoy saliendo del tema tratado aquí, pero compañero Portgaz como ya mencionaron estas etiquetas son importantes para la semántica y sin duda una gran ayuda en cuanto a SEO y posicionamiento se refiere...

que alguien me contradiga si estoy mal, pero tengo entendido lo que es h1, h2 y h3 son de gran valor para los buscadores ya que representan palabras clave del contenido de tu sitio, ayuda a indexar y clasificar mas adecuadamente un sitio, aunque claro no por usarlas tendrás una posición muy buena pero si ayudara bastante

[David]

Iniciado por Portgaz

Debido a sus respuestas hay una conclusion a este tema:
Necesario poner una imagen dentro de etiquetas <p>

Entonces resumire y hare uso de sus respuestas para dejar claro:

-En XHTML 1.0 Strict.
Es necesario colocar las imagenes dentro de las etiquetas <p>, si no, te dara error de validacion.

-En XHTML 1.0 Transitional (-).
No dara ningun problemas si solo usas la etiqueta img sin meterla dentro de otras.

No, creo que hay un error de conceptos o de interpretación de lo que indica el validador.

NO es obligatorio envolver una imagen dentro de etiquetas <p>.

¿Que por qué produce un error el código publicado por Ag666? Sencillo, según la especificación HTML la etiqueta <body> sólo puede contener elementos en boque (div, p, hN, etc.); por lo que cualquier elemento en línea (a, strong, img, etc.) producirá un error si se inserta directamente allí.

[Portgaz]

según la especificación HTML la etiqueta <body> sólo puede contener elementos en boque (div, p, hN, etc.); por lo que cualquier elemento en línea (a, strong, img, etc.) producirá un error si se inserta directamente allí.

Disculpenme por seguir aqui de latoso, pero entonces...

Cuando encontramos una imagen dentro de las etiquetas <p>, no es nada mas ni nada menos, por que asi debe de ser, segun la especificacion de HTML y no cause errores.

Entonces no solo <p>, si no, que si metes una imagen dentro de un div, igual no habra errores.

Estoy bien???
P.D: es que no me sabia esta especificacion que menciona David.

[David]

Así es, con tal de que la imagen esté dentro de un elemento en bloque (p, div, hN, etc.) y no directamente dentro de la etiqueta <body> (o cualquier otra etiqueta que requiera explícitamente que sus descendientes directos sean elementos en bloque) no marcará error en el validador.

[ElJavista]

Genial! llegamos hasta el meollo del asunto. Esta discusión fue muy provechosa. Nunca he usado el HTML strict, pero si sabía que había elementos que no soportaban elementos en línea, aunque no sabía que uno de esos era body. Bien.