segunda-feira, 30 de janeiro de 2012

Capítulo 6: Globalization and Accessibility Lição 1: Configuring Globalization and Localization

A maioria dos sites são desenvolvidos para uma só língua e cultura, entretanto o site pode ser acessado por pessoas em diversos países que falam diferentes línguas. Os desenvolvedores igoram esta larga audiência. O asp.net permite você desenvolver de forma que consiga atingir essas pessoas, salvando os textos dos seus sites em arquivos de recursos, separando por língua ou cultura.

Será criado um arquivo de recurso para cada linguagem que seu site irá suportar, no momento em que o usuário acessar o site, o asp.net irá verificar através da requisição do usuário qual sua língua e escolher o arquivo de recurso ideal para o usuário, caso seu site não suporte a cultura do usuário, será escolhido um arquivo de recurso padrão para fornecer o resultado.

Outro ponto importante é acessibilidade. Isso significa que seu site suporta diferentes tipos de visualização e entrada de dispositivos. Utilizando os recursos da acessibilidade todos os usuários irão se beneficiar ao acessar seu site.

O asp.net possui importantes ferramentas para conseguir atingir seus objetivos tanto com globalização e acessibilidade.

Lesson 1: Configuring Globalization and Localization

Existem aplicações web seja de intranet, seja aplicativos de multinacionais que necessitam atingir um público alvo amplo de diferentes países. Para esses casos o asp.net disponibiliza ferramentas para que seu site se adeque a língua e cultura do usuário que esta acessando.


About ASP.NET Resources


Para exibir uma página asp.net que suporte diferentes linguagens, você pode solicitar a língua que o usuário utiliza e escrever linhas de códigos para modificar todo seu texto, porém isto será custoso e complexo e irá requerer que uma pessoa que não seja desenvolvedora mexa no seu código. Claro que esta não é a melhor solução. Você pode externaliza seu texto, ou seja, deixa-lo separado do seu código fonte, e decidir em tempo de execução qual texto é o mais apropriado para ser exibido.


O Asp.net utiliza arquivos de recursos que suportam múltiplas linguagens. Um arquivo de recurso contém uma lingua especifica para ser exibida em uma página ou site. Sua página irá exibir o arquivo de recurso baseado na requisição do usuário, utilizando definições de sua máquina ou configurações do navegador.


Existem dois tipos de arquivos de recursos no asp.net: Local e Global. Arquivos Locais são especificos para uma página. Arquivos Globais são compartilhados por todo o site.


Using Local Resource Files


Um arquivo de recurso local é especifico para uma página web. Arquivos de Recursos locais devem ser armazenados dentro de uma pasta especial chamada App_LocalResources. Esta pasta pode estar na raíz ou dentro de outras pastas do seu projeto. Caso seu site contenha várias páginas, o ideal é criar uma sub-pasta App_LocalResources dentro de cada pasta.

Como o arquivo local é especifico para uma página você deve nomeá-lo com o nome da página mais a extensão .resx. Por exemplo se você tiver a página Home.aspx o arquivo de recurso padrão deve ter o nome Home.aspx.resx. Este será o arquivo padrão, caso seu site não possua a linguagem requisitada pelo usuário este arquivo será utilizado.

Você deve criar um arquivo específico para cada linguagem que seu site irá suportar. O nome desse arquivo deve ser o nome do arquivo padrão mais a informação da linguagem específica. Por exemplo, se você criar um arquivo para a linguagem abranger o espanhol, o arquivo de recurso da página Default.aspx deve ser Default.aspx.es.resx onde "es" é abreviação de Spanish. Se for criar para o alemão, deve ser, Default.aspx.de.resx onde "de" representa German.

Culture-Specific Local Resources

No desenvolvimento asp.net o termo culture (cultura) refere-se a linguagens regionais e diferenças de formatos. Exemplo, o Inglês falado nos Estados Unidos, é diferente do Inglês falado na Inglaterra e na Austrália ou outras partes do mundo. Cada país ou região pode ter um padrão diferente de formato de moeda, data ou número. Nos Estados Unidos por exemplo o número é formatado da seguinte forma: 12,345.67, já em algumas partes da Europa a vírgula e o ponto são invertidos: 12.345,67.

Quando uma requisição de cultura específica for feita o FrameWork irá ajustar conforme a necessidade. Você só precisa criar arquivos de recursos específicos.

Para atender diferentes culturas, como por exemplo ter textos diferentes para o Espanhol falado na Espanha e o Espanhol falado no México, basta criar o arquivo com o seguinte formato: PageName.aspx.languageId-cultureId.resx.

Exemplo, caso queria ter um texto diferenciado para o Espanhol falado no México (mx) precisa criar um arquivo: Home.aspx.es-mx.resx; Já para o Espanhol falado no restante do mundo basta: Home.aspx.es.resx.

Examining the Contents of a Resource File

O arquivo de recurso no Asp.Net é um arquivo xml com um conjunto de pares com chave e valor. A chave é única e é usada para definir e referenciar o resource. Já o valor (claro) é o valor retornado pela chave. O seguinte código é um exemplo de um chave em um arquivo de recurso:

<data name="PageResource1.Title" xml:space="preserve">
  <value>Customer Lookup</value>
</data>


Neste exemplo observe que a chave é PageResource1.Title e o valor é Customer Lookup.
O Visual Studio possui uma ferramenta própria para edição, porém caso precise ou queria pode editar seu arquivo de recurso através de algum editor Xml.

Generating Local Resources

Você pode utilizar o Visual Studio para gerar automaticamente um arquivo de recurso local para sua página. Este procedimento irá exportar para o arquivo as propriedades baseadas em textos dos controles dessa página. Para executar este procedimento, siga os passsos:
  • Abra sua página no Visual Studio;
  • Vá até o menu Tools-Generate Local Resource.
O Visual Studio irá fazer:
  • Criar a pasta App_LocalResources se for necessário;
  • Gerar um arquivo baseado em Xml, que será seu arquivo local de recursos. Ele irá conter as propriedades de sua página e de seus controles, propriedades como Text, ToolTip, Title e Caption).
Veja a imagem de exemplo, uma página que possui um TextBox, um Calendar e controles Button. Repare no menu:


Depois de clicar na opção. O Visual Studio irá gerar um arquivo de recurso com as propriedades exportadas de sua página e controles. Este arquivo irá ser nomeado com o nome de sua página mais a extensão .resx.

Observe na próxima figura o arquivo gerado, repare que foram exportadas as propriedades com seus valores que estavam informados.


Localizing Text Outside of Controls

Lembre-se que o Visual Studio não gera recursos para todo o texto de sua página, ele apenas irá gerar para os controles que possuem a propriedade Text. Verifique pela figura anterior que vários itens de texto não foram exportados para o arquivo de recurso, isto é por que as propriedades não estavam preenchidas. Esta é a única preocupação que precisa ter quando for criar seus arquivos de recursos.

Se você possui textos em sua página que necessitam utilizar recursos de localização, é melhor utilizar algum controle que exiba este texto do que utilizar apenas marcadores html. O ASP.NET possui te da duas opções de controles para esta tarefa. O primeiro é o controle <asp:Localize>. Este controle não irá gerar nenhum código na sua página quando exibida, ele só trabalha para localizar textos que estão fora de controles. Outro controle que pode ser usado é o <asp:Label> que trabalha de forma parecida. Veja como fica o código do controle <asp:Localize>


<asp:Localize ID="LabelTitle" runat="server" Text="Customer Lookup" meta:resourcekey="LabelTitleResource1"></asp:Localize>


Attaching Controls and Resources Implicitly


Quando o Visual studio gera o arquivo de resource, ele automaticamente altera o código aspx adicionando a meta:resourcekey como atributos ao controle específico. Em tempo de execução o ASP.NET procura um valor para este item no arquivo de recurso com base nessa chave.


Isto é uma localização implícita, utilizando o padrão Key.Property onde o é definido que a chave é o nome do controle e a propriedade é a propriedade do controle como ButtonFind.Text ou ButtonFindResource1.Text.


O código a seguir mostra um exemplo no botão Find, após sua propriedade Text ser exteriorizada em um recurso implicito.



<asp:Button ID="ButtonFind" runat="server" Text="Find" CssClass="submitButton" meta:resourcekey="ButtonFindResource1" />


O ASP.NET irá utilizar a chave meta:resourcekey para procurar no arquivo de recurso a mesma chave para substituir o valor da propriedade Text do botão.


Você pode usar este mesmo método de nomenclatura quando utilizar arquivo de recursos e fazer todo o processo manualmente. Isso é importante porque muitas vezes você irá adicionar ou mudar um controle de uma página após ter gerado o arquivo de recurso. E o Visual Studio não irá tentar manter em sincronia o arquivo de recurso. Portanto é importante você gerar seus arquivos de recursos com base em um dos passos anteriores.


Attaching Controls and Resources Explicitly

O modelo implícito discutido anteriormente trabalha monta a combinação dos valores da propriedade com o recurso automaticamente com base na convenção (Key.Property). Mas existe a opção de fazer esta combinação explicitamente. O código a seguir mostra como fica para definir a propriedade Text com um valor vindo de um recurso.

<asp:Button ID="ButtonFind" runat="server" CssClass="submitButton" Text="<%$ Resources:, ButtonFindResource1.Text %>" />


Quando optar pela foma explícita você sempre precisará informar qual a chave do recurso corresponde a propriedade do controle. Portanto, basta criar seu arquivo de recurso, adicionar o recurso e associar a seu controle.

Creating Language-Specific Local Resources

Quando pretende utilizar diversas linguagens e culturas em seu site, o primeiro passo é criar o arquivo de recurso padrão. Para criar o arquivo de recurso para outros idiomas, você deve copiar seguir os seguintes passsos:

1º No Solution Explorer, clique em Copiar no arquivo padrão.
2º Vá na pasta App_LocalResources e clique em Colar.
3º Renomeie seu novo arquivo incluindo a linguagem e a cultura antes da extensão do arquivo. Por exemplo para um arquivo que irá dar suporte ao Francês, o nome do arquivo deve ficar: CustomerLookup.aspx.fr.resx onde fr é a abreviação para Francês.
4º De um cliquei duplo no arquivo e altere os valores dos recursos para os valores correspondentes a linguagem.

Você deve repetir esses passos para criar o arquivo para suportar outras linguagens.

Testing Resource Files for Other Cultures

Para executar testes em seu aplicativo utilizando outras linguagens, basta alterar a linguagem padrão de sua máquina, mudando esta propriedade automaticamente quando acessar seu site o navegador irá verificar esta propriedade e enviar para o ASP.Net.

Using Global Resources

Um recurso Global é utilizado quando você precisa que este recurso seja lido por várias páginas do seu site. Um recurso Global não é utilizado para uma página específica.

Ele segue praticamente as mesas regras dos recursos locais, ele é um arquivo .resx. Você precisa criar um arquivo padrão e arquivos para as linguagens que pretende dar suporte e manter a mesma regra referente aos nomes dos arquivos. Entretanto, um arquivo de recurso Global fica salvo na pasta App_GlobalResources na raíz da aplicação. O ASP.NET sempre irá gerar objetos que facilitam a utilização desses recursos de forma simples. Uma diferença é que os recursos globais só podem ser usados explicitamente e nunca implicitamente.

Creating Global Resources

Para criar um recurso global você deve iniciar criando o arquivo e armazenando na pasta App_GlobalResources. Neste arquivo você deve preencher todo recurso que será compartilhado entre as páginas. Para criar um arquivo de recurso global, siga os passos:
  1. Clique com o botão direito na Solution Explorer. Selecione, Add ASP.NET Folder e em seguida App_GlobalResources. Ele irá criar a pasta na raíz do seu projeto.
  2. Clique com o botão direito na pasta App_GlobalResources e selecione Add New Item.
  3. Na caixa de diálogo que abrir, selecione Resource File. Defina um nome para seu arquivo seguida da extensão .resx.
Do passo anterior em diante, segue o mesmo padrão do arquivo local. Você deve abrir o arquivo para criar seus recursos. E este será seu arquivo padrão, você deve criar outros arquivos para dar suporte as cultuas que deseja.

Attaching Control Properties to Global Resources

Após criar o arquivo de recurso Global, você pode associar explicitamente as propriedades dos controles aos recursos. No caso do recurso global, se você possuir uma Label que exibe uma mensagem de saudação em todas páginas, basta você criar este recurso uma única vez e utilizá-lo em todas as páginas.

Para associar as propriedade dos controles ao recurso no modo de design, você pode usar a propriedade Expressions. Veja como:
  • Abre a página no modo de design do Visual Studio e abra a aba propriedades de um controle;
  • Selecione a propriedade Expressions que está na categoria Data. Clique no botão com 3 pontos (...) para abrir a caixa de diálogo.
  • Selecione a propriedade que deseja associar ao recurso;
  • Na lista de tipo de expressão, selecione Resources;
  • Na chave ResourceKey selecione a propriedade correspondente e clique em OK, veja na imagem:


Esses passos farão que o Visual Studio mostre o valor do recurso padrão no modo de design e quando a página for aberta pelo usuário irá mostrar conforme as definições dele. No código aspx o visual studio cria o código necessário para fazer esta ligação explicita com o recurso, veja como fica:

<asp:Label ID="LocalizeWelcome" Text="<%$ Resources:SharedLocalizedText, WelcomeString %>" runat="server"></asp:Label>

Accessing Resource Values Programmatically

O ASP.NET cria objetos que permite que você acesse os recursos através da programação, usando a sintaxe Resources.ResourceFilename.Resource. Esta é uma classe fortemente tipada do objeto  Resources.Resource para cada arquivo de recurso global. Esta classe é criada com base no nome do arquivo menos sua extensão.

Cada recurso se torna um membro da classe. Por exemplo para acessar o recurso WelcomeString que esta dentro do arquivo SharedLocalizedText você programar da seguinte forma:

LabelLocalizedWelcome.Text = Resources.SharedLocalizedText.WelcomeString;

O código anterior é quando você já possui seu arquivo criado em modo de design, quando você cria este arquivo em tempo de execução você pode acessá-lo através dos métodos GetLocalResourceObject e GetGlobalResourceObject. Veja como fica:

Button1.Text = GetLocalResourceObject("Button1.Text").ToString();
Image1.ImageUrl = (String)GetGlobalResourceObject("WebResourcesGlobal", "LogoUrl");

HTML Layout Best Practices

Globalização pode ser simples como substituir um texto pelo texto da outra linguagem, formatando os números e símbolos. Entretanto algumas línguas como a língua Árabe requer um layout diferente pois os textos são da direita pra esquerda. Quando quiser permitir que seu site de suporte a linguagens de culturas variadas, siga as seguintes diretrizes:
  • Evite utilizar posicionamento absoluto e tamanhos definidos para os controles: ao invés de definir os tamanhos em pixels nos controles, deixe que o navegador controle isso, para fazer isso não utilize posição absoluta nem tamanhos fixos.
  • Utilize a altura e largura dos formulários: devido essas línguas terem mais ou menos letras para escrever uma palavra ou frase, você não deve definir em pixels os tamanhos dos controles, utiliza porcentagem. Ex.: <table width="100%">
  • Defina os tamanhos dos controle em relação ao tamanho total do formulário: Quando precisar definir o tamanho de um controle utilize tamanhos proporcionais ao formulário. Você pode fazer isso utilizando expressões de folha de estilo. Ex.:  <div style='height: expression(document.body.clientHeight / 2); width: expression(document.body.clientWidth / 2); '>
  • Utilize células para cada controles: isso irá permitir que o texto seja moldado e garante o alinhamento entre as colunas mesmo com diferentes línguas.
  • Evite utilizar a propriedade NoWrap nas tabelas: não permita a quebra de linha, pois isso pode funcionar na língua nativa, mas não em outras línguas.
  • Evite especificar a propriedade Align nas tabelas: definindo um alinhamento da esquerda pra direita poderá substituir o layout em culturas que utilizam o texto da direita pra esquerda.
  • Desassocie controles RadioButton e CheckBox do texto: separando o texto em células separadas do controle permite que o texto seja moldado quando for necessário um texto maior quando for traduzido.
Em resumo quanto menos deixar fixo os tamanhos dos controles de sua página, mais fácil ficará adaptar para outras línguas, pois quem ficará responsável por esta tarefa é o navegador.

Setting the Culture

Normalmente utiliza-se as preferências do usuário que esta definida nas configurações do browser. Porém é interessante permitir ao usuário que modifique esta opção manualmente. Pode acontecer de um turista estar utilizando um computador público em outro país e prefere ver o site na língua nativa dele.

Você deve exibir para ele uma forma de trocar a língua. Quando o usuário mudar esta configuração você deve salvar em um cookie, sessão ou algo similar.

Nas páginas ASP.NET existem 2 propriedades para definir a linguagem e a cultura:
  • Culture: este objeto determina os resultados de funções que são dependentes da cultura, como formatações de data, moeda e número. Definindo uma cultura específica, você define tanto a linguagem como a formatação regional, tais como es-MX ou fr-FR. Você não pode definir objetos de cultura neutra que define apenas a linguagem, tais como es ou fr.
  • UICulture: esta propriedade determina os recursos globais e locais que serão carregados. Nesta propriedade você pode definir culturas neutras.
Você define as propriedade Culture UICulture sobrescrevendo o métodInitializeCulture da página. O código a seguir mostra como definir essas propriedades com o valor vindo de um dropdownlist.


protected override void InitializeCulture()
{
  if (Request.Form["DropDownList1"] != null)
  {
    //define the language
    UICulture = Request.Form["DropDownList1"];
    //define the formatting (requires a specific culture)
    Culture = Request.Form["DropDownList1"];
  }
  base.InitializeCulture();
}

O correto é você fornecer ao usuário uma lista das linguagens que você suporta em seu site. Porém você tem a opção de recuperar todas as culturas disponíveis chamando o método System.Globalization.CultureInfo.GetCultures. Este método retorna um Enumerador do tipo CultureTypes que especifica um subconjunto de culturas disponíveis. Os valores mais utilizados são:
  • AllCultures: esta lista todas as culturas disponíveis no framework, tanto culturas específicas como neutras.
  • NeutralCultures: fornece somente a língua e não configurações regionais.
  • SpecificCultures: fornece tanto a língua como definições de configurações regionais.
Setting Culture Declaratively at the Page or Site Level

Você pode definir a cultura tanto do website como somente de uma página. Para definir a cultura do website, adicione a seção <globalization> no arquivo web.config. Em seguida defina os atributos UICulture e Culture. Veja como:


<globalization uiculture="es" culture="es-MX" />


Para definir estes atributos somente para uma página você deve utilizar na diretiva @Page.


<%@ Page uiculture="es" culture="es-MX" %>


Por padrão os valores atribuidos a essas propriedades é auto.

Um comentário:

  1. Oi, estou acompanhando seus posts e eles são muito bons!

    Quando vão sair os próximos capitulos??

    Obrigada

    ResponderExcluir