{"id":2196,"date":"2015-09-20T19:37:21","date_gmt":"2015-09-20T19:37:21","guid":{"rendered":"https:\/\/marketingweb.com.mx\/blog\/?p=2196"},"modified":"2016-05-08T21:57:40","modified_gmt":"2016-05-08T21:57:40","slug":"diseno-web-pestanas","status":"publish","type":"post","link":"https:\/\/marketingweb.com.mx\/blog\/diseno-web-pestanas\/","title":{"rendered":"Dise\u00f1o Web Pesta\u00f1as"},"content":{"rendered":"<p><a href=\"https:\/\/marketingweb.com.mx\/blog\/wp-content\/smush-webp\/Thetabs-Responsive-HTML5-CSS3-Tabs-2016-01-29-05-57-05.png.webp\"><img fetchpriority=\"high\" decoding=\"async\" class=\"alignnone size-medium wp-image-2370\" src=\"https:\/\/marketingweb.com.mx\/blog\/wp-content\/smush-webp\/Thetabs-Responsive-HTML5-CSS3-Tabs-2016-01-29-05-57-05-300x235.png.webp\" alt=\"TABS\" width=\"300\" height=\"235\" srcset=\"https:\/\/marketingweb.com.mx\/blog\/wp-content\/smush-webp\/Thetabs-Responsive-HTML5-CSS3-Tabs-2016-01-29-05-57-05-300x235.png.webp 300w, https:\/\/marketingweb.com.mx\/blog\/wp-content\/uploads\/Thetabs-Responsive-HTML5-CSS3-Tabs-2016-01-29-05-57-05-1024x801.png 1024w, https:\/\/marketingweb.com.mx\/blog\/wp-content\/smush-webp\/Thetabs-Responsive-HTML5-CSS3-Tabs-2016-01-29-05-57-05.png.webp 1349w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<h1><a href=\"https:\/\/marketingweb.com.mx\/diseno-web.html\">Dise\u00f1o Web Pesta\u00f1as<\/a><\/h1>\n<p>Hay una gran cantidad de caminos que puede tomar en el <strong>dise\u00f1o web<\/strong>, espec\u00edficamente en la navegaci\u00f3n. Aqu\u00ed, vamos a hablar de una t\u00e9cnica de <strong>dise\u00f1o web<\/strong> espec\u00edfica de navegaci\u00f3n, navegaci\u00f3n basada en pesta\u00f1as. Si se lleva a cabo correctamente el <strong>dise\u00f1o web<\/strong>, la navegaci\u00f3n con pesta\u00f1as puede ser muy limpio y organizado dentro de un <strong>dise\u00f1o web<\/strong>.<\/p>\n<p>As\u00ed que <strong>lo que est\u00e1 por pesta\u00f1as de <\/strong>navegaci\u00f3n? Bueno, es esencialmente un conjunto de botones con mayor frecuencia establecidos horizontalmente. Aqu\u00ed generalmente siguen numerosas diferentes pautas de <strong>dise\u00f1o web<\/strong> estilo. En primer lugar, una ficha establecido generalmente se adjunta o ligeramente sobresale de un contenedor, como en el siguiente ejemplo. Tambi\u00e9n en el dise\u00f1o web, observe c\u00f3mo la pesta\u00f1a abierta coincide con el color de fondo del contenedor, y los otros botones son m\u00e1s oscuras. Esta es otra directriz estilo com\u00fan.<\/p>\n<p>Cuando nos fijamos en navegaciones con pesta\u00f1as, tambi\u00e9n se dar\u00e1 cuenta de muchas tendencias de estilo. En primer lugar de <strong>dise\u00f1o web<\/strong>, muchas pesta\u00f1as tendr\u00e1n esquinas redondeadas en los botones. Esto ayuda a crear una apariencia limpia.Tambi\u00e9n ayuda a hacer una mirada limpia es el uso de la separaci\u00f3n entre los botones. La mayor\u00eda de los dise\u00f1os utilizan el espacio para botones separados, pero un bisel, de una sola l\u00ednea, o el contraste de color de fondo tambi\u00e9n se ver\u00e1 muy bien.<\/p>\n<p>Tambi\u00e9n podr\u00e1 ver el <strong>uso de efectos de <\/strong>activaci\u00f3n, que es una caracter\u00edstica com\u00fan de la facilidad de uso de la navegaci\u00f3n por pesta\u00f1as. Degradados, radial y lineal, ayudan a lograr un efecto hover impressve que trae dimensi\u00f3n al bot\u00f3n que el usuario est\u00e1 seleccionando. En realidad, te dar\u00e1s cuenta de que muchos botones de ficha, seleccionados o no, utilizar\u00e1n una ligera pendiente para a\u00f1adir profundidad y Demension al bot\u00f3n. Este es un detalle muy simple menudo utilizado para llevar un estilo extra para muchos elementos de la interfaz de usuario diferentes, tales como botones. El aspecto m\u00e1s importante en el dise\u00f1o de la navegaci\u00f3n por pesta\u00f1as es que la pesta\u00f1a activa debe ser clara y evidente. Esto es lo que separa a un sistema de navegaci\u00f3n con pesta\u00f1as de una fila horizontal ordinaria de botones o hiperv\u00ednculos.<\/p>\n<p><a href=\"https:\/\/marketingweb.com.mx\" target=\"_blank\">Marketing Web Dise\u00f1o Web Guadalajara y Ciudad de M\u00e9xico D.F.<\/a><\/p>\n<p><a href=\"https:\/\/marketingweb.com.mx\" target=\"_blank\">#dise\u00f1oweb<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Dise\u00f1o Web Pesta\u00f1as Hay una gran cantidad de caminos que puede tomar en el dise\u00f1o web, espec\u00edficamente en la navegaci\u00f3n. Aqu\u00ed, vamos a hablar de una t\u00e9cnica de dise\u00f1o web espec\u00edfica de navegaci\u00f3n, navegaci\u00f3n basada en pesta\u00f1as. Si se lleva a cabo correctamente el dise\u00f1o web, la navegaci\u00f3n con pesta\u00f1as puede ser muy limpio y &hellip;<\/p>\n<p class=\"read-more\"> <a class=\"ast-button\" href=\"https:\/\/marketingweb.com.mx\/blog\/diseno-web-pestanas\/\"> <span class=\"screen-reader-text\">Dise\u00f1o Web Pesta\u00f1as<\/span> Leer m\u00e1s \u00bb<\/a><\/p>\n","protected":false},"author":18,"featured_media":2370,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"default","ast-global-header-display":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","_joinchat":[],"footnotes":""},"categories":[55,20],"tags":[46,144,143,47,142,141],"class_list":["post-2196","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-diseno-web","category-seo","tag-diseno-web","tag-diseno-web-ciudad-de-mexico","tag-diseno-web-df","tag-diseno-web-guadalajara","tag-diseno-web-pestanas","tag-diseno-web-tabs"],"_links":{"self":[{"href":"https:\/\/marketingweb.com.mx\/blog\/wp-json\/wp\/v2\/posts\/2196","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/marketingweb.com.mx\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/marketingweb.com.mx\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/marketingweb.com.mx\/blog\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/marketingweb.com.mx\/blog\/wp-json\/wp\/v2\/comments?post=2196"}],"version-history":[{"count":0,"href":"https:\/\/marketingweb.com.mx\/blog\/wp-json\/wp\/v2\/posts\/2196\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/marketingweb.com.mx\/blog\/wp-json\/wp\/v2\/media\/2370"}],"wp:attachment":[{"href":"https:\/\/marketingweb.com.mx\/blog\/wp-json\/wp\/v2\/media?parent=2196"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/marketingweb.com.mx\/blog\/wp-json\/wp\/v2\/categories?post=2196"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/marketingweb.com.mx\/blog\/wp-json\/wp\/v2\/tags?post=2196"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}