Tableless - Desenvolvimento inteligente com Padrões Web

05/11/2007
Artigos

Isso é coisa básica

Não é a primeira vez que me perguntam se eu acoselho o uso de includes. Não sei o motivo, mas grande parte do pessoal não usa includes. Parece que isso é uma daquelas coisas de uso exclusivo de programadores. Engano …

Por

Não é a primeira vez que me perguntam se eu acoselho o uso de includes. Não sei o motivo, mas grande parte do pessoal não usa includes. Parece que isso é uma daquelas coisas de uso exclusivo de programadores. Engano deles.

Includes (por exemplo) é uma das coisas que ajudam e muito o trabalho da equipe inteira. Menus, cabecalhos, rodapés, e qualquer coisa que você ache que vá se repetir em mais de uma página no site deve ser colocado em includes. Já vi muita gente, em pleno século 21, repetir o código do menu em todas as páginas. E sim, quando algo muda no menu, ele muda na página inteira. Muito triste.

Faz parte do trabalho parar um tempo por dia para pesquisar novas metodologias, novos meios para agilizar seu trabalho diário. Costumo fazer isso no final do expediente. Normalmente sempre encontro maneiras que resolvem meus problemas mais urgentes.

PS.: Já já novidades aqui no Tableless.

Por Diego Eis

Diego Eis criou o Tableless para disseminar os padrões web no Brasil. Como consultor já treinou equipes de empresas como Nokia, Globo.com, Yahoo! e iG. É palestrante e empreendedor.

http://twitter.com/diegoeis/

Veja os outros posts de

  • http://www.antenando.com.br Rael B. Riolino

    Concordo.

    A única coisa que eu sei de PHP é trabalhar com includes, e isso com certeza facilitou E MUITO a minha vida!

    Eu aconselho! :D

  • http://www.guilhermemedeiros.com.br Guilherme Medeiros

    Concerteza.
    Por isso acho que todo designer deve saber um pouco de programação, por mais difícil que seja (pra os designers) de aprender…

  • http://www.thiagomachado.com Thiago Machado

    Include bem usado facilita muito, é mto importante para a não repetição de código e agiliza em certo ponto a produção de código

  • Gustavo Luciano

    no .net temos o sucego da Masterpage!

  • Bruno Francisco Santos

    há um tempo atrás eu nao usava includes.. depois que tive que fazer uma grande alteração que me deu muito trabalho, comecei a usá-lo com frequencia e hoje nao vivo sem :)

    novidades?
    sempre é bom!
    estou curioso hehe

  • http://www.juniovitorino.com Junio Vitorino

    Eu particularmente uso sempre includes. Acho que facilita e muito a vida.

    Ah! Novidades é sempre bom e eu que sou leitor antigo daqui, espero mesmo novidades. :P

  • Renato

    Sempre fui a favor de usar includes, por vários motivos, mas o principal seria a facilidade que o administrador do site tem nas atualizações…

    Concordo que um designer tem que saber o que ele pode usar para facilitar as atualizações, da mesma forma que o programador tem que saber alguns conceitos bássicos de design.

  • http://www.google.com/corporate/execs.html#eric Fake Eric Schmidt

    Finalmente concordo com o Diego.
    Não usar “templates”, é totalmente contra-producente além de induzir ao erro.
    E para o pessoal do PHP, vida longa ao Smarty!

  • http://blog.ciin.com.br Daniel Accorsi

    Hoje em dia um designer tem a obrigação de finalizar sua arte no Photshop / Illustrator, passar para html, css e ainda fazer os includes. E há aqueles que se diferenciam tendo uma boa noção em javascript.

  • http://blog.ipe.srv.br Nicholas Bittencourt

    Além dos includes, uma coisa muito interessante é trabalhar com templates de página. Como programador java, gosto muito da abordagem criada pelo Tiles e pelo Facelets, onde defino como seria uma página e só preciso reescrever a parte que quero alterar, seja o menu ou o bloco de conteudo. Bem interessante!

  • http://project47.viscountbox.com/ Carlos Eduardo

    Não vejo onde está o problema de utilizar include nas páginas.

    Dependendo do tamanho do site, também utilizo, isso facilita (e muito) na manutenção.

  • Joana

    No começo eram os frames, eu gostava muito da idéia. Eu já perdi muito tempo no google procurando uma maneira de fazer includes com html e não me conformo que não exista (ou existe??).
    Até que com este seu post me voltou a esperança…

  • Daniel Lopes

    O ideal é usar-se alguma classe/engine de templates, já que se tem uma linguagem server side à mão.

    Não adianta quem for montar o html seguir os web standards e construir css layout se quem programa( as vezes o mesmo individuo), seguir a metodologia spagueti de includes e código misturado ao html, isso tambem vale para o spagueti do java script. COmo defendido aqui aplicações web bem feitas são aquelas que podem ser lidas e melhoradas facilmente até em um bloco de notas.

  • http://tanafesta.net Felipe

    “Eu já perdi muito tempo no google procurando uma maneira de fazer includes com html e não me conformo que não exista (ou existe??).”

    EXISTE um recurso do Apache que permite isso: Server Side Includes(SSI)

    http://httpd.apache.org/docs/2.3/howto/ssi.html

    No final desta página ele conclui dizendo que está é uma solução que substitui os cgi e outras tecnologias(python, Perl, PHP) em páginas que preicisam de um pequeno dinamismo.

  • http://www.provedorcrescenet.com Mauro Britto

    O protocolo HTTP é baseado nas requisições do cliente(Get). Assim para acessar uma pagina o navegador executa as seguintes etapas:

    1) Query DNS no nome do domínio.
    2) Recebe o “Response” do servidor de DNS contendo o IP correspondente ao domínio requisitado.
    3) Envia um comando SYN para sincronizar a transferências de dados entre cliente/servidor.
    4) Então, finalmente, realiza o comando GET para começar a receber a pagina.

    As duas primeiras etapas podem ser puladas apenas se o Cliente de DNS do Windows/Linux possuírem em cache a resolução do domínio requisitado. Para verificar sua tabela de DNS interna vá ao prompt e tecle “ipconfig /displaydns”.

    Portanto para cada include que existir na pagina o navegador terá que seguir essas etapas antes de baixar o conteúdo do include. Isso deixa o carregamento da pagina mais lento do que se os arquivos dos includes estivessem no mesmo HTML.

    Isso não significa que includes sejam ruins. Eu uso includes praticamente sempre, eles facilitam e organizam a criação de sites. Um bom exemplo é esse do menu que se repete em todas as paginas. A questão é que o exagero de includes pode ser prejudicial. Então eu aconselho a calcular se o beneficio de um include vai ser superior ao acréscimo de overhead que ele vai trazer.

    Quem quiser saber mais sobre o funcionamento do protocolo HTTP pode pesquisar no google sobre o Ethereal, um ótimo programa para analise de rede.

    Até mais.

  • http://www.ead.feuc.br EAD

    Includes é o que há.

  • http://julioweb.wordpress.com Julio Fragoso

    Cara, isso é das coisas mais importantes num site.

    Poupa código, poupa tempo e a manutenção fica simples ao extremo.

    A equipe aqui do trabalho usa em asp.

    Sem igual

  • http://www.agenciapro.com.br JOabe

    É meio difícil imaginar um profissional hoje que não use os includes, agora um amador é compreensível. Eu só aprendi a usar no momento que me pediram um site com mais de 20 seções, “a necessidade é a mãe da invenção…” nesse caso a necessidade me fez ir ao Google! :d

  • Mark de Souza Costa

    Uahh,

    Quem trabalha com ASP.NET não tem essa preocupação a muuuuito tempo.

    Vide Web User Controls e Master Pages.

    Sds,

    Mark Costa

  • http://sitedepoesias.com.br/poetas/peka Ederson Peka

    Mauro Britto, o include acontece no lado do servidor. Não há “múltiplas requisições do navegador”, nem “overhead”, enfim… O navegador/user agent/cliente HTTP não fica sabendo se foram usados ou não includes. ;-)

  • Diego Hercowitz

    Bem eu uso mesmo os includes em ASP. Esse SSI que o felipe falou eu já tinha ouvido falar, mas sinceramente ainda não testei.

    Acho que um grande fator pelo qual nego não uso include é pq nesses cursos relâmpago de “webdesign” molecada aprende tudo no estilão “aperta e pronto”, nos programinhas mesmo… Aí não se ligam no que os códigos oferecem de facilidade.

    Por um lado é bom, né… quem conhece pode levar um mérito de profissional… quem não se desenvolve fica fazendo site pra loja de embaladora de quiabos do tio lá do interior de são joão das costas curtas!:)

    Abração.
    Diego

  • http://www.expobahia.net Fernando

    realmente os includes facilitam muito a vida de toda equipe… poupa muito trabalho em atualizações, tais como adição de uma item no menu, mudança de estrutura do topo ou rodapé e por ai vai… dependendo da criatividade do camarada…

  • Dirceu Bimonti

    Pro pessoal de PHP tem o CodeIgniter que trabalha com o padrão MVC. Excelente alternativa ao Smarty. Aliás, hoje em dia eu nem uso mais o Smarty.

    Novidades no Tableless ? Seria bom, porque um excelente ponto de referência para os web designers brasileiros estava meio as moscas.

  • Joao Paulo Faria

    Falou, falou, falou e disse besteira, Mauro…

    Os includes são server-side, não client-side. Logo, o cliente recebe UMA página com tudo já incluido, sem essa história de várias requisições para receber uma única página (como frames, por exemplo).

    Outra, desconheço qualquer implementação de TCP/IP que não tenha caching de DNS.

    Mais outra, não precisa ser tão xiita. Se for assim, para cada imagem que você colocar na página também é gerada uma requisição. Por isso os servidores de web e clientes negociam o keep-alive de conexão.

  • http://www.profissionalweb.net/blog/ Cesar Oliveira

    Olá, boa tarde a todos os leitores do tableless,

    Realmente é pena o próprio html não ter a função de include.

    Em ColdFusion usa-se assim:

    Só uma duvida, esse SSI funciona em IIS também ?

    Cumprimentos
    César Oliveira
    http://www.profissionalweb.net/blog/
    http://www.profissionalweb.net/sondagens (Ainda em desenvolvimento)
    msn: malainho2003@hotmail.com

  • Anderson

    Como diz o título, isso é básico.
    Não consigo imaginar alguém que se diz desenvolvedor não dividir seu site em módulos.

  • http://http//www.acordapraweb.com Alexandre

    Céus! HTML NUNCA deveria ter includes nativos.. é um documento, hipertexto.. não uma aplicação.

    Includes em programação são ótimos, um recurso indispensável em várias tecnologias.. não sei como tem gente que não vê isso. Apesar que, já vi gente me perguntar qual a utilidade de uma array! Vai entender esse pessoal…

  • http://naosei.net Ulysses

    include é a salvação do trabalho em grupo.

    atualmente tenho usado em documentos de word (centenas deles) com o svn para fazer documentacao de software. cada arquivo é um item do documento, e existe um compilação.doc (e .pdf) que a gente gera juntando tudo. maravilha!

  • Vinícius Pitta Lima de Araújo

    Acho que com XSLT você pode criar um esquema de templates pra sua página sem ter que usar uma linguagem server side. No final das contas a curva de aprendizado é quase a mesma que aprender a fazer um includezinho em uma linguagem ou outra. Eu, como uso mais .net e java uso os templates que as linguagens oferecem.

  • Edgar da Silva Ramos

    Eu trabalho com web design a um ano e comecei a pouco me aventurar em php…sua dica mudo minha vida bixo, valeu =D !

  • http://www.flaviowd.wordpress.com Flávio Araújo

    Includes ou qualquer coisa semelhante realmente é mais que uma mão na roda.

    Há algum tempo junto com um amigo meu, escrevi algo sobre isso http://flaviowd.wordpress.com/2007/03/30/includes-do-php-versus-frames-e-iframes/)

    Mas tinha testado basicamente só a coisa …

    Ai dia desses realmente precisei disso pra fazer o site da FATEC-SJC e ai realmente foi uma maravilha:

    Descobri este código aqui:

    1
    2
    3
    4
    5
    6
    7
    8
    E depois onde voce quer que apareça o conteúdo que muda você coloca:

       
       
        <!--FIM DA DIV CONTEUDO -->
    E suas urls ficam algo do tipo:

    <a>Sobre Nós</a>

    Mais fácil que isso, impossível.

    Abraços

  • João Rodrigo Moreira

    Realmente é uma forma de deixar o código limpo e bem estruturado, facilitando paca na hora de fazer alguma atualização. Entendamos como uma obrigação.

  • http://sergiotucano.blogspot.com Sergio Clemente

    hehehehe

    includes, o FRAME do SEC XXI :P

    Uso e recomendo, ajuda pra caramba ;)

    FALOW !

  • http://www.etudoounada.com.br Filipe

    Ótimo lembrete!!!!

    Realmente o pessoal que ainda não usa includes não sabe o que está perdendo. Eu não vivo sem includes já tem muito tempo.

    Abraços

  • http://www.andersonsa.com/ Anderson Sá

    Eu concordo. O include é um recurso bastante útil que pouca gente usa. Uma maneira interessante de usar includes é através da extensão .shtml.

    Será que é isso que o Joana gostaria de fazer?

  • Caio

    Acredito que a melhor forma seria fazer uma unica pagina – layout.php – onde teria toda a estrutura do website. A medida que vou montando as paginas uso um “require” chamando o layout.php que tera uma variavel que ira imprimir o conteudo recebido. Uso ‘require’ por questoes de seguranca pois caso algo errado aconteca o ‘require’ logo cancela o script enquanto o ‘include’ continua executando ate o final o script mostrando as vezes dados bestas mas importantes para aqueles mau-intencionados

  • http://www.matheusoliveira.net Matheus de Oliveira

    Será possível que ainda tem gente que não usa includes? Não acredito nisso…:S

  • Joyce

    É uma mão na roda usar includes! Eu tenho pavor de IFRAMES! É prejudicial em tudo, até na hora de indexar as páginas… Não conheço ninguém que use IFRAMES…

  • doce

    hummm includes… Tem algo errado em usar para carregar meio de páginas?

    Ué, se tiver e daí? Ninguem os vê no navegador mesmo :D

  • somebody

    Muito bom usar includes, faço sites amador (apenas para meus interesses particulares, não vendo e não faço para ninguém para não prejudicar quem vive com isso) e eles sempre me ajudaram.
    No começo editava pagina por pagina… depois aprendi includes e agora vou além, uso uma página chamada config, por exemplo, nessa eu coloco todo a “programação” do site, isto é, o html ou o php propriamente dito e insiro os includes de menus (para facilitar a edição em separado, como menus com javascript, carregando fora do “principal” deixando a engine mais leve etc), e também link do css.

    Nas outras páginas, por exemplo o index.php, eu apenas coloco o texto escrito numa div class que chamo de conteudo principal.

    Muito importante aliar o photoshop para desenhar e depois codificá-lo. As includes e, mais ainda, a página config com função top e bottom salvam a vida na hora de reedição total do site em apenas um arquivo.