slide 12
Copyright © 2005 W3C (MIT, ERCIM, Keio)
Graphics in fixed width boxes
Text size
.box h3 {
margin: 0;
padding: 6px 8px 4px 10px;
font-size: 130%;
color: #333;
background: url(img/h3-bg.gif)
no-repeat top left;
border-bottom: 1px solid #E0CFAB;
Bulletproof Web Design, Dan Cederholm
Go to previous slide Go to next slide Go to the first slide Go to the slide index Go to the PDF version
Slide 12 of 53
To get the line to appear in the right place, we simply create it as the bottom border of the heading.
This example uses a technique (and the exact same code and graphic) described in Dan Cederholm's book, Bulletproof Web Design (although the text is borrowed from Google's language preferences). This is significant! Dan is not writing about internationalization per se - he is more concerned with people pumping up the text size for accessibility reasons. It just so happens, however, that the same approach helps with localizability.
This is an example that you don't necessarily have to learn new information to deal with internationalization issues - just following existing best practices can be the key in many cases. Note again, however, that we are still talking about the design and development of content - not about work that the localizers will do!
Dan's book contains several other recommendations that will benefit internationalization.