Wysiwyg
-
Upload
cathy-jo-nelson -
Category
Technology
-
view
900 -
download
1
Transcript of Wysiwyg
![Page 1: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/1.jpg)
The Fastest Way to Have Web Presence!Presented by:
Cathy Nelson & Liz Martin
Rock Hill School District #3
![Page 2: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/2.jpg)
![Page 3: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/3.jpg)
Our Future Students!
![Page 4: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/4.jpg)
WWhat YYou SSee IIs WWhat YYou GGet!
• Html editors that show you the end results as you type
• You see what the final product will look like as you create it.
![Page 5: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/5.jpg)
Plan, Plan, Plan
• Before Beginning– What do I want it to say?– Why do I want it to say it?– Who is my primary audience? Secondary?– How can this information be presented?
• Textually
• graphically
• both
![Page 6: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/6.jpg)
Develop a Strategy
• One page or multiple pages
• connected
• navigation
• appearance– titles– pictures
![Page 7: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/7.jpg)
Under Construction!
• Select an html editor– Microsoft Word– Microsoft Publisher– Netscape Composer– Microsoft FrontPage – Macromedia Dreamweaver
• Enables user to produce an html document without needing to know html language
![Page 8: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/8.jpg)
Netscape Composer
• Media Center Template
• Netscape Composer Tutorial
![Page 9: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/9.jpg)
The Composer Environment• Opens to a blank page like this
• Many of its features are similar to a word processor.
![Page 10: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/10.jpg)
Toolbars
• Menu Bar– access functions of
composer with “drop-down” menus
• Composition Toolbar– shortcuts to several of
the more common functions used
![Page 11: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/11.jpg)
• Print - Print all the pages of the current document
• New - make a new page
• Open - open an existing page
• Save - save the current page
• Publish - Upload the current document to the proper server
• Cut - cut text or an object
• Copy - Copy text or an object• Paste - Paste the things you copied
• Find - find a word or phrase in the current page
• Link - create a link to a different page
• Image - insert a picture
• H. Line - insert a horizontal rule
• Table - Insert a table• Spelling - Spell check your work
• Preview - view the page in browser format • Target - create a target to a specific point in a page
![Page 12: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/12.jpg)
Formatting Toolbar
• Very similar to the formatting toolbar in Microsoft Word
• Type of text
![Page 13: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/13.jpg)
![Page 14: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/14.jpg)
![Page 15: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/15.jpg)
![Page 16: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/16.jpg)
![Page 17: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/17.jpg)
![Page 18: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/18.jpg)
![Page 19: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/19.jpg)
![Page 20: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/20.jpg)
![Page 21: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/21.jpg)
![Page 22: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/22.jpg)
![Page 23: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/23.jpg)
![Page 24: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/24.jpg)
To add a text hyperlink,
highlight text, then click the
link icon.
![Page 25: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/25.jpg)
![Page 26: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/26.jpg)
![Page 27: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/27.jpg)
![Page 28: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/28.jpg)
Microsoft FrontPage
• Front Page Guide
![Page 29: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/29.jpg)
![Page 30: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/30.jpg)
![Page 31: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/31.jpg)
![Page 32: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/32.jpg)
![Page 33: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/33.jpg)
![Page 34: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/34.jpg)
Tool Bar
Button used to make hyperlink
![Page 35: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/35.jpg)
Beside the box for URL, type in the complete address
![Page 36: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/36.jpg)
![Page 37: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/37.jpg)
![Page 38: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/38.jpg)
![Page 39: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/39.jpg)
![Page 40: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/40.jpg)
![Page 41: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/41.jpg)
Be sure to save often!
Use the disk icon on the toolbar!
![Page 42: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/42.jpg)
• Choose where to save it
– web folder
– my documents
– desktop
![Page 43: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/43.jpg)
• Choose File name
– what appears in the URL
– simple
– avoid spaces
• Click Save
![Page 44: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/44.jpg)
Change it to a more appropriate name here.
• Notice the name of the Page Title
• It appears across the top blue line on web pages
![Page 45: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/45.jpg)
![Page 46: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/46.jpg)
When you save, you will be prompted to save embedded objects, like images.
![Page 47: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/47.jpg)
A folder will be created.Inside will be the web page file and image files used
![Page 48: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/48.jpg)
• 2 ways:– Click the plain white page icon– Go to “File,” “New Page”
![Page 49: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/49.jpg)
• Make the new page
• Save it in the same folder
• It appears on left side of screen as another html file
• Dress it up now, or come back to it later.
![Page 50: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/50.jpg)
• To connect (hyperlink) two pages– Highlight the text or image
– Click your hyperlink button (earth & chain link icon)
– Find your folder with your html pages
– Click on the page you want to link
![Page 51: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/51.jpg)
![Page 52: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/52.jpg)
![Page 53: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/53.jpg)
![Page 54: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/54.jpg)
![Page 55: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/55.jpg)
![Page 56: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/56.jpg)
![Page 57: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/57.jpg)
![Page 58: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/58.jpg)
![Page 59: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/59.jpg)
![Page 60: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/60.jpg)
![Page 61: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/61.jpg)
![Page 62: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/62.jpg)
![Page 63: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/63.jpg)
Microsoft Publisher
• Publisher Template
![Page 64: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/64.jpg)
![Page 65: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/65.jpg)
![Page 66: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/66.jpg)
Microsoft Word
• Microsoft Word Template
![Page 67: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/67.jpg)
![Page 68: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/68.jpg)
![Page 69: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/69.jpg)
![Page 70: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/70.jpg)
![Page 71: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/71.jpg)
Macromedia DreamWeaver
![Page 72: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/72.jpg)
![Page 73: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/73.jpg)
![Page 74: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/74.jpg)
![Page 75: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/75.jpg)
![Page 76: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/76.jpg)
![Page 77: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/77.jpg)
![Page 78: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/78.jpg)
![Page 79: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/79.jpg)
Handouts!
![Page 80: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/80.jpg)
Special Thanks
• Christopher J. Smith– formerly the North
Central Regional Technology Specialist
– currently the Rock Hill School District 3 Technology Coordinator
• Kierston Byrd– Principal at The
Children’s School at Sylvia Circle
• Linda Crute– Principal at Northside
Elementary School
• Joe Keeton– Follett Representative
![Page 81: Wysiwyg](https://reader031.fdocuments.in/reader031/viewer/2022013011/555a5e67d8b42a47748b51ca/html5/thumbnails/81.jpg)
Contact Us!
• Catherine NelsonCatherine Nelson– Media Specialist
– Northside Elementary School
• Liz MartinLiz Martin– Media Specialist
– The Children’s School at Sylvia Circle