HTML, CSS, and Javascript are crucial to website development these days.
Especially when you’re working on localizing websites into multiple languages.
In this course, we learned how to build a website using html, css, and javascript from the ground up.
To put these terms in simple languages:
*https://bit.ly/2zOgGTX
html is like the body of the website
css is like the appearance of the website
javascript is like the muscle of the website
*Screen Capture of me working on my website
Frankly speaking, it was quite confusing when you don’t have any background knowledge with coding at first, but as I learned more and more about it, I realize that these tools are pretty logical. The more you dive into them, the more sense they make. In the first few classes, I wasn’t able to understand the functions and ideas of any of the basic tags we learned, I was simply copying and pasting the codes into my bracket and somehow the website slowly built up on its own. Take a line in the following picture <div id=”inner”> for example, I don’t really understand why we’re putting <id> behind <div>. All I know is that it in some way helps us to style it in CSS. Later on, I understand that the <id> is like a label within the system that let the system recognize which one of the <div>, a tag that defines a section on the website, am I dealing with. Of course, that’s just one of the many enlightenment I had when learning the basics of them. The html, css, and javascript.
After learning these tools, we start getting our hands on WordPress, a well-recognized software for people building their website, where we can apply what we’ve previously learned about. For WordPress, I was introduced to a bunch of handy localization plugins such as Polylang, WPML. Each of them has their own pros and cons. WPML is a premium function but overall easier to manage your sites while Polylang stands as a free option but less user-friendly when it comes to managing your multilingual sites. We also start on creating our e-Portfolio on WordPress as well. we didn’t just limit ourselves to WordPress, we also take a look at Drupal. Getting Drupal helps me get a gist of how different these two platforms are and perhaps incorporate these factors into decisions when choosing a platform for our websites.
*The menu of WordPress site
Project
Before the end of the semester, us students get to form into a small group of three and work on a small project based on what we learned that semester. I team up with Viola Tsai, Hannah Wang and we decide to localize an open source html game called “Tower”.
After looking into it, we realize that most of the strings are in the pictures. Although we haven’t learned about DTP at the moment, we then get a chance to find out what DTP is like before even taking an actual course for it. We start with using Photoshop, but since we’re not familiar with its function, we turn to use the built-in preview tool on our mac. It might sound unbelievable but it indeed gets the job done.
The next issue we had is with the language selector. Since we’re localizing a game, language selector is a must-have. We confront some obstacles like it’s not working properly or it’s not even showing up on the page. At first, we were thinking about going the most simple of putting an <a href>, but it was too hideous in our opinion. To solve that, we have to review on our past works and try to recall how we did that in Fortunatelytunatly, we’re able to figure it out, and were able to use the css styling to put it at the place where we want it to be. Plus, we understand the importance of directory after completing this assignment cause one of the problems we have is due to the fact that one of the directories is wrong so that our pages won’t load up. Overall, I would say that we get a sneak peek to what website localization is actually like in a real-world environment.
*Problem A-Directory
*Problem B- language switcher