Padrões Web & Coding Standards Boas Maneiras na Programação Web por Antonio Albuquerque

Sobre Mim Nome: Antonio C. Albuquerque Netto Email: [email_address] Blog: http://www.acalbuquerque.blog.br

Nome: Antonio C. Albuquerque Netto

Email: [email_address]

Blog: http://www.acalbuquerque.blog.br

" A simplicidade é o último grau da sofisticação " (Leonardo Da Vinci)

" A simplicidade é o último grau da sofisticação " (Leonardo Da Vinci)

Uma Breve história sobre a Simplicidade O Princípio da Simplicidade é consagrado pelo desprendimento quantitativo mínimo e qualitativo máximo dos fatores para alcançar um objetivo específico. A simplicidade, denominada em chinês Tang Son , é composta por duas idéias fundamentais: Tang - Simplicidade quantitativa, quando algo é simples em quantidade e; Son - Simplicidade qualitativa, quando algo é puro em qualidade.

O Princípio da Simplicidade é consagrado pelo desprendimento quantitativo mínimo e qualitativo máximo dos fatores para alcançar um objetivo específico.

A simplicidade, denominada em chinês Tang Son , é composta por duas idéias fundamentais:

Tang - Simplicidade quantitativa, quando algo é simples em quantidade e;

Son - Simplicidade qualitativa, quando algo é puro em qualidade.

A simplicidade em 4 regras i – Coloque tudo num único lugar ; ii – Selecione o Essencial; iii – Elimine o resto; iv – Organize o material restante de modo agradável e ordenado; por Leo Babauta ( http://zenhabits.net )

i – Coloque tudo num único lugar ;

ii – Selecione o Essencial;

iii – Elimine o resto;

iv – Organize o material restante de modo agradável e ordenado;

por Leo Babauta ( http://zenhabits.net )

Princípio do KISS Com isso nos deparamos com o princípio do KISS , um acrônimo em inglês de: “ Keep It Simple, Stupid” ou; "Keep It Sweat & Simple" ou; "Keep it Short & Simple" ou; "Keep it Simple, Silly“ Trata-se de um princípio geral que valoriza a simplicidade do projeto e defende que toda a complexidade desnecessária seja evitada. Este princípio teve a sua inspiração diretamente no princípio da Navalha de Ockham .

Com isso nos deparamos com o princípio do KISS , um

acrônimo em inglês de:

“ Keep It Simple, Stupid” ou;

"Keep It Sweat & Simple" ou;

"Keep it Short & Simple" ou;

"Keep it Simple, Silly“

Trata-se de um princípio geral que valoriza a simplicidade do projeto e defende que toda a complexidade desnecessária seja evitada. Este princípio teve a sua inspiração diretamente no princípio da Navalha de Ockham .

A Navalha de Ockham A Navalha de Ockham é um princípio lógico criado pelo frade Franciscano inglês, William de Ockham. O princípio afirma que a explicação para qualquer fenômeno deve assumir apenas as premissas estritamente necessárias à explicação do fenômeno e eliminar todas as que não causariam qualquer diferença aparente nas predições da hipótese ou teoria. “ Se em tudo o mais forem idênticas as várias explicações de um fenômeno, a mais simples é a melhor”” William de Ockham

A Navalha de Ockham é um princípio lógico criado pelo

frade Franciscano inglês, William de Ockham.

O princípio afirma que a explicação para qualquer fenômeno

deve assumir apenas as premissas estritamente necessárias

à explicação do fenômeno e eliminar todas as que não

causariam qualquer diferença aparente nas predições da

hipótese ou teoria.

“ Se em tudo o mais forem idênticas as várias explicações de um fenômeno, a mais simples é a melhor””

William de Ockham

Princípios e Argumentos Na área de T.I, além da Navalha de Ockham nos deparamos com inúmeros princípios e argumentos válidos para o nosso cotidiano. YAGNI Argument - É uma sigla para “You Ain’t Gonna Need It” , ou “Você não vai precisar disso” em português. É uma idéia usada na engenharia de software para controlar a adição de novas funcionalidades em um aplicativo que irão acrescentar mais custos de manutenção do que benefícios. DRY - É a sigla para o termo "Dont repeat yourself" ( Não se repita ), sendo uma filosofia de um processo que visa a não repetição de código, particularmente utilizado em computação. Essa filosofia enfatiza que informação não deve ser duplicada, porque duplicação aumenta dificuldades nas mudanças, pode diminuir a clareza, e leva a oportunidades de um código não coeso. Lista de filosofias de desenvolvimento de software: http://en.wikipedia.org/wiki/List_of_software_development_philosophies

Na área de T.I, além da Navalha de Ockham nos deparamos com inúmeros princípios e argumentos válidos para o nosso cotidiano.

YAGNI Argument - É uma sigla para “You Ain’t Gonna Need It” , ou “Você não vai precisar disso” em português. É uma idéia usada na engenharia de software para controlar a adição de novas funcionalidades em um aplicativo que irão acrescentar mais custos de manutenção do que benefícios.

DRY - É a sigla para o termo "Dont repeat yourself" ( Não se repita ), sendo uma filosofia de um processo que visa a não repetição de código, particularmente utilizado em computação. Essa filosofia enfatiza que informação não deve ser duplicada, porque duplicação aumenta dificuldades nas mudanças, pode diminuir a clareza, e leva a oportunidades de um código não coeso.

Lista de filosofias de desenvolvimento de software: http://en.wikipedia.org/wiki/List_of_software_development_philosophies

Método DRY “ Programadores estão sempre em modo de manutenção.” – The Pragmatic Programmer DRY é mais do que apenas uma boa prática de desenvolvimento, é uma filosofia que envolve evitar repetições. Trechos de código repetidos na maior parte dos casos (se não em todos) somente tornam nosso código mais obscuro e inconsistente. Quando repetimos trechos de código em nosso projeto ou mesmo em projetos diferentes, estamos aumentando a complexidade de gerenciamento e dificultando mudanças.

“ Programadores estão sempre em modo de manutenção.” – The Pragmatic Programmer

DRY é mais do que apenas uma boa prática de desenvolvimento, é uma

filosofia que envolve evitar repetições. Trechos de código repetidos na

maior parte dos casos (se não em todos) somente tornam nosso código

mais obscuro e inconsistente. Quando repetimos trechos de código em

nosso projeto ou mesmo em projetos diferentes, estamos aumentando a

complexidade de gerenciamento e dificultando mudanças.

World Wide Web : O início A web foi criada em 1989, no CERN , por Tim Berners-Lee, para otimizar a comunicação no centro europeu de pesquisas nucleares. Berners-Lee criou o HTML, uma linguagem de marcação para formatar os documentos que seriam distribuídos em rede. Como tratava de documentos formais, o HTML não tinha uma preocupação visual, sendo informação pura. A marcação era utilizada para determinar o que significava cada elemento. Anos mais tarde, o projeto do CERN foi aberto e a internet tornou-se a rede mundial de computadores. As potencialidades de comunicação e negócio logo fizeram a internet tornar-se bastante popular e a necessidade de um maior apelo visual para o comércio logo surgiu.

Padrões Web O que significa? São as normas que regem a construção de conteúdo para web. W3C – World Wide Web Consortium Criada em 1994 por Tim Berners-Lee, hoje possuindo mais de 400 membros como: - Adobe System, Inc - Apple, Inc - Cisco - Google, Inc - Mozilla foundation - Microsoft Corp. - ORACLE - ...outros

O que significa?

São as normas que regem a construção de conteúdo para web.

W3C – World Wide Web Consortium

Criada em 1994 por Tim Berners-Lee, hoje possuindo mais de 400 membros como:

- Adobe System, Inc

- Apple, Inc

- Cisco

- Google, Inc

- Mozilla foundation

- Microsoft Corp.

- ORACLE

- ...outros

Padrões Web Existem vários padrões estabelecidos pela W3C, os mais conhecidos são: - xHTML - CSS - XML - DOM xHTML - O XHTML , ou eXtensible Hypertext Markup Language , é uma reformulação da linguagem de marcação HTML, baseada em XML. Combina as tags de marcação HTML com regras da XML. Este processo de padronização tem em vista a exibição de páginas Web em diversos dispositivos (televisão, palm, celular, etc). Sua intenção é melhorar a acessibilidade. CSS - Cascading Style Sheets (ou simplesmente CSS ) é uma linguagem de estilo utilizada para definir a apresentação de documentos escritos em uma linguagem de marcação, como HTML ou XML. Seu principal benefício é prover a separação entre o formato e o conteúdo de um documento. XML - eXtensible Markup Language é uma recomendação da W3C para gerar linguagens de marcação para necessidades especiais. DOM - DOM (Document Object Model - Modelo de Objetos de Documentos) é uma especificação da W3C, independente de plataforma e linguagem , onde pode-se dinamicamente alterar e editar a estrutura, conteúdo e estilo de um documento eletrônico.

Existem vários padrões estabelecidos pela W3C, os mais conhecidos são:

- xHTML

- CSS

- XML

- DOM

xHTML - O XHTML , ou eXtensible Hypertext Markup Language , é uma reformulação da linguagem de marcação HTML, baseada em XML. Combina as tags de marcação HTML com regras da XML. Este processo de padronização tem em vista a exibição de páginas Web em diversos dispositivos (televisão, palm, celular, etc). Sua intenção é melhorar a acessibilidade.

CSS - Cascading Style Sheets (ou simplesmente CSS ) é uma linguagem de estilo utilizada para definir a apresentação de documentos escritos em uma linguagem de marcação, como HTML ou XML. Seu principal benefício é prover a separação entre o formato e o conteúdo de um documento.

XML - eXtensible Markup Language é uma recomendação da W3C para gerar linguagens de marcação para necessidades especiais.

DOM - DOM (Document Object Model - Modelo de Objetos de Documentos) é uma especificação da W3C, independente de plataforma e linguagem , onde pode-se dinamicamente alterar e editar a estrutura, conteúdo e estilo de um documento eletrônico.

Cross-browser Cross-browser refere-se à habilidade de um site, Aplicação Web, construtor HTML ou script side-client suportar múltiplos navegadores.

Vantagens Uniformidade, Simplicidade e Liberdade O uso de webstandards permite que as fases de design e programação ocorram em paralelo, reduzindo o tempo de produção. A manutenção do projeto também fica mais simples SEO (Search Engine Optimization) Quando um HTML é estruturado da maneira correta, com as tag´s sendo utilizadas para as funções que foram criadas, a indexação em mecanismos de busca inteligentes, como o Google, é muito mais bem realizada. Por exemplo, o Google sabe que algo escrito entre tag´s [h1] é um título importante e têm relevância maior em uma busca com determinada palavra-chave. Isso não acontece se o título fosse marcado com [font size="5" color="#FF6600"][strong] . Otimização Como o arquivo de apresentação visual só precisa ser baixado uma vez e o HTML é estruturado da forma correta, as páginas ficam muito mais leves, carregando rapidamente e permitindo que o usuário tenha uma experiência de navegação otimizada. Além disso, economiza-se muito (em alguns casos, até 75%) em banda que antes era desperdiçada para transportar códigos inúteis. Acessibilidade Usar web standards por si só já é um grande passo no quesito de acessibilidade. Não será necessário criar versões específicas de um projeto para portadores de deficiência. Além disso, o projeto poderá ser visto em qualquer navegador, com algumas diferenças de renderização.

Uniformidade, Simplicidade e Liberdade

O uso de webstandards permite que as fases de design e programação ocorram em paralelo, reduzindo o tempo de produção. A manutenção do projeto também fica mais simples

SEO (Search Engine Optimization)

Quando um HTML é estruturado da maneira correta, com as tag´s sendo utilizadas para as funções que foram criadas, a indexação em mecanismos de busca inteligentes, como o Google, é muito mais bem realizada. Por exemplo, o Google sabe que algo escrito entre tag´s [h1] é um título importante e têm relevância maior em uma busca com determinada palavra-chave. Isso não acontece se o título fosse marcado com [font size="5" color="#FF6600"][strong] .

Otimização

Como o arquivo de apresentação visual só precisa ser baixado uma vez e o HTML é estruturado da forma correta, as páginas ficam muito mais leves, carregando rapidamente e permitindo que o usuário tenha uma experiência de navegação otimizada. Além disso, economiza-se muito (em alguns casos, até 75%) em banda que antes era desperdiçada para transportar códigos inúteis.

Acessibilidade

Usar web standards por si só já é um grande passo no quesito de acessibilidade. Não será necessário criar versões específicas de um projeto para portadores de deficiência. Além disso, o projeto poderá ser visto em qualquer navegador, com algumas diferenças de renderização.

Coding Standards Programar é uma arte?

Programar é uma arte?

Coding Standards Na verdade resolver problemas e criar soluções é sim uma arte e com o amadurecimento e uma maior interação entre programadores, isso virou uma ciência. Não existe esse negócio de o “meu jeito de programar, de pensar ou escrever” , existe sim um ou vários padrões de projetos ( Design Patterns ). Acontece que nós somos educados desde criança para trabalharmos em grupos, mas na verdade a vida exige que nós devemos trabalhar em equipe. E existe uma grande diferença entre esses 2 modos. Visando mais produtividade e padronização do ambiente de trabalho, foi que as grandes corporações adotaram o coding standards .

Na verdade resolver problemas e criar soluções é sim uma arte e com o amadurecimento e uma maior interação entre programadores, isso virou uma ciência.

Não existe esse negócio de o “meu jeito de programar, de pensar ou escrever” , existe sim um ou vários padrões de projetos ( Design Patterns ).

Acontece que nós somos educados desde criança para trabalharmos em grupos, mas na verdade a vida exige que nós devemos trabalhar em equipe. E existe uma grande diferença entre esses 2 modos.

Visando mais produtividade e padronização do ambiente de trabalho, foi que as grandes corporações adotaram o coding standards .

Coding Standards Com a ajuda de uma poderosa IDE de programação isso pode facilitar e muito a sua vida.

Com a ajuda de uma poderosa IDE de programação isso pode facilitar e muito a sua vida.

Coding Standards Evite o espaguete!!

Coding Standards: O Início Os programadores c/c++ já utilizam padrões e convenções a anos e Todd Hoff’s , criou aquele que acredito ser o primeiro manual sobre coding standards e que serviu de base para muitos outros e de diferentes linguagens. http://www.possibility.com/Cpp/c++_coding_standards.pdf

Coding Standards Mas sem dúvida alguma, o “Boom” do coding standard veio com a gigante linguagem de programação Java e seus fiéis seguidores. A Sun desenvolveu uma ótima documentação de Coding Standards, que é seguida pelos desenvolvedores Java, e como Padrão de Documentação em Código, criou um sistema de documentação excelente conhecido como JavaDoc , onde há ferramentas que geram a documentação HTML e em outros formatos baseado nos blocos de documentação feitos no código fonte.

Coding Standards Ganhos Reais: Facilidade de Implementação; Melhor visibilidade de código; Portabilidade de código; Melhor reaproveitamento de código; Redução de tempo em: Adaptação de novos desenvolvedores. Manutenção; Migração; Diminuição de reescrita de código por falta de documentação.

Ganhos Reais:

Facilidade de Implementação;

Melhor visibilidade de código;

Portabilidade de código;

Melhor reaproveitamento de código;

Redução de tempo em:

Adaptação de novos desenvolvedores.

Manutenção;

Migração;

Diminuição de reescrita de código por falta de documentação.

Coding Standards: PHPDOC http://www.phpdoc.org/

Coding Standards Introdução Serve para escrever um código organizado, bem estruturado e documentado. Melhorando visibilidade e facilitando futuras manutenções e implementações. Assegurar a Alta Qualidade do código, diminuir bug´s. *Observação: As regras a seguir são baseadas no PHP Coding Standards do Walker de Alencar; Algumas modificações foram realizadas se adequando à nossa realidade;

Introdução

Serve para escrever um código organizado, bem estruturado e documentado.

Melhorando visibilidade e facilitando futuras manutenções e implementações.

Assegurar a Alta Qualidade do código, diminuir bug´s.

*Observação:

As regras a seguir são baseadas no PHP Coding Standards do Walker de Alencar;

Algumas modificações foram realizadas se adequando à nossa realidade;

Coding Standards Identação 4 espaços para identação de blocos de comando (Tab configurado para 4 espaços) 1 linha em branco após declaração de classes ou métodos/funções, as chaves devem ser abertas na mesma linha da declaração do comando. A identação deve ser mantida mesmo ao passar de blocos de código PHP para código HTML, e vice-versa.

Identação

4 espaços para identação de blocos de comando (Tab configurado para 4 espaços)

1 linha em branco após declaração de classes ou métodos/funções, as chaves devem ser abertas na mesma linha da declaração do comando.

A identação deve ser mantida mesmo ao passar de blocos de código PHP para código HTML, e vice-versa.

Coding Standards Nomeclaturas Padrão CamelCase : É a denominação em inglês para a prática de escrever palavras compostas ou frases, onde cada palavra é iniciada com Maiúsculas, e unida sem espaços. Divisões: lowerCamelCase ( iPod, iPhone ) UpperCamelCase ( OpenOffice, StarTrek )

Nomeclaturas

Padrão CamelCase :

É a denominação em inglês para a prática de escrever palavras compostas ou frases, onde cada palavra é iniciada com Maiúsculas, e unida sem espaços.

Divisões:

lowerCamelCase ( iPod, iPhone )

UpperCamelCase ( OpenOffice, StarTrek )

Coding Standards Item Estilo Exemplos Obs. Classe Upper Camel Case ExemploDeClasse Método/Função Lower Camel Case exemploDeMetodo Objeto/Atributo/Variável Lower Camel Case exemploDeAtributo Constantes Upper Case / Underline LIMIT, MAX_SIZE Pastas Singular / Underline / Lower Case model, view, img, lib Bom senso quando abreviar Arquivos de classe Upper Camel Case ExemploControll.php Nome igual ao nome da classe Demais arquivos Singular / Underline / Lower Case index.php, estilo.css

Coding Standards Recomendações: Só usar abreviações quando for realmente necessário ou se tratar de costume; palavras completas facilitam o entendimento e conseqüentemente melhoram a legibilidade. Para decisão do uso de palavra estrangeira ou nacional deve ser levado em consideração, mais uma vez, a questão da facilidade de entendimento; a palavra que passar mais facilmente a idéia desejada deve ser utilizada. Usar aspas simples sempre que possível. Desde que seja uma string literal sem apóstrofo[ ], caso seja, utilizar aspas duplas para evitar slashes[]. Classes devem estar em arquivos isolados que possuem o mesmo nome da classe. Usar tag´s completas(<?php e <?php echo) e NUNCA utilizar short-tag´s(<? e <?=). E caso o arquivo possua apenas elementos PHP, não é aconselhado fechar tag PHP(?>). Usar espaço entre os operadores (=, +, -, %, &&, || ...). Tentar ser o mais fiel o possível quanto a documentação do código utilizando os conceitos do PHPDocumentor. Mantendo a simplicidade e clareza nos comentários.

Recomendações:

Só usar abreviações quando for realmente necessário ou se tratar de costume; palavras completas facilitam o entendimento e conseqüentemente melhoram a legibilidade.

Para decisão do uso de palavra estrangeira ou nacional deve ser levado em consideração, mais uma vez, a questão da facilidade de entendimento; a palavra que passar mais facilmente a idéia desejada deve ser utilizada.

Usar aspas simples sempre que possível. Desde que seja uma string literal sem apóstrofo[ ], caso seja, utilizar aspas duplas para evitar slashes[]. Classes devem estar em arquivos isolados que possuem o mesmo nome da classe.

Usar tag´s completas(<?php e <?php echo) e NUNCA utilizar short-tag´s(<? e <?=).

E caso o arquivo possua apenas elementos PHP, não é aconselhado fechar tag PHP(?>). Usar espaço entre os operadores (=, +, -, %, &&, || ...).

Tentar ser o mais fiel o possível quanto a documentação do código utilizando os conceitos do PHPDocumentor. Mantendo a simplicidade e clareza nos comentários.

Coding Standards Testando 1, 2 3 ... Referência: Walker de Alencar ( www.walkeralencar.com )

Testando 1, 2 3 ...

Referência: Walker de Alencar

( www.walkeralencar.com )

Dúvidas

“ A perfeição não é alcançada quando já não há mais nada para adicionar, mas sim, quando já não há mais nada que se possa retirar&quot; (Antoine de Saint-Exupéry)

“ A perfeição não é alcançada quando já não há mais nada para adicionar, mas sim, quando já não há mais nada que se possa retirar&quot; (Antoine de Saint-Exupéry)

Referências ACAlbuquerque.Blog ◦ http://www.acalbuquerque.blog.br Appendix B. Zend Framework Coding Standard for PHP ◦ http://framework.zend.com/manual/en/coding-standard.html PEAR Manual ◦ http://pear.php.net/manual/en/standards.classdef.php CamelCase ◦ http://pt.wikipedia.org/wiki/CamelCase PHP Coding Standards ( Walker de Alencar ) ◦ http://blog.walkeralencar.com/archives/11 PHPDOC ◦ http://www.phpdoc.org/ Usabilidoido ◦ http://www.usabilidoido.com.br/ W3C ◦ http://www.w3.org/ Navalha de Ockham ◦ http://pt.wikipedia.org/wiki/Navalha_de_Occam YAGNI argument ◦ http://en.wikipedia.org/wiki/You_Ain%27t_Gonna_Need_It Princípio da Simplicidade http://www.jmdois.com.br/home/an_txt15.htm http://migre.me/ain5 http://zenhabits.net/ Princípio do KISS http://en.wikipedia.org/wiki/KISS_principle Método DRY http://en.wikipedia.org/wiki/Don%27t_repeat_yourself Lista de filosofias de desenvolvimento de software: http://en.wikipedia.org/wiki/List_of_software_development_philosophies Webstandards (Padrões Web) ◦ http://www.webstandards.org/ ◦ http://www.maujor.com ◦ http://www.tableless.com.br/

ACAlbuquerque.Blog

◦ http://www.acalbuquerque.blog.br

Appendix B. Zend Framework Coding Standard for PHP

◦ http://framework.zend.com/manual/en/coding-standard.html

PEAR Manual

◦ http://pear.php.net/manual/en/standards.classdef.php

CamelCase

◦ http://pt.wikipedia.org/wiki/CamelCase

PHP Coding Standards ( Walker de Alencar )

◦ http://blog.walkeralencar.com/archives/11

PHPDOC

◦ http://www.phpdoc.org/

Usabilidoido

◦ http://www.usabilidoido.com.br/

W3C

◦ http://www.w3.org/

Navalha de Ockham

◦ http://pt.wikipedia.org/wiki/Navalha_de_Occam

YAGNI argument

◦ http://en.wikipedia.org/wiki/You_Ain%27t_Gonna_Need_It

Princípio da Simplicidade

http://www.jmdois.com.br/home/an_txt15.htm

http://migre.me/ain5

http://zenhabits.net/

Princípio do KISS

http://en.wikipedia.org/wiki/KISS_principle

Método DRY

http://en.wikipedia.org/wiki/Don%27t_repeat_yourself

Lista de filosofias de desenvolvimento de software: http://en.wikipedia.org/wiki/List_of_software_development_philosophies

Webstandards (Padrões Web)

◦ http://www.webstandards.org/

◦ http://www.maujor.com

◦ http://www.tableless.com.br/