As tabelas podem ser úteis para diversas formas de apresentação no Wikinotícias. Se você tem familiaridade com código HTML necessário para criar tabelas, pode simplesmente inserir o código diretamente no artigo que estiver editando. No entanto, não é recumendado utilizar HTML e sim código wiki, pois assim se tornam mais difíceis de editar, principalmente para aqueles sem conhecimento de HTML.
Há algumas situações onde as tabelas não são apropriadas e uma marcação mais simples pode ser usada. Este artigo discute como criar tabelas nos artigos do Wikinotícias e quando elas são desnecessárias.
Em HTML, os elementos td (para um valor), tr (para uma linha) e th (destaque) são chamados "células", assim como células em uma planilha. Cada linha deve possuir o mesmo número de células que as demais linhas, para que o número de colunas em uma tabela permaneça uniforme. Para células vazias, coloca-se dentro dela um código de um espaço vazio ( ), caso contrário alguns navegadores poderão não mostrá-las corretamente.
Se sua tabela não apareceu como você esperava, verifique todas as tags HTML. Um erro simples pode fazer muita diferença. Pode ser fácil esquecer as tags de fechamento (as que têm "/") de alguns dos elementos (somente alguns elementos HTML não exigem tags de fechamento para serem corretamente exibidas no navegador, embora a w3 recomende enfaticamente o fechamento de todas as tags abertas). O melhor jeito de encontrar erros em sua tabela é checá-la (o código) no W3C serviço de validação de marcações, disponível no histórico de todas as páginas do Wikinotícias. Este serviço é bastante útil para tabelas grandes e/ou complexas, uma vez que seria bastante trabalhoso verificá-las visualmente.
No entanto, não é recomendado criar tabelas em HTML no Wikinotícias e na maioria dos projetos da Wikimedia, por diversos motivos: tabelas em HTML pode ser mais complexas e exige que os usuários tenham conhecimento, seu código pode ser atualizado e se tornar obsoleto, entre outros fatores. Para quem já está familiarizado com tabelas em HTML, cabe notar que os elementos thead, tbody, tfoot, e colgroup não são suportados no Wikinotícias.
Código wiki
O código wiki (usado para escrever páginas do Wikinotícias) é o preferido, pois é mais simplificado que o usual HTML. o código é entre 10 e 20% mais compacto que o tradicional HTML. Ele utilizada os elementos {| e |} para iniciar e finalizar uma tabela. Para criar uma linha inclua | e para separá-las adicione |- entre elas. Você pode usar um HTML script on-line para converter o código HTML para este código wiki.
Aqui temos um exemplo. Você pode usar esta configuração em sua própria tabela para ver o efeito que têm. Tente manter as marcas relativamente simples em suas tabelas — lembre-se que outras pessoas podem editar os artigos também! Este exemplo pode dar uma ideia de como isso é possível.
{|
|+Exemplo de tabela
|-
!Primeiro cabeçalho
!Segundo cabeçalho
|-
|Texto esquerda
|Texto direita
|-
|[[Image:Wikinews-logo.svg]]
|[[Image:Wikinews-logo-pt.png]]
|-
|Logo sem texto
|Logo com texto
|}
Exemplo de tabela
Primeiro cabeçalho
Segundo cabeçalho
Texto esquerda
Texto direita
Logo sem texto
Logo com texto
Configurações
Existem muitas maneiras de configurar a tabela completamente ou apenas um pedaço dela. Uma das formas é usando class=. Você pode usar class="wikitable" (recomendada) após {| para criar bordas e destacar os cabeçalhos, assim a visualização parece mais organizada. Por exemplo:
Exemplo de tabela
Primeiro cabeçalho
Segundo cabeçalho
Texto esquerda
Texto direita
Logo sem texto
Logo com texto
Além disso, pode-se usar style=, onde pode configurá-la igual ao HTML. Por exemplo, se quer uma borda vermelha e maior inclua style="border: 3px red solid;". Se deseja alterar o fundo caixa inclua style="background:cor;". Você pode usar também text-size (tamanho da letra), text-align (alinhamento), margin (margem) e etc.
Para forçar a largura de uma coluna para um valor específico use width=, ao invés de ter o texto mais largo como determinante da largura. Não esqueça de fechar as configurações usando "aspas".
Quando usar ou não?
Tabelas são perfeitas para organizar qualquer informação que se apresente melhor em formado de linhas-e-colunas.
Em muitos casos, é melhor deixar uma lista simplesmente como uma lista. Alguns artigos têm listas muito longas, que seriam trabalhosas de se editar se em forma de tabela. Use tabelas com parcimônia: antes de aditar algo em tabela, considere se a informação ganhará realmente maior claridade se organizada em linhas e colunas. Se for assim, então uma tabela pode ser uma boa ideia. Se o ganho não é tão evidente, considere a possibilidade de não ser uma boa ideia passar horas montando uma tabela, que outro usuário passará outras tantas horas decifrando para editar o artigo.
Tabelas tampouco deveriam ser usadas apenas para criar layouts. Se a informação que você está editando não é tabular em si, então ela não pertence a uma tabela. Tente não usar tabelas para criar letras capitulares (aquela primeira letra bem grande na primeira linha de um paragrafo), legenda em fotografia, organizar ligações e grupos ou qualquer outra coisa estritamente visual. Isso torna o artigo mais difícil de ser editado por outros Wikijornalistas, e não foi para isso que se criaram as tabelas.
Exemplos
Listas muito longas ou muito simples
Se uma lista é particularmente longa, ou é relativamente simples, use uma das listas padrão de formatação do Wikinotícias. Listas longas podem ser difíceis de administrar quando em forma de tabela e simples não precisam necessariamente das dimensões de uma tabela. Eis aqui alguns exemplos que ficariam melhor como listas que como tabelas:
Em forma de tabela (não faça isso!)
1980
Ultra Wave
1988
What's Bootsy Doin'?
1994
Blasters of the Universe
1994
Fresh Outta 'P' University
Sem tabela (melhor assim)
1980: Ultra Wave
1988: What's Bootsy Doin'?
1994: Blasters of the Universe
1994: Fresh Outta 'P' University
Código desta última formatação:
*1980: Ultra Wave
*1988: What's Bootsy Doin'?
*1994: Blasters of the Universe
*1994: Fresh Outta 'P' University
Organização de imagens
Em muitos casos, recorre-se a tabelas para colocar imagens em artigos. Como tabelas podem flutuar à direita ou esquerda da tela, se tornou comum a prática de se utilizar uma tabela simples de uma única célula para colocar imagens onde se queira. Isso era necessário com navegadores antigos. Hoje em dia, no entanto, não é preciso! O código do Wikinotícias formatações para imagens bem mais simplificadas que HTML e tabelas; para instruções mais detalhadas, veja Ajuda:Tutorial/Imagens. Ainda assim, aqui vai um pequeno exemplo:
Em forma de tabela (não faça isso!
Sem tabela (melhor assim)
Nos dois casos acima, o resultado é essencialmente o mesmo: a imagem aparece flutuando do lado esquerdo da tela e o texto fica à sua volta. Mas montar a tabela leva muito mais tempo do que apenas escrever [[Imagem:Covalent.png|esquerda]]. Veja como fica o exemplo sem tabela (com texto ilustrativo):
Covalent bonding most frequently occurs between atoms with similar electronegativities, where neither atom can provide sufficient energy to completely remove an electron from the other atom. Covalent bonds are more common between non-metals, whereas ionic bonding is more common between two metal atoms or a metal and a non-metal atom.
E o exemplo em forma de tabela:
Covalent bonding most frequently occurs between atoms with similar electronegativities, where neither atom can provide sufficient energy to completely remove an electron from the other atom. Covalent bonds are more common between non-metals, whereas ionic bonding is more common between two metal atoms or a metal and a non-metal atom.
Possíveis problemas
Tabelas podem causar outras dificuldades, mesmo quando usadas corretamente. Aqui estão algumas questões que você pode querer considerar se usar tabelas nos artigos seus:
Tabelas podem ser difíceis para outras pessoas editarem, especialmente para aquelas que são novas no Wikinotícias. Os novos editores podem se sentir desconfortáveis se clicarem em "Editar essa página" e virem um código estranho. Tente manter as suas tabelas simples e bem formatadas no código. Você poderia adicionar também um comentário (o qual não apareceria na página renderizada) como "<!-- Para editar o texto desse artigo, pule a tabela. -->", a fim de tranquilizar os editores.
Se ela é complicada tenha certeza de que a tabela seja renderizada corretamente em todos (ou mesmo muitos) navegadores. Se usar HTML, o menor erro tipográfico pode causar problemas visuais drásticos com a tabela. Você pode estar confiante em suas habilidades para prevenir isso, mas os futuros editores podem não o estar. Novamente, mantenha tabelas simples e bem formatadas, e isso será menos provável de ser um problema.
Tabelas largas, com bastante informação, podem exceder o lado direito da tela em baixas resoluções. Isto é às vezes aceitável, especialmente se o usuário for avisado de antemão. Se você ver que for necessário criar uma tabela muito larga para um artigo, você pode considerar em criar uma versão mais simples e menor para os usuários que não possam usar efetivamente a versão maior.
Se você incluir texto de largura fixada dentro de uma tabela (usanto os elementos de HTML como code, pre, ou tt; por exemplo), isso pode forçar a página a ser mais larga do que o necessário. Sempre que possível, evite usar esse tipo de texto dentro de tabelas, assim o texto poderá fluir naturalmente. Um problema similar pode acontecer se você incluir imagens dentro de tabelas (uma vez que imagens usualmente estão determinadas a serem de uma largura específica).
Células que contêm um grande volume de informação podem causar problemas de renderização em alguns navegadores. Em particular, uma célula contendo um parágrafo grande pode misturar a formatação em navegadores de apenas texto. Isto às vezes é necessário, dependendo do tipo de tabela que você está criando mas, se de alguma for for possível, tente limitar a quantidade de conteúdo que você põe nas células da tabela.
Em alguns navegadores, as tabelas que são alinhadas à direita permitem o texto justificado a passar por cima da borda. Isso pode parecer desagradável. Uma solução é usar style = "margin-left: 0.5em;" no cabeçalho na tabela
