Introduction to CSC110

Download Report

Transcript Introduction to CSC110

CSW 131 – Supplement 1
HTML / CSS - Some Not Covered or in Textbook
Prepared by Prof. Battilana
1
Favorites Icon [Cool Notice] (NOT IN BOOK / COVERED)
 You can create and use your own favorites icon, which will appear next
to the URL in the address window, in favorites, etc. Small files in .gif.,
.jpg, .png, or .ico should work, but the best / most reliable is a .ico file.
You can create your own image, then easily convert it to .ico format.
 Go to http://tools.dynamicdrive.com/favicon/, then click browse and
select favicon.png from your class_work images folder.
 Click Create Icon, then click Download FavIcon and place it in your
class_work images folder.
 Open $default.html, and on a new line before the </head> tag type:
<link rel="shortcut icon" href="images/favicon.ico"
type="image/x-icon" /> [link to favicon (on one line)]
 Save as favorite_icon.html then view it in a IE, Chrome, & FF browsers.
To REALLY test this, upload this and icon files to the WCU server.
 Other file types and required “type”:
favicon.gif requires type="image/gif"
favicon.jpg requires type="image/jpg"
favicon.png requires type="image/png"
2
Safe Color Shorthand (NOT IN BOOK / COVERED)
 Remember the use of the Web Safe Palette is still common. It is made
up of 216 colors, using 6 shades of three primaries using 00, 33, 99,
CC, FF.
 Color safe shorthand can be used accordingly:
 Drop duplicates in pairs
e.g., #000066 becomes #006; #990000 becomes #900; and
#33FFCC becomes #3FC
 Conversely, you can add the 3 digits back to a shorthand color to look
up the actual hexadecimal (6-digit) color.
3
Some 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 browsers
for better testing:




 Chrome
 FF
 IE
 Safari
 Opera
Upload files (WinSCP)
Project Requirements
View code in browsers
Course Hot! page
4