Lenguaje de programación utilizado para crear este sitio con pestañas

moiseseccam

Pi
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Desde
5 Mar 2013
Mensajes
6.348
Todas las vistas en el frontend son prácticamente HTML, Javascript y CSS.

La web que mencionas está hecha a medida, y al parecer usando Vanilla. ¿Qué es Vanilla? La esencia original de un software sin modificaciones
 

xplorando

Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
4 Mar 2017
Mensajes
315
Se puede hacer con Jquery. Encontrás bastantes ejemplos, plugins y variantes en la web.

Y Bootstrap ya lo trae implementado.

En ambos casos si lo quieres igualito solo te toca personalizarlo vía CSS. Hasta ahí... tabbed nav.

* Pero... al que pusiste de ejemplo en específico le veo detalles, por ejemplo... no creo que justifique que cada clic se convierta (te lleve) a una URL diferente. En términos de SEO y tu gusto personal puede que tenga sentido según tus fines, pero en términos de usabilidad... no, el usuario no se dará cuenta que cada clic cambia de URL, y la espera resulta "confusa", incómoda e innecesaria. Igual, en términos de usabilidad: algunos clics te cambian por completo el orden de los tabs, haciendo que si quieres dar clic en una opción que ya tenías vista... sorpresa, cambió de lugar.
 
Última edición:

JuanRJhony

Beta
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
2 Ene 2014
Mensajes
50
El sitio que mencionas es personalizado en base a PHP montado con Apache HTTP Server, claramente utilizando CSS, HTML y Javascript.
En mi opinión tal y como te menciona @xplorando no me parece buena idea el que al dar clic en una pestaña del menú te lleve a una url diferente pudiéndolo hacer dinámicamente, sin embargo, depende mucho de tu necesidad o intención de realizarlo.
 

Puko

Delta
Verificación en dos pasos activada
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
20 Dic 2022
Mensajes
692
"pestañas" por cada item
son simples enlaces (html y css), como carga rapido hace parecer como si tuviera el efecto de cambiar el cuadro de las especificaciones en la misma pagina

<div class="tab-container"
<div style="top:0px;">
<a href=" "><span class="icon" style="background-image: url(https:// …/thickness.svg);"></span><span class="text">Grosor</span></a>

</div>
</div>
<div style="overflow: hidden; margin-top: 40px; position: relative;">
contenido de las especificaciones
</div>
 
Última edición:

Franco Gabriel

Épsilon
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
Verificado por Binance
Desde
17 Nov 2022
Mensajes
833
Edad
27
No se de diseño web y queria saber en que lenguaje esta hecho este sitio con esas "pestañas" por cada item. Busqué con algunas extensiones como whatruns pero no me dice nada. Es algun cms tal vez?

https://www.devicespecifications.com/es/model/ccb35a24
Es muy fácil de hacer utilizando el código <table> o separando los <a> mediante style="display:block;" y para que la misma foto aparezca siempre y no cambie cada vez que se presiona un <a> se utilizará algún otro código, o se puede recurrir al mismo host mediante otro <a> luego quedaría colocar algunos css y listo bro, si quieres te ayudo, pero ahorita estoy con poco tiempo, pero hacer una página igual utilizando los datos que yo te di, es súper sencillo, mira, yo tengo la mia, que hago algo similar, sin siquiera usar bootstrap http://www.forotexto.xyz/ (una vez te registras checas la sección de mensajeria o mensajes privados para ver que utilicé el mismo truco en mi foro)
 

Franco Gabriel

Épsilon
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
Verificado por Binance
Desde
17 Nov 2022
Mensajes
833
Edad
27
son simples enlaces (html y css), como carga rapido hace parecer como si tuviera el efecto de cambiar el cuadro de las especificaciones en la misma pagina

<div class="tab-container"
<div style="top:0px;">
<a href=" "><span class="icon" style="background-image: url(https:// …/thickness.svg);"></span><span class="text">Grosor</span></a>

</div>
</div>
<div style="overflow: hidden; margin-top: 40px; position: relative;">
contenido de las especificaciones
</div>
Yo creo que más bien:
<div class="CLASE">
<a style="display:block;" href="ENLACE-1">ITEM-1</a>
<a style="display:block;" href="ENLACE-2">ITEM-2</a>
<a style="display:block;" href="ENLACE-3">ITEM-3</a>
<a style="display:block;" href="ENLACE-4">ITEM-4</a>
</div>

<style> .CLASE {
width: auto;
height: 100%;
overflow: auto;
}
</style>
 

Puko

Delta
Verificación en dos pasos activada
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
20 Dic 2022
Mensajes
692
Yo creo que más bien:
<div class="CLASE">
<a style="display:block;" href="ENLACE-1">ITEM-1</a>
<a style="display:block;" href="ENLACE-2">ITEM-2</a>
<a style="display:block;" href="ENLACE-3">ITEM-3</a>
<a style="display:block;" href="ENLACE-4">ITEM-4</a>
</div>

<style> .CLASE {
width: auto;
height: 100%;
}
</style>
solo puse un simple ejemplo del codigo que tiene la pagina pero reducido
 

Franco Gabriel

Épsilon
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
Verificado por Binance
Desde
17 Nov 2022
Mensajes
833
Edad
27
solo puse un simple ejemplo del codigo que tiene la pagina pero reducido
Sí, también se puede aplicar <table> para darle un lugar específico a cada enlace y hacerlo "mas cuadrado" a la página, incluso sería "mas responsive" si se lo aplica bién, sin necesidad de usar overflow, pero tardaría más en cargar la página, sobre todo si son muchos <a>
 

EasyProjects

Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
3 Nov 2020
Mensajes
194
1698457409339.png

Creo que las pestañas no tienen ninguna librería es javascript puro y duro xd
 

Danitaa

Curioso
Verificación en dos pasos desactivada
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
5 Jun 2023
Mensajes
13
wow la velocidad y calidad de respuestas con código y todo. Mucho mas que lo esperado.

Pregunta: Si yo quisiera hacer algo parecido con algun cms cual podria servirme para la "estructura macro"?. No tengo problema de tocar un poco de codigo como el que me faciltaron aqui, pero me siento mas "segura" si la estructura general me la facilita un cms, aunque quizas sea menos eficiente pero es el costo que pago.

Mi necesidad central en este sitio es como nombraron: el SEO.

Gracias a todos !
 

EasyProjects

Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
3 Nov 2020
Mensajes
194
wow la velocidad y calidad de respuestas con código y todo. Mucho mas que lo esperado.

Pregunta: Si yo quisiera hacer algo parecido con algun cms cual podria servirme para la "estructura macro"?. No tengo problema de tocar un poco de codigo como el que me faciltaron aqui, pero me siento mas "segura" si la estructura general me la facilita un cms, aunque quizas sea menos eficiente pero es el costo que pago.

Mi necesidad central en este sitio es como nombraron: el SEO.

Gracias a todos !
Si no me equivoco puedes usar Snippets y Wordpress es la mejor opcion sin duda.
 

samuelsuteras

Épsilon
Verificación en dos pasos activada
Verificado por Whatsapp
Verificado por Binance
Desde
5 Oct 2017
Mensajes
925
wow la velocidad y calidad de respuestas con código y todo. Mucho mas que lo esperado.

Pregunta: Si yo quisiera hacer algo parecido con algun cms cual podria servirme para la "estructura macro"?. No tengo problema de tocar un poco de codigo como el que me faciltaron aqui, pero me siento mas "segura" si la estructura general me la facilita un cms, aunque quizas sea menos eficiente pero es el costo que pago.

Mi necesidad central en este sitio es como nombraron: el SEO.

Gracias a todos !
Con wordpress, php y javascript se puede hacer rapido y facil
 

Danitaa

Curioso
Verificación en dos pasos desactivada
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
5 Jun 2023
Mensajes
13

¡Regístrate y comienza a ganar!

Beneficios

  • Gana dinero por participar
  • Gana dinero por recomendarnos
  • Descubre ofertas de empleo diariamente
  • Negocios seguros
  • ¡Información premium y más!

Acceder

¿Ya tienes una cuenta? Accede aquí

Arriba