Foros del Web » Creando para Internet » CSS »

Son confiables los programas gratis para hacer menues CSS?

Estas en el tema de Son confiables los programas gratis para hacer menues CSS? en el foro de CSS en Foros del Web. Hola amigos! Estoy buscando maneras practicas de armar menues en CSS, y di con este programa gratuito: http://cssmenu.com/ Al generar un menu y ver su ...
  #1 (permalink)  
Antiguo 09/11/2013, 21:35
 
Fecha de Ingreso: agosto-2007
Mensajes: 122
Antigüedad: 16 años, 8 meses
Puntos: 3
Son confiables los programas gratis para hacer menues CSS?

Hola amigos!

Estoy buscando maneras practicas de armar menues en CSS, y di con este programa gratuito: http://cssmenu.com/

Al generar un menu y ver su codigo, lo encuentro tremendamente complejo (cabe aclarar que no domino CSS al dedillo, más bien lo conozco y lo aplico medianamente bien) se generan muchas pero muchas lineas de codigo CSS las cuales entiendo poco y nada, se generan además dos archivos XML con instrucciones... Y bueno pues, una cosa enorme!! Me surgió entonces la duda si aplicar estos menues es complejizar un sitio web o mas bien darle un marco profesional.

Espero por favor la opinión siempre acertada de ustedes, los maestros que tanto saben aqui en el foro.

saludos!!
  #2 (permalink)  
Antiguo 10/11/2013, 02:13
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 9 meses
Puntos: 2114
Respuesta: Son confiables los programas gratis para hacer menues CSS?

Sin conocerlo diría que no, pero es mejor que pegues el código HTML/CSS que genera para verlo bien.

Complejo/complicar.
  #3 (permalink)  
Antiguo 10/11/2013, 07:38
 
Fecha de Ingreso: agosto-2007
Mensajes: 122
Antigüedad: 16 años, 8 meses
Puntos: 3
Respuesta: Son confiables los programas gratis para hacer menues CSS?

Hola pzin, el menu que he creado con el programa es este (solo la opción de recuadros rojos, el fondo de madera es parte del diseño web):



el código CSS generado por el programa es este:

ul#cm-nav ,
ul#cm-nav ul {
list-style-type: none;
margin: 0px;
list-style-image: none;
padding: 0px
}

ul#cm-nav li {
position: relative;
list-style-type: none;
margin: 0px;
width: auto;
float: right;
list-style-image: none;
padding: 0px
}

ul#cm-nav li li {
width: auto;
float: none
}

#cm-nav a {
border-bottom: black 1px solid;
text-align: left;
border-left: black 1px solid;
display: block;
white-space: nowrap;
background: yellow;
border-top: black 1px solid;
border-right: black 1px solid;
text-decoration: none
}

#cm-nav a:focus {
outline-style: none;
outline-color: invert;
outline-width: medium
}

#cm-nav a.no-click {cursor: default}

#cm-nav li a {margin: -1px -1px 0px 0px}

#cm-nav li li a {margin: 0px 0px -1px}

#cm-nav > li > a.arrow {padding-right: 14px}

#cm-nav ul.arrow-pad > li > a {padding-right: 11px}

#cm-nav li a.arrow ,
#cm-nav > li > a.arrow {
background-repeat: no-repeat;
background-position: right 50%
}

#cm-nav li ul ,
#cm-nav li:hover ul ul ,
#cm-nav li:hover ul ul ul ,
#cm-nav li:hover ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul {
z-index: 999;
position: absolute;
display: none
}

#cm-nav li:hover ul {display: block}

#cm-nav li li:hover ul ,
#cm-nav li li li:hover ul ,
#cm-nav li li li li:hover ul ,
#cm-nav li li li li li:hover ul ,
#cm-nav li li li li li li:hover ul ,
#cm-nav li li li li li li li:hover ul {
display: block;
margin-left: 100%
}

#cm-nav li:hover ul {margin-left: 0px}

#cm-nav ul ul {
top: 1px;
left: -1px
}

#cm-nav li {top: -1px}

#cm-nav a {background-color: #87121b}

#cm-nav a {border-color: transparent}

#cm-nav a {color: #ffffff}

#cm-nav a {font-family: georgia}

#cm-nav a {font-size: 12pt}

#cm-nav a {padding-top: 22px}

#cm-nav a {padding-bottom: 22px}

#cm-nav li:hover > a {background-color: #e3d5b3}

#cm-nav li:hover > a {color: #382517}

#cm-nav a {padding-left: 24px}

#cm-nav a {padding-right: 24px}

#cm-nav a {font-variant: normal}



A este codigo se suman dos archivos XML tambien generados por el programa, el primero (cm-config.xml) con las instrucciones:

<?xml version="1.0" encoding="utf-8"?>
<menuConfig>
<ver>1</ver>
</menuConfig>



y el segundo (cm-data.xml) con las instrucciones:

<?xml version="1.0" encoding="utf-8"?>
<menuinfo>
<menu>
<item url="index.htm" lbTxt="Welcome"/>
<item url="local.htm" lbTxt="Local"/>
<item url="menu.htm" lbTxt="Menu"/>
<item url="videos.htm" lbTxt="Videos"/>
<item url="contact.php" lbTxt="Contact"/>
</menu>
</menuinfo>



No es mucho para un menu CSS?? Es este resultado un trabajo más correcto y profesional o complejiza un poco el sitio innecesariamente?

Gracias y Saludos!

Lola Lola
  #4 (permalink)  
Antiguo 10/11/2013, 11:02
Avatar de eduardobrutaldeath  
Fecha de Ingreso: agosto-2013
Ubicación: América
Mensajes: 306
Antigüedad: 10 años, 8 meses
Puntos: 3
Respuesta: Son confiables los programas gratis para hacer menues CSS?

Deberías aprender CSS en lugar de copiar código; a la larga es mejor, conoces tu trabajo, no dependes de otros y además, a veces los códigos foráneos están mal hechos o tienen propiedades que bloquean las propias, y como uno desconoce el código externo no sabe por qué sus estilos no afectan a sus elementos.
  #5 (permalink)  
Antiguo 10/11/2013, 11:53
 
Fecha de Ingreso: agosto-2007
Mensajes: 122
Antigüedad: 16 años, 8 meses
Puntos: 3
Respuesta: Son confiables los programas gratis para hacer menues CSS?

Es verdad Eduardo. Ahora, la consulta es por si este tipo de codigos es aconsejable aprenderlo, ó mejor dicho, si este es es el mas correcto CSS aplicable a un menu, con ficheros complementarios en XML, o si no es una buena solucion. Quizas sea un buen ejemplo para aprender a maquetar menues, quizas no lo es. De ahi tambien la consulta.

Saludos y gracias!
  #6 (permalink)  
Antiguo 10/11/2013, 13:33
Avatar de eduardobrutaldeath  
Fecha de Ingreso: agosto-2013
Ubicación: América
Mensajes: 306
Antigüedad: 10 años, 8 meses
Puntos: 3
Respuesta: Son confiables los programas gratis para hacer menues CSS?

Cita:
Iniciado por Lola Lola Ver Mensaje
Es verdad Eduardo. Ahora, la consulta es por si este tipo de codigos es aconsejable aprenderlo, ó mejor dicho, si este es es el mas correcto CSS aplicable a un menu, con ficheros complementarios en XML, o si no es una buena solucion. Quizas sea un buen ejemplo para aprender a maquetar menues, quizas no lo es. De ahi tambien la consulta.

Saludos y gracias!
Yo no usaría ese menú.
Tengo menúes con menos y más código que ese.
A lo que me refiero es a que, si el código es largo pero necesario está todo bien, pero si por el contrario es innecesariamente largo entonces se convierte en un estrobo; por ejemplo si quieres que tu menú tenga efectos de transición, que se deslice o que tenga cualquier otro efecto de animación, pues obviamente el código va a ser más largo pero necesario porque los resultados van a ser muy buenos (también depende de cuantas listas desplegables tenga). Sin embargo hay personas que crean menúes que para novatos parecen muy complicados por el exceso de código pero en realidad están hechos de manera exagerada porque fácilmente se podría compactar código.
Como te dije, creo que ese menú tiene mucha cosa, eso del XML no me cuadra, pero al final tu decides. Aparte tampoco debemos hacer tanto drama por un menú que es tan fácil hacer. Lo que sugiero es que aprendas CSS y crees plantillas de tus menúes, slides, y otros proyectos que tengas. Yo tengo por ejemplo 5 menúes, horizontales con listas desplegables que van de arriba a abajo, de abajo hacia arriba, y verticales con muchas animaciones, igual con los sliders y otras cosas, todos estos los uso como plantillas, o sea que cuando tengo que hacer una web ya no creo un menú sino que copio y pego, PERO ESO SÍ, es mi menú, yo lo he creado, y por tanto lo conozco ¿entiendes?
  #7 (permalink)  
Antiguo 10/11/2013, 16:09
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 9 meses
Puntos: 2114
Respuesta: Son confiables los programas gratis para hacer menues CSS?

Todo esto:

Código CSS:
Ver original
  1. #cm-nav a {background-color: #87121b}
  2.  
  3. #cm-nav a {border-color: transparent}
  4.  
  5. #cm-nav a {color: #ffffff}
  6.  
  7. #cm-nav a {font-family: georgia}
  8.  
  9. #cm-nav a {font-size: 12pt}
  10.  
  11. #cm-nav a {padding-top: 22px}
  12.  
  13. #cm-nav a {padding-bottom: 22px}
  14.  
  15. #cm-nav li:hover > a {background-color: #e3d5b3}
  16.  
  17. #cm-nav li:hover > a {color: #382517}
  18.  
  19. #cm-nav a {padding-left: 24px}
  20.  
  21. #cm-nav a {padding-right: 24px}
  22.  
  23. #cm-nav a {font-variant: normal}

Es igual a hacer esto:

Código CSS:
Ver original
  1. #cm-nav a {
  2.   background-color: #87121b;
  3.   border-color: transparent;
  4.   color: #ffffff;
  5.   font-family: georgia;
  6.   font-size: 12pt;
  7.   padding-top: 22px;
  8.   padding-bottom: 22px;
  9.   padding-left: 24px;
  10.   padding-right: 24px;
  11.   font-variant: normal;
  12. }
  13.  
  14. #cm-nav li:hover > a {
  15.   background-color: #e3d5b3;
  16.   color: #382517
  17. }

Y esto:

Código CSS:
Ver original
  1. #cm-nav li ul ,
  2. #cm-nav li:hover ul ul ,
  3. #cm-nav li:hover ul ul ul ,
  4. #cm-nav li:hover ul ul ul ul ,
  5. #cm-nav li:hover ul ul ul ul ul ,
  6. #cm-nav li:hover ul ul ul ul ul ul ,
  7. #cm-nav li:hover ul ul ul ul ul ul ul ,
  8. #cm-nav li:hover ul ul ul ul ul ul ul ul {
  9. z-index: 999;
  10. position: absolute;
  11. display: none
  12. }

Igual que:

Código CSS:
Ver original
  1. #cm-nav li ul ,
  2. #cm-nav li:hover ul ul {
  3.   z-index: 999;
  4.   position: absolute;
  5.   display: none
  6. }

Y así hay algunas cosas más. Así que si, genera mucho código innecesario/inútil.

Creo que no hay ningún programa de este tipo —ya sea un generador de menús o directamente uno tipo Dreamweaver— que no genere código apto para reducir a la mitad como poco. Y no es muy raro, ya que suelen sufrir de poca optimización en favor de cierta facilidad para el principiante.

Aquí se insiste siempre en que uno escriba su propio código, y no son caprichos de quienes llevan un rato con estas cosas, sino porque aparte de conocer en profundidad tu código, también será (o debería ser) un código más limpio, claro y focalizado a lo que tiene que hacer ese código.
  #8 (permalink)  
Antiguo 10/11/2013, 17:42
 
Fecha de Ingreso: agosto-2007
Mensajes: 122
Antigüedad: 16 años, 8 meses
Puntos: 3
Respuesta: Son confiables los programas gratis para hacer menues CSS?

pzin y eduardo, muchas gracias por las,opiniones! Veo que el codigo no es lo mas limpio que puede haber, y creo tambien que es mejor escribir el propio codigo. En mi caso investigo y veo como lo hacen otros, de ahi que muchas veces "tomo referencias" para optimizar mi trabajo, y al ver este codigo creado por u programa especifico para eso entendí era un modo profesional de hacerlo pero... TAMPOCO me cuadraba todo esto de lineas mas lineas mas xml... de ahi que me decidi a consultar en el foro.

Gracias por las opiniones, voy a escribir mis propios menues mejor, siempre un gusto tratar con ña gente que sabe en estos foros.

Saludos y gracias nuevamente!

Lola Lola

Etiquetas: gratis, programas, son
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 04:06.