Web Design Class

WD Class Announcement

ANNOUNCEMENT

 

I have previously posted an announcement to read and study the sections of the handouts..

  • Using The Text Editor
  • Enhancing and Testing your HTML Page

Prepare your for the quiz.


quiztest

  • Follow the QUIZ LINK for a short test
  • Make sure that you put your Nickname and Grade Level (ex. EUGENE 6A) in the quiz. Cannot identified name will be marked as zero.
  • Wait for the Quiz Code to be announced in class by the substitute teacher.

 

 LINKS

Click DOWNLOAD link to view and/or download the handouts presentation. (Note: Presentation pdf is for study purpose)

 

 

 

 

 

Web Design Class

personal crest

WEB DESIGN CLASS

 

LECTURES & HANDOUTS

 

Download the following Lectures:

  1. Web Basics
  2. HyperText Mark-up Language (HTML) Basics
  3. Planning a Website

 PROJECT ASSIGNMENT

DEADLINE: September 18, 2017

Make a simple html-coded 4 pages site with the following elements:

 

  • The web pages are:

    • HOMEPAGE (Index.html)
    • ABOUT ME (page1.html)
    • MY HOBBIES AND  FRIENDS (page2.html)
    • CONTACT ME (page3.html)

  • Four (4) Pages with different background colors

  • Each pages should be linked together using self-designed buttons.

  • Each page should have a minimum of 100 words for any kind of acceptable statements that will reflect the webpage title.

  • Include images, sounds, and/or videos on most of the web pages.

  • Due credit must be  given to links, pictures, videos, etc. of references for your website.

 

 

QUICK HTML  REFERENCE

IMAGES

<img src="your picture.jpg" alt="Mountain View" style="width:304px; height:228px;">

LINKING PAGES

 <a href="yourwebpage.html">Welcome to my website</a>

MP3 / Sounds

<audio controls>
  <source src="yourmusic.mp3" type="audio">
</audio>

Insertion of Youtube Video

Go to www.youtube.com and select the video you like to insert, then look for EMBEDDING codes. Copy and paste the codes on the body section of your HTML webpage.

 

 REFERENCES

guideHTML                guide HTML 5

 

What's Your Say

Web Design Links

 personal crest

WEB DESIGNING

 

ONLINE QUIZ

 


 

LECTURES & HANDOUTS

Download the following Lectures:

  1. Web Basics
  2. HyperText Mark-up Language (HTML) Basics
  3. Planning a Website

 PROJECT ASSIGNMENT

 Follow the LINK HERE

 

QUICK HTML  REFERENCE

IMAGES

<img src="your picture.jpg" alt="Mountain View" style="width:304px; height:228px;">

LINKING PAGES

 <a href="yourwebpage.html">Welcome to my website</a>

MP3 / Sounds

<audio controls>
  <source src="yourmusic.mp3" type="audio/mpeg">
</audio>

Insertion of Youtube Video

Go to www.youtube.com and select the video you like to insert, then look for EMBEDDING codes. Copy and paste the codes on the body section of your HTML webpage.

 REFERENCES

guideHTML                guide HTML 5

 

What's Your Say

Web Design Basics

objective

  1. Understand the format of an HTML Document.
  2. Create your 1st HTML Webpage.
  3. Complete a 4 page simple HTML Personal Website.

 presentation

  1. Class Powerpoint Lecture on Web Design Basics.
  2. Hands-on activity on building your simple html website. Take note of the HTML references below.

 

 LINKS

Click on the DOWNLOAD LINK to view the presentation

 

LABACTIVITY

On your computer, open the NOTEPAD Program and type the following:

HTMLDocformat

  • Change the Mr. GrandPa 13/A to your Nickname and grade level
  • Save it as index.html inside your folder on the computer desktop.

 

quiztest

  • Upon my instruction during classroom time, you will have a quiz.
  • Follow the link: https://quizizz.com/join/
  • Quiz code to be announced.

 

 

INTERESTING HTML TAGS

Marquee

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/marquee

 


 

LECTURES & HANDOUTS

Download the following Lectures:

  1. Web Basics
  2. HyperText Mark-up Language (HTML) Basics
  3. Planning a Website

 

 PROJECT ASSIGNMENT

 Follow the LINK HERE

QUICK HTML  REFERENCE

IMAGES

<img src="your picture.jpg" alt="Mountain View" style="width:304px; height:228px;">

LINKING PAGES

 <a href="yourwebpage.html">Welcome to my website</a>

MP3 / Sounds

<audio controls>
  <source src="yourmusic.mp3" type="audio">
</audio>

Insertion of Youtube Video

Go to www.youtube.com and select the video you like to insert, then look for EMBEDDING codes. Copy and paste the codes on the body section of your HTML webpage.

 REFERENCES

guideHTML                guide HTML 5