Friday, June 17, 2016

Using HTML and CSS

The Projects


One of the projects was a simple HTML site, and the content wasn't anything specific. It was more of an opportunity to focus on the layout and building of an HTML page than creating something with valuable information. I used HTML to set up the basic format of the html / head / body, and I also made a list within the page and inserted a picture.

The second project, a page that used CSS, was based on an event that I attended recently. Our community of Ocean Beach (almost straight west toward the beach from downtown San Diego) is a really tight-knit community that loves music. We went to a backyard music festival where I played percussion, and I thought I would base the mock-invite off that event.

Using CSS helped me to format the page in a far easier way than with pure HTML. I was able to set color from the very top, which was much quicker and more convenient. Also, I was able to do the "CSS Box Model," which highlighted the important information for people attending the event, as shown below:


Obstacles


More than any other obstacle I faced, the one that plagued me the most was forgetting to "close" certain tags. When I would forget to do this, one of two things would happen: Either the text would disappear completely, or nothing that I planned on editing would actually change. Other than this, obstacles I faced were finding the correct color codes and "font-family" codes. Some of them would work at times, but others, even when double-checked, seemed like they weren't compatible for some reason.

For the closing of tags, I began copying and pasting lines of code so that the "closing" of the tag was built into the pasted item. This sped things up and solved the problem. As for the "font-family" codes, I chose new font-families that were not giving me any trouble. While this didn't necessarily "solve" the problem, it still looked good, and I was able to move on to more important things than font.

Successes and Future Applications


After completing these two assignments, I can say that I am happy with my new perspective. I have successfully changed my view of websites and what happens behind the interface and design. It is truly fascinating to think that behind some of our favorite and most complicated websites is an incredibly detail-oriented person typing away. While I do not feel I would ever be the person for that type of job, it does not change my appreciation for what they do.

Another success of this exercise is that I can now alter code on my personal sites, (including this blog) rather than relying on the template of a site. While I'm sure I may make things worse once or twice in trying this, it has given me the confidence to at least try to read the code, make sense of it, and edit it.

This may help me in my classroom in the future with some of the sharing that I do with students. I often share Google Docs with them, but now I could have a central place for all of them to get the links and information. Our district has pages where we can create our own website for the classroom. They offer templates and Google-based apps, but I could use HTML for building it from scratch to personalize it (or just for bragging rights).