{"id":328,"date":"2020-09-26T23:05:26","date_gmt":"2020-09-26T21:05:26","guid":{"rendered":"http:\/\/blog.espol.edu.ec\/conocer\/?p=328"},"modified":"2020-09-26T23:05:26","modified_gmt":"2020-09-26T21:05:26","slug":"disenador-web-vs-desarrollador-web","status":"publish","type":"post","link":"https:\/\/blog.espol.edu.ec\/conocer\/2020\/09\/26\/disenador-web-vs-desarrollador-web\/","title":{"rendered":"Dise\u00f1ador web vs. desarrollador web"},"content":{"rendered":"<p><span style=\"font-weight: 400\">Es posible que alguna vez te hayas preguntado cu\u00e1l es la diferencia entre un dise\u00f1ador y un desarrollador web. Tal vez te la has hecho porque est\u00e1s pensando en tu futuro profesional, y en que sabes que quieres enfocarte al mundo digital, aunque no tienes muy claros todos los perfiles que se requieren en todo este mundo digital. Tal vez simplemente tienes un negocio, una tienda de muebles en Bilbao, te has decidido, por fin, a tener tu propia p\u00e1gina web (bienvenido al S.XXI, s\u00f3lo llegas 20 a\u00f1os tarde, no te preocupes), y claro, no sabes si lo que necesitas es un <\/span><a href=\"https:\/\/pixelfactory.es\/desarrollo-web-bilbao\/\"><span style=\"font-weight: 400\">desarrollador web en Bilbao<\/span><\/a><span style=\"font-weight: 400\"> o alguien que se encargue del <\/span><a href=\"https:\/\/pixelfactory.es\/diseno-web-bilbao\/\"><span style=\"font-weight: 400\">dise\u00f1o web en Bilbao<\/span><\/a><span style=\"font-weight: 400\">, porque en realidad para ti es m\u00e1s o menos lo mismo (es comprensible, no te apures).\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400\">Pero no. La especializaci\u00f3n est\u00e1 a la orden del d\u00eda en las nuevas tecnolog\u00edas, y en este caso, hay diferencias entre ambas profesiones, lo que no implica que no exista alg\u00fan superhombre, o supermujer, que pueda aunar las dos competencias en su superpersona. Aunque lo m\u00e1s f\u00e1cil es que encuentres todo en una agencia de comunicaci\u00f3n y marketing digital, en la cual dispondr\u00e1n de varios perfiles a tu servicio, pero al grano\u2026<\/span><\/p>\n<h2><span style=\"font-weight: 400\"><br \/>\n<\/span><span style=\"font-weight: 400\">\u00bfCu\u00e1l es la diferencia entre un dise\u00f1ador y un desarrollador web?\u00a0<\/span><\/h2>\n<p><span style=\"font-weight: 400\">En los primeros d\u00edas de la web, la respuesta a esa pregunta era simple: los dise\u00f1adores dise\u00f1an y desarrollan c\u00f3digo. Hoy en d\u00eda esa pregunta requiere un poco m\u00e1s de matiz... ser\u00eda dif\u00edcil encontrar un dise\u00f1ador web que no supiera al menos un poco de HTML y CSS, y no tendr\u00edas que buscar muy lejos un desarrollador web de primera l\u00ednea que pueda montar un gui\u00f3n gr\u00e1fico. Sin embargo, si hablamos estrictamente de los conceptos generales de dise\u00f1o web vs. desarrollo web, la distinci\u00f3n es un poco m\u00e1s clara. Echemos un vistazo a estos dos conceptos y a los papeles que juegan en la construcci\u00f3n de los sitios web y aplicaciones que conocemos y amamos.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span style=\"font-weight: 400\">\u00bfQu\u00e9 es el dise\u00f1o web?<\/span><\/h3>\n<p><span style=\"font-weight: 400\">El dise\u00f1o web rige todo lo relacionado con la est\u00e9tica visual y la usabilidad de un sitio web: combinaci\u00f3n de colores, dise\u00f1o, flujo de informaci\u00f3n y todo lo dem\u00e1s relacionado con los aspectos visuales de la interfaz de usuario (UI\/UX). Algunas habilidades y herramientas comunes que distinguen al dise\u00f1ador web del desarrollador web son:<\/span><\/p>\n<p>&nbsp;<\/p>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Adobe Creative Suite (Photoshop, Illustrator) u otro software de dise\u00f1o<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Dise\u00f1o gr\u00e1fico<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Dise\u00f1o del logo<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Dise\u00f1o\/formato<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Colocando botones de llamada a la acci\u00f3n<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Marca<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Marcos, maquetas y guiones gr\u00e1ficos...<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Paleta de colores<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Tipograf\u00eda<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400\">El dise\u00f1o de la web se preocupa por lo que el usuario ve realmente en la pantalla de su ordenador o dispositivo m\u00f3vil, y menos por los mecanismos bajo la superficie que hacen que todo funcione. A trav\u00e9s del uso del color, las im\u00e1genes, la tipograf\u00eda y el dise\u00f1o, dan vida a una experiencia digital. Dicho esto, muchos dise\u00f1adores web tambi\u00e9n est\u00e1n familiarizados con HTML, CSS y JavaScript- ayuda a ser capaz de crear maquetas vivas de una aplicaci\u00f3n web cuando se trata de lanzar una idea al equipo o ajustar la interfaz de usuario de una aplicaci\u00f3n. Los dise\u00f1adores web tambi\u00e9n suelen trabajar con servicios de plantillas como WordPress o Joomla!, que permiten crear sitios web utilizando temas y widgets sin escribir una sola l\u00ednea de c\u00f3digo.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span style=\"font-weight: 400\">\u00bfQu\u00e9 es el desarrollo web?<\/span><\/h3>\n<p><span style=\"font-weight: 400\">El desarrollo web rige todo el c\u00f3digo que hace que un sitio web funcione. Se puede dividir en dos categor\u00edas: front-end y back-end. El front-end o lado del cliente de una aplicaci\u00f3n es el c\u00f3digo responsable de determinar c\u00f3mo el sitio web mostrar\u00e1 realmente los dise\u00f1os que un dise\u00f1ador ha creado. El back-end o lado del servidor de una aplicaci\u00f3n es responsable de gestionar los datos dentro de la base de datos y de servir esos datos al front-end para ser mostrados. Como habr\u00e1s adivinado, es el trabajo del desarrollador del front-end el que tiende a compartir la mayor parte de la superposici\u00f3n con el dise\u00f1ador web. A continuaci\u00f3n se enumeran algunas habilidades y herramientas comunes que tradicionalmente se consideran exclusivas del desarrollador de front-end:<\/span><\/p>\n<p>&nbsp;<\/p>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">HTML\/CSS\/JavaScript<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Preprocesadores CSS (es decir, LESS o Sass)<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Marcos (es decir, AngularJS, ReactJS, Ember)<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Bibliotecas (es decir, jQuery)<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Git y GitHub<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400\">Los desarrolladores web de primera l\u00ednea no suelen crear maquetas, seleccionar tipograf\u00edas o elegir paletas de color, que suelen ser proporcionadas por el dise\u00f1ador. El trabajo del desarrollador es dar vida a esas maquetas. Dicho esto, entender lo que el dise\u00f1ador quiere requiere un conocimiento de las mejores pr\u00e1cticas en el dise\u00f1o de UI\/UX para que el desarrollador sea capaz de elegir la tecnolog\u00eda adecuada para ofrecer el aspecto deseado y la experiencia en el producto final.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2><span style=\"font-weight: 400\">Encuentra al \"Unicornio\"<\/span><\/h2>\n<p><span style=\"font-weight: 400\">Lo que comenz\u00f3 como una broma en la industria -el h\u00edbrido dise\u00f1ador\/desarrollador que puede hacerlo todo- es ahora un final viable tanto para los dise\u00f1adores web como para los desarrolladores de front-end, gracias al aumento de la disponibilidad de recursos educativos en la web. Aquellos desarrolladores\/dise\u00f1adores que tienen una buena comprensi\u00f3n de las habilidades a ambos lados del espectro son muy buscados en la industria. El \"unicornio\" puede tomar su proyecto desde la etapa conceptual de las maquetas visuales y los guiones gr\u00e1ficos, y llevarlo a trav\u00e9s del desarrollo del front-end por s\u00ed mismo. No es que quieras que lo hagan; el verdadero valor de los desarrolladores que dise\u00f1an y de los dise\u00f1adores que desarrollan es su capacidad para hablar los idiomas de los dem\u00e1s. Esto no s\u00f3lo conduce a una mejor comunicaci\u00f3n en el equipo y a un flujo de trabajo m\u00e1s fluido, sino que tambi\u00e9n significa que obtendr\u00e1s la mejor soluci\u00f3n posible. Como regla general, si\u00e9ntete libre de confiar en el \"unicornio\" para proyectos peque\u00f1os, en los que es factible que una o dos personas se encarguen tanto de la parte trasera como de la delantera de una aplicaci\u00f3n. Para proyectos m\u00e1s grandes, aunque se consiga contratar a unos pocos \"unicornios\", se requieren funciones m\u00e1s claramente definidas. O como ya hemos comentado, conf\u00eda en toda la gama de profesionales que puede aportar una agencia, en la que cada perfil est\u00e1 orientado y especializado a un tipo de trabajo y campo espec\u00edfico que domina completamente, porque aunque no lo creas, el trabajo no termina cuando termina tu web, de hecho, acaba de comenzar...<\/span><\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Es posible que alguna vez te hayas preguntado cu\u00e1l es la diferencia entre un dise\u00f1ador y un desarrollador web. Tal vez te la has hecho porque est\u00e1s pensando en tu futuro profesional, y en que sabes que quieres enfocarte al mundo digital, aunque no tienes muy claros todos los perfiles que se requieren en todo &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/blog.espol.edu.ec\/conocer\/2020\/09\/26\/disenador-web-vs-desarrollador-web\/\" class=\"more-link\">Continuar leyendo<span class=\"screen-reader-text\"> \"Dise\u00f1ador web vs. desarrollador web\"<\/span><\/a><\/p>\n","protected":false},"author":11121,"featured_media":329,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[818],"tags":[],"class_list":["post-328","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-sin-categoria"],"_links":{"self":[{"href":"https:\/\/blog.espol.edu.ec\/conocer\/wp-json\/wp\/v2\/posts\/328","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.espol.edu.ec\/conocer\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.espol.edu.ec\/conocer\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.espol.edu.ec\/conocer\/wp-json\/wp\/v2\/users\/11121"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.espol.edu.ec\/conocer\/wp-json\/wp\/v2\/comments?post=328"}],"version-history":[{"count":1,"href":"https:\/\/blog.espol.edu.ec\/conocer\/wp-json\/wp\/v2\/posts\/328\/revisions"}],"predecessor-version":[{"id":330,"href":"https:\/\/blog.espol.edu.ec\/conocer\/wp-json\/wp\/v2\/posts\/328\/revisions\/330"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.espol.edu.ec\/conocer\/wp-json\/wp\/v2\/media\/329"}],"wp:attachment":[{"href":"https:\/\/blog.espol.edu.ec\/conocer\/wp-json\/wp\/v2\/media?parent=328"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.espol.edu.ec\/conocer\/wp-json\/wp\/v2\/categories?post=328"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.espol.edu.ec\/conocer\/wp-json\/wp\/v2\/tags?post=328"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}