Diseño de Webs en .NET

Ajrob · #1 (**permalink**) 29/12/2005, 03:31

Buenas, yo las páginas antes las hacía para php y para realizar su diseño me valía del uso de tables con sus filas y columnas para delimitar los espacios de las imagenes y contenidos.
En .NET es recomendable seguir realizandolo así, o hay algún otro método que sea intersante y deba aprender?

Muchas gracias y un saludo.

doncog · #2 (**permalink**) 29/12/2005, 07:13

Hola te recomiendo que trabajes en Dreamweaver y cuando tengas el diseño listo y te falte solo la programacion, ballas a el codigo y lo copies todo despues te vas a visual en la parte de htm y borra todo y copia el codigo de Dreamweaver.
bueno yo trabajo haci y no e tenido problemas.

Atte. cog

Ajrob · #3 (**permalink**) 29/12/2005, 07:39

Entonces me copio todo lo que haya hecho con el dreamWeaver y lo paso al studio al aspx, pero supongo que solo la parte de dentro del body, porque los code behind y demas los necesita para usar despues el aspx.cs

Pos nada probaré así a ver que tal. De todas maneras hay gente que diseña mediante divs no? es más efectivo? cual os parece mejor?

Un saludo y gracias por la respuesta.

Nombela · #4 (**permalink**) 29/12/2005, 09:30

Las tablas usalas para mostrar datos, para diseñar tu pagina web lo mejor que puedes usar es div.
Mirate: estandares w3c

Ajrob · #5 (**permalink**) 29/12/2005, 10:10

Busco en google? o es un hilo de este foro? es que he buscado "estandares w3c" y no he encontrado nada. Sin las comillas muchos temas relacionados que me han llevado a otros sitios y esos a otros y al final de algo me he enterado, pero aún no lo veo del todo claro.
¿Sabeis de algún sitio donde venga un ejemplo sencillito de uso de etiquetas div para diseños? para ver como se les da las propiedades para ubicarlas separarlas y tal. Para después yo intentar ampliar esos ejemplos con la práctica.
Estoy por comprarme algún libro para aprender bien

Muchas gracias por la ayuda y un saludo.

xknown · #6 (**permalink**) 29/12/2005, 18:06

Una página que en su momento me sirvió de base:
http://www.tierradenomadas.com/

Saludos

Ajrob · #7 (**permalink**) 14/03/2006, 10:36

Buenas, sigo aun a vueltas con cambiar los tables por divs.
Os pongo un ejemplo:

Aqui deberia usar divs para cada área de contenido?
Muchas Gracias y un saludo.

stjepan · #8 (**permalink**) 14/03/2006, 14:23

puedes utilizar como te mencionan arriba las recomendaciones del w3c, que es en vez de usar tablas utilizas div. y luego mediante un archivo de estilo css, podoras decirle por medio de su id en que parte de tu pagina lo quieres, yo he trabajado con div con la propiedad ms_positioning="GridLayout", de este modo en .net puede mover los objetos dentro del div con el mouse o con las flechas, puedes buscarlo enta dentro de los componentes de la paleta html y se llama grid layout panel. Es bien versatil, esto ya que luego puedes cambiar el diseño de tu pagina solo cambiando el css y listo, toda pagina se reacomoda a tus gustos

stjepan · #9 (**permalink**) 14/03/2006, 14:26

se me paso incluirte algunos links

referencias
http://www.w3schools.com/css/css_reference.asp

ejemplos:

http://www.mezzoblue.com/zengarden/alldesigns/

Ajrob · #10 (**permalink**) 21/03/2006, 07:26

Antes de nada muchas gracias por la ayuda para realizar el cambio desde tables. Ahora tengo más dudas...

No consigo ver el segundo div (nombre), he probado cambiandole la propiedad z-index, pero nada. ¿Sabeis por qué es?

Código:

<style type="text/css">
<!--
#cabecera {
	position:relative;
	left:0px;
	top:0px;
	width:800px;
	height:120px;
	z-index:0;
	background-image: url(imagenes/web/superior.png);
	visibility: visible;
}
#nombre {
	position:relative;
	left:400px;
	top:90px;
	width:120px;
	height:20px;
	z-index:1;
	background-color: #FFFFFF;
	visibility: visible;
}
-->
</style>
</head>
<body>
 
 <div id="cabecera">
 <div id="nombre">Usuario:&nbsp;</div> 
 </div>


</body>

javiermil · #11 (**permalink**) 21/03/2006, 08:12

Hola, no sé qué problema tienes, yo veo el div nombre perfectamente. Saludos

Ajrob · #12 (**permalink**) 21/03/2006, 08:24

jobar, muchisimas gracias, no tenia actualizado el archivo en el servidor!!!
:$

Ajrob · #13 (**permalink**) 21/03/2006, 10:15

Una cosilla más y el estilo este se puede considerar el correcto?
Poner un monton de divs? o mezclariais tables con divs? estaría bien poner dentro de un div de tipo noticia principal por ejemplo, una tabla con una fila para el titular, otra para la foto y otra para un avance del contenido?

y lo de ms_positioning="GridLayout" no me funciona, hay que ponerlo en el body y ya deberias poder mover los div y tal?

Muchas gracias y un saludo.

rodri · #14 (**permalink**) 21/03/2006, 15:28

no te recomendaria utilizar posicionamiento absoluto, FlowLayout es la forma mas estandar de trabajar en diseños mas serios. aunque hay bastantes recursos te paso uno interesante: www.glish.com/css/
o también la página www.csszengarden.com

saludos

Ajrob · #15 (**permalink**) 06/04/2006, 09:11

Cita:

Iniciado por rodri

no te recomendaria utilizar posicionamiento absoluto, FlowLayout es la forma mas estandar de trabajar en diseños mas serios. aunque hay bastantes recursos te paso uno interesante: www.glish.com/css/
o también la página www.csszengarden.com

saludos

con lo de FlowLayout te refieres a la propiedad del body MS_POSITIONING??
Y si no uso posicionamiento absoluto, que pongo position:relative en cada div?

Muchas gracias y un saludo.

Ajrob · #16 (**permalink**) 21/04/2006, 10:31

Alguien me puede decir por favor si sería más correcto trabajar con lo de position:relative en cada div??

Un saludo y muchas gracias.

Ajrob · #17 (**permalink**) 22/04/2006, 05:25

Este código con el que estoy haciendo las separaciones de las distintas partes de la página web me lo muestra muy distinto visualmente dependiendo si lo veo con firefox o con el internet explorer.

Código:

 <div id="contenedor" style="width: 800px;">
        <div id="cabecera_superior" style="width: 800px; height: 120px;">
            <div id="cabecera_superior_r1_c1" style="width: 350px; height: 120px; position:relative; right:0px">
                <asp:Image ID="img_cabecera_superior_r1_c1" runat="server" ImageUrl="~/imagenes/Cabecera_r1_c1.jpg" />
            </div>
            <div style="width: 450px; height: 65px; position:relative; right:-350px; top: -120px;">
                <asp:Image ID="img_cabecera_superior_r1_c2" runat="server" ImageUrl="~/imagenes/Cabecera_r1_c2.jpg" />
            </div>
            <div style="width: 450px; height: 55px; position:relative; right:-350px; top: -120px;">
                <asp:Image ID="img_cabecera_superior_r2_c2" runat="server" ImageUrl="~/imagenes/Cabecera_r2_c2.jpg" />
            </div>
        </div>    
        <div id="cabecera_menu" style="width: 800px; height: 35px">
            <asp:Image ID="menu" runat="server" ImageUrl="~/imagenes/web/menu.png" />
        </div>
        <div id="cabecera_publi" style="width: 800px; height: 100px">
            <asp:Image ID="publicidad" runat="server" ImageUrl="~/imagenes/web/superior_publicidad.png" />
        </div>
        <div id="cuerpo" style="width: 800px; height: 165px">
        </div>
    </div>

Hay alguna manera para hacer que se vean parecidos en los dos navegadores?

Un saludo y gracias.

Stream · #18 (**permalink**) 22/04/2006, 08:29

Ese es el detalle... mejor usa tablas.. asi será más compatibles con varios navegadores... yo personalmente uso tablas... y lo del ms_positioning="GridLayout" no es recomendable en .net.. es mejor usarlo sin eso ó flowLayout, es decir.. tienes que dejarlo tal cual esta construido el html.. te lo digo por que el GridLayout y su posicionamiento absoluto te puede dar problemas...

Ajrob · #19 (**permalink**) 22/04/2006, 09:15

Si?? Me recomiendas que al final vuelva a las tablas??

despues de mil aproximaciones a esto de los divs... xD
Pos nada creo que así acabaré antes porque con las etiquetas ando muy perdido.

Muchas gracias!

Stream · #20 (**permalink**) 22/04/2006, 09:52

Mira.. yo te lo digo por si te interesa lo de la compatibilidad de los navegadores... ya que si va a ser solo para internet explorer si esta bien que usas div's.. pero sino es esi usa tablas, es más compatible...

Stream · #21 (**permalink**) 22/04/2006, 10:07

Bueno, en realidad es cuestion de diseño, pero, si te puedo asegurar que los div's se comportan diferente en explorer y firefox.. creo que debido al flujo y al comportamiento de cada navegador... si vas a usar div's tendrias que complementarlo con hojas de estilo (css) ya que de otra manera te puede causar problemas... por si meter un monton de divs puede llegar a deformar tu pagina.. entonces, tendrias que cuidate el diseño de las clases en tu hoja de estilos... yo te recomiendo usar tablas... son más estables.. incluso puedes usar divs dentro de las td's de las tablas... en si esta bien usar div's si le aplicas estilos.. pero pero para más compatibilidad usa tablas e igual le puedes meter estilos e imagenes...