Web Designer x Web Developer: quais as diferenças? \| TreinaWeb Promoção no ar Matricule-se agora e garanta **54% de desconto** Termina em Tempo restante da oferta: 14 Horas 06 Min 49 Seg Tempo restante da oferta: 14 06 49 [Assinar →](https://www.treinaweb.com.br/checkout/pagamento/plano/anual?cupom=TW-SCLIENTE26) [ ](https://www.treinaweb.com.br) Explorar [ Quanto custa? ](#assinatura) [ FAQ ](https://www.treinaweb.com.br#faq) [Matricule-se](#assinatura) [ Entrar ](https://www.treinaweb.com.br/login) [ Início ](https://www.treinaweb.com.br) [ Artigos ](https://www.treinaweb.com.br/blog) Web Designer x Web Developer: quais as diferenças? [ Desenvolvimento ](https://www.treinaweb.com.br/blog/categoria/desenvolvimento) # Web Designer x Web Developer: quais as diferenças? Confira neste artigo as principais diferenças entre um Web Designer e um Web Developer. [ Marylene Guedes ](https://www.treinaweb.com.br/blog/autor/marylene-guedes) 7 anos atrás ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2020/04/08111124/WEB-DEVELOPER-WEB-DESIGNER.png) Muitos iniciantes da área de tecnologia ficam em dúvida de qual carreira seguir, no que devem focar… afinal são diversas opções. Dentre essas opções estão as carreiras de **Web Designer** e **Web Developer**. Por serem áreas que se complementam, muitas pessoas acabam confundindo elas e principalmente sobre o que cada profissional realmente faz. Essas são dúvidas principalmente de quem quer ingressar na área de desenvolvimento web e é o que vamos abordar neste artigo. ### Web Designer Web designer é o responsável pelo design - o visual - da aplicação. Esse profissional deve dominar conceitos de design, usabilidade ([UX e UI](https://www.treinaweb.com.br/blog/ux-e-ui-o-que-e-e-quais-as-diferencas/ "UX e UI")), identidade visual e design de interfaces, além de ferramentas de edição visual, como o Photoshop, Illustrator e Sketch App, por exemplo, pois são através dessas ferramentas que ele irá desenvolver a parte visual da aplicação. **Mas, para ser um Web Designer eu preciso saber programar?** Não necessariamente. O foco do web designer é focar totalmente no design, como o próprio nome diz é um design só que mais focado para web. Ele também deve saber [HTML e CSS](https://www.treinaweb.com.br/blog/o-que-e-e-como-comecar-com-html-e-css/ "HTML e CSS"), mas essas não são consideradas linguagens de programação. Alguns profissionais de Web Designer acabam aprendendo [JavaScript](https://www.treinaweb.com.br/blog/o-que-e-e-como-comecar-com-javascript/ "JavaScript"), mas não é uma obrigatoriedade, pois ele não precisará mexer com o código da aplicação de fato. O Web Designer deve fazer o planejamento, a criação de toda a aparência da aplicação e a manutenção de interfaces digitais, tudo isso considerando aspectos importantes do design. É essencial que os designers criem algo atraente, para gerar uma boa experiência do usuário. Depois do Web Designer fazer seu trabalho teremos um layout, porém um layout é algo estático, não tem funcionalidade nenhuma, nenhum usuário conseguirá ter alguma interação com a aplicação. Sendo assim, para que ele se torne algo utilizável, com ações pelo usuário, precisamos utilizar tecnologias onde através de sua implementação com códigos, podemos torná-lo acessível para os usuários. O profissional de Web Designer entrega o projeto cheio de recursos visuais aos desenvolvedores para codificação. ### Web developer O Web Developer é quem realmente coloca a mão no código. Ele cuida da codificação onde tornará possível que a interface gráfica (que vimos acima) seja acessada e utilizada. Geralmente são profissionais com a parte lógica mais aguçada e esses sim devem possuir habilidades em [programação](https://www.treinaweb.com.br/blog/quero-programar-por-onde-comecar/ "programação"). Um ponto importante de ressaltar aqui é que o Web Developer pode ser dividido em dois tipos: [front-end e back-end](https://www.treinaweb.com.br/blog/o-que-e-front-end-e-back-end/ "front-end e back-end"). De maneira sucinta, os desenvolvedores front-end se concentram na parte que o usuário vê, como as interações por exemplo, fazendo com que a [experiência do usuário](https://www.treinaweb.com.br/blog/ux-a-importancia-da-experiencia-do-usuario-nos-projetos/ "experiência do usuário") naquela aplicação seja positiva. Já o desenvolvedor back-end está mais para a “parte de trás” do site, aquilo que não vemos, como a configuração de servidores e banco de dados. O papel do back-end também é importantíssimo para o funcionamento da aplicação. Na verdade, o Web Designer e o Web Developer (desenvolvedores front-end e back-end) se complementam a fim de entregar um bom resultado aos usuários finais. [ ![Desenvolvedor Front-end Júnior](https://d2knvm16wkt3ia.cloudfront.net/assets/svg-icon/html5-css3.svg) Formação Desenvolvedor Front-end Júnior Conhecer a formação ](https://www.treinaweb.com.br/formacao/desenvolvedor-front-end-junior) No final, o que acaba fazendo muita confusão é um profissional acabar fazendo ambos os papéis. Pode acontecer do próprio web developer ter que pensar no design e planejar a aplicação. Como também pode acontecer de um web designer acabar aprendendo a programar também, fazendo com que ele mesmo siga os próximos passos ao invés de passar para um programador. Neste caso, seria um acúmulo de funções, pois vimos quais tarefas pertenceriam a cada profissional. Agora que você já sabe a diferença entre Web Designer e Web Developer, mas quer conhecer melhor o que um [front-end e um back-end](https://www.treinaweb.com.br/blog/o-que-e-front-end-e-back-end/ "front-end e um back-end") faz, temos um artigo específico disso em nosso blog. Até a próxima! =) - [ #Design ](https://www.treinaweb.com.br/blog/tag/design) - [ #Desenvolvimento ](https://www.treinaweb.com.br/blog/tag/desenvolvimento) - [ #Programação ](https://www.treinaweb.com.br/blog/tag/programacao) - [ #web designer ](https://www.treinaweb.com.br/blog/tag/web-designer) - [ #web developer ](https://www.treinaweb.com.br/blog/tag/web-developer) Autor ![Marylene Guedes](//secure.gravatar.com/avatar/5b0ba52b3705f298802db58782656bbc?d=mm) ## Marylene Guedes Responsável pelo sucesso do cliente na TreinaWeb. Graduada em Gestão de Tecnologia da Informação pela FATEC Guaratinguetá, além de estudante de UX/UI. [Todos os artigos](https://www.treinaweb.com.br/blog/autor/marylene-guedes) ## Continue estudando Transforme leitura em prática com os cursos e formações da TreinaWeb. [Ver cursos](https://www.treinaweb.com.br/cursos) Continue lendo ## Artigos relacionados - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2019/07/29063746/0-400x280.png) [ Carreira ](https://www.treinaweb.com.br/blog/categoria/carreira) 7 anos atrás ## [ Como funciona uma empresa de desenvolvimento de software? ](https://www.treinaweb.com.br/blog/como-funciona-uma-empresa-de-desenvolvimento-de-software) Veja de forma resumida como é trabalhar em uma empresa de desenvolvimento de software. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2018/03/29143726/TW-ENTREVISTAS-TALITA-PAGANI-400x280.png) [ Entrevistas ](https://www.treinaweb.com.br/blog/categoria/entrevistas) 9 anos atrás ## [ TW Entrevista 07: Talita Pagani ](https://www.treinaweb.com.br/blog/tw-entrevista-07-talita-pagani) Fizemos uma série de entrevistas chamada "TW Entrevista". A entrevistada de hoje é a Talita Pagani, desenvolvedora, empreendedora e membro da W3C's Web Accessibility Working Group do Brasil. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2018/11/06104639/TW-ENTREVISTAS-FABIO-400x280.png) [ Desenvolvimento Web ](https://www.treinaweb.com.br/blog/categoria/entrevistas-desenvolvimento-web) 8 anos atrás ## [ TW Entrevista 08: Fabio Costa ](https://www.treinaweb.com.br/blog/tw-entrevista-08-fabio-costa) Fizemos uma série de entrevistas chamada "TW Entrevista". O entrevistado de hoje é o Fabio Costa, desenvolvedor que já trabalhou na Globo.com, no Facebook e agora está na GoDaddy. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2018/12/16065017/front-back-ou-fullstack-400x280.png) [ Carreira ](https://www.treinaweb.com.br/blog/categoria/carreira) 8 anos atrás ## [ Devo começar como Front-End, Back-End ou Full Stack? ](https://www.treinaweb.com.br/blog/devo-comecar-como-front-end-back-end-ou-full-stack) Devo começar minha carreira como desenvolvedor Front-End, Back-End ou FullStack? Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2018/09/27171404/diego-eis-400x280.png) [ Entrevistas ](https://www.treinaweb.com.br/blog/categoria/entrevistas) 8 anos atrás ## [ TW Entrevista 11: Diego Eis ](https://www.treinaweb.com.br/blog/tw-entrevista-11-diego-eis) Fizemos uma série de entrevistas chamada "TW Entrevista". O entrevistado de hoje é o Diego Eis, fundador do Tableless, um dos maiores sites sobre desenvolvimento web do Brasil. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2018/02/09185014/adzuna-marylene-400x280.png) [ Carreira ](https://www.treinaweb.com.br/blog/categoria/carreira) 9 anos atrás ## [ Vagas mais procuradas em TI no Brasil ](https://www.treinaweb.com.br/blog/vagas-mais-procuradas-em-ti-no-brasil) Os profissionais de Tecnologia da Informação estão no topo da lista dos mais requisitados pelas empresas. Veja as vagas de TI mais procuradas aqui no Brasil. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2020/08/técnicas-acessibilidade-web-400x280.png) [ Acessibilidade e User Experience (UX) ](https://www.treinaweb.com.br/blog/categoria/acessibilidade-e-user-experience-ux) 6 anos atrás ## [ Técnicas de acessibilidade para deixar o seu site mais inclusivo ](https://www.treinaweb.com.br/blog/tecnicas-de-acessibilidade-para-deixar-o-seu-site-mais-inclusivo) Conheça as principais ferramentas e técnicas de acessibilidade para web. Veja também tipos de dificuldades e deficiências atendidas por elas. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2021/05/css-filters-copy-400x280.jpg) [ CSS ](https://www.treinaweb.com.br/blog/categoria/css) 10 anos atrás ## [ CSS Filters - Tratamento de imagens em sua página ](https://www.treinaweb.com.br/blog/css-filters-tratamento-de-imagens-em-sua-pagina) Com a evolução do CSS3 passou a ser possível criar muitos dos efeitos dos softwares de edição de imagem diretamente pelo CSS. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2023/03/como-escolher-melhor-area-400x280.jpg) [ Carreira ](https://www.treinaweb.com.br/blog/categoria/carreira) 4 anos atrás ## [ Como escolher a área de TI mais adequada para mim? ](https://www.treinaweb.com.br/blog/como-escolher-a-area-de-ti-mais-adequada-para-mim) Se você está iniciando em TI pode ficar muito confuso com a área que você deve escolher, o que é muito comum. Por isso, vamos dar algumas dicas que podem te ajudar a encontrar a área que mais tem a ver com você. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2020/09/ux-research-e-360-view-o-que-e-e-como-pode-ser-aplicado-400x280.png) [ Acessibilidade e User Experience (UX) ](https://www.treinaweb.com.br/blog/categoria/acessibilidade-e-user-experience-ux) 6 anos atrás ## [ UX Research e 360 View – O que é e como pode ser aplicado? ](https://www.treinaweb.com.br/blog/ux-research-e-360-view-o-que-e-e-como-pode-ser-aplicado) Entenda o que é e como aplicar o UX Research e 360 View, técnicas importantes na hora de pensar em uma melhor experiência do usuário. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2021/03/criando-interfaces-graficas-no-c-com-gtk-400x280.png) [ C ](https://www.treinaweb.com.br/blog/categoria/c) 6 anos atrás ## [ Criando interfaces gráficas no C com GTK ](https://www.treinaweb.com.br/blog/criando-interfaces-graficas-no-c-com-gtk) Aplicações Desktop ainda são muito utilizadas. Neste artigo aprenda como utilizar o GTK para criar interfaces gráficas no C. Ler artigo - ![](https://dkrn4sk0rn31v.cloudfront.net/uploads/2020/09/emmet-toolkit-seja-um-web-developer-mais-rapido-agora-mesmo-400x280.png) [ Desenvolvimento Front-end ](https://www.treinaweb.com.br/blog/categoria/desenvolvimento-front-end) 6 anos atrás ## [ Emmet Toolkit - Seja um Web Developer mais rápido ](https://www.treinaweb.com.br/blog/emmet-toolkit-seja-um-web-developer-mais-rapido) Conheça o Emmet Toolkit, ferramenta presente em praticamente todos os editores de código e IDEs que acelera muito a escrita do seu HTML e CSS. Ler artigo ## Um ano de acesso total para você viver de programação. Todos os cursos e formações da TreinaWeb numa única assinatura, com professores que atuam no mercado, suporte direto e certificados. Do primeiro `console.log` ao mercado de trabalho. - **1 ano** de acesso a **todos os cursos** - Cursos novos **toda semana** - Suporte **direto com professores** - Plano de carreira **personalizado** - **Certificados digitais** inclusos - **Aplicativos** para Android e iOS, com **acesso offline** **Garantia incondicional de satisfação** Teste por 7 dias e, se não fizer sentido para você, devolvemos seu dinheiro. ### Acesso completo a todos os cursos e dezenas de Formações. 12 meses Economize R$ 840,00 54% OFF de 12x R$ 129,00 por apenas 12x R$ 59,00 sem juros no cartão de crédito ou R$ 599,00 à vista Oferta termina em **14h 06min 49s** - Acesso imediato e ilimitado durante 1 ano. - Plano de carreira personalizado. - Suporte direto com professores. - E muito mais! [Matricule-se agora](https://www.treinaweb.com.br/checkout/pagamento/plano/anual?cupom=TW-SCLIENTE26) [ ](https://www.treinaweb.com.br) Escola online de programação, tecnologia e IA. - [ ](https://www.facebook.com/TreinaWeb/) - [ ](https://www.instagram.com/treinaweb/) - [ ](https://www.youtube.com/user/TreinaWeb) - [ ](https://twitter.com/treinaweb) - [ ](https://www.linkedin.com/company/treinaweb) - [ ](https://github.com/treinaweb) ## Inscreva-se em nossa newsletter Receba lançamentos, promoções e novidades. Seu nome Seu WhatsApp Seu melhor e-mail Inscrever-se ## Cursos - [ Base para Devs ](https://www.treinaweb.com.br/categoria/base-para-devs) - [ Front-end ](https://www.treinaweb.com.br/categoria/desenvolvimento-front-end) - [ Back-end ](https://www.treinaweb.com.br/categoria/desenvolvimento-back-end) - [ Mobile ](https://www.treinaweb.com.br/categoria/desenvolvimento-mobile) - [ Bancos de Dados ](https://www.treinaweb.com.br/categoria/bancos-de-dados) - [ Cloud ](https://www.treinaweb.com.br/categoria/cloud-computing) - [ IA ](https://www.treinaweb.com.br/categoria/ia) - [ E mais ](https://www.treinaweb.com.br/categoria/e-mais) - [ Ver todos os cursos ](https://www.treinaweb.com.br/cursos) ## Conteúdo - [ Formações ](https://www.treinaweb.com.br/formacoes) - [ Projetos práticos ](https://www.treinaweb.com.br/projetos-praticos) - [ Direto ao ponto ](https://www.treinaweb.com.br/direto-ao-ponto) - [ Planos ](https://www.treinaweb.com.br#assinatura) - [ Depoimentos ](https://www.treinaweb.com.br#depoimentos) - [ Comunidade ](https://www.treinaweb.com.br#comunidade) - [ Corpo docente ](https://www.treinaweb.com.br#docente) ## A empresa - [ Sobre a TreinaWeb ](https://www.treinaweb.com.br#sobre) - [ Perguntas frequentes ](https://www.treinaweb.com.br#faq) - [ Vantagens de estudar na TreinaWeb ](https://www.treinaweb.com.br/vantagens-de-estudar-na-treinaweb) - [ Cursos para empresas ](https://www.treinaweb.com.br/empresas) - [ Sugira um novo curso ](https://www.treinaweb.com.br/sugerir-curso) - [ Trabalhe conosco ](https://www.treinaweb.com.br/trabalhe-conosco) - [ Artigos ](https://www.treinaweb.com.br/blog) - [ Desenvolvedores e agentes ](https://www.treinaweb.com.br/developers) - [ Contato ](https://www.treinaweb.com.br/contato) - [ Política de privacidade ](https://www.treinaweb.com.br/politica-de-privacidade) - [ Termos de uso ](https://www.treinaweb.com.br/termos-de-uso) ## Baixe nosso aplicativo [ Disponível na **App Store** ](https://apps.apple.com/us/app/treinaweb/id1322729447) [ Disponível no **Google Play** ](https://play.google.com/store/apps/details?id=br.com.treinaweb.mobile) Av. Paulista, 1765, Conj 71 e 72 · Bela Vista · São Paulo · SP · 01311-200 © 2004 – 2026 TreinaWeb Tecnologia LTDA · CNPJ 06.156.637/0001-58