Upload
olwen
View
19
Download
0
Embed Size (px)
DESCRIPTION
CSW 131 – Supplement 1 HTML / CSS - Some Not Covered or in Textbook. Prepared by Prof. Battilana. Favorites Icon [Cool Notice] (NOT IN BOOK / COVERED). - PowerPoint PPT Presentation
Citation preview
CSW
1 31
Ste v
e n
Bat t
ilana
1
CSW 131 – Supplement 1CSW 131 – Supplement 1HTML / CSS - Some Not Covered or in HTML / CSS - Some Not Covered or in
TextbookTextbook
Prepared by Prof. BattilanaPrepared by Prof. Battilana
CSW
131
Ste v
e n
Bat t
ilana
2
Favorites Icon [Cool Notice] Favorites Icon [Cool Notice] (NOT IN BOOK / COVERED)(NOT IN BOOK / COVERED)
You can create and use your own You can create and use your own favorites iconfavorites icon, which will appear , which will appear next to the URL in the address window, in favorites, etc. Small files next to the URL in the address window, in favorites, etc. Small files in in .gif.gif., ., .jpg.jpg, , .png.png, or , or .ico.ico should work, but should work, but the best / most reliable is the best / most reliable is a .ico filea .ico file. You can . You can create your own image, then easily convert it create your own image, then easily convert it to .ico formatto .ico format..
Go to Go to http://tools.dynamicdrive.com/favicon/, then click browse and , then click browse and select select favicon.pngfavicon.png from your class_work images folder. from your class_work images folder.
Click Click Create IconCreate Icon, then click , then click Download FavIcon Download FavIcon and and place it in your place it in your class_work images folderclass_work images folder..
Open Open default.htmldefault.html, and on a new line before the , and on a new line before the </head> </head> tag type:tag type:<link rel="shortcut icon" href="images/favicon.ico" type="image/x-<link rel="shortcut icon" href="images/favicon.ico" type="image/x-
icon" /> icon" /> [link to favicon (on one line)][link to favicon (on one line)] Save as Save as favorite_icon.html then favorite_icon.html then view it in a IE, Chrome, & FF view it in a IE, Chrome, & FF
browsers.browsers. Other file types and required “type”: Other file types and required “type”:
favicon.gif favicon.gif requires requires type="image/gif"type="image/gif"favicon.jpg favicon.jpg requiresrequires type="image/jpg" type="image/jpg"favicon.png favicon.png requiresrequires type="image/png" type="image/png"
CSW
131
Ste v
e n
Bat t
ilana
3
Safe Color Shorthand Safe Color Shorthand (NOT IN BOOK / COVERED)(NOT IN BOOK / COVERED)
Remember the use of the Remember the use of the Web Safe Palette Web Safe Palette is still common. is still common. It is made up of 216 colors, using 6 shades of three It is made up of 216 colors, using 6 shades of three primaries using primaries using 0000, , 3333, , 9999, , CCCC, , FFFF. .
Color safe shorthand can be used accordingly:Color safe shorthand can be used accordingly: Drop duplicates in pairs
e.g., #000066 becomes #006; #990000 becomes #900; and#33FFCC becomes #3FC
ConverselyConversely, you can add the 3 digits back to a shorthand , you can add the 3 digits back to a shorthand color to look up the actual hexadecimal (6-digit) color.color to look up the actual hexadecimal (6-digit) color.
CSW
131
Ste v
e n
Bat t
ilana
4
Some Key Class LinksSome Key Class Links Default Web Page Lipsum Filler Text HTML Validator CSS Validator Browsers Test Escape Characters Quirks/Bugs 1 2 Adobe Kuler Colorblind Access Color Schemer Extended Colors
Clearing browsersfor better testing:Chrome FF IESafariOpera
Upload files (WinSCP)
Project Requirements
View code in browsers
Course Hot! page