Me llamo Miguel y soy recién llegado a la comunidad de Cristalab. Hace unos minutos creé un primer post en el subforo "Muestranos tu trabajo" para presentar la web que andamos haciendo un amigo y un servidor en persona (fwc.uco.net) y tenemos serias dificultades con la cabecera. Al inicio iba a ser una tira negra con varios iconos en unos de los lados pero daba un poquillo de pena, así que con Illustrator me he currado este banner/cabecera para ponerlo arriba del todo:
Puede que el diseño final sea este con los iconos de loginen el lateral derecho, aunque sobre esto le he dicho a mi amigo, que si tenemos problemas, remodelar el panel del formulario de entrada y metemos allí los iconos de acceso. La imagen en Illustrator está sectorizada con los enlaces y con el código HTML que genera Illustrator. El marrón es "reproducir" el código HTML en CSS. La web está hecha mediante plantillas de Ucoz para más información. Aquí el código HTML a "convertir" en CCS:
Código HTML :
<head> <title>Banner</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <div style="position:absolute; left:0px; top:0px; width:1000px; height:229px;"> <div style="background-image:url(Banner_01.png); position:absolute; left:0px; top:0px; width:1000px; height:193px;" title=""> </div> <div style="background-image:url(Banner_02.png); position:absolute; left:0px; top:193px; width:11px; height:36px;" title=""> </div> <a href="http://fwc.ucoz.net" style="cursor:hand"> <div style="background-image:url(Banner_03.png); position:absolute; left:11px; top:193px; width:122px; height:22px;" title=""> </div></a> <a href="http://fwc.ucoz/publ" style="cursor:hand"> <div style="background-image:url(Banner_04.png); position:absolute; left:133px; top:193px; width:121px; height:22px;" title=""> </div></a> <a href="http://fwc.ucoz.net/forum" style="cursor:hand"> <div style="background-image:url(Banner_05.png); position:absolute; left:254px; top:193px; width:121px; height:22px;" title=""> </div></a> <div style="background-image:url(Banner_06.png); position:absolute; left:375px; top:193px; width:625px; height:36px;" title=""> </div> <div style="background-image:url(Banner_07.png); position:absolute; left:11px; top:215px; width:364px; height:14px;" title=""> </div> </div> </body>
Lo que va con enlaces son los botones de Inicio, Noticias y Foro. En el código de arriba especifica las direcciones URL donde redireccionan clickando encima. Yo sé, no tengo conocimientos de diseño web siendo sincero, pero sé que es posible convertir TODO el código de HTML a CSS y que quede como la imagen, pero mi compañero no lo ve claro. Yo le dejé caer que es posible que hayan lineas de código inservibles que destrozan la reproducción. Pero no entra en razón...
Chao!
