{"id":1382,"date":"2012-01-14T16:20:16","date_gmt":"2012-01-14T16:20:16","guid":{"rendered":"https:\/\/www.jose-aguilar.com\/blog\/?p=1382"},"modified":"2012-11-05T14:49:20","modified_gmt":"2012-11-05T14:49:20","slug":"menu-simple-css","status":"publish","type":"post","link":"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/","title":{"rendered":"Men\u00fa simple con CSS"},"content":{"rendered":"<p>Existe p\u00e1ginas Web que contienen men\u00fas con demasiados efectos que hacen ralentizar la carga de nuestras p\u00e1ginas Webs.<\/p>\n<p>Contra m\u00e1s f\u00e1cil y simple sea nuestro c\u00f3digo, m\u00e1s r\u00e1pido cargaran nuestras p\u00e1ginas Webs. Si podemos evitar el uso de im\u00e1genes en los men\u00fas entre otras cosas podemos acelerar la carga.<\/p>\n<p>En este art\u00edculo vamos a detallar como disponer de unos men\u00fas muy sencillos y editables mediante CSS sin utilizar im\u00e1genes ni efectos muy sotisficados.<\/p>\n<p><a href=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/01\/menu-simple.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1403\" title=\"menu-simple\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/01\/menu-simple.png\" alt=\"\" width=\"145\" height=\"144\" srcset=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/01\/menu-simple.png 145w, https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/01\/menu-simple-80x80.png 80w\" sizes=\"auto, (max-width: 145px) 100vw, 145px\" \/><\/a><\/p>\n<p>Es sencill\u00edsimo podemos jugar con el CSS para cambiar los colores o a\u00f1adir alg\u00fan efecto m\u00e1s, esto se los dejo a su imaginaci\u00f3n.<\/p>\n<p>En los ejemplos ver\u00e1n que el c\u00f3digo HTML (estructura) est\u00e1 separado del c\u00f3digo CSS (Presentaci\u00f3n o formato); esto nos ayuda a modificar r\u00e1pidamente el c\u00f3digo, ahorrar el ancho de banda entre otros detalles importantes para la aceleraci\u00f3n de la carga de nuestra Web.<\/p>\n<p><a href=\"https:\/\/www.jose-aguilar.com\/scripts\/css\/simple-menu\/menu-horizontal-css.html\">Ver ejemplo del men\u00fa horizontal<\/a><\/p>\n<p><a href=\"https:\/\/www.jose-aguilar.com\/scripts\/css\/simple-menu\/menu-vertical-css.html\">Ver ejemplo del men\u00fa vertical<\/a><\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Existe p\u00e1ginas Web que contienen men\u00fas con demasiados efectos que hacen ralentizar la carga de nuestras p\u00e1ginas Webs. Contra m\u00e1s f\u00e1cil y simple sea nuestro c\u00f3digo, m\u00e1s r\u00e1pido cargaran nuestras p\u00e1ginas Webs. Si podemos evitar el uso de im\u00e1genes en los men\u00fas entre otras cosas podemos acelerar la carga. En este art\u00edculo vamos a detallar [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":6469,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[44],"class_list":["post-1382","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-css","tag-menus"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Men\u00fa simple con CSS - Jose Aguilar Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Men\u00fa simple con CSS - Jose Aguilar Blog\" \/>\n<meta property=\"og:description\" content=\"Existe p\u00e1ginas Web que contienen men\u00fas con demasiados efectos que hacen ralentizar la carga de nuestras p\u00e1ginas Webs. Contra m\u00e1s f\u00e1cil y simple sea nuestro c\u00f3digo, m\u00e1s r\u00e1pido cargaran nuestras p\u00e1ginas Webs. Si podemos evitar el uso de im\u00e1genes en los men\u00fas entre otras cosas podemos acelerar la carga. En este art\u00edculo vamos a detallar [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/\" \/>\n<meta property=\"og:site_name\" content=\"Jose Aguilar Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/joseaguilarblog\" \/>\n<meta property=\"article:published_time\" content=\"2012-01-14T16:20:16+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2012-11-05T14:49:20+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2014\/10\/Imagen-no-disponible-282x300.png\" \/>\n\t<meta property=\"og:image:width\" content=\"282\" \/>\n\t<meta property=\"og:image:height\" content=\"300\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Jose Aguilar\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@JoseAguilarBlog\" \/>\n<meta name=\"twitter:site\" content=\"@JoseAguilarBlog\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jose Aguilar\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minuto\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/\",\"name\":\"Men\u00fa simple con CSS - Jose Aguilar Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2014\/10\/Imagen-no-disponible-282x300.png\",\"datePublished\":\"2012-01-14T16:20:16+00:00\",\"dateModified\":\"2012-11-05T14:49:20+00:00\",\"author\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/#primaryimage\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2014\/10\/Imagen-no-disponible-282x300.png\",\"contentUrl\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2014\/10\/Imagen-no-disponible-282x300.png\",\"width\":282,\"height\":300},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/www.jose-aguilar.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Men\u00fa simple con CSS\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#website\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/\",\"name\":\"Jose Aguilar Blog\",\"description\":\"Desarrollo Web con PrestaShop, WordPress, PHP, jQuery y Ajax\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.jose-aguilar.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11\",\"name\":\"Jose Aguilar\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g\",\"caption\":\"Jose Aguilar\"},\"description\":\"Director ejecutivo y tecnol\u00f3gico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.\",\"sameAs\":[\"https:\/\/plus.google.com\/114357189801512615537\"],\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/author\/josea902\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Men\u00fa simple con CSS - Jose Aguilar Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"es_ES","og_type":"article","og_title":"Men\u00fa simple con CSS - Jose Aguilar Blog","og_description":"Existe p\u00e1ginas Web que contienen men\u00fas con demasiados efectos que hacen ralentizar la carga de nuestras p\u00e1ginas Webs. Contra m\u00e1s f\u00e1cil y simple sea nuestro c\u00f3digo, m\u00e1s r\u00e1pido cargaran nuestras p\u00e1ginas Webs. Si podemos evitar el uso de im\u00e1genes en los men\u00fas entre otras cosas podemos acelerar la carga. En este art\u00edculo vamos a detallar [&hellip;]","og_url":"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/","og_site_name":"Jose Aguilar Blog","article_publisher":"https:\/\/www.facebook.com\/joseaguilarblog","article_published_time":"2012-01-14T16:20:16+00:00","article_modified_time":"2012-11-05T14:49:20+00:00","og_image":[{"width":282,"height":300,"url":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2014\/10\/Imagen-no-disponible-282x300.png","type":"image\/png"}],"author":"Jose Aguilar","twitter_card":"summary_large_image","twitter_creator":"@JoseAguilarBlog","twitter_site":"@JoseAguilarBlog","twitter_misc":{"Escrito por":"Jose Aguilar","Tiempo de lectura":"1 minuto"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/","url":"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/","name":"Men\u00fa simple con CSS - Jose Aguilar Blog","isPartOf":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/#primaryimage"},"image":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/#primaryimage"},"thumbnailUrl":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2014\/10\/Imagen-no-disponible-282x300.png","datePublished":"2012-01-14T16:20:16+00:00","dateModified":"2012-11-05T14:49:20+00:00","author":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11"},"breadcrumb":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/#primaryimage","url":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2014\/10\/Imagen-no-disponible-282x300.png","contentUrl":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2014\/10\/Imagen-no-disponible-282x300.png","width":282,"height":300},{"@type":"BreadcrumbList","@id":"https:\/\/www.jose-aguilar.com\/blog\/menu-simple-css\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/www.jose-aguilar.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Men\u00fa simple con CSS"}]},{"@type":"WebSite","@id":"https:\/\/www.jose-aguilar.com\/blog\/#website","url":"https:\/\/www.jose-aguilar.com\/blog\/","name":"Jose Aguilar Blog","description":"Desarrollo Web con PrestaShop, WordPress, PHP, jQuery y Ajax","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.jose-aguilar.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Person","@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11","name":"Jose Aguilar","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g","caption":"Jose Aguilar"},"description":"Director ejecutivo y tecnol\u00f3gico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.","sameAs":["https:\/\/plus.google.com\/114357189801512615537"],"url":"https:\/\/www.jose-aguilar.com\/blog\/author\/josea902\/"}]}},"_links":{"self":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts\/1382","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/comments?post=1382"}],"version-history":[{"count":0,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts\/1382\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/media\/6469"}],"wp:attachment":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/media?parent=1382"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/categories?post=1382"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/tags?post=1382"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}