1. Welcome to BCC’s Photoshop 1 Instructor / Revered Master / Fearless Leader John Herring

2. Things you’ll need to know... Schedule Five meetings, 3 hours each. Total: 15 hours. June / July 2008 SMTWTFS 22232425262728 2930JULY 12345 6789101112 13141516171819 20212223242526 Mondays 6:30 pm - 9:30 pm Usually one break, halfway through.

3. How to reach me by e-mail: jhherring@yahoo.com Please place “BCC Student” in subject line. Class Web Site http: / / johnherring.net / bcc You’ll be visiting this address, and related addresses, frequently. Changes / announcements / files / resources will appear on the class web site...

4. The best design tools ever invented... Pencil and paper Good Supplies

5. USB key 1 GB < $10 2 GB < $15 4 GB < $25 Necessary Supplies Brands: SanDisk, Kingston, PNY Vendors: CompUSA, BestBuy, BrandsMart, Target, Staples, Office Depot, Amazon.com

6. A free e-mail account. It’s best to use one of these, instead of a BellSouth or AOL account, and I’ll help you get one. Required Supplies YahooUnlimited Gmail6.8 GB MSN / Hotmail5 GB

7. The General Idea

8. To learn to create web pages...  Write code according to simple rules. Create basic page with text. Revise the page by editing the text.  Add images to web pages.  Add links to other pages and other sites.  Arrange text and images on the page. Change the arrangement to improve it. Make changes to the arrangement, or some part of it, and re-publish.  Publish the whole thing to the web. 

9. Creating Web Pages

10. Creating Web Pages and Web Sites and Putting them on the Net Welcome to my Web Site! Hello! Welcome to my Web Site! Hello!

11. Welcome! Hello! Creating Web Pages and Web Sites and Putting them on the Net Welcome! Hello! Welcome! Hello!

12. Go to Home Page Creating Web Pages and Web Sites and Putting them on the Net Go to Blue Page Go to Yahoo

13. Putting Web Pages on the Net

14. Creating Web Pages and Web Sites and Putting them on the Net Host

15. Creating Web Pages and Web Sites and Putting them on the Net The Web Host

16. Web Site Hosting Naturally, these services aren’t free. You can expect to pay at least $5/month (long-term contract; more if you want to pay month-to-month) for a good web host. Free hosts, like Tripod or Freewebs or Yahoo GeoCities, always have some kind of drawback – ads, pop-up panels, etc., on your web pages. If you’re OK with these, go for it. If you want your own space, you must have your own domain name....

17. Domain Names

18. Pines Lincoln-Mercury pineslm.com Doctors Talking drstalking.com Your Name? yourname.com? I can help you look up domain names, and even buy them, if you want.

19. Creating Web Pages and Web Sites and Putting them on the Net http://mywebsite.com http://mycompany.com http://anothername.net http://anonprofit.org http://broward.edu http://whitehouse.gov http://nasa.gov http://noaa.gov http://af.mil http://www.mywebsite.com http://www.mycompany.com http://www.anothername.net http://www.anonprofit.org http://www.broward.edu http://www.whitehouse.gov http://www.nasa.gov http://www.noaa.gov http://www.af.mil Your Domain Name http://806.com http://806.the-village.com

20. Getting your domain name has nothing to do with getting web hosting. They are two separate things. Many companies offer both, for “convenience,” but this approach can backfire. These are two separate things. Domain Names

21. Domain Name Registrars Register your domain name, like mycupcakes.com or joesmithphotos.com, for a period of time, and a small fee (about $10/year). If this registration isn’t kept current, your domain (including e-mail) just won’t work. The registrar might offer to host your web site in addition to registering your domain, but this is not required. (Your web host will likely offer domain registration too – maybe even for free – but this too isn’t required, and may be a bad idea.)

22. The Keyboard

24. Escape

25. Tilde

26. Exclamation, Bang, Slam

27. At (from e-mail)

28. Pound, number, hash, octothorpe

29. Percent

30. Ampersand

31. Star, asterisk

32. Hyphen, dash / Underscore, underline

33. Equals

34. Braces, curly braces

35. Quotes (shift character)

36. Colon, semicolon

37. Brackets, angle brackets (open / close)

38. Slash

39. Control, Ctrl

40. Alt

41. Arrow / cursor keys

42. HTML Document Structure

43. title of page other things that belong in the head, if any everything else Entire HTML file

44. This is the title Hello, world!

45. This is the title Hello, world! This is the title Hello, world!

46. This is the title Hello, world! This is the title Hello, world!

47. This is the title Hello, world! This is the title Hello, world! This is the title Hello, world!

48. Hello, world! Hello, world! Hello, world! Hello, world! Hello, world!

49. File Names

50. Naming Your Files For the UNIX Platform

51. Mac Create Host View         

52. Things NOT to do... consistency (with index.html) my-web-page.html UNIX Filenaming Conventions use hyphens (dashes) to separate parts mywebpage.html all-lower-case, no spaces, no special characters, ends with.html mywebpage.htm MyWebPage.html WEBPAGE.html my First webpage.html My*First webpage!.html web_page.html underscore (UNIX convention) special characters spaces capitalization issues web-page-001.html numbers are OK

53. file-name.html File-Name.html Windows (not case sensitive) UNIX (case sensitive) link text file-name.html File-Name.html Cannot Display Web Page

54. image of ipod.jpg Image of iPod.jpg Image-of-ipod.jpg Image-of-iPod.jpg Windows (not case sensitive) UNIX (case sensitive)

55. Things NOT to do... consistency (with index.html) my-web-page.html UNIX Filenaming Conventions use hyphens (dashes) to separate parts mywebpage.html all-lower-case, no spaces, no special characters, ends with.html mywebpage.htm MyWebPage.html WEBPAGE.html my First webpage.html My*First webpage!.html web_page.html underscore (UNIX convention) special characters spaces capitalization issues web-page-001.html numbers are OK

56. File Sizes & Image Formats

57. File Size and Image Formats

58. Digital cameras often save images in one of several formats: JPGBMPTIFFRAWOthers Most of these are unsuitable for use on the web, and even JPGs (which are suitable) can be much too large or can have other issues that should be dealt with before putting them on the web. But, most image types that are unsuitable can be made suitable, using appropriate free software (available here in the lab and at home). There are also other sources for images, like the web itself, but just because it came from the web doesn’t mean it’s right for what you want to do. Be careful. So what’s a suitable image type? Glad you asked....

59. Most of the images you want to use in your web pages will be in either JPG (pronounced jay-peg) or in GIF (usually pronounced giff) formats. There is also PNG, but this is less common. If you’re looking at any other image type, you should consider converting it before you do anything else with it. In general, JPGs are suitable for photos and other complex images with lots of different colors, while GIFs are suitable for simple images with few colors, large areas of single colors, or with transparent areas, or with animations. JPG images cannot have transparent areas or animations. JPGs for photos, GIFs for everything else. JPG – Photo, many complex colors GIF – Only a few solid colors

60. Smaller File = Better File Size and File Formats Smaller File = Quicker Download JPG GIF

61. Smaller File = Better File Size and File Formats Smaller File = Quicker Download 256 KB17 KB 15  JPG BMP 12 1 12 1

62. Bits and Bytes A bit is the smallest unit of data a computer can work with, a 1 or a 0. A byte is eight bits. File sizes are measured in bytes, because it’s important to know how big they are – how much room they’ll take up, how long they’ll take to download, how well they’ll print, etc. A smaller file size is better than a larger file size, but this usually means the quality of the image suffers. In general, the larger the image, the higher the quality – but the slower the download time, etc. A kilobyte is 1000 bytes (1 KB), and is usually fairly small by web standards. Most images for the web fall into the range of about 10 KB (kilobytes) to 80 KB -- total -- for the page. Anything larger than about 100 KB -- total – for the images on a page, and you should ask yourself if there’s a better way. There usually is. An image that needs 100 KB on disk, or 200 KB on disk, or even 1400 KB on disk, needs to be reduced (optimized) before use on a web page.

63. File Size and File Formats 96 KB 8 KB 12  45 KB4 KB 11  240 KB 20 KB 12  JPGBMP JPG GIFBMP

64. File Size and File Formats 616 KB 63 KB 99 JPG

65. File Size and File Formats 54 KB 11 JPG

66. File Size and File Formats 28 KB 237 KB 88 JPG

67. File Size and File Formats DO USE JPG (photos)* GIF (solid colors, or if transparency or animation is required) PNG (any) *JPGs can still contain large amounts of information if not properly optimized DON’T USE BMP, WMF, TIF Other formats CONVERT AS NEEDED

68. FTP (File Transfer Protocol)

69. FTP File Transfer Protocol http Hyper-Text Transfer Protocol

70. Creating Web Pages and Web Sites and Putting them on the Net Host

71. Creating Web Pages and Web Sites and Putting them on the Net FTP

72. 1. A connection to the internet. 2. A program to send and receive files (an FTP client). 3. A host name / address. 4. A user ID. 5. A password. FTP (File Transfer Protocol) requires the following things:

73. Program to send and receive files (FTP client) Host name / address User ID Password

74. Your FTP Account (I suggest writing this down or memorizing it.)

75. Your FTP User ID your first name: thomas patricia elizee alan alijose maria

76. Your FTP Password You should memorize your password. You should also keep it safe and private (once you get a new password). All passwords are set to 12341234 at first. If you want yours changed, send me e-mail and suggest a new password. It must be at least 5 characters, cannot be longer than 8 characters, and you may or may not get exactly the password you want. Only I can change the passwords. jhherring@yahoo.com

77. Your web pages will appear at this address: http://johnherring.net/bcc/0806/yourlastname (if you upload a file called “index.html”, this is all you need to type to see that page) or http://johnherring.net/bcc/0806/... yourlastname/file-name.html for files with other filenames.

78. Daily File Storage Procedures At the end of class each day, you should e-mail your files to yourself. Remember, you should have a free e-mail account with Yahoo (unlimited), gmail (6+ GB), or MSN / Hotmail (5 GB). You should also upload all your files to the server via FTP if you want to see them on the web. You should check to be sure your files actually got uploaded safely – use a browser to check that the files are on the server. If you omit this step, you may get an unpleasant surprise later. You may also want to copy your files to a USB key.

79. Other Items Colors, color pickers, color utilities Broward Convention Center site