Exercise 01 - Web Development

Assignemnts

Create about page and progrees of the week - Publish, modify and re-publish several times the page
Sketch of your final project

Setup Developer Environment

Fablab O Gitlab Account

Please provide us your full name and email address.

Defines roles of HTML, CSS and Java Script

HTML

Hyper Text Markup Language
Defines the structure of a webpage

Put an image here
Put a text here

The "nouns" of a webpage

CSS

Cascading Style Sheets
Define the style of HTML

Make all text green
Give the first image a yellow border

The “adjectives” of a webpage

Java Script

Adds Logic and interactivity to a page
Do some math

Change colour when the user clicks

The action or “verbs” of a webpage

Write a proper structured HTML document

            <!DOCTYPE html>
            <div class="html">
                <html>
                <head><title>Title</title></head>
                <body>
                    <p>Unrendred html</p>
                </body>
                </html>
            </div>

Write common closing and self closing tags

            <h1>I need a closing tag</h1>
            <p>I need a closing tag</p>

The General Rule of HTML

            <tagName>Some Content</tagName>

Comments

            <!-- This is a comment. It does do anything! -->

Images

            <img src="pictureName.png">

Useful Links:

w3schools.com

How to

If you would like to use Marcello HTML and CSS template, the following is the reference.

Write your content in between of:

            <!-- Insert your content here below! -->
            
            INSERT YOUR CONTENT HERE
            
            <!-- End of your content -->

Write common closing and self closing tags

Code:

            <h1>I need a closing tag</h1>
            <h2>I need a closing tag</h2>
            <h3>I need a closing tag</h3>
            <h4>I need a closing tag</h4>

Result:

I need a closing tag

Code:

            <p>
            In Harry’s world fate works not 
            only through powers and objects such as
            prophecies, the Sorting Hat, wands, and 
            the Goblet of Fire, but also through 
            people. Repeatedly, other characters 
            decide Harry’s future for him, depriving him
            of freedom and choice. For example, 
            before his eleventh birthday, the Dursleys
            control Harry’s life, keeping from 
            him knowledge of his past and understanding
            of his identity (Sorcerer’s 49). In
            Harry Potter and the Chamber of Secrets, 
            Dobby repeatedly assumes control over 
            events by intercepting Ron’s and Hermione’s
            letters during the summer; by sealing
            the barrier to Platform 93⁄4, causing Harry
            to miss the Hogwarts Express; and by 
            sending a Bludger after Harry in a Quidditch
            match, breaking his wrist. Yet again,
            in Harry Potter and the Prisoner of Azkaban,
            many adults intercede while attempting 
            to protect Harry from perceived danger, 
            as Snape observes: “Everyone from the
            Minister of Magic downward has been trying
            to keep famous Harry Potter safe from
            Sirius Black” (284). All these characters, 
            as enactors of fate, unknowingly drive 
            Harry toward his destiny by attempting 
            to control or to direct his life, while 
            themselves controlled and directed 
            by fate.

            —Julia Pond, “A Story of the Exceptional: Fate and 
            Free Will in the Harry Potter Series”
            </p>

Result:

In Harry’s world fate works not only through powers and objects such as prophecies, the Sorting Hat, wands, and the Goblet of Fire, but also through people. Repeatedly, other characters decide Harry’s future for him, depriving him of freedom and choice. For example, before his eleventh birthday, the Dursleys control Harry’s life, keeping from him knowledge of his past and understanding of his identity (Sorcerer’s 49). In Harry Potter and the Chamber of Secrets, Dobby repeatedly assumes control over events by intercepting Ron’s and Hermione’s letters during the summer; by sealing the barrier to Platform 93⁄4, causing Harry to miss the Hogwarts Express; and by sending a Bludger after Harry in a Quidditch match, breaking his wrist. Yet again, in Harry Potter and the Prisoner of Azkaban, many adults intercede while attempting to protect Harry from perceived danger, as Snape observes: “Everyone from the Minister of Magic downward has been trying to keep famous Harry Potter safe from Sirius Black” (284). All these characters, as enactors of fate, unknowingly drive Harry toward his destiny by attempting to control or to direct his life, while themselves controlled and directed by fate. —Julia Pond, “A Story of the Exceptional: Fate and Free Will in the Harry Potter Series”

Code:

            <ul>
                <li>one</li>
                <li>two</li>
            </ul>
            
            <img src="images/profilePicture.PNG" class="imgCenter">

Result:

Code:


            <img src="images/profilePicture.PNG" class="imgCenter">

Result:

Code:


            <a href="" download="">
                <p>Download</p>
            </a>

Result:

Download