{"id":7610,"date":"2012-08-22T13:41:11","date_gmt":"2012-08-22T16:41:11","guid":{"rendered":"https:\/\/www.yogh.com.br\/?p=7610"},"modified":"2025-04-14T11:52:54","modified_gmt":"2025-04-14T14:52:54","slug":"o-conteudo-e-rei-mas-o-que-isso-significa-para-os-projetos-web","status":"publish","type":"post","link":"https:\/\/www.yogh.com.br\/blog\/o-conteudo-e-rei-mas-o-que-isso-significa-para-os-projetos-web\/","title":{"rendered":"O conte\u00fado \u00e9 rei. Mas o que isso significa para os projetos web?"},"content":{"rendered":"<p>\t\t\t\t\u00c9 cada vez mais comum ouvir por a\u00ed a afirma\u00e7\u00e3o &#8220;O conte\u00fado \u00e9 rei&#8221;, n\u00e3o \u00e9 por acaso que o termo \u00e9 cada vez mais falado, grandes cases de sucesso, como Google, Facebook e Youtube est\u00e3o a\u00ed para provar que sem conte\u00fado, toda a infraestrutura: layout, programa\u00e7\u00e3o e arquitetura tem pouca utilidade.<\/p>\n<p>Perceber a necessidade de conte\u00fado nos grandes cases \u00e9 f\u00e1cil, mas quando se trata dos projetos que trabalhamos no dia a dia, o que significa esse rei?<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Os_primeiros_passos_de_um_projetos_web_onde_entra_o_conteudo\"><\/span>Os primeiros passos de um projetos web: onde entra o conte\u00fado?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>O conte\u00fado, juntamente com as necessidades e objetivos s\u00e3o a mat\u00e9ria prima para estrutura\u00e7\u00e3o de qualquer projeto, eles s\u00e3o a base para defini\u00e7\u00e3o de cada etapa de concep\u00e7\u00e3o, afinal, \u00e9 o motivo pelo o qual qualquer usu\u00e1rio acessar\u00e1 o seu site.<\/p>\n<div id=\"attachment_7615\" style=\"width: 610px\" class=\"wp-caption alignnone\"><img decoding=\"async\" aria-describedby=\"caption-attachment-7615\" class=\"size-full wp-image-7615 \" title=\"Representa\u00e7\u00e3o: O conte\u00fado e a estrutura do projeto\" src=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/o-conteudo-e-a-estrutura-do-projeto.jpg\" alt=\"Representa\u00e7\u00e3o: O conte\u00fado e a estrutura do projeto\" width=\"600\" height=\"439\" srcset=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/o-conteudo-e-a-estrutura-do-projeto.jpg 600w, https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/o-conteudo-e-a-estrutura-do-projeto-300x220.jpg 300w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><p id=\"caption-attachment-7615\" class=\"wp-caption-text\">Assim como uma casa precisa de estrutura para ser constru\u00edda, o projeto web necessita do conte\u00fado para ser concebido.<\/p><\/div>\n<p>Nessa primeira etapa de trabalho podemos escolher entre dois caminhos: deixar o conte\u00fado para depois ou criar e analisar antes de iniciar as pr\u00f3ximas etapas, \u00e9 nesse momento que encontramos o caso ruim e o bom.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"O_caso_ruim_quando_tentamos_vestir_o_rei_sem_saber_o_seu_tamanho\"><\/span>O caso ruim: quando tentamos vestir o rei sem saber o seu tamanho<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Nesse momento surge a pergunta:<strong> ent\u00e3o \u00e9 imposs\u00edvel desenvolver qualquer projeto web sem conte\u00fado?<\/strong> A concep\u00e7\u00e3o continua sendo poss\u00edvel, afinal, conhecemos centenas de casos onde s\u00e3o utilizados templates prontos para websites, podemos compr\u00e1-los e encaixar o conte\u00fado nas \u00e1reas dispon\u00edveis, n\u00e3o existem problemas aparentes&#8230; ou existem?<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-7623\" title=\"Nem sempre funciona criar o layout antes do conte\u00fado\" src=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/vestir-o-rei.jpg\" alt=\"Nem sempre funciona criar o layout antes do conte\u00fado\" width=\"600\" height=\"330\" srcset=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/vestir-o-rei.jpg 600w, https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/vestir-o-rei-300x165.jpg 300w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/p>\n<p>\u00c9 nesse momento que devemos lembrar de alguns assuntos que j\u00e1 podem ter atormentado algum projeto seu:\u00a0atrasos, retrabalhos, designs que n\u00e3o se encaixam bem com o conte\u00fado na entrega, p\u00e1ginas que n\u00e3o trazem retorno e sites confusos que geram alto custo com atendimento aos clientes. N\u00e3o vamos apontar apenas para um vil\u00e3o, mas a falta de conte\u00fado pode mesmo causar todos esses sintomas e outros imprevistos adicionais.<\/p>\n<p>Na teoria criar conte\u00fado baseado em uma \u00e1rea espec\u00edfica n\u00e3o apresenta problemas. Mas na pr\u00e1tica percebemos que cada projeto tem uma necessidade espec\u00edfica, como tipos diferentes de conte\u00fado, organiza\u00e7\u00e3o e principalmente, de oportunidades.<\/p>\n<p>Vamos fazer um teste desse caso na pr\u00e1tica, imagine que voc\u00ea adquiriu um template como abaixo, a princ\u00edpio tudo parece interessante e organizado, as imagens de exemplo se aplicam bem, os textos e links ficam bem distribu\u00eddos:<\/p>\n<div id=\"attachment_7618\" style=\"width: 610px\" class=\"wp-caption alignnone\"><img decoding=\"async\" aria-describedby=\"caption-attachment-7618\" class=\"size-full wp-image-7618 \" title=\"Site e conte\u00fado template\" src=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/conteudo-em-site-template.jpg\" alt=\"Site e conte\u00fado template\" width=\"600\" height=\"439\" srcset=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/conteudo-em-site-template.jpg 600w, https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/conteudo-em-site-template-300x220.jpg 300w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><p id=\"caption-attachment-7618\" class=\"wp-caption-text\">Template de site com conte\u00fado gen\u00e9rico<\/p><\/div>\n<p>Ao ver o layout bonito e organizado nos esquecemos por alguns instantes de um detalhe importante: <strong>ao ver a tela voc\u00ea se sentiu motivado a digerir o seu conte\u00fado?<\/strong> Quando paramos para pensar percebemos que os textos distribu\u00eddos nele s\u00e3o irrelevantes, s\u00e3o apenas &#8220;textos-layout&#8221;.<\/p>\n<p>Imagine que o template acima foi realmente aprovado e utilizado no projeto. Ap\u00f3s concluir a cria\u00e7\u00e3o visual, implementa\u00e7\u00e3o e todos os detalhes do projeto, inclu\u00edmos o conte\u00fado, confira o resultado:<\/p>\n<div id=\"attachment_7619\" style=\"width: 610px\" class=\"wp-caption alignnone\"><img decoding=\"async\" aria-describedby=\"caption-attachment-7619\" class=\"size-full wp-image-7619 \" title=\"Aplica\u00e7\u00e3o do conte\u00fado em template mal sucedida\" src=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/aplicacao-conteudo-em-site-template.jpg\" alt=\"Aplica\u00e7\u00e3o do conte\u00fado em template mal sucedida\" width=\"600\" height=\"430\" srcset=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/aplicacao-conteudo-em-site-template.jpg 600w, https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/aplicacao-conteudo-em-site-template-300x215.jpg 300w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><p id=\"caption-attachment-7619\" class=\"wp-caption-text\">O conte\u00fado de um site tem necessidades espec\u00edficas que nem sempre se aplicam a templates<\/p><\/div>\n<p>Nesse caso conseguimos perceber com facilidade que nem sempre nosso conte\u00fado consegue se adaptar ao layout, isso ocorre por v\u00e1rios motivos, podemos destacar nesse caso: dimens\u00f5es das imagens, cores e quantidade de texto, mas em cada novo projeto encontramos limita\u00e7\u00f5es diferentes, em menor e maior grau.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"O_caso_bom_quando_criamos_o_reino_do_conteudo_no_momento_certo\"><\/span>O caso bom: quando criamos o reino do conte\u00fado no momento certo<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Com a capta\u00e7\u00e3o pr\u00e9via do conte\u00fado, v\u00e1rias portas s\u00e3o abertas para o projeto. Al\u00e9m de garantir o b\u00e1sico: que o layout suportar\u00e1 corretamente o conte\u00fado, podemos descobrir como melhorar o UX (Experi\u00eancia do usu\u00e1rio), desenvolvendo novas formas para os usu\u00e1rios absorverem o conte\u00fado, incentivando-os a continuar no site e adquirir os seus produtos e servi\u00e7os.<\/p>\n<p>Nesse momento o site deixa de se tornar um layout suportado por texto para realizar a sua fun\u00e7\u00e3o, dar suporte ao que vale a pena: o conte\u00fado.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-7627\" title=\"Criando o layout para o conte\u00fado\" src=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/vestir-o-rei-com-conteudo-correto-jpg.jpg\" alt=\"Criando o layout para o conte\u00fado\" width=\"600\" height=\"330\" srcset=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/vestir-o-rei-com-conteudo-correto-jpg.jpg 600w, https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/vestir-o-rei-com-conteudo-correto-jpg-300x165.jpg 300w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/p>\n<p>Um bom exemplo \u00e9 o Youtube, que continuamente adapta o site e descobre novas oportunidades, isso ocorre na medida que novo conte\u00fado \u00e9 inserido e seus usu\u00e1rios o digerem. Sabemos que na sua vasta quantidade de v\u00eddeos existem conte\u00fados bons e ruins, <strong>como manter o usu\u00e1rio no site quando ele n\u00e3o encontra o que procurava?<\/strong><\/p>\n<p>O Youtube gera novas motiva\u00e7\u00f5es, mostrando v\u00eddeos relacionados melhores aceitos pelos usu\u00e1rios. Entendendo melhor a segmenta\u00e7\u00e3o do seu conte\u00fado, tamb\u00e9m aparece a oportunidade de apresentar an\u00fancios que ser\u00e3o melhor aceitos por um p\u00fablico espec\u00edfico.\u00a0Al\u00e9m desses recursos v\u00e1rias fun\u00e7\u00f5es do site\u00a0totalmente \u00a0focadas no conte\u00fado aprimoram a experi\u00eancia do usu\u00e1rio: op\u00e7\u00f5es de compartilhamento, coment\u00e1rios, playlists e outros:<\/p>\n<div id=\"attachment_7621\" style=\"width: 610px\" class=\"wp-caption alignnone\"><img decoding=\"async\" aria-describedby=\"caption-attachment-7621\" class=\"size-full wp-image-7621 \" title=\"Interface do youtube com v\u00eddeos relacionados\" src=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/interface-youtube.jpg\" alt=\"Interface do youtube com v\u00eddeos relacionados\" width=\"600\" height=\"422\" srcset=\"https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/interface-youtube.jpg 600w, https:\/\/www.yogh.com.br\/blog\/wp-content\/uploads\/2012\/08\/interface-youtube-300x211.jpg 300w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><p id=\"caption-attachment-7621\" class=\"wp-caption-text\">Com conhecimento do seu conte\u00fado, o Youtube mant\u00e9m seus usu\u00e1rios mais tempo no site e gera novas oportunidades com an\u00fancios focados<\/p><\/div>\n<p>Sabemos que nem sempre \u00e9 poss\u00edvel criar e analisar o conte\u00fado antes da concep\u00e7\u00e3o. Mas agora que conhecemos a import\u00e2ncia do &#8220;rei&#8221; no ponto de vista de projetos, podemos pensar com mais cuidado no assunto antes de iniciar cada etapa, assim \u00e9 poss\u00edvel evitar v\u00e1rios problemas nos projetos e o melhor: encontrar novas oportunidades que ir\u00e3o alavancar sua ideia.\t\t<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.yogh.com.br\/blog\/o-conteudo-e-rei-mas-o-que-isso-significa-para-os-projetos-web\/#Os_primeiros_passos_de_um_projetos_web_onde_entra_o_conteudo\" >Os primeiros passos de um projetos web: onde entra o conte\u00fado?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.yogh.com.br\/blog\/o-conteudo-e-rei-mas-o-que-isso-significa-para-os-projetos-web\/#O_caso_ruim_quando_tentamos_vestir_o_rei_sem_saber_o_seu_tamanho\" >O caso ruim: quando tentamos vestir o rei sem saber o seu tamanho<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.yogh.com.br\/blog\/o-conteudo-e-rei-mas-o-que-isso-significa-para-os-projetos-web\/#O_caso_bom_quando_criamos_o_reino_do_conteudo_no_momento_certo\" >O caso bom: quando criamos o reino do conte\u00fado no momento certo<\/a><\/li><\/ul><\/nav><\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u00c9 cada vez mais comum ouvir por a\u00ed a afirma\u00e7\u00e3o &#8220;O conte\u00fado \u00e9 rei&#8221;, n\u00e3o \u00e9 por acaso que o termo \u00e9 cada vez mais falado, grandes cases de sucesso, como Google, Facebook e Youtube est\u00e3o a\u00ed para provar que sem conte\u00fado, toda a infraestrutura: layout, programa\u00e7\u00e3o e arquitetura tem pouca utilidade. Perceber a necessidade [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":7658,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"kk_blocks_editor_width":"","_kiokenblocks_attr":"","_kiokenblocks_dimensions":"","footnotes":""},"categories":[7],"tags":[],"class_list":["post-7610","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-marketing-digital"],"acf":[],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.yogh.com.br\/blog\/wp-json\/wp\/v2\/posts\/7610","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.yogh.com.br\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.yogh.com.br\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.yogh.com.br\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.yogh.com.br\/blog\/wp-json\/wp\/v2\/comments?post=7610"}],"version-history":[{"count":1,"href":"https:\/\/www.yogh.com.br\/blog\/wp-json\/wp\/v2\/posts\/7610\/revisions"}],"predecessor-version":[{"id":38970,"href":"https:\/\/www.yogh.com.br\/blog\/wp-json\/wp\/v2\/posts\/7610\/revisions\/38970"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.yogh.com.br\/blog\/wp-json\/wp\/v2\/media\/7658"}],"wp:attachment":[{"href":"https:\/\/www.yogh.com.br\/blog\/wp-json\/wp\/v2\/media?parent=7610"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.yogh.com.br\/blog\/wp-json\/wp\/v2\/categories?post=7610"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.yogh.com.br\/blog\/wp-json\/wp\/v2\/tags?post=7610"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}