Autor Tema: Ejercicio resuelto HTML con div CU00727B. Creación de un portal web básico. (Leído 3150 veces)

mariobeitia · « **en:** 03 de Agosto 2015, 18:55 »

Buenas tardes, ¿alguien me puede decir si lo que hice respeta la consigna del curso y si está correcto?. Muchas Gracias

Citar

Define la estructura de un portal web que conste de:

a) Una cabecera con una imagen, un texto h1, y otra imagen que a su vez sea un link.
b) Un cuerpo con un menú que contenga 5 items, una imagen y dos párrafos.
c) Un pie que contenga una imagen, un copyright y un texto que sea a su vez un link.

Código: [Seleccionar]

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<meta charset="utf-8">
	<head>
	<title>Portal Básico - aprender a programar.com</title>
	</head>
	<body>
	<div id="page" >
		<div id="header"><img src="http://www.beitia.com.ar/gallery/ae1736f02940e7c8d53ce289dcfe6e70_250x90.png" height="42"></img>
		<h1>Portal (Tutorial básico del programador web: HTML desde cero) - aprenderaprogramar.com</h1>
		<a href="#" ><img src="http://www.beitia.com.ar/gallery/ae1736f02940e7c8d53ce289dcfe6e70_250x90.png" height="24"></img></a>
		</div>
		<div id="wrapper">
			<!-- Inicio Menu-->
			<div id="menu"><!-- Aqui va el código del menú-->
				<div><br><br>Menú</div>
				<hr style="color:red; background-color:red; width:50%; "/>
				<ul>
					<li><a href="#">Portada</a></li>
					<li>
						<a href="https://www.aprenderaprogramar.com">Aprenderaprogramar.com</a>
					</li>
					<li><a href="#2">Foto</a></li>
					<li><a href="#3">Párrafo Uno</a></li>
					<li><a href="#4">Párrafo Dos</a></li>
				</ul>
			</div>
			<!-- Fin Menu-->
			<!-- Inicio Cuerpo-->
			<div id="body">
				<div id="imagen">
				<a id=2>
				<img src="http://www.rionegro.com.ar/diario/funciones/binario/imagen.aspx?idart=7858647&idcat=62202&idcon=6187626&resolucion=0&tipo=2" alt="Vista de Pájaro"></img>
				</a>
				<a href="#">Volver</a>
				</div>
				<div id="parrafo1">
				<a id="3"><h3>Parrafo Uno</h3>
				<p>
				Al hablar de fundamentos de programación nos referimos a aquellos</br>
				conocimientos básicos que nos permitirán desenvolvernos sin excesivo número</br>
				de tropiezos. Veamos a qué tipo de tropiezos nos referimos utilizando un</br>
				símil de transporte. El conductor (programador) dispone de un coche</br>
				(el ordenador) y desea trasladarse</br>
				Al hablar de fundamentos de programación nos referimos a aquellos</br>
				conocimientos básicos que nos permitirán desenvolvernos sin excesivo número</br>
				de tropiezos. Veamos a qué tipo de tropiezos nos referimos utilizando un</br>
				símil de transporte. El conductor (programador) dispone de un coche</br>
				(el ordenador) y desea trasladarse</br>
				Al hablar de fundamentos de programación nos referimos a aquellos</br>
				conocimientos básicos que nos permitirán desenvolvernos sin excesivo número</br>
				de tropiezos. Veamos a qué tipo de tropiezos nos referimos utilizando un</br>
				símil de transporte. El conductor (programador) dispone de un coche</br>
				(el ordenador) y desea trasladarse	</br>			
				</p>
				<a href="#">Volver</a>
				</a>
				</div>
				<div id="parrafo2">
				<a id="4"><h3>Parrafo Dos</h3>
				<p>
				Al hablar de fundamentos de programación nos referimos a aquellos</br>
				conocimientos básicos que nos permitirán desenvolvernos sin excesivo número</br>
				de tropiezos. Veamos a qué tipo de tropiezos nos referimos utilizando un</br>
				símil de transporte. El conductor (programador) dispone de un coche</br>
				(el ordenador) y desea trasladarse</br>
				Al hablar de fundamentos de programación nos referimos a aquellos</br>
				conocimientos básicos que nos permitirán desenvolvernos sin excesivo número</br>
				de tropiezos. Veamos a qué tipo de tropiezos nos referimos utilizando un</br>
				símil de transporte. El conductor (programador) dispone de un coche</br>
				(el ordenador) y desea trasladarse	</br>			
				Al hablar de fundamentos de programación nos referimos a aquellos</br>
				conocimientos básicos que nos permitirán desenvolvernos sin excesivo número</br>
				de tropiezos. Veamos a qué tipo de tropiezos nos referimos utilizando un</br>
				símil de transporte. El conductor (programador) dispone de un coche</br>
				(el ordenador) y desea trasladarse</br>
				</p>
				</a>
				<a href="#">Volver</a>
				</div>

			</div>
			<!-- Fin Cuerpo-->
		</div>
		<div id="footer">
			<p>
			<img src="http://www.beitia.com.ar/gallery/ae1736f02940e7c8d53ce289dcfe6e70_250x90.png" height="10"></img>
			<a href="http://www.beitia.com.ar">Copyright 2006-2072 aprenderaprogramar.com</a></p>
		</div>
	</div>
	</body>
</html>

Alex Rodríguez · « **Respuesta #1 en:** 03 de Agosto 2015, 20:00 »

Hola Mario. El ejercicio está correcto y cumple la consigna del ejercicio en lo fundamental.

Aspectos a mejorar:

El código <meta charset="utf-8"> debe ir dentro de las etiquetas <head> ... </head>

Los valores para atributos id no deben ser números, y deben ir entrecomillados.

Por ejemplo no usar id=2 sino si se quiere id="dos"

No usar en algunos casos , en otros , en otros 

Recomendación: utilizar siempre 

Finalmente si se quiere que el texto volver que aparece a la derecha de la imagen aparezca debajo lo que habría que hacer es introducir un justo antes del texto.

Por cierto una fotografía ciertamente sorprendente

Saludos cordiales

mariobeitia · « **Respuesta #2 en:** 03 de Agosto 2015, 20:55 »

Muchas gracias por tu respuesta.
Tomado nota de los consejos, ya mofico el código.

Gracias nuevamente.

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias: