{"id":987518699,"date":"2025-04-17T16:43:34","date_gmt":"2025-04-17T16:43:34","guid":{"rendered":"https:\/\/mallorcagraphics.com\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/"},"modified":"2026-09-23T15:26:37","modified_gmt":"2026-09-23T15:26:37","slug":"por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web","status":"publish","type":"post","link":"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/","title":{"rendered":"\u00bfPor qu\u00e9 deber\u00eda usar vw y vh en lugar de px en el desarrollo web?"},"content":{"rendered":"

En el desarrollo web, el dise\u00f1o responsivo es uno de los aspectos m\u00e1s cr\u00edticos y con vw y vh se puede crear una experiencia visualmente atractiva y f\u00e1cil de usar. Con la creciente variedad de dispositivos \u2014tel\u00e9fonos inteligentes, tabletas, ordenadores de sobremesa e incluso relojes inteligentes\u2014, los dise\u00f1adores deben asegurarse de que sus sitios web se adapten con fluidez a los diferentes tama\u00f1os y resoluciones de pantalla.<\/p>\n

Por esta raz\u00f3n, los desarrolladores web modernos suelen preferir el uso de \u00abvw\u00bb (viewport width) y \u00abvh\u00bb (viewport height) en lugar del m\u00e1s tradicional \u00abpx\u00bb (p\u00edxeles) para dimensionar elementos en una p\u00e1gina web.<\/p>\n

\u00bfQu\u00e9 son \u00abvw\u00bb y \u00abvh\u00bb?<\/h2>\n

\u00abvw\u00bb (Viewport Width): 1 \u00abvw\u00bb equivale al 1 % del ancho del viewport del navegador. Si su viewport tiene 1000 p\u00edxeles de ancho, 1 \u00abvw\u00bb equivaldr\u00eda a 10 p\u00edxeles.
\n\u00abvh\u00bb (Viewport Height): 1 \u00abvh\u00bb equivale al 1 % de la altura del viewport. Si su viewport tiene 800 p\u00edxeles de alto, 1 \u00abvh\u00bb equivaldr\u00eda a 8 p\u00edxeles.<\/p>\n

Estas unidades son relativas al viewport, que es el \u00e1rea visible de una p\u00e1gina web. A diferencia de \u00abpx\u00bb, que es una unidad absoluta que permanece est\u00e1tica independientemente del tama\u00f1o de la pantalla, \u00abvw\u00bb y \u00abvh\u00bb se ajustan din\u00e1micamente a medida que cambia el viewport.<\/p>\n

Ventajas de usar \u00abvw\u00bb y \u00abvh\u00bb en lugar de \u00abpx\u00bb<\/h3>\n

1. Dise\u00f1o responsivo:<\/strong><\/h3>\n

Cuando se utilizan p\u00edxeles (`px`) para el dimensionamiento, el dise\u00f1o se vuelve fijo. Esto significa que a medida que cambia el tama\u00f1o de la pantalla (de escritorio a m\u00f3vil, por ejemplo), los elementos pueden aparecer demasiado grandes, demasiado peque\u00f1os o desalineados. \u00abvw\u00bb y \u00abvh\u00bb, por otro lado, permiten que su dise\u00f1o se adapte autom\u00e1ticamente a diferentes tama\u00f1os de pantalla, manteniendo elementos de dise\u00f1o proporcionados que se ven bien en cualquier dispositivo.<\/p>\n

Por ejemplo:<\/strong>
\n\u00ab`css
\n\/* With px *\/
\n.header {
\nheight: 100px;
\nwidth: 600px;
\n}\u00ab`<\/p>\n

\/* Con vw y vh *\/
\n.header {
\nheight: 10vh;
\nwidth: 60vw;
\n}
\n\u00ab`
\nCon \u00abvw\u00bb y \u00abvh\u00bb, las dimensiones del encabezado se ajustar\u00e1n proporcionalmente, asegurando que el dise\u00f1o funcione tanto en un monitor de escritorio ancho como en una pantalla m\u00f3vil peque\u00f1a.<\/strong><\/p>\n

2. Dimensionamiento basado en el viewport:<\/strong><\/h3>\n

Dado que las unidades \u00abvw\u00bb y \u00abvh\u00bb se basan en el viewport del navegador, los desarrolladores pueden crear dise\u00f1os que se escalen en funci\u00f3n del espacio de pantalla disponible. Esto es particularmente \u00fatil para componentes de pantalla completa como banners de h\u00e9roe, modales y deslizadores, donde mantener las proporciones correctas es crucial.<\/p>\n

Por ejemplo, un fondo de pantalla completa se puede lograr f\u00e1cilmente usando \u00abvh\u00bb:<\/strong>
\n\u00ab`css
\n.full-screen-banner {
\nheight: 100vh;
\nwidth: 100vw;
\n}
\n\u00ab`
\nEsto garantiza que el banner siempre ocupe toda la pantalla, independientemente del tama\u00f1o o la resoluci\u00f3n del dispositivo.<\/strong><\/p>\n

3. Tipograf\u00eda fluida:<\/h3>\n

La tipograf\u00eda fluida, donde los tama\u00f1os de fuente se escalan din\u00e1micamente con el tama\u00f1o del viewport, es una tendencia creciente en el dise\u00f1o web. Al usar `vw` para los tama\u00f1os de fuente, puede asegurarse de que el texto se ajuste proporcionalmente en diferentes dispositivos, mejorando la legibilidad y manteniendo una est\u00e9tica de dise\u00f1o consistente.<\/p>\n

Por ejemplo:<\/strong>
\n\u00ab`css
\nh1 {
\nfont-size: 5vw;
\n}
\n\u00ab`
\nEn este caso, el texto del encabezado ser\u00e1 el 5 % del ancho del viewport, lo que permite fuentes m\u00e1s grandes en pantallas m\u00e1s grandes y fuentes m\u00e1s peque\u00f1as en dispositivos m\u00f3viles sin necesidad de consultas de medios.<\/strong><\/p>\n

4. Sin sobrecarga de consultas de medios:<\/h3>\n

Un problema com\u00fan con el uso de `px` es que los desarrolladores a menudo necesitan escribir numerosas consultas de medios para manejar diferentes tama\u00f1os de pantalla. Esto puede inflar su archivo CSS y dificultar el mantenimiento. Al usar \u00abvw\u00bb y \u00abvh\u00bb, puede reducir la necesidad de consultas de medios excesivas, ya que los elementos de dise\u00f1o se redimensionan naturalmente seg\u00fan el viewport.<\/p>\n

5. Mejor accesibilidad:<\/h4>\n

El uso de \u00abvw\u00bb y \u00abvh\u00bb tambi\u00e9n puede mejorar la accesibilidad. Dado que estas unidades se ajustan en funci\u00f3n del tama\u00f1o de la pantalla, pueden ayudar a garantizar que elementos como botones, im\u00e1genes y texto mantengan un tama\u00f1o adecuado para los usuarios con discapacidades visuales que pueden depender del zoom de acercamiento o alejamiento.<\/p>\n

6. Consistencia entre dispositivos:<\/h3>\n

Al usar \u00abpx\u00bb, los dise\u00f1os pueden verse perfectos en un dispositivo, pero completamente diferentes en otro. Esta inconsistencia puede ser frustrante, especialmente al garantizar una experiencia de usuario fluida. Con \u00abvw\u00bb y \u00abvh\u00bb, los tama\u00f1os relativos se mantienen consistentes, proporcionando una experiencia m\u00e1s unificada en m\u00faltiples dispositivos.<\/p>\n

\u00bfCu\u00e1ndo deber\u00eda seguir usando \u00abpx\u00bb?<\/h3>\n

Aunque \u00abvw\u00bb y \u00abvh\u00bb ofrecen muchas ventajas, hay ocasiones en las que \u00abpx\u00bb podr\u00eda seguir siendo la mejor opci\u00f3n:<\/strong>
\nElementos \u00abpixel perfect\u00bb:<\/strong> Los p\u00edxeles pueden ser \u00fatiles si necesita elementos que permanezcan con un tama\u00f1o fijo independientemente del tama\u00f1o de la pantalla (por ejemplo, iconos o peque\u00f1os componentes de interfaz de usuario).
\nBordes y detalles de dise\u00f1o ajustados:<\/strong> Los p\u00edxeles podr\u00edan ofrecer m\u00e1s control para bordes finos, m\u00e1rgenes o rellenos, especialmente cuando las peque\u00f1as diferencias de tama\u00f1o importan.<\/p>\n

Conclusi\u00f3n<\/h4>\n

La flexibilidad y la adaptabilidad son clave para ofrecer excelentes experiencias de usuario en diferentes dispositivos en el desarrollo web moderno. Al optar por las unidades \u00abvw\u00bb y \u00abvh\u00bb en lugar de \u00abpx\u00bb, puede crear dise\u00f1os m\u00e1s responsivos, mantener la consistencia del dise\u00f1o y requerir menos ajustes a trav\u00e9s de consultas de medios. Si bien \u00abpx\u00bb todav\u00eda tiene su lugar para algunos elementos de dise\u00f1o espec\u00edficos, adoptar unidades relativas dar\u00e1 como resultado, en \u00faltima instancia, dise\u00f1os m\u00e1s limpios, escalables y f\u00e1ciles de usar.<\/p>\n

 <\/p>\n","protected":false},"excerpt":{"rendered":"

En el desarrollo web, el dise\u00f1o responsivo es uno de los aspectos m\u00e1s cr\u00edticos y con vw y vh se puede crear una experiencia visualmente atractiva y f\u00e1cil de usar. Con la creciente variedad de dispositivos \u2014tel\u00e9fonos inteligentes, tabletas, ordenadores de sobremesa e incluso relojes inteligentes\u2014, los dise\u00f1adores deben asegurarse de que sus sitios web […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"iawp_total_views":1,"footnotes":""},"categories":[33],"tags":[],"class_list":["post-987518699","post","type-post","status-publish","format-standard","hentry","category-diseno-web"],"yoast_head":"\n\u00bfPor qu\u00e9 deber\u00eda usar vw y vh en lugar de px en el desarrollo web? - Mallorca Graphics<\/title>\n<meta name=\"description\" content=\"Hoy en d\u00eda, en el desarrollo web, el dise\u00f1o responsivo, vw y vh se encuentran entre los comandos m\u00e1s utilizados al crear una experiencia visualmente atractiva y f\u00e1cil de usar.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u00bfPor qu\u00e9 deber\u00eda usar vw y vh en lugar de px en el desarrollo web?\" \/>\n<meta property=\"og:description\" content=\"Hoy en d\u00eda, en el desarrollo web, el dise\u00f1o responsivo, vw y vh se encuentran entre los comandos m\u00e1s utilizados al crear una experiencia visualmente atractiva y f\u00e1cil de usar.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/\" \/>\n<meta property=\"og:site_name\" content=\"Mallorca Graphics\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/MallorcaGraphics\" \/>\n<meta property=\"article:published_time\" content=\"2025-04-17T16:43:34+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-23T15:26:37+00:00\" \/>\n<meta name=\"author\" content=\"Mallorca Graphics\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Mallorca Graphics\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/blog\\\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/blog\\\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\\\/\"},\"author\":{\"name\":\"Mallorca Graphics\",\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/#\\\/schema\\\/person\\\/2ae1a7f5760bb7ee6f3114ae6e20888c\"},\"headline\":\"\u00bfPor qu\u00e9 deber\u00eda usar vw y vh en lugar de px en el desarrollo web?\",\"datePublished\":\"2025-04-17T16:43:34+00:00\",\"dateModified\":\"2026-09-23T15:26:37+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/blog\\\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\\\/\"},\"wordCount\":970,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/#organization\"},\"articleSection\":[\"Dise\u00f1o web\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/blog\\\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/blog\\\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\\\/\",\"url\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/blog\\\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\\\/\",\"name\":\"\u00bfPor qu\u00e9 deber\u00eda usar vw y vh en lugar de px en el desarrollo web? - Mallorca Graphics\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/#website\"},\"datePublished\":\"2025-04-17T16:43:34+00:00\",\"dateModified\":\"2026-09-23T15:26:37+00:00\",\"description\":\"Hoy en d\u00eda, en el desarrollo web, el dise\u00f1o responsivo, vw y vh se encuentran entre los comandos m\u00e1s utilizados al crear una experiencia visualmente atractiva y f\u00e1cil de usar.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/blog\\\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\\\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/blog\\\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/blog\\\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u00bfPor qu\u00e9 deber\u00eda usar vw y vh en lugar de px en el desarrollo web?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/#website\",\"url\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/\",\"name\":\"Mallorca Graphics\",\"description\":\"Mi blog de WordPress\",\"publisher\":{\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/#organization\",\"name\":\"Mallorca Graphics\",\"url\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":null,\"contentUrl\":null,\"width\":null,\"height\":null,\"caption\":\"Mallorca Graphics\"},\"image\":{\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/MallorcaGraphics\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/mallorca-graphics\\\/\",\"https:\\\/\\\/www.instagram.com\\\/mallorca.graphics\\\/\",\"https:\\\/\\\/www.youtube.com\\\/@Mallorca.Graphics\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/#\\\/schema\\\/person\\\/2ae1a7f5760bb7ee6f3114ae6e20888c\",\"name\":\"Mallorca Graphics\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/603e188914e8f0f5b725a7c86881a82f6b7acf285aae5fa76b5a961e17dff5ea?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/603e188914e8f0f5b725a7c86881a82f6b7acf285aae5fa76b5a961e17dff5ea?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/603e188914e8f0f5b725a7c86881a82f6b7acf285aae5fa76b5a961e17dff5ea?s=96&d=mm&r=g\",\"caption\":\"Mallorca Graphics\"},\"sameAs\":[\"https:\\\/\\\/mallorcagraphics.com\"],\"url\":\"https:\\\/\\\/mallorcagraphics.com\\\/es\\\/blog\\\/author\\\/pedro-alvarez\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"\u00bfPor qu\u00e9 deber\u00eda usar vw y vh en lugar de px en el desarrollo web? - Mallorca Graphics","description":"Hoy en d\u00eda, en el desarrollo web, el dise\u00f1o responsivo, vw y vh se encuentran entre los comandos m\u00e1s utilizados al crear una experiencia visualmente atractiva y f\u00e1cil de usar.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/","og_locale":"es_ES","og_type":"article","og_title":"\u00bfPor qu\u00e9 deber\u00eda usar vw y vh en lugar de px en el desarrollo web?","og_description":"Hoy en d\u00eda, en el desarrollo web, el dise\u00f1o responsivo, vw y vh se encuentran entre los comandos m\u00e1s utilizados al crear una experiencia visualmente atractiva y f\u00e1cil de usar.","og_url":"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/","og_site_name":"Mallorca Graphics","article_publisher":"https:\/\/www.facebook.com\/MallorcaGraphics","article_published_time":"2025-04-17T16:43:34+00:00","article_modified_time":"2026-09-23T15:26:37+00:00","author":"Mallorca Graphics","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"Mallorca Graphics","Tiempo de lectura":"5 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/#article","isPartOf":{"@id":"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/"},"author":{"name":"Mallorca Graphics","@id":"https:\/\/mallorcagraphics.com\/es\/#\/schema\/person\/2ae1a7f5760bb7ee6f3114ae6e20888c"},"headline":"\u00bfPor qu\u00e9 deber\u00eda usar vw y vh en lugar de px en el desarrollo web?","datePublished":"2025-04-17T16:43:34+00:00","dateModified":"2026-09-23T15:26:37+00:00","mainEntityOfPage":{"@id":"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/"},"wordCount":970,"commentCount":0,"publisher":{"@id":"https:\/\/mallorcagraphics.com\/es\/#organization"},"articleSection":["Dise\u00f1o web"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/","url":"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/","name":"\u00bfPor qu\u00e9 deber\u00eda usar vw y vh en lugar de px en el desarrollo web? - Mallorca Graphics","isPartOf":{"@id":"https:\/\/mallorcagraphics.com\/es\/#website"},"datePublished":"2025-04-17T16:43:34+00:00","dateModified":"2026-09-23T15:26:37+00:00","description":"Hoy en d\u00eda, en el desarrollo web, el dise\u00f1o responsivo, vw y vh se encuentran entre los comandos m\u00e1s utilizados al crear una experiencia visualmente atractiva y f\u00e1cil de usar.","breadcrumb":{"@id":"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/mallorcagraphics.com\/es\/blog\/por-que-deberia-usar-vw-y-vh-en-lugar-de-px-en-el-desarrollo-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/mallorcagraphics.com\/es\/"},{"@type":"ListItem","position":2,"name":"\u00bfPor qu\u00e9 deber\u00eda usar vw y vh en lugar de px en el desarrollo web?"}]},{"@type":"WebSite","@id":"https:\/\/mallorcagraphics.com\/es\/#website","url":"https:\/\/mallorcagraphics.com\/es\/","name":"Mallorca Graphics","description":"Mi blog de WordPress","publisher":{"@id":"https:\/\/mallorcagraphics.com\/es\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/mallorcagraphics.com\/es\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/mallorcagraphics.com\/es\/#organization","name":"Mallorca Graphics","url":"https:\/\/mallorcagraphics.com\/es\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/mallorcagraphics.com\/es\/#\/schema\/logo\/image\/","url":null,"contentUrl":null,"width":null,"height":null,"caption":"Mallorca Graphics"},"image":{"@id":"https:\/\/mallorcagraphics.com\/es\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/MallorcaGraphics","https:\/\/www.linkedin.com\/company\/mallorca-graphics\/","https:\/\/www.instagram.com\/mallorca.graphics\/","https:\/\/www.youtube.com\/@Mallorca.Graphics\/"]},{"@type":"Person","@id":"https:\/\/mallorcagraphics.com\/es\/#\/schema\/person\/2ae1a7f5760bb7ee6f3114ae6e20888c","name":"Mallorca Graphics","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/secure.gravatar.com\/avatar\/603e188914e8f0f5b725a7c86881a82f6b7acf285aae5fa76b5a961e17dff5ea?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/603e188914e8f0f5b725a7c86881a82f6b7acf285aae5fa76b5a961e17dff5ea?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/603e188914e8f0f5b725a7c86881a82f6b7acf285aae5fa76b5a961e17dff5ea?s=96&d=mm&r=g","caption":"Mallorca Graphics"},"sameAs":["https:\/\/mallorcagraphics.com"],"url":"https:\/\/mallorcagraphics.com\/es\/blog\/author\/pedro-alvarez\/"}]}},"_links":{"self":[{"href":"https:\/\/mallorcagraphics.com\/es\/wp-json\/wp\/v2\/posts\/987518699","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mallorcagraphics.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mallorcagraphics.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mallorcagraphics.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mallorcagraphics.com\/es\/wp-json\/wp\/v2\/comments?post=987518699"}],"version-history":[{"count":0,"href":"https:\/\/mallorcagraphics.com\/es\/wp-json\/wp\/v2\/posts\/987518699\/revisions"}],"wp:attachment":[{"href":"https:\/\/mallorcagraphics.com\/es\/wp-json\/wp\/v2\/media?parent=987518699"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mallorcagraphics.com\/es\/wp-json\/wp\/v2\/categories?post=987518699"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mallorcagraphics.com\/es\/wp-json\/wp\/v2\/tags?post=987518699"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}