SlideShare a Scribd company logo
1 of 7
More Basic HTML Module 2: HTML Basics, Lesson 2
Guiding Questions What colors do you like to see when viewing a web page? How can a choice of color affect the message on a Web page? What is text alignment and what are some examples of it? (You will respond to these questions in the discussion forums)
Coloring the Web Color choice can be crucial to conveying your message and engaging your audience Colors affect our decisions everyday… without ever realizing it! Web colors can be defined three ways: Color Name (i.e. Black; 16 choices) Hexadecimal code (#000000) RGB code (0, 0, 0)
Defining Colors Hexadecimal Color Chart Visibone Hexadecimal Color Chart - 216 Web Safe Color Chart (Hexadecimal and RGB)  Color Names and Hexadecimal Code RGB, Hexadecimal and Color Names RGB, Hexadecimal and Color Names Each is a link to an online resource
Background Color Background color is defined using an attribute Attributes define the way a tag should be marked up The background color attribute is “bgcolor” <body bgcolor=“black”> This code would change the background color for the page to black
Text Alignment As with any word processing program, you can choose to align the text on a page in three ways Left Center Right By default, text will be aligned to the left margin of a web page
Horizontal Rules A horizontal rule is a line that spans the width of a web page element Created using the <hr> tag Attributes can be defined to change the default line Width can be defined as a percentage Size is defined with an integer Color is defined by a code Ex: <hr width=“90%” size=“5” color=“#000000”>

More Related Content

Similar to Lesson 2 - More Basic HTML

Module 2 Lesson 2
Module 2 Lesson 2Module 2 Lesson 2
Module 2 Lesson 2claytors
 
Colorful Twitterbots
Colorful TwitterbotsColorful Twitterbots
Colorful TwitterbotsTony Veale
 
The Elements of Design - Color
The Elements of Design - ColorThe Elements of Design - Color
The Elements of Design - Colorcoachhahn
 
Handout2 formatting tags
Handout2 formatting tagsHandout2 formatting tags
Handout2 formatting tagsNadine Guevarra
 
Lecture 2-2023.pdf
Lecture 2-2023.pdfLecture 2-2023.pdf
Lecture 2-2023.pdfssuserff72e4
 
Lecture 2-2023.pdf
Lecture 2-2023.pdfLecture 2-2023.pdf
Lecture 2-2023.pdfssuserff72e4
 
Bootcamp - Web Development Session 4
 Bootcamp - Web Development Session 4 Bootcamp - Web Development Session 4
Bootcamp - Web Development Session 4GDSCUniversitasMatan
 
Web Development 2 (HTML & CSS)
Web Development 2 (HTML & CSS)Web Development 2 (HTML & CSS)
Web Development 2 (HTML & CSS)ghayour abbas
 

Similar to Lesson 2 - More Basic HTML (9)

Module 2 Lesson 2
Module 2 Lesson 2Module 2 Lesson 2
Module 2 Lesson 2
 
Colorful Twitterbots
Colorful TwitterbotsColorful Twitterbots
Colorful Twitterbots
 
The Elements of Design - Color
The Elements of Design - ColorThe Elements of Design - Color
The Elements of Design - Color
 
T.3.1.pp
T.3.1.ppT.3.1.pp
T.3.1.pp
 
Handout2 formatting tags
Handout2 formatting tagsHandout2 formatting tags
Handout2 formatting tags
 
Lecture 2-2023.pdf
Lecture 2-2023.pdfLecture 2-2023.pdf
Lecture 2-2023.pdf
 
Lecture 2-2023.pdf
Lecture 2-2023.pdfLecture 2-2023.pdf
Lecture 2-2023.pdf
 
Bootcamp - Web Development Session 4
 Bootcamp - Web Development Session 4 Bootcamp - Web Development Session 4
Bootcamp - Web Development Session 4
 
Web Development 2 (HTML & CSS)
Web Development 2 (HTML & CSS)Web Development 2 (HTML & CSS)
Web Development 2 (HTML & CSS)
 

More from coachhahn

THe Evolution of Web Design
THe Evolution of Web DesignTHe Evolution of Web Design
THe Evolution of Web Designcoachhahn
 
Illustrations
IllustrationsIllustrations
Illustrationscoachhahn
 
Formatting Charts
Formatting ChartsFormatting Charts
Formatting Chartscoachhahn
 
Communications & Networks
Communications & NetworksCommunications & Networks
Communications & Networkscoachhahn
 
Communications & Networks
Communications & NetworksCommunications & Networks
Communications & Networkscoachhahn
 
Communications and Networks
Communications and NetworksCommunications and Networks
Communications and Networkscoachhahn
 
Format and Modify Text and Display and Print Formulas
Format and Modify Text and Display and Print FormulasFormat and Modify Text and Display and Print Formulas
Format and Modify Text and Display and Print Formulascoachhahn
 
Summarize Data Using a Formula
Summarize Data Using a FormulaSummarize Data Using a Formula
Summarize Data Using a Formulacoachhahn
 
Reference Data in Formulas
Reference Data in FormulasReference Data in Formulas
Reference Data in Formulascoachhahn
 
Impact of Images
Impact of ImagesImpact of Images
Impact of Imagescoachhahn
 
Format as a Table
Format as a TableFormat as a Table
Format as a Tablecoachhahn
 
Repetition and Unity
Repetition and UnityRepetition and Unity
Repetition and Unitycoachhahn
 
Formatting Cells
Formatting CellsFormatting Cells
Formatting Cellscoachhahn
 
Balance & Proximity
Balance & ProximityBalance & Proximity
Balance & Proximitycoachhahn
 
Rows and Columns
Rows and ColumnsRows and Columns
Rows and Columnscoachhahn
 
Formatting Worksheets
Formatting WorksheetsFormatting Worksheets
Formatting Worksheetscoachhahn
 
The Elements of Design - Texture and Typography
The Elements of Design - Texture and TypographyThe Elements of Design - Texture and Typography
The Elements of Design - Texture and Typographycoachhahn
 

More from coachhahn (20)

THe Evolution of Web Design
THe Evolution of Web DesignTHe Evolution of Web Design
THe Evolution of Web Design
 
Illustrations
IllustrationsIllustrations
Illustrations
 
Formatting Charts
Formatting ChartsFormatting Charts
Formatting Charts
 
Communications & Networks
Communications & NetworksCommunications & Networks
Communications & Networks
 
Communications & Networks
Communications & NetworksCommunications & Networks
Communications & Networks
 
Communications and Networks
Communications and NetworksCommunications and Networks
Communications and Networks
 
Format and Modify Text and Display and Print Formulas
Format and Modify Text and Display and Print FormulasFormat and Modify Text and Display and Print Formulas
Format and Modify Text and Display and Print Formulas
 
Banners
BannersBanners
Banners
 
Logos
LogosLogos
Logos
 
Summarize Data Using a Formula
Summarize Data Using a FormulaSummarize Data Using a Formula
Summarize Data Using a Formula
 
Reference Data in Formulas
Reference Data in FormulasReference Data in Formulas
Reference Data in Formulas
 
Impact of Images
Impact of ImagesImpact of Images
Impact of Images
 
Format as a Table
Format as a TableFormat as a Table
Format as a Table
 
Repetition and Unity
Repetition and UnityRepetition and Unity
Repetition and Unity
 
Formatting Cells
Formatting CellsFormatting Cells
Formatting Cells
 
Balance & Proximity
Balance & ProximityBalance & Proximity
Balance & Proximity
 
Rows and Columns
Rows and ColumnsRows and Columns
Rows and Columns
 
Movement
MovementMovement
Movement
 
Formatting Worksheets
Formatting WorksheetsFormatting Worksheets
Formatting Worksheets
 
The Elements of Design - Texture and Typography
The Elements of Design - Texture and TypographyThe Elements of Design - Texture and Typography
The Elements of Design - Texture and Typography
 

Recently uploaded

How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17Celine George
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxEsquimalt MFRC
 
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdfUnit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdfDr Vijay Vishwakarma
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...Nguyen Thanh Tu Collection
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...Poonam Aher Patil
 
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptxSKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptxAmanpreet Kaur
 
How to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSHow to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSCeline George
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfAdmir Softic
 
Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and ModificationsMJDuyan
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfSherif Taha
 
Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxDr. Sarita Anand
 
Spellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please PractiseSpellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please PractiseAnaAcapella
 
Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Association for Project Management
 
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...Nguyen Thanh Tu Collection
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxJisc
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentationcamerronhm
 
Fostering Friendships - Enhancing Social Bonds in the Classroom
Fostering Friendships - Enhancing Social Bonds  in the ClassroomFostering Friendships - Enhancing Social Bonds  in the Classroom
Fostering Friendships - Enhancing Social Bonds in the ClassroomPooky Knightsmith
 
Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Jisc
 
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...pradhanghanshyam7136
 
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...Pooja Bhuva
 

Recently uploaded (20)

How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
 
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdfUnit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdf
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...
 
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptxSKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
 
How to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSHow to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POS
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdf
 
Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and Modifications
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdf
 
Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptx
 
Spellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please PractiseSpellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please Practise
 
Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...
 
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptx
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentation
 
Fostering Friendships - Enhancing Social Bonds in the Classroom
Fostering Friendships - Enhancing Social Bonds  in the ClassroomFostering Friendships - Enhancing Social Bonds  in the Classroom
Fostering Friendships - Enhancing Social Bonds in the Classroom
 
Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)
 
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
 
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
 

Lesson 2 - More Basic HTML

  • 1. More Basic HTML Module 2: HTML Basics, Lesson 2
  • 2. Guiding Questions What colors do you like to see when viewing a web page? How can a choice of color affect the message on a Web page? What is text alignment and what are some examples of it? (You will respond to these questions in the discussion forums)
  • 3. Coloring the Web Color choice can be crucial to conveying your message and engaging your audience Colors affect our decisions everyday… without ever realizing it! Web colors can be defined three ways: Color Name (i.e. Black; 16 choices) Hexadecimal code (#000000) RGB code (0, 0, 0)
  • 4. Defining Colors Hexadecimal Color Chart Visibone Hexadecimal Color Chart - 216 Web Safe Color Chart (Hexadecimal and RGB) Color Names and Hexadecimal Code RGB, Hexadecimal and Color Names RGB, Hexadecimal and Color Names Each is a link to an online resource
  • 5. Background Color Background color is defined using an attribute Attributes define the way a tag should be marked up The background color attribute is “bgcolor” <body bgcolor=“black”> This code would change the background color for the page to black
  • 6. Text Alignment As with any word processing program, you can choose to align the text on a page in three ways Left Center Right By default, text will be aligned to the left margin of a web page
  • 7. Horizontal Rules A horizontal rule is a line that spans the width of a web page element Created using the <hr> tag Attributes can be defined to change the default line Width can be defined as a percentage Size is defined with an integer Color is defined by a code Ex: <hr width=“90%” size=“5” color=“#000000”>