Saturday, September 17, 2016

Hexadecimal Color Coding and Fonts

Hexadecimal Color 

Hexadecimal color coding is a way to display color in HTML. It is represented by #RRGGBB; the R representing red, the G representing green, and the B representing blue. Hexadecimal has a base of 16 digits, which range from 0-9 and A-F. The letters are higher than the numbers, so F is like a 16. The higher the number/ letter, the lighter the color will appear and vice versa.

 We incorporated our web design knowledge with our knowledge of the hexadecimal color coding to create a webpage. Looking at the HTML coding, you can see that the body has a lot of similar looking coding. But you can see that each is a different color with a different hexadecimal color code. We started off by doing the rainbow. For example, to create red you make the RR part the highest, which is FF, and leave the rest as zeros. Then we made a lighter color/pastel section. To create the lighter colors, we made the colors less vibrant. To do this, for example, the color red: You keep the RR turned up all of the way but make the other spaces in between dark and light by making them eights. Lastly, we made a section of "colorless colors." Black is the lowest number (#000000) and white is the highest (#FFFFFF), so to create gray, you meet half way. Gray would be #888888.The hexadecimal color coding does not always have six digits. If there is a color that has the same digit in each place, it can be shortened to just three digits. For example, #FF0000 can be shortened to #F00.

 This is what the Hexadecimal webpage looks like.


In addition to creating the hexadecimal page, we made a font page as well. We first learned the eight core web fonts. Some of which are serif fonts which means they have little 'lines' or feet at the end of them, while some are sanserif which means they do not. The serif fonts include:
  • Times New Roman
  • Georgia
  • Courier
The sanserif fonts include:
  • Arial
  • Verdana
  • Tahoma
  • Trebuchet
  • Comic Sans, which is a very controversial font. Many people hate it because it is commonly misused, disproportionate, and is overused.

After being educated on these fonts, we used created a webpage for it. We included the eight core web fonts by doing the same thing as creating the color page instead with fonts. We created a div style and set the font family to whatever the font was. We then typed: The quick brown fox jumps over the lazy dog. We typed this to display the letters of the alphabet because this simple sentence includes all of the letters in the alphabet.



    This is what the font webpage looks like

No comments:

Post a Comment