When people hear about the occupation of a web designer, most people think about the creative side. Planning, creating or updating a stunning website with cool graphics, content, colours, fonts, and more.
Diary entries:
- Diary 1: Bootcamp – UX Design
- Diary 2: Bootcamp – UI Design
- Diary 3: Bootcamp – Development
- Diary 4: Bootcamp – WordPress, Hosting and Domain name
- Diary 5: Bootcamp – Digital Marketing
- Diary 6: Bootcamp – Freelancing
But there is much more a web designer need to know from the technical perspective. The Web Design Bootcamp should prepare us also to work as a freelancer, which makes at least basic understanding of HTML and CSS essential.
A new teacher
Module 3 of the Web Courses Bangkok bootcamp was about web development. Our teacher was now Cylis, an experienced web developer who is working as a freelancer as well. He has great knowledge about Hypertext Markup Language (HTML) and Cascading Style Sheets (CSS).
Changing teachers have been very beneficial for us as a group because we learn the topics from experts, and we see different perspectives as well of a web designer and a web developer.
This is important, because, in our future career as a freelancer or employee, we most likely work together with either of one. I really enjoyed this experience during we learn new skills.
Our first lesson in module 3
In our first lesson of WCB´s module 3, web development, we focus on Structural HTML. Cylis explained to us that we have to look at it as a house.
The <div> are the walls, which separate content. The <header> is the roof because it is on top of a page and often contains the main navigation. The <nav> is the hallways and stairs, they bring us to different rooms. And the <footer> in the basement, which is mostly closing a page.
This was very helpful to start with a logical understanding of the different tags and understand what they are used for. When I tried to learn it by myself before the course, it was very hard to find an entry point into the topic.
During the first day of the course, I realized that it is not so complex and difficult like I thought it would be. It is actually very simple and straight forward if you know the basic structure and tags.
The class was supported by worksheets to try by ourselves to name the right type of content and match them with the right code. This really helped, because we see examples of actual websites from different industries.
After a short time of solving, we discussed the different answers as a group.
Cylis is teaching the Web Development Bootcamp class.A new project using HTML, CSS, and Bootstrap
We also get introduced to our next in-class project, which will be built with HTML, CSS, and Bootstrap. It is a multi page website about our learning portfolio. In nearly every module we are challenged with a different kind of website, to develop our skills but also a portfolio with our work to have an easier transition into our future career.
We used the program Sublime text 3, to create our HTML file. The basic version is free to use and is very beginner-friendly if you want to learn how to code. The program will color different tags and make auto-fill suggestions, which makes it easier to follow the learned instructions.
The web pro boot camp is including a lot of information in a short time, so it is very important for the students to do some extra work at home. The basics of HTML have been only one and a half days in class, but I spend much more time at home to really learn the topic more in-depth. The provided videos, cheat sheets and exercises helped me a lot, and even we are not in-class we can always contact our teacher to ask questions.
If you visit the course be sure that you have a strong self-motivation to work after classes in your free time, to increase your knowledge and follow the pace of the class. At Web Courses Bangkok they offer many courses to refresh your web knowledge before the Bootcamp or master skills more in-depth after graduation.
[text-blocks id=”73087″]
One of the students had not used a computer for six years, because she took care of her family. Attempting the Introduction to Web Development course, before she entered the class, helped her to follow along more confidently.
After learning HTML you might wonder why we need CSS as well? Just ask yourself, what do you like about good website design? You may like a certain font, add nice colors, a special layout, stunning animations, and responsive to all devices? That is the reason why you need to learn CSS as well, that your websites do not look like 1995.
Here is what our beloved facebook looks like without any CSSThe Style sheet allows the web designer to control huge websites with only one file because it separates design from content. The current version is CSS3, and we also use Sublime to create it for our project.
The sheet also can target specific tags and change them on all of your pages. For example, your Heading1 should be in Comic Sans, pink, and 36pixels. When you direct your command towards your Heading1 will change no matter if it is on the homepage, about page, or somewhere else.
If you do not want to change it on all pages, there is still the option to individualize your design with a class or id. This will style only the parts of your website which have a specific name.
Understanding the basics it will not take too long after you learned HTML, but it will take time to master it. If you want to create your own effects and animations you need to educate yourself and learn by repeating and failing.
We always learned in class to try it first and if we make a mistake, we will go through it and search for the bug. This will teach the class about the individual mistakes someone did and help to understand them better. It is very hard to just explain general CSS or HTML because every project is different. Sometimes it is better to stick and find the solution by yourself to really understand it.
[text-blocks id=”59324″]
