Foros aprenderaprogramar.com

Aprender a programar => Aprender a programar desde cero => Mensaje iniciado por: mariobeitia en 03 de Agosto 2015, 18:55

Título: Ejercicio resuelto HTML con div CU00727B. Creación de un portal web básico.
Publicado por: 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>
Título: Re:Ejercicio resuelto HTML CU00727B. Creación de un portal web básico.
Publicado por: Alex Rodríguez 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 <br>, en otros </br>, en otros <br/>

Recomendación: utilizar siempre <br/>

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 <br/> justo antes del texto.

Por cierto una fotografía ciertamente sorprendente

Saludos cordiales
Título: Re:Ejercicio resuelto HTML CU00727B. Creación de un portal web básico.
Publicado por: mariobeitia en 03 de Agosto 2015, 20:55
Muchas gracias por tu respuesta.
Tomado nota de los consejos, ya mofico el código.

Gracias nuevamente.