9/26/2018 0 Comments CRAFTING CODEThe Technical: To make this site, I first started by keeping my original Tutorial 2 folder that we turned in awhile ago. I hoped I could edit the code by adding in parts of w3.school templates. However, I soon realized that it’s very difficult to pick and choose from a variety of templates. And, of course, I wanted to make it completely unique. So, I started by making the home page with simply a solid background color. Then, I edited a navigation bar and photo gallery from one of the w3 templates. For other elements, I simply browsed over the stylesheets from other templates and familiarized myself with the codes. Based on what I saw, I would try to translate that into my own stylesheet. This was definitely the most frustrating part because once I figured out the code, it typically never appeared as I wanted it. To fix this, I had to play around with everything else on the page. For me, this was my primary obstacle — adding new elements without changing other content. After time and a lot of frustration, I eventually figured out how to manipulate the elements so that they would compliment each other. The Ideal Website: When I started this process, I didn’t have a distinct “vision” of how I wanted my website to look. After exploring online (and w3 templates), I got a better idea as to what I wanted. I hoped that it would be clean and organized, but also decorative and vibrant. I also knew I wanted my color scheme to be subtle, so that it could contrast other vibrant elements. Overall, I feel like the closest I got to this “vision” was through the color scheme. On the other hand, I wish I could’ve spaced and aligned the elements better. If I knew everything about code, my website would be much more complex visually, through varying alignments and elements. Modes: I feel that I most prominently used the linguistic, visual, and spatial modes. Linguistic: Although I didn’t use a vast amount of words, I feel that when I did, I specifically considered word choice and the organization of words. I wanted the content to look and feel approachable, most importantly. When there are too many words at first glance, the content feels overwhelming and cramped. To avoid this, I tried to be concise as possible, and balance the words with another element on the page. Visual: Visually, I tried to create content that would appeal to the viewer’s eye. I attempted to do this through contrast and alignment. To contrast, I specifically chose colors, fonts, and sizes to distinguish certain items from the rest. However, I also wanted to be consistent with the overall theme of the site. To be visually consistent, I focused on keeping color, font, and alignment the same, for the most part. Spatial: From the start, I wanted my website to be spacious so that it would be easy to navigate, appealing to the eyes, and overall approachable. To do this, I tried to organize each element in a specific proximity to the others. Design Strategies: Two specific design strategies I tried to incorporate were color and contrast. I purposefully chose a lighter background color to contrast the black and white text and the colorful graphics. I hoped that this would bring the viewer’s attention to certain elements. Overall, I wanted the site to be balanced and consistent, but also eye-grabbing and lively. To conclude, this was one of the most challenging tasks I've had this semester. All in all, I do feel like I learned another language, even though I'm not fluent in the slightest. It was satisfying to see how far I've come though.
0 Comments
Leave a Reply. |