Let’s Code!

Everything start with couple words…

Hello Word !!!

Watch the video:


Read the lesson: 

( Please feel free anytime to raise your hand and ask for help to Ms. P )

So you are wondering “Does this weird combination of letters, brackets and numbers have any meaning?”

Well the answer is “Yes” and this is how it goes:

First of all you need to learn that in HTML you always have to open the code with < and close it with /> to make it work in internet and that there are some structures that you have to respect to allows the browsers understand what you wants to complete.

Here are some examples:   


< em > < /em > (italics)

< strong > < /strong > (bold)

< a > < /a > (hyperlink)

< img > (image)

< br > (adds a line break)

< hr > (adds a horizontal line)

& nbsp ; (adds a single space)

& copy ; (adds a copyright symbol)

Let’s learn about HTML Color Codes format:

Just like when you’re using the color picker tool in  PHOTOSHOP, here in HTML you are going to use the same numbers and letters to describe colors.  – This is exactly the same!

Each HTML code contains symbol “#” and 6 letters or numbers.(#FF0000) These numbers are in hexadecimal numeral system. For example “FF” in hexadecimal represents number 255 in Decimal.

Meaning of symbols:

  • The first two symbols in HTML color code represents the intensity of red color.
  • 00 is the least and FF is the most intense.
  • The third and fourth represents intensity of green and fifth and sixth represents the intensity of blue. So with combining the intensity of red, green and blue we can mix almost any color that our heart desire;)

#FF0000 – With this HTML code we tell browser to show maximum of red and no green and no blue. The result is of course pure red color.

#00FF00 – This HTML code shows just green and no red and blue.

#0000FF – This HTML code shows just blue and no red and green.

#FFFF00 – Combination of red and green color gives us yellow.

#CCEEFF – Take some red a bit more of green and maximum of blue to get color of sky.

Click the image to get an amazing color codes tool   ツ  ➙htlmcolor

Watch next video:


You are about to start  HTML AND CSS!
(Talk to your instructor if you have previous knowledge.)


Open your BRACKETS Program to start coding, look for it on your iMac, clicking on “FINDER” and then on “APPLICATIONS”.

BRACKETS’ icon looks like this:


The textbook that I have chosen for this part of the program provides thorough instruction on building interactive Web sites from scratch. In addition to providing comprehensive coverage of HTML and CSS, this book does not require any prior knowledge on the subject and starts with the basics.

Detailed explanations of key concepts and skills make even complex topics accessible to all students.  New Perspectives’ signature case scenarios and case problems contextualize complex concepts.

You will develop your problem solving skills by working through realistic exercises, which help you retain the material and apply what you’ve learned in a professional environment.

Find a HTML and CSS 6th Edition Book in the classroom book shelf.


In the the book named

“HTML and CSS6th Edition by  Carey, start your lessons in the page HTML 12 but only doing the Dark-Yellow areas.  

↑ ↑ ↑ – Click on the picture (above) to find related files or go to the back cover of the book to find the instructions to download the files you will need for this course.

Here’s another option for you to get HTML files but please be careful to organize chapters in separate folders on your desktop in order to avoid future confusion.

Chapter 1 Chapter 2 Chapter 3 Chapter 4 Chapter 5
Chapter 6 Chapter 7 Chapter 8 Chapter 9 Chapter 10

You only have 2 weeks to do this part of the program so, please do not waste your time doing anything different than your class framework.

NEXT: Once you have the book done:

Log in to www.codecademy.com and sign up to start coding!

Click Codecademy Icon below and start with:
HTML, UNIT 1: Introduction to HTML, follow the HTML course and return to this website once you’ve finish it.

Show your progressions to your instructor.  (Mandatory).


Watch at least the first 45 minutes of next video in fullscreen and High Definition to reinforce your HTML knowledge.

You will be watching things like “parents, children and grandchildren” of the document and it may sound weird to you but it’s better to understand this topic “now” with HTML than in the future while you are learning other script languages.

Anyway  you could always come back for a refresher.

Remember: By repeating lessons, learning becomes easier but better when we use different environments. HTML is the foundation of script languages.

These exercises will help you understand better when you are dealing with more elaborate script languages. Think you are now learning to read and write so, good bases that you plant today  are the ones that will define how good CODER you will become in the future. (better now than struggling later…)