Business Problem
Our colleagues at Digital Phenom had a client, Landon IP, with a website that catered to both English and Japanese speaking markets. The site was being maintained as two separate copies: one in English and one in Japanese. This meant that adding a page to the site actually required adding two pages: one in English and one in Japanese. Landon wanted to add two new forms and over half a dozen pages, and realized that double the labor was too much. They wanted to convert their site to use internationalization and localization.
Digital Phenom turned to us because of Celtic Wolf's ASP.NET expertise.
Solution
We worked with Digital Phenom and their client to assess their requirements and design a solution that gave them the new forms and pages they wanted, with the contents, buttons, graphics and even error messages in both English and Japanese. The language that is displayed is determined by the user's browser settings. If they have selected English as their primary language, they get English pages. If they have selected Japanese, they get that language instead. If their browser is set for some other language, the site defaults to English.
Using standard ASP.NET localization techniques, we created a system that can be easily expanded to include additional languages as the need arrises. Text and images are stored separately from the web page in which they appear, in special files called "resource files". To add a new language, the client only needs to create a set of resource files for that language and upload them to the site. They will automatically be used without needing to reconfigure or rebuild the site.
Landon was so happy with our work that they asked us to internationalize the master page template as well. A master page template contains headers, menus, footers and other common page elements and allows every page to share those elements without having to make copies of them. Once we modified their template to support multiple languages, all pages on the site automatically displayed the header, menu, footer, etc. in the user's preferred language.
In addition to creating new forms and pages, we:
- created submenus for easy navigation (in both English and Japanese)
- had the forms send email to the person who filled out the form and the correct Landon personnel (in either English or Japanese, depending on the submitter's language)
- added reCAPTCHA to protect the forms from being used for spam
- implemented a slick file uploader to allow attachment multiple files to a form at one time
Technical Details
The site was originally created with ASP.NET 2.0. Landon wisely used ASP.NET's template facility, which allowed us to easily internationalize the master page template. Localization of the master page template and the new forms and content pages was accomplished using local resource files. Using this mechanism has several advantages:
- Using local resource files instead of global resource files helps to organize content that is used on only one page or in one control
- It's easy to create a set of resource files for a new language and add them to the website
- Because it's a standard mechanism for the ASP.NET platform, any future developers who work on it will already be familiar with it or can easily read the documentation
We created several ASP.NET user controls to function as reusable "widgets" that could appear on multiple pages. Each user control had its own set of local resource files to contain the needed translations. We also created a custom ASP.NET control as part of a secondary assembly. This control was derived from DropDownList and created a drop-down list with customized behavior for use on the site. Finally, we added conditional compilation directives to allow for different behavior between the testing and production versions of the code.