{"id":47,"date":"2016-08-04T14:13:11","date_gmt":"2016-08-04T20:13:11","guid":{"rendered":"http:\/\/www.masterclass.com.mx\/blog\/?p=47"},"modified":"2016-08-04T14:13:11","modified_gmt":"2016-08-04T20:13:11","slug":"css-shapes%e2%80%8a-%e2%80%8adiseno-de-vanguardia","status":"publish","type":"post","link":"https:\/\/www.masterclass.com.mx\/blog\/diseno-web\/css-shapes%e2%80%8a-%e2%80%8adiseno-de-vanguardia\/","title":{"rendered":"CSS Shapes\u200a \u200aDise\u00f1o de vanguardia"},"content":{"rendered":"<h3 id=\"2f45\" class=\"graf--h3 graf--leading graf--title\">CSS Shapes\u200a\u2014\u200aDise\u00f1o de vanguardia<\/h3>\n<p id=\"5e54\" class=\"graf--p graf-after--h3\">\n<figure id=\"5e71\" class=\"graf--figure graf-after--p\"><\/figure>\n<p id=\"b669\" class=\"graf--p graf-after--figure\">\n<p id=\"9a08\" class=\"graf--p graf-after--p\">El dise\u00f1o exige flexibilidad y libertad para expresar y cumplir su cometido. En la Web el contenido lo estructuramos mediante cajas y no es que las cajas sean malas, pero el que sean estrictamente rectangulares no precisamente lo que podemos llamar libre y flexible.<\/p>\n<p class=\"graf--p graf-after--p\">Adobe ha introducido una especificaci\u00f3n CSS (entre otras), \u201cCSS Shapes\u201d, el objetivo es dotar a los dise\u00f1adores de esa libertad y flexibilidad que les permita crear dise\u00f1os de niveles superiores.<\/p>\n<p id=\"da68\" class=\"graf--p graf-after--p\">Las cajas o l\u00edmites exteriores de una imagen, que nos permiten controlar el flujo de texto a nuestro antojo, son prestaciones inherentes al dise\u00f1o editorial, que ahora es posible llevar al WEB.<\/p>\n<p id=\"a18b\" class=\"graf--p graf-after--p\">\u2018Alice in Wonderland\u2019 es un gran ejemplo de c\u00f3mo la especificaci\u00f3n CSS-Shapes, puede mejorar significativamente la narrativa visual. Este estupendo trabajo ha sido realizado por Razvan Caliman (s\u00ed ya s\u00e9, est\u00e1 padre el apellido \u00bfno?), Caliman es un colaborador de Adobe que aporta su talento para que los dise\u00f1adores puedan expresar el suyo, chequen el trabajo: <a class=\"markup--anchor markup--p-anchor\" title=\"css-shapes-visual-storytelling\" href=\"http:\/\/blogs.adobe.com\/webplatform\/2013\/10\/23\/css-shapes-visual-storytelling\/\" rel=\"nofollow\" data-href=\"http:\/\/blogs.adobe.com\/webplatform\/2013\/10\/23\/css-shapes-visual-storytelling\/\">css-shapes-visual-storytelling<\/a><\/p>\n<p id=\"27d2\" class=\"graf--p graf-after--p\">Existen tantos ejemplos de c\u00f3mo es tan \u00fatil esa flexibilidad de construcci\u00f3n que podemos incluso pensar, que no es posible dise\u00f1ar sin ella, al menos no del modo en que quisi\u00e9ramos. Sin embargo la implementaci\u00f3n de la especificaci\u00f3n CSS-Shapes no hab\u00eda sido tan sencilla\u2026 Hasta ahora, y gracias \u00bfadivinen a qui\u00e9n?<\/p>\n<p id=\"6ff9\" class=\"graf--p graf-after--p\">S\u00ed, a Razvan Caliman quien generosamente desarroll\u00f3 una extensi\u00f3n para Google Chrome que nos facilita enormemente el trabajo, la extensi\u00f3n se llama \u201c<a class=\"markup--anchor markup--p-anchor\" title=\"CSS Shapes Editor for Chrome\" href=\"http:\/\/razvancaliman.com\/writing\/css-shapes-editor-chrome\/\" rel=\"nofollow\" data-href=\"http:\/\/razvancaliman.com\/writing\/css-shapes-editor-chrome\/\">CSS Shapes Editor for Chrome<\/a>\u201d y pueden conocerla en este enlace.<\/p>\n<p id=\"3df3\" class=\"graf--p graf-after--p\">Para terminar, no olviden mantenerse al pendiente de la plataforma web auspiciada por Adobe en: <a class=\"markup--anchor markup--p-anchor\" title=\"WebPlatform\" href=\"http:\/\/html.adobe.com\/webplatform\/\" rel=\"nofollow\" data-href=\"http:\/\/html.adobe.com\/webplatform\/\">WebPlatform<\/a><\/p>\n<p id=\"e8ca\" class=\"graf--p graf-after--p\">Con el gusto de saludarlos, esperamos saber de ustedes.<\/p>\n<p id=\"53d6\" class=\"graf--p graf-after--p graf--last\">Entry posted 09\/03\/14 by Manuel Vargas\u00a0, tagged: Design 812 views, 0 comments.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>CSS Shapes\u200a\u2014\u200aDise\u00f1o de vanguardia El dise\u00f1o exige flexibilidad y libertad para expresar y cumplir su cometido. En la Web el contenido lo estructuramos mediante cajas&#8230;<\/p>\n<div class=\"more-link-wrapper\"><a class=\"more-link\" href=\"https:\/\/www.masterclass.com.mx\/blog\/diseno-web\/css-shapes%e2%80%8a-%e2%80%8adiseno-de-vanguardia\/\">seguir leyendo<span class=\"screen-reader-text\">CSS Shapes\u200a \u200aDise\u00f1o de vanguardia<\/span><\/a><\/div>\n","protected":false},"author":1,"featured_media":49,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","enabled":false},"version":2}},"categories":[5],"tags":[],"class_list":["post-47","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-diseno-web","entry"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/www.masterclass.com.mx\/blog\/wp-content\/uploads\/2016\/08\/Alice-in-Wonderland-CSS.jpg?fit=839%2C410&ssl=1","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p8vEow-L","jetpack-related-posts":[],"_links":{"self":[{"href":"https:\/\/www.masterclass.com.mx\/blog\/wp-json\/wp\/v2\/posts\/47","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.masterclass.com.mx\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.masterclass.com.mx\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.masterclass.com.mx\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.masterclass.com.mx\/blog\/wp-json\/wp\/v2\/comments?post=47"}],"version-history":[{"count":2,"href":"https:\/\/www.masterclass.com.mx\/blog\/wp-json\/wp\/v2\/posts\/47\/revisions"}],"predecessor-version":[{"id":50,"href":"https:\/\/www.masterclass.com.mx\/blog\/wp-json\/wp\/v2\/posts\/47\/revisions\/50"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.masterclass.com.mx\/blog\/wp-json\/wp\/v2\/media\/49"}],"wp:attachment":[{"href":"https:\/\/www.masterclass.com.mx\/blog\/wp-json\/wp\/v2\/media?parent=47"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.masterclass.com.mx\/blog\/wp-json\/wp\/v2\/categories?post=47"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.masterclass.com.mx\/blog\/wp-json\/wp\/v2\/tags?post=47"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}