Text editor- (Notepad) software used to create plain text files HTML editors- do the same as text editors, but have special features that allow for easy insertion of HTML tags (HTML-Kit, CoffeeCup) Dreamweaver Allows you to have to learn all the HTML codes because it provides the underlying markup language Web Templates Pre-fabricated website structure, that allows someone with little to no knowledge to create a website. Can be used to control the look and function of all the pages on an intranet (private network within a large organization that uses the internet)

Today’s Lab: Exploring a web page’s underlying markup language Get with a partner!!! Open your browser and enter in your favorite school appropriate website Internet Explorer: click view on the menu bat at top of page and then source of the underlying markup language Firefox: press ctrl and U to get the markup language Google: press ctrl U Copy and paste about 5 pages in Google Docs or into Word Print ONLY 5 PAGES of the markup language Use Appendix B in the back of your book to identify several of the markup tags. Highlight them and write them on a separate sheet of paper explaining what they are Some of them you may need to look them up in Google.

Basic Web Design Principals Balance and Proximity Symmetric arrangement of Web elements is centered or balanced and suggest conservative, safe and a peaceful atmosphere Be careful to not be too symmetrical to avoid being boring. It is always important to balance out this with color choices and other elements Asymmetrical arrangement is off balanced and can suggest fun, energetic mood *It is always important to think of who your audience is. Which do you think would appeal to a 10year old? How about a 40 year old?

Proximity is the closeness of objects Things that are related to one another need to be close to each other. White Space, is the empty space surrounding the text and images, is just as important as the proximity. Focal point is the dominating segment of the Webpage. It is what you want your visitors to focus on when they view your page. Alignment: the placement of objects are fixed or predetermined positions (rows/columns) This helps with readability, consistency and expectancy of the visitor. *Having all of these give your webpage unity and visual identity ( helps it stands out from the rest)

Color Color wheels (pg53) are great to figure out effective and appealing color combinations Primary colors: red, yellow and blue When combining 2 colors you get: Cool colors: green, blue and purples ( tranquil or detached) Warm colors: yellow, orange and red (activity and power) Complementary colors: colors directly opposite of each other in the wheel. Creates contrast on your page. RGB Color System The color system used in computer monitors Channels of red, green and blue light at various intensity (values) When values from the channels are combined, different colors result

Writing on the web Use language that is straight forward and geared toward your audience. Simplicity is always easier to the reader than jargon or slang. Humor should be used cautiously, because what you find funny may not be the same as your visitor Write your information first in Word/Docs to make sure that everything is spelled correctly and that there are no grammar mistakes. Always have at least one other person look at your materials! Use reliable sources: Wiki is not one of them ;) Be sure to have a cite page! It is always important to give credit to those who helped you

Chunked Text-have small sections that include headings, subheadings, bulleted lists and are concise. Pg 50 in book for example Avoid the use of dense paragraphs Avoid using blue text, because that color is traditionally used for hyperlinks. Purple should also be avoided, because it usually indicates a hyperlink that has already been visited. Avoid underlined text, because that is usually symbolizes a link Use uppercase letters sparingly. It causes problems with readability and if the word is in all caps then the reader may perceive this as shouting.

Organization Styles Inverted Pyramid- places the summary chunked text ( include the Ws: who, what, when, where, why) on the homepage and links to subsidiary information.

Technical Issues Bandwidth - quantity of data that can be transmitted in a specific time frame Bandwidth, traffic on the internet at a specific time and webpage’s file size affect how quickly it downloads into a browser. You can control only your webpage’s file size Remember that a visitor will only wait 5-10 seconds for a website to download. If it takes too long, they will look else where. Monitor Resolution (measure of sharpness and clarity, related to the number of pixels it can display) if number of pixel increases then the size of each one will decrease Solutions: Use fewer images or thumbnail images ( miniature versions of images that link to a larger images) Reduce file size of images by using editing programs like Adobe Photoshop Always test your website in different browsers to be sure that it is the product you are wanting to be displayed

Legal Issues Copyright-ownership right to materials, images and multimedia Taking an image from online that is copyrighted and displaying it on your page is illegal with out the owners permission In US published webpages are protected by copyright, regardless of whether the property is registered or not Encryption-is a process that changes data encoding so it cannot be understood if an unauthorized person tries to read the material Decryption changes the material back to its normal format Cookies: small text files stored on a visitor’s hard drive Cookies can have: login data, domain names, browser types, and operating systems.