SlideShare uma empresa Scribd logo
1 de 12
The Elements
of Design
Color
Lesson Overview
 In   this lesson, you will
      Explore the use of color as it applies to Web
       design
Guiding Question
 How
    does color impact the choices you
 make for the clothes you wear each day?
Color
   The Internet isn’t
    black and white
   Colors can be
    analogous or
    complementary
   Complementary
    colors are colors
    opposite each other
    on the color wheel
Color
 Why   is the choice of color so important?
    Color affects the first impression of your site
    Color sets a level of professionalism for the
     site
    Good choices increase the chance that
     your site will be taken seriously
Color - RGB
 RGB  = Red:Green:Blue
 Numbers represent how much of each
  color was used to make the new color
    Range from white 255:255:255 to black 0:0:0
 Web development enables the designer
 to use these number to produce the
 exact color desired
Color - HEX
 HEX  = Hexadecimal code
 Series of six letters and numbers
     0 – 9 and A – F
     HEX code for white is 000000 and the HEX
      code for black is FFFFFF.
 Most
     Web development software will
 accept either RGB or HEX.
Color Choice Resources
   Color Families
       http://www.colorjack.com/
   Color Codes
       http://www.colorschemer.com/blog/
       http://www.pitt.edu/~nisg/cis/web/cgi/rgb.html
   Use Color Codes to find the Color Family
       http://meyerweb.com/eric/tools/color-blend/
       http://colorblender.com/
       http://www.nickherman.com/colormatch/
       http://www.colorschemer.com/online.html
Color Examples
 Examples   of Bad Font Color Choices
    http://iteslj.org/Articles/Kelly-
     MakePage/samples/bad/badcolors.html
 Examples
         of Good and Bad Uses of Color
 on a Web page
    http://www.2fortoys.net/web_design/color-
     example.htm
W3C
 The World Wide Web Consortium also
  provides guidelines on the use of color
  within a Web site.
 To view two examples of incorrect uses of
  color in a Web site, view the HiSoftware
  Tutorial at the following address
    http://www.contentquality.com/tutorial/c2
     1.htm
Color Assignments
 Discussion    Forum
     Go to the Discussion forum and create a
      thread to answer the following question:
       How   is color used in Web design?
Color Assignments
 Activity
     Locate a Web site on the Internet
       You   can use any type of Web site
       It will be used for design assessment
       As concepts are covered, examine your site
        to note how concepts are used:
          Correctly
          Incorrectly
       Examine    the use of color on the site

Mais conteúdo relacionado

Destaque

Color wheel powerpoint
Color wheel powerpointColor wheel powerpoint
Color wheel powerpointAna
 
The color wheel
The color wheelThe color wheel
The color wheelMyers
 
Elements of interior design
Elements of interior design Elements of interior design
Elements of interior design Sumit Ranjan
 
Color Theory
Color TheoryColor Theory
Color Theoryslhallman
 
Elements and Principles of Design
Elements and Principles of DesignElements and Principles of Design
Elements and Principles of DesignRavi Bhadauria
 
Elements & Principles of Art Design PowerPoint
Elements & Principles of Art Design PowerPointElements & Principles of Art Design PowerPoint
Elements & Principles of Art Design PowerPointemurfield
 
Illusions of space
Illusions of spaceIllusions of space
Illusions of spacemindartpower
 

Destaque (9)

Color wheel powerpoint
Color wheel powerpointColor wheel powerpoint
Color wheel powerpoint
 
The color wheel
The color wheelThe color wheel
The color wheel
 
Elements of interior design
Elements of interior design Elements of interior design
Elements of interior design
 
Elements of Design
Elements of DesignElements of Design
Elements of Design
 
Color Theory
Color TheoryColor Theory
Color Theory
 
Elements and Principles of Design
Elements and Principles of DesignElements and Principles of Design
Elements and Principles of Design
 
Elements & Principles of Art Design PowerPoint
Elements & Principles of Art Design PowerPointElements & Principles of Art Design PowerPoint
Elements & Principles of Art Design PowerPoint
 
Understanding Color
Understanding ColorUnderstanding Color
Understanding Color
 
Illusions of space
Illusions of spaceIllusions of space
Illusions of space
 

Semelhante a The Elements of Design - Color

Web Design - What's Trending in 2021-Mantran Presentation
Web Design - What's Trending in 2021-Mantran PresentationWeb Design - What's Trending in 2021-Mantran Presentation
Web Design - What's Trending in 2021-Mantran PresentationMantran
 
Critique web page design.ppt
Critique  web page design.pptCritique  web page design.ppt
Critique web page design.pptSharmaine Resuma
 
Report web authoring assigment 1
Report   web authoring assigment 1 Report   web authoring assigment 1
Report web authoring assigment 1 haverstockmedia
 
Unsolicited Redesign Visual Inventory
Unsolicited Redesign Visual InventoryUnsolicited Redesign Visual Inventory
Unsolicited Redesign Visual InventoryAmy_em_B
 
Report web authoring assigment 1
Report   web authoring assigment 1 Report   web authoring assigment 1
Report web authoring assigment 1 haverstockmedia
 
Web design - What's Trending in 2021 - Mantran
Web design - What's Trending in 2021 - MantranWeb design - What's Trending in 2021 - Mantran
Web design - What's Trending in 2021 - MantranMantran
 
DIWE - Introduction to Web Technologies
DIWE - Introduction to Web TechnologiesDIWE - Introduction to Web Technologies
DIWE - Introduction to Web TechnologiesRasan Samarasinghe
 
Things to consider when designing websites
Things to consider when designing websitesThings to consider when designing websites
Things to consider when designing websitesNic Finch
 
Assignment 1 guide (W.A)
Assignment 1 guide (W.A)Assignment 1 guide (W.A)
Assignment 1 guide (W.A)haverstockmedia
 
Assignment 1 guide (W.A)
Assignment 1 guide (W.A)Assignment 1 guide (W.A)
Assignment 1 guide (W.A)haverstockmedia
 
Color Modes Meanings and Schemes
Color Modes Meanings and SchemesColor Modes Meanings and Schemes
Color Modes Meanings and SchemesRavi Bhadauria
 
Assignment 1 guide (W.A)
Assignment 1 guide (W.A)Assignment 1 guide (W.A)
Assignment 1 guide (W.A)haverstockmedia
 
Assignment 1 guide (W.A)
Assignment 1 guide (W.A)Assignment 1 guide (W.A)
Assignment 1 guide (W.A)haverstockmedia
 

Semelhante a The Elements of Design - Color (20)

T.3.1.pp
T.3.1.ppT.3.1.pp
T.3.1.pp
 
Web Design - What's Trending in 2021-Mantran Presentation
Web Design - What's Trending in 2021-Mantran PresentationWeb Design - What's Trending in 2021-Mantran Presentation
Web Design - What's Trending in 2021-Mantran Presentation
 
Color schemes
Color schemesColor schemes
Color schemes
 
Critique web page design.ppt
Critique  web page design.pptCritique  web page design.ppt
Critique web page design.ppt
 
Report web authoring assigment 1
Report   web authoring assigment 1 Report   web authoring assigment 1
Report web authoring assigment 1
 
Edon
Edon Edon
Edon
 
Unsolicited Redesign Visual Inventory
Unsolicited Redesign Visual InventoryUnsolicited Redesign Visual Inventory
Unsolicited Redesign Visual Inventory
 
Report web authoring assigment 1
Report   web authoring assigment 1 Report   web authoring assigment 1
Report web authoring assigment 1
 
Web design - What's Trending in 2021 - Mantran
Web design - What's Trending in 2021 - MantranWeb design - What's Trending in 2021 - Mantran
Web design - What's Trending in 2021 - Mantran
 
DIWE - Introduction to Web Technologies
DIWE - Introduction to Web TechnologiesDIWE - Introduction to Web Technologies
DIWE - Introduction to Web Technologies
 
Things to consider when designing websites
Things to consider when designing websitesThings to consider when designing websites
Things to consider when designing websites
 
Assignment 1 guide (W.A)
Assignment 1 guide (W.A)Assignment 1 guide (W.A)
Assignment 1 guide (W.A)
 
Assignment 1 guide (W.A)
Assignment 1 guide (W.A)Assignment 1 guide (W.A)
Assignment 1 guide (W.A)
 
Color Modes Meanings and Schemes
Color Modes Meanings and SchemesColor Modes Meanings and Schemes
Color Modes Meanings and Schemes
 
LO2 - Lesson 13 - Colours & Fonts
LO2 - Lesson 13 - Colours & FontsLO2 - Lesson 13 - Colours & Fonts
LO2 - Lesson 13 - Colours & Fonts
 
Beautiful Web Design
Beautiful Web DesignBeautiful Web Design
Beautiful Web Design
 
Assignment 1 :JJD
Assignment 1 :JJDAssignment 1 :JJD
Assignment 1 :JJD
 
Assignment 1 guide (W.A)
Assignment 1 guide (W.A)Assignment 1 guide (W.A)
Assignment 1 guide (W.A)
 
Assignment 1 guide (W.A)
Assignment 1 guide (W.A)Assignment 1 guide (W.A)
Assignment 1 guide (W.A)
 
Web authoring
Web authoringWeb authoring
Web authoring
 

Mais de 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
 
Creating and Modifying Charts
Creating and Modifying ChartsCreating and Modifying Charts
Creating and Modifying 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
 

Mais de 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
 
Creating and Modifying Charts
Creating and Modifying ChartsCreating and Modifying Charts
Creating and Modifying 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
 

Último

INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxINTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxHumphrey A Beña
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parentsnavabharathschool99
 
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfLike-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfMr Bounab Samir
 
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...Nguyen Thanh Tu Collection
 
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Celine George
 
Judging the Relevance and worth of ideas part 2.pptx
Judging the Relevance  and worth of ideas part 2.pptxJudging the Relevance  and worth of ideas part 2.pptx
Judging the Relevance and worth of ideas part 2.pptxSherlyMaeNeri
 
How to Add Barcode on PDF Report in Odoo 17
How to Add Barcode on PDF Report in Odoo 17How to Add Barcode on PDF Report in Odoo 17
How to Add Barcode on PDF Report in Odoo 17Celine George
 
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYKayeClaireEstoconing
 
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxiammrhaywood
 
How to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPHow to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPCeline George
 
Student Profile Sample - We help schools to connect the data they have, with ...
Student Profile Sample - We help schools to connect the data they have, with ...Student Profile Sample - We help schools to connect the data they have, with ...
Student Profile Sample - We help schools to connect the data they have, with ...Seán Kennedy
 
FILIPINO PSYCHology sikolohiyang pilipino
FILIPINO PSYCHology sikolohiyang pilipinoFILIPINO PSYCHology sikolohiyang pilipino
FILIPINO PSYCHology sikolohiyang pilipinojohnmickonozaleda
 
Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Celine George
 
What is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERPWhat is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERPCeline George
 
THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATION
THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATIONTHEORIES OF ORGANIZATION-PUBLIC ADMINISTRATION
THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATIONHumphrey A Beña
 
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdfInclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdfTechSoup
 
4.16.24 21st Century Movements for Black Lives.pptx
4.16.24 21st Century Movements for Black Lives.pptx4.16.24 21st Century Movements for Black Lives.pptx
4.16.24 21st Century Movements for Black Lives.pptxmary850239
 
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️9953056974 Low Rate Call Girls In Saket, Delhi NCR
 

Último (20)

INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxINTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parents
 
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfLike-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
 
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
 
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
 
Judging the Relevance and worth of ideas part 2.pptx
Judging the Relevance  and worth of ideas part 2.pptxJudging the Relevance  and worth of ideas part 2.pptx
Judging the Relevance and worth of ideas part 2.pptx
 
How to Add Barcode on PDF Report in Odoo 17
How to Add Barcode on PDF Report in Odoo 17How to Add Barcode on PDF Report in Odoo 17
How to Add Barcode on PDF Report in Odoo 17
 
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
 
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
 
How to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPHow to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERP
 
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptxFINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
 
Student Profile Sample - We help schools to connect the data they have, with ...
Student Profile Sample - We help schools to connect the data they have, with ...Student Profile Sample - We help schools to connect the data they have, with ...
Student Profile Sample - We help schools to connect the data they have, with ...
 
FILIPINO PSYCHology sikolohiyang pilipino
FILIPINO PSYCHology sikolohiyang pilipinoFILIPINO PSYCHology sikolohiyang pilipino
FILIPINO PSYCHology sikolohiyang pilipino
 
Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17
 
What is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERPWhat is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERP
 
THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATION
THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATIONTHEORIES OF ORGANIZATION-PUBLIC ADMINISTRATION
THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATION
 
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdfInclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
 
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptxYOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
 
4.16.24 21st Century Movements for Black Lives.pptx
4.16.24 21st Century Movements for Black Lives.pptx4.16.24 21st Century Movements for Black Lives.pptx
4.16.24 21st Century Movements for Black Lives.pptx
 
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
 

The Elements of Design - Color

  • 2. Lesson Overview  In this lesson, you will  Explore the use of color as it applies to Web design
  • 3. Guiding Question  How does color impact the choices you make for the clothes you wear each day?
  • 4. Color  The Internet isn’t black and white  Colors can be analogous or complementary  Complementary colors are colors opposite each other on the color wheel
  • 5. Color  Why is the choice of color so important?  Color affects the first impression of your site  Color sets a level of professionalism for the site  Good choices increase the chance that your site will be taken seriously
  • 6. Color - RGB  RGB = Red:Green:Blue  Numbers represent how much of each color was used to make the new color  Range from white 255:255:255 to black 0:0:0  Web development enables the designer to use these number to produce the exact color desired
  • 7. Color - HEX  HEX = Hexadecimal code  Series of six letters and numbers  0 – 9 and A – F  HEX code for white is 000000 and the HEX code for black is FFFFFF.  Most Web development software will accept either RGB or HEX.
  • 8. Color Choice Resources  Color Families  http://www.colorjack.com/  Color Codes  http://www.colorschemer.com/blog/  http://www.pitt.edu/~nisg/cis/web/cgi/rgb.html  Use Color Codes to find the Color Family  http://meyerweb.com/eric/tools/color-blend/  http://colorblender.com/  http://www.nickherman.com/colormatch/  http://www.colorschemer.com/online.html
  • 9. Color Examples  Examples of Bad Font Color Choices  http://iteslj.org/Articles/Kelly- MakePage/samples/bad/badcolors.html  Examples of Good and Bad Uses of Color on a Web page  http://www.2fortoys.net/web_design/color- example.htm
  • 10. W3C  The World Wide Web Consortium also provides guidelines on the use of color within a Web site.  To view two examples of incorrect uses of color in a Web site, view the HiSoftware Tutorial at the following address  http://www.contentquality.com/tutorial/c2 1.htm
  • 11. Color Assignments  Discussion Forum  Go to the Discussion forum and create a thread to answer the following question:  How is color used in Web design?
  • 12. Color Assignments  Activity  Locate a Web site on the Internet  You can use any type of Web site  It will be used for design assessment  As concepts are covered, examine your site to note how concepts are used:  Correctly  Incorrectly  Examine the use of color on the site

Notas do Editor

  1. Lesson 3 Overview
  2. Use the guiding question as a class starter, allowing the students time to answer the question in their journal. Discuss student answers to the question.
  3. Many of us are concerned with how the colors in our clothes go together as we get dressed each morning. A Web designer should also be concerned with how the colors in a site go together. Putting some thought into this process can help with the design of the site. Since most people using the Internet are not interested in looking at sites that have only a white background and black font, the Web designer must choose colors to use for the site. When choosing colors for a Web site, a designer should remember to choose colors that create a contrast with each other. This contrast makes the information easy to see on the site. Use a color wheel to find complementary colors. Complementary colors are those that are opposite each other on the color wheel.
  4. The colors that you choose to use on your Web site will make the first impression of your site and the authority of the site. If you make poor choices in your colors, then your site might not be taken seriously. So how can you get some help in making the right choices in choosing colors for your Web site? There are many Web sites on the Internet that were created for this purpose.
  5. When using the Internet to search for color choices, you will encounter two codes. The first of these codes is an RGB code. RGB stands for red, green, and blue. Each letter will have a number value to designate how much of each color (red, green, and blue) were used to make the color. The numeric values range from 0 to 255. The RGB value for white is 255:255:255 because white is the mixture of all the colors. Black on the other hand would be 0:0:0 because it is the absence of all color. You will be able to use these numbers to ensure you are getting the exact color that you want for your site. Your Web development software will have a place for you to enter these numbers.
  6. Another designation for color that you will encounter is the HEX code or Hexadecimal code. This code is similar to the RGB system but uses a series of six letters and numbers to identify the colors. This code uses the number 0–9 and the letters A–F to identify colors. For example, the HEX code for white is 000000 and the HEX code for black is FFFFF. In most Web development software, you can use either the RGB or HEX code to ensure the proper colors.
  7. Now it is time to make some choices. Look through the following Web sites and make some choices for the family of color that you want to use in creating your own Web site.
  8. Show students how the choices of text color and background color can affect the way a Web page looks using the “Examples of Bad Font Color Choices” Web page at http://iteslj.org/Articles/Kelly-MakePage/samples/bad/badcolors.html. This page allows the user to change the background color of the page to see how different font colors appear against the chosen background color. To show students an example of the good and bad use of color in a Web page, use http://www.2fortoys.net/web_design/color-example.htm. At the bottom of this Web page, you can switch to how the Web page might look if better colors are chosen for the same site.
  9. Discuss the assignment as listed above.