Foros del Web » Creando para Internet » CSS »

diseñar TODA una web con layers??

Estas en el tema de diseñar TODA una web con layers?? en el foro de CSS en Foros del Web. holas, una consulta, acabo de hacer una aplicacion web y la hice con harta tabla que felizmente, por ahora, no se descuadra en ningun navegador...pero ...
  #1 (permalink)  
Antiguo 10/08/2007, 14:25
 
Fecha de Ingreso: junio-2007
Mensajes: 53
Antigüedad: 10 años, 5 meses
Puntos: 0
diseñar TODA una web con layers??

holas, una consulta, acabo de hacer una aplicacion web y la hice con harta tabla que felizmente, por ahora, no se descuadra en ningun navegador...pero como saben (o talvez soy solo yo), trabajar con tablas es algo pesado y mas al momento de querer cuadrar algo en la una pagina, por lo que he optado hacer el siguiente proyecto que me han mandado con layers (capas) y me resulto facilisimo porque la coloco donde quiero sin preocuparme que se descuadre ni nada...ayer hice el diseño en fireworks, saque los cortes y diseñe la pagina de inicio en 1 hora ... fue en ese momento que sospeche que tan facil no podria ser...debe haber algo oculto por ahi para decir TRABAJA CON LAYERS, PEEEEEEEEEERO ..... y por ahi va la pregunta...hay algun problema en trabajar con layers?? me va a traer consecuencias que despues voy a lamentar??? alguien puede decirme los pro y contras de trabajar de esta manera.... gracias ...saludos.
  #2 (permalink)  
Antiguo 10/08/2007, 14:35
Avatar de rafak20  
Fecha de Ingreso: febrero-2006
Ubicación: Colombia
Mensajes: 265
Antigüedad: 11 años, 9 meses
Puntos: 3
Re: diseñar TODA una web con layers??

sinceramente.. algunos navegadores no te cojen muy bien la ubicacion del layer.. no se mucho. pero he probado con varios navegadores destino y en el opera y el firefox he tenido problema con los layer. los pongo en un lugar se ven bien el IE. pero me tapa otros contenidos o se desplaza en opera y firefox. la verdad hay que tener en cuenta el solapamiento.
__________________
todopromocionales.com
  #3 (permalink)  
Antiguo 10/08/2007, 15:22
 
Fecha de Ingreso: octubre-2005
Mensajes: 50
Antigüedad: 12 años, 1 mes
Puntos: 0
Re: diseñar TODA una web con layers??

Pues ami me sucedio exactamente todo lo contrario, para mi era mucho mas fácil hacer paginas con tablas ya que en cualquier navegador las veía igualitas, desde un explorer 5, pasando por el 6 y 7, hasta un opera y firefox.

Pero cuando me cambie a xhtml y css, las primeras veces fueron unos terribles dolores de cabeza, y todo por que no existe un estándar en algunas reglas css, como son border y padding, entre otros, o también los espacios verticales que deja explorer en cada item de una lista. Esto hace que una web que se ve bien en firefox salga toda descuadrada en explorer o en algunos casos en opera ( Y tomemos en cuenta que no mencione koquerror, Safari y algunos mas que son usados aunque en menor medida)

Pero para eso existen los famosos "hacks" de css, a simples rasgos son reglas que solo un navegador en concreto entiende y por lo tanto los demás navegadores no aplicaran dicho estilo y asi podemos por ejemplo, hacer que firefox ponga un borde de 20px y en explorer tome uno de 40px, esto de acuerdo a lo que necesitamos pulir en cada navegador.

Definitivamente trabajar con maquetacion en CSS es un poco mas tardado las primeras veces, pero al final es mucho mas ligero y a futuro te ahorra horas de trabajo, ya que puedes controlar el diseño de cientos de paginas con una sola hoja de estilos.
  #4 (permalink)  
Antiguo 10/08/2007, 15:35
 
Fecha de Ingreso: junio-2007
Mensajes: 53
Antigüedad: 10 años, 5 meses
Puntos: 0
Re: diseñar TODA una web con layers??

gracias por sus respuestas, las tendre en cuenta para el diseño, ya sabia que tan facil no podria ser...voy a revisar otras cosas por otro lares y a ver que me conviene usar..saludos!
  #5 (permalink)  
Antiguo 10/08/2007, 15:58
 
Fecha de Ingreso: octubre-2005
Mensajes: 50
Antigüedad: 12 años, 1 mes
Puntos: 0
Re: diseñar TODA una web con layers??

Nada es fácil en un principio, yo te recomiendo que empieces a experimentar con CSS y después "veras que es pan comido" xDDD. Y ademas en foros del web y con Papá Google encontraras muchas soluciones alas dudas que te surjan.
  #6 (permalink)  
Antiguo 10/08/2007, 16:46
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Re: diseñar TODA una web con layers??

podrias poner la URL de alguna de esas paginas de las que hablas?


DX
  #7 (permalink)  
Antiguo 10/08/2007, 16:52
 
Fecha de Ingreso: octubre-2005
Mensajes: 50
Antigüedad: 12 años, 1 mes
Puntos: 0
Re: diseñar TODA una web con layers??

¿A quien le preguntaste? y ¿a que paginas te refieres?, jejeje Disculpa es que no entendí.
  #8 (permalink)  
Antiguo 10/08/2007, 17:04
 
Fecha de Ingreso: junio-2007
Mensajes: 53
Antigüedad: 10 años, 5 meses
Puntos: 0
Re: diseñar TODA una web con layers??

http://two.xthost.info/trabajos/conL..._Intranet.html ... aunque no se ve como la veo yo en mi maquina...spero sea por algun problemilla con el hosting gratuito .. esa es la version que hice en html para ver como se veia (???) el sistema va a ser en asp.net con vb2005 .... gracias...saludos!
  #9 (permalink)  
Antiguo 10/08/2007, 17:12
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Re: diseñar TODA una web con layers??

Esta muy bien!!!

Ahora viste como se ve en FireFox? no se ve tan bien, pero arreglala que esta muy bien

DX
  #10 (permalink)  
Antiguo 10/08/2007, 17:18
 
Fecha de Ingreso: junio-2007
Mensajes: 53
Antigüedad: 10 años, 5 meses
Puntos: 0
Re: diseñar TODA una web con layers??

andale.. de veras??...no se si te habras dado cuenta pero lo que hice fue en los layers le puse como fondo pequeñas imagenes que son los cortes del diseño que hice en FIREWORKS ya que a mis jefes les gusto el efecto de sombra que tienen los recuadros...asi que iba a ser algo complicado hacerlo sin esta "tecnica"...pero bueno, no me preocupa que no se vea tan bien en firefox porque donde se va a implementar no lo usan...solo usan IE asi que....no se como se veria en safari pero vamos a ver...gracias por sus consejos..me han sido de gran ayuda....en todo caso...sigo con los layers?? ... ojala uqe si porque es mas facil que hacerlo con tablas saludos...y gracias

Última edición por empilado; 10/08/2007 a las 17:24
  #11 (permalink)  
Antiguo 10/08/2007, 17:22
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Re: diseñar TODA una web con layers??

claro! segui con los "layers" (estilos) pero la próxima vez que hagas una web, fijate que ande en los diferentes browsers

DX
  #12 (permalink)  
Antiguo 10/08/2007, 17:29
paois1
Invitado
 
Mensajes: n/a
Puntos:
Re: diseñar TODA una web con layers??

Hola
tengo ie 7.0.5730.11IC y pues cambio el tamaño de fuente en tu pagina y se salen de los marcos, ese es un problema que he tenido siempre tambien yo y quisiera saber como hacer para que eso no suceda
  #13 (permalink)  
Antiguo 10/08/2007, 17:39
 
Fecha de Ingreso: junio-2007
Mensajes: 53
Antigüedad: 10 años, 5 meses
Puntos: 0
Re: diseñar TODA una web con layers??

Cita:
Iniciado por paois1 Ver Mensaje
Hola
tengo ie 7.0.5730.11IC y pues cambio el tamaño de fuente en tu pagina y se salen de los marcos
umm pues yo tb lo tengo ... eso fue lo que vi cuando subi la muestra a esta pagina que ofrece hosting gratuito y como que se descuadro pero localmente la veo bien... tendria que probarlo poniendola en el servidor de produccion para ver como va...de todas maneras gracias por el dato...saludos
  #14 (permalink)  
Antiguo 10/08/2007, 17:48
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.462
Antigüedad: 15 años, 4 meses
Puntos: 2100
Re: diseñar TODA una web con layers??

Cita:
Iniciado por hispamaster Ver Mensaje
[...]
Pero cuando me cambie a xhtml y css, las primeras veces fueron unos terribles dolores de cabeza, y todo por que no existe un estándar en algunas reglas css, como son border y padding, entre otros, o también los espacios verticales que deja explorer en cada item de una lista.
[...]
Todo comienzo es difícil, incluso el comienzo con tablas, también lo es.

De todas formas, solo quería comentar que no es que no existan unos estándares, que de hecho, sí que existen. Lo que pasa es que los navegadores se hacen a la patada sin respetar esos estándares. Es mas, la gran mayoría de webmasters empezamos con tablas me atrevería a decir.
Yo cuando descubrí las tablas, dije "coño, se pueden poner cosas a los lados y no todo de arriba abajo", un descubrimiento increible cuando andaba con un formulario metiendo HTML en fortunecity.
  #15 (permalink)  
Antiguo 10/08/2007, 18:29
 
Fecha de Ingreso: agosto-2007
Mensajes: 2
Antigüedad: 10 años, 4 meses
Puntos: 0
Re: diseñar TODA una web con layers??

ola saludos soy nuevo en el foro y me parecen que tienen buenos comentarios por otro lado quisiera saber donde consigo peliculas flash pero buenas para tomar de modelos bueno comienzo en el diseño de web, se la teoria pero me falta imaginacion y kiero saber kien me puede ayudar para mi primeros pasos como diseñador
  #16 (permalink)  
Antiguo 10/08/2007, 18:31
paois1
Invitado
 
Mensajes: n/a
Puntos:
Re: diseñar TODA una web con layers??

te aconsejo que postees un nuevo tema y en la zona de flash :)
  #17 (permalink)  
Antiguo 12/08/2007, 08:22
 
Fecha de Ingreso: agosto-2007
Mensajes: 9
Antigüedad: 10 años, 4 meses
Puntos: 0
Re: diseñar TODA una web con layers??

antes de todo perdonen my español, soy italiano.

las tablas son añejas y limitadas.
con el CSS design se pueden crear paginas mas ligeras.
puedes crear paginas compatibles con el w3c y puedes posizionar los elementos del codigo donde quieres y optimizar para google.

por ejemplo google prefiere paginas donde encuentra el h1 primero de todo despues el h2 el p .

puedes poner un menu que se visualiza a la izquierda pero que google encuentra despues del texto de la paginas.

el problema maximo, como siempre es Internet explorer que nunca respecta los standards.

por ejemplo el css2 es muy avanzado y tiene funciones que serìan comodisimas pero no puedes utilizarle.

el truco està aqui: utilizar solo las funciones que son suportadas de todos los navegadores y utilizar el hack quando lo necesita.

el problema principal di internet explorer es: (border, padding, margin) y te voy a esplicar porque:

si tu tienes un objecto ancho 400px con un bordo/margin/padding de 20px
todos los navegadores te da un objecto que es ancho 400px con bordo/margin/padding incluidos mientras IE te dà un objecto ancho 400px+padding+border+maring

por ejemplo este:

width:400px
border:20px solid #000;
margin:10px

serìa ancho 10+20+400+20+10=460px

para resolver en IE tienes que poner el objecto ancho 340px con el hack.

te digo que como empiezo puede parecér todo muy dificìl pero despues el primo projecto veràs que es fantastico trabajar sin tablas.

espero que has entendido mi espanol.

aqui està un web site que te insegna que se puede hacer con css
www.csszengarden.com

los autores de este sito han publicado muchos libros que pueden ayudarte y creo que lo han traducido en espanol tambien.

una autora es molly www.molly.com y hay tambien dave shea www.mezzoblue.com
adios
  #18 (permalink)  
Antiguo 13/08/2007, 09:40
 
Fecha de Ingreso: junio-2007
Mensajes: 53
Antigüedad: 10 años, 5 meses
Puntos: 0
Re: diseñar TODA una web con layers??

que buen post zUmBo, estoy seguro que va a ser de gran utilidad para todos y en especial para mi, de por si ya lo estoy viendo y esta bastante interesante...gracias por compartir esta informacion...saludos y tu español se entendio muy bien!
  #19 (permalink)  
Antiguo 13/08/2007, 10:59
 
Fecha de Ingreso: agosto-2007
Mensajes: 9
Antigüedad: 10 años, 4 meses
Puntos: 0
Re: diseñar TODA una web con layers??

Cita:
Iniciado por empilado Ver Mensaje
que buen post zUmBo, estoy seguro que va a ser de gran utilidad para todos y en especial para mi, de por si ya lo estoy viendo y esta bastante interesante...gracias por compartir esta informacion...saludos y tu español se entendio muy bien!
De nada
  #20 (permalink)  
Antiguo 15/08/2007, 10:36
Avatar de hCanté
Colaborador
 
Fecha de Ingreso: marzo-2007
Ubicación: Guatemala
Mensajes: 233
Antigüedad: 10 años, 9 meses
Puntos: 9
De acuerdo Re: diseñar TODA una web con layers??

Hola

"ya sabia que tan facil no podria ser..." no es tan dramatico, si es mas facil trabajar con capas, tambien estoy de acuerdo con zUmBo!, el peso de los documentos es una parte muy importan que que ya se menciono,

fijense en este codigo para obtener una tabla que te contenga otra con una imagen:

<table width="584" height="315" border="0">
<tr>
<th scope="col"><table width="363" height="150" border="0">
<tr>
<th scope="col"><img src="imagen.jpg" width="600" height="370" /></th>
</tr>
</table></th>
</tr>
</table>

Con capas tu código quedaría mas o menos así:

<div id="nombre_de_tu_capa_contenedora">
<div id="nombre_de_la_capa_que_llevara_tu_imagen">
img src="imagen.jpg" width="600" height="370" />
</div>
</div>

aparte de representar menos lineas de codigo (menos peso), imaginate unas 20 o 15 capas que uses a usar 20 o 15 celdas y/o tablas...
llegas a un punto al trabajar con css en el que tu codigo no puede ser desordenado porque no hay razón de que sea así, entonces...
Sin hacer de menos claro, la función de una tabla que la puedes usar igual cuando tu diseño, estructura o contenido lo requiera,


Saludos
hCanté
  #21 (permalink)  
Antiguo 16/08/2007, 05:38
 
Fecha de Ingreso: agosto-2007
Mensajes: 9
Antigüedad: 10 años, 4 meses
Puntos: 0
Re: diseñar TODA una web con layers??

Cita:
Iniciado por hCanté Ver Mensaje
...Con capas tu código quedaría mas o menos así:

<div id="nombre_de_tu_capa_contenedora">
[/COLOR] <div id="nombre_de_la_capa_que_llevara_tu_imagen">
[COLOR=DarkRed]img src="imagen.jpg" width="600" height="370" />
</div>
</div>
Exacto y otra cosa tenemos que considerar:

para las imagenes structurales podémos evitar de utilizàr el tag img y poner todo en el file CSS que viene descargado una sola véz, por ejemplo.

HTML:
Código HTML:
<div id="header"></div> 
(es bastante )

y en el css pones:

Código:
#header{
position:relative;
width:955px;
height:125px;
padding:0; 
top:0;
left:0;
background: #fff url(../imagenes/logo.gif) no-repeat 20px center;}
y ya esta

a qui estan esplicadas las características que puedes asegnàr a background:
http://www.w3schools.com/css/css_background.asp

adiooss
  #22 (permalink)  
Antiguo 16/08/2007, 09:42
Avatar de hCanté
Colaborador
 
Fecha de Ingreso: marzo-2007
Ubicación: Guatemala
Mensajes: 233
Antigüedad: 10 años, 9 meses
Puntos: 9
Re: diseñar TODA una web con layers??

Claro... esa esta aún mejor, menos lineas...

Saludos
hCanté
  #23 (permalink)  
Antiguo 16/08/2007, 10:41
paois1
Invitado
 
Mensajes: n/a
Puntos:
Re: diseñar TODA una web con layers??

hola muy bonitas y utiles las explicaciones pa que, pero alguien podria explicarnos como hacer para que utilizando los divs no suceda lo que sucede con la pagina de empilado (que la letra se sale de los marcos al modificar tamaño de letra)?
  #24 (permalink)  
Antiguo 16/08/2007, 13:37
 
Fecha de Ingreso: agosto-2007
Mensajes: 9
Antigüedad: 10 años, 4 meses
Puntos: 0
Re: diseñar TODA una web con layers??

Cita:
Iniciado por paois1 Ver Mensaje
hola muy bonitas y utiles las explicaciones pa que, pero alguien podria explicarnos como hacer para que utilizando los divs no suceda lo que sucede con la pagina de empilado (que la letra se sale de los marcos al modificar tamaño de letra)?
Hola paois, solo ahora he visitado la pagina de impilado. El estilo està escrito en una manera perfecta para volverse loco.

  1. no tenémos necesidad de dar el estilo a todos los layers
  2. muchas véces es mejor utilizar el position:relative
  3. no tenémos que especificar siempre el z-index
  4. MUY IMPORTANTE: no tenémos que poner todas estas capas, no olvidàmos que los otros objectos (p, h1,h2,h3...) son todos funcionantes como los layers, puedes decidìr l'anchura, imagenes y color de fondo, bordos, position, margin....cuasi todo lo que puedes hacer con los DIV!!!!
  5. si querémos dar una propiedàd igual a todo un grupo de elementos como por ejemplo dar absolute a todos los divs es bastante escrivir primero de todo:

Código HTML:
div{position:absolute;}
  1. no tenémos que dar siempre la altura y la anchura a los elementos de hecho la altura es mejor tenérla flexible.
  2. si ponémos las capas en position relative ellas partiràn desde la fine de la capa anterior
  3. cosa muy importante da considerar: las capas son objectos inline object (si bien recuerdo que se llaman asì) quiere decìr que si pones un objecto inline con position:relative, no importa que anchura es però otros objectos estaràn abajo de esto.

si quieres que otros objectos estaran a lado de esto tienes que utilizàr la propriedàd float por ejemplo:

Código HTML:
float:left;
este tiene que sér cierrado quando quieres que en la pagina no sea mas activo por ejemplo:

Código HTML:
#div1{float:left;}
#div2{float:left;}
#div3{float:left;}

.clear{clear:left;}
Código HTML:
<div id="div1">mi texto</div>
<div id="div2">mi texto</div>
<div id="div3">mi texto</div>
<!--div para desactivar float-->
<div class="clear"></div> 
el float es bueno si quieres creàr liquid design layout, porque cuando vas para apretàr la pagina las capas que no han espacio horizontal van automaticàmente abajo.

muchas otras cosas es importante sabèr una cosa buena son los libros que a mi me han ayudado mucho.

adioooss
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 21:49.