My First Attempt Towards the Technical Skill Achievement

First Attempt towards Technical Skills.

Welcome to my first journal and, my first website! It’s here. At first, I thought it would be not that hard because there were only several required elements and they are not complicated. In the end, I have found it is easy to produce a website, but it is never easy to DESIGN a website if you want it to be practical and beautiful. I always generated new styling ideas which required me to go learning online because I only got the picture in mind without the knowledge of how to conduct it through CSS. Therefore, the design process is also a learning process for me.

Basically, I have tried to use different HTML and CSS skills taught in class as much as possible. For HTML, I have employed the universal, class and id selector to help with styling different parts of the website. Also, link insertion and list function were employed into the website. As for CSS, a variety of styling elements were used to improve the looking. And I have used a separate CSS file to store those properties. It really arouses a sense of pride to me when I have combined all these together to have a MY work.

At the beginning, I immediately wrote all the needed elements and the website looked like a mess even after a simple reorganization. Then I started to browse and inspect those websites that I frequently visit and I found video background a satisfying answer to my decoration. The insertion is similar to image insertion. However, how to make it full screen and put everything onto it really required me to watch some YouTube tutorials. Before this idea, I have separated the website into the header, aside and main part to conduct the layout through grid-template-areas. But I failed to figure out how to put the video across the aside and main part. Then I decided to give up this format and adopted different div classes to achieve the effect. Object-fit and overflow property really help a lot in presenting the video as the background.

CSS is a tedious while intriguing process. I had to check every time when I edited a small change in CSS to see if the website looked harmonious. Meanwhile, I enjoyed playing with the colors, fonts, paddings and display to organize them into what I desired. This process also has encouraged me to learn more about color coordination.

Practice is the best way to learn. Though I thought that I have understood all the concepts in class, I still forgot something and encountered difficulties while designing. In the following classes, I hope I could learn more about responsive design and improve the present version soon.