Since we just had our Latino tech meet up, this seems like the perfect time to give a tech tip on getting those Spanish-language accent marks right in your HTML.
Look closely at this image below. It’s part of what was in one of our pretests that assess our game.
Do you see something wrong here? Look closely. In the button where it should say AQUÍ instead of an i with an accent mark, there is a ? Inside of a diamond. This is definitely not what I wanted.
Now here’s the weird thing that happens. This looked perfect in a Word document. If I copied and pasted it from a Word document into an HTML document and looked at it on Google Chrome it might have looked perfect as well. However this screenshot is from Firefox and it is definitely not perfect.
Tip: do not just copy and paste Spanish language text with accents from a Word document into an HTML document or you get stuff like this in some browsers.
Now some people (cough*Luis*cough) might say that is a browser problem. I don’t see why you blame the poor browser who is just minding its own business.
Besides, this is really easy to fix. All you need to do is use the correct code. In this case I want to uppercase I with accent mark. The code for this is: Í
You can find other codes for other accents here.
HAZ CLIC AQUÍ
You can use these accent codes, anywhere.
You can see below a statement which is part of the function where everything flips from English to Spanish. To change the value of the submit button I change the text in HTML of the div as shown below.
That is all.
$("#submit1").val( $("<div>").html("HAZ CLIC AQUÍ").text());
You can buy the games here that teach all of the skills taught in the tests. Run on Mac and Windows computers.
What’s that you say? You don’t have a computer! You only have an iPad and you have no money! No worries. You can get our very first iPad app Making Camp here for free.
Get Making Camp for iPad!