Skip to main content

Web Design and New Media (Week 7)

12/10/2017 (Week 7)
Liam Yue Wei (0327686)
Web Design & New Media
HTML and CSS (Box Model)


Lecture

During the class, we learned how to make the logo, and the navigation on top of the website, using both HTML and CSS. It is said that there are 4 different states of hyperlink, such as a:link, a:hover, a:active, and a:visited.  When we want to style the navigation, we have to type: 

#mainnav li a:link{
}

There is a proper sequence of styling the navigation, which is in the order of: 
a:link, a:visited
a:visited
a:hover, a:active
a:active 

Also, if we want the link (font size/family) to be the same as the paragraph then don't put font size/family in the link element. Because we have already chosen the font style for the paragraph. 

There are tons of other styles that we can use in HTML. For example: 
border-radius: xxpx;
height: fix;
min-height: 30px;

We can even use overflow, hidden, scroll and auto to change the display of the website. 

Instructions

In the class, we tried to add logo and navigation in our own HTML file, while making the logo and the navigation to be aligned on the same section.

Tutorial

In order to make the logo and navigation to be on same section, we had to add:
display: inline-block; 
             or
float: left;
margin-left: 30px;

Submission
Google Drive link : https://drive.google.com/open?id=0B69


Feedback

-No feedback given yet-

Reflection

Experience

I did realize that it was getting slightly confusing in the class as we go, I think I am still not used to HTML and CSS, knowing that I still don't truly understand the content about them. 

Observation

I noticed that some books about HTML and CSS didn't explain the way I want to learn about them. So I might as well borrow another book from library so that I can compare the information given inside, and most probably will be able to learn more about them. 


Findings

I believe that I need to explore myself more to HTML such as practicing and looking it up online so that I can get used to them, and be more confident in my coding. 

Comments

Popular posts from this blog

Compositing and Special Effects - Lectures and Tutorials

26/03/2018 - 30/03/2018 (Week 1) Liam Yue Wei (0327686) Compositing and Special Effects Introduction to Compositing and Special Effect Lecture Week 1  26/03/2018 (Monday)  Mr.Kannan and Mr.Martin started off by briefing us on the module assignments.  Project 1: Opening title sequence  Settings for Adobe After Effects  - 30 secs 1080p full HD - H2. 64, MPEG - Audio: 44.100kHz Stereo - QuickTime H2.64 In compositing and special effects, there are few things to pay attention to: 1. images 2. color sceheme 3. music 4. 3D modeling (free from web, but have to give credits)  Project 2: Matte Painting - The initial stage of the projects is to make thumbnails and storyboards, these need to be simple, nice and believable.  - We were told that to it is hard to master matte painting and it needs a lot of time.  Final project: Motion Graphic - We have to look for music with nice beats.  - Tons of exper...

Week 12-Week 13

20 June 2017 - 4 July2017 (Week 12 - Week 13) Liam Yue Wei (0327686) Typography & Hypertextuality Final Project : Kinetic Typography Lecture Week 12 (No lecture was conducted) Week 13 (No lecture was conducted) Instruction Final Project & Portfolio 40%  The Brief  Kinetic Typography Duration of Assignment  3 Weeks (Briefing on Week 10) DEADLINE  Week 13 (27 Jun 2017) Description  In this Final Project you may use the font you designed in the previous project and give voice to it. You will be required to choose a statement / poem / quote / dialog / etc. that is suitable to the character and personality of your font. You will design a static and animated Poster. “Kinetic typography—the technical name for "moving text"—is an animation technique mixing motion and text to express ideas using video animation. This text is presented over time in a manner intended to convey or evoke a particular idea or emotion.” (http...

Web Design & New Media - Final Project

31/10/2017 (Week 9) Liam Yue Wei (0327686) Web Design & New Media Final Project Lecture -No lecture- Instruction You’re required to create an interactive storytelling Website that to inform a specific target audience on a given topic. The target audience is for children between 6-12 years old. You may use images and video from the internet or you can illustrate to make the content even more interesting. Below are the content that you need to include in the Website. You need to create a storyboard/site structure so that it is easier for you to plan the page and the flow of the Website. You may include sounds or use Adobe Animate to have a whole new experience of interactive Website. What to do in a fire (This will be the title of the Website) Introduction Fire drills are a big part of being safe in school: They prepare you for what you need to do in case of a fire. But what if there was a fire where you live? Would you know what to do? Talking about fires can...