HTML Exercise 20 Linking Pictures To Other Documents Or Web Sites
|
|
- Morgan Parsons
- 6 years ago
- Views:
Transcription
1 HTML Exercise 20 Linking Pictures To Other Documents Or Web Sites Turning pictures into hyperlinks is nearly the same as what you learned in Exercises 4 and 5. If a picture is essential to a Web page, you should insert it. Otherwise, give the reader the choice of looking at a thumbnail of the picture and clicking the thumbnail to see the full picture. Also, you may want to use a thumbnail image if the full size picture has a large file size and takes a while to download. Whenever you use a JPEG picture, Paint Shop Pro allows you to compress it using the JPEG Saver. In this exercise, you will have to choose the best level of compression and write down the final value. Be courteous to your readers; they may not have a fast Internet connection. Another way to be courteous to your readers is to use the ALT subcommand. Some people with older browsers may not be able to see pictures, or they may have the picture option turned off. Also, many people with limited vision have Web readers that read whatever ALT message you type. Finally, add the BORDER= n subcommand. The number stands for pixels. If the number is 0, the blue or purple hyperlink box that will appear around the picture is removed. <A HREF= filename ><IMG SRC= filename ALT= screen tip BORDER= 0 ></A> The URL or the HTML document that you want to jump to. Inserts the picture subcommand Changing the Pictures Document 1. Double-click your HTML folder to open it. 2. Double-click the pictures.html file to open it. 3. Right-click a blank spot on the page and select View Source. 4. Change the Revision Date in the footer of the page to today s date. 5. Change the exercise number to 20. Revised--Date<BR> HTML Exercise 20<BR> 6. Type the HTML code below the heading9.gif. <P ALIGN="center"><IMG SRC="heading9.gif"</P> <H2>Thumbnail Images in HTML Documents are Way Cool!</H2> <BLOCKQUOTE> <P>Using thumbnail images in HTML documents is really easy and fun, not to mention a kindness to your readers.</p> </BLOCKQUOTE> Exercise 20 Page 1
2 7. Click File on the Menu bar and select Save. 8. Click the Internet Explorer button on the Taskbar. 9. Click the Refresh button. 10. You should now see the Web page with a heading and a paragraph. Figure 1 Browsing Some Picture Files 11. Click Start, point to Programs, point to the Jasc Software folder, and select Paint Shop Pro Maximize the Paint Shop Pro window. 13. Press Ctrl+B to browse a folder. 14. In the left pane, click the + sign to the left of Network Neighborhood. 15. Click the + sign to the left of Students 200_ folder. 16. Click the + sign to the left of Advanced Computers folder. 17. Click the Class Photos folder to open it. 18. You will see a number of class photos. The photos are JPEGs. 19. Double-click any picture that you want to use. 20. The picture will open in Paint Shop Pro. Resizing an Image The new digital cameras take large pictures, too large for the average monitor. Resizing will mean smaller file sizes, faster download times, and no horizontal scrolling. 21. Press Shift+S. 22. The Resize image dialog box opens. 23. Under Pixel Size, change the Width to The Height will automatically change. 25. Click OK. Using the Effects Browser Use the Filter Browser to try out filter effects before applying them to your image. When you select a filter from the Filter Browser, Paint Shop Pro opens that filter. To apply a filter to a selection, create the selection before choosing the filter. 26. Click Effects on the Menu bar and select Effects Browser. 27. The Effects Browser dialog box opens. Exercise 20 Page 2
3 28. Under Effect name, preview an effect that you like. 29. Click OK when you find a filter effect that you like. 30. Another dialog box will open with the name of the effect that you have chosen. 31. Experiment with the settings to get just the effect you want. 32. Click OK. Table 1: Filters are a lot of fun Saving a Compressed JPEG The JPEG Optimizer is similar to the GIF Optimizer. It compresses the file to make the file size smaller. Exercise 20 Page 3
4 33. Click File on the Menu bar, point to Export, and select JPEG Optimizer. 34. The JPEG Optimizer dialog box opens. 35. This dialog box allows you to compress your picture so that it will download faster. 36. Click the Quality tab. 37. Notice the two preview windows. This shows your image before and after compression and the file size. 38. Between the two preview windows are three Zoom buttons. - zooms out - zooms in - moves around the image 39. Click the button and move to a part of the picture that has a lot of detail or color. 40. Zoom in or out if it helps. 41. Set compression value to any number from Figure 2:The compressed JPEG is much smaller in file size. The pictures are about equal in quality. 42. The higher the compression value, the smaller the file size, but the lower the quality of the image. 43. Set the compression to the highest number that looks as good as the original. 44. Click the Format tab. 45. Select Standard. 46. Click OK. 47. The Save As dialog box opens. 48. Save in your HTML folder. 49. In the File name text box type filter1. Exercise 20 Page 4
5 50. Click Save or press Enter. Making a Thumbnail Image 51. Press Shift+S. 52. The Resize image dialog box opens. 53. Under Pixel Size, change the Width to The Height will automatically change. 55. Click OK. 56. Click File on the Menu bar, point to Export, and select JPEG Optimizer. 57. The JPEG Optimizer dialog box opens. 58. This dialog box allows you to compress your picture so that it will download faster. 59. Click the Quality tab. 60. Set compression value to the highest number that looks as good as the original. 61. Click the Format tab. 62. Select Standard. 63. Click OK. 64. The Save As dialog box opens. 65. Save in your HTML folder. 66. In the File name text box type filter1tmb. 67. Click Save or press Enter. 68. Close the resized picture, but do not save it. Figure 3: The thumbnails will have a consistent size. Inserting, Aligning, and Linking a Picture into a Document The thumbnail picture will be inserted into the document. You will write a paragraph about what effect you used and about the amount of compression. 69. Click the Notepad button on the Taskbar. 70. Type the HTML code before the closing </BLOCKQUOTE> tag. <BLOCKQUOTE> <P>Using thumbnail images in HTML documents is really easy and fun, not to mention a kindness to your readers.</p> <P> <A HREF="filter1.jpg"><IMG SRC="filter1tmb.jpg" ALT="Twirl filter." ALIGN="left" HSPACE="10" BORDER="0"></A> I used the Twirl filter. The compression value was 20. </P> <BR><BR><BR><BR><BR><BR><BR><BR> </BLOCKQUOTE> Type your own information here. Exercise 20 Page 5
6 71. The hyperlink is to the filter1.jpg. 72. Instead of a text link, you are inserting a picture. 73. The ALT subcommand will be visible when you move the mouse over the picture. 74. The HSPACE subcommand will move the text away from the picture. 75. No hyperlink border will surround the picture. 76. Click File on the Menu bar and select Save. 77. Click the Internet Explorer button on the Taskbar. 78. Click the Refresh button. 79. You should now see the thumbnail picture surrounded by a blue hyperlink border. The text is wrapping around the side of the picture. 80. Click the thumbnail to test the hyperlink. 81. Click the Back button on the toolbar. Figure 4 Using the Effects Filter Again 82. Click the Paint Shop Pro button on the Taskbar. 83. Press Ctrl+B to browse the Class Photos folder on Zeus. 84. Double-click another picture you like to open it in Paint Shop Pro. 85. Press Shift+S. 86. The Resize image dialog box opens. 87. Under Pixel Size, change the Width to The Height will automatically change. 89. Click OK. 90. Click Image on the Menu bar and select Effect Browser. Exercise 20 Page 6
7 91. The Effect Browser dialog box opens. 92. Under Effect name, preview another effect that you like. 93. Click OK. 94. Another dialog box will open with the name of the effect that you have chosen. 95. Experiment with the settings to get just the effect you want. 96. Click OK. 97. Click File on the Menu bar, point to Export, and select JPEG Optimizer. 98. Click the button and move to a part of the picture that has a lot of detail or color. 99. Zoom in or out if it helps Set compression value to the highest number that looks as good as the original Click the Format tab Select Standard Click OK The Save As dialog box opens Save in your HTML folder In the File name text box type filter Click Save or press Enter. Making a Thumbnail Image 108. Press Shift+S The Resize image dialog box opens Under Pixel Size, change the Width to The Height will automatically change Click OK Click File on the Menu bar, point to Export, and select JPEG File The JPEG Saver dialog box opens This dialog box allows you to compress your picture so that it will download faster Click the Quality tab Click the button and move to a part of the picture that has a lot of detail or color Zoom in or out if it helps Set compression value to the highest number that looks as good as the original Click the Format tab Select Standard Click OK. Exercise 20 Page 7
8 123. The Save As dialog box opens Save in your HTML folder In the File name text box type filter2tmb Click Save or press Enter Close the resized picture, but do not save it. Inserting, Aligning, and Linking a Picture into a Document The thumbnail picture will be inserted into the document. You will write a paragraph about what effect you used and about the amount of compression Click the Notepad button on the Taskbar Type the HTML code before the closing </BLOCKQUOTE> tag. <P> <A HREF="filter2.jpg"><IMG SRC="filter2tmb.jpg" ALT="Tiles filter." ALIGN="left" HSPACE="10" BORDER="0"></A> I used the Tiles filter. The compression value was 30. </P> <BR><BR><BR><BR><BR><BR><BR><BR> </BLOCKQUOTE> 130. Click File on the Menu bar and select Save Click the Internet Explorer button on the Taskbar Click the Refresh button You should now see the thumbnail picture surrounded by a blue hyperlink border. The text is wrapping around the side of the picture Click the thumbnail to test the hyperlink Click the Back button on the toolbar. Figure 5 Type your own information here. Exercise 20 Page 8
9 On Your Own 136. Select two more photos from the Class Photos folder Resize the pictures to 800 pixels in width Use the Effects Browser to create two more effects that are different Export the pictures to the JPEG Optimizer Set the correct compression value Resize your pictures to make thumbnails Make the Width of each thumbnail 200 pixels Save you two compressed pictures and two thumbnails to your HTML folder Name the files: 145. filter filter3tmb 147. filter filter4tmb 149. Insert the thumbnails into your pictures.html document and link them to the large pictures Don t forget the ALT subcommand When you are finished, test to see that all of your hyperlinks work. Uploading Your Documents 152. In Internet Explorer, type in the Address bar text box and press Enter Type your user name and password Press Enter or click the Sign in button Under Advanced Toolbox, click. Upload pictures.html Upload filter1.jpg, filter2.jpg, filter3.jpg, and filter4.jpg Upload filter1tmb.jpg, filter2tmb.jpg, filter3tmb.jpg, and filter4tmb.jpg 156. Click the button to copy the files to the Geocities server A new page will open telling you that you have successfully uploaded the files Click the hyperlink to your home page Click. Printing the Web Page 160. Before printing, click View on the Menu bar, point to Text Size, and select Medium Press Ctrl+P. Exercise 20 Page 9
10 162. The Print dialog box opens Change the Name to Ireland Change the Number of copies to Click OK Your teacher will go online to check your Web page and mark the grade on the printed copy Close all windows. Figure 6: Now everyone can see exactly how you made each design. Exercise 20 Page 10
HTML Exercise 21 Making Simple Rectangular Buttons
HTML Exercise 21 Making Simple Rectangular Buttons Buttons are extremely popular and found on virtually all Web sites with multiple pages. Buttons are graphical elements that help visitors move through
More informationHTML Exercise 12 Making A Transparent 3-D Heading For The Hyperlinks 3 Page
HTML Exercise 12 Making A Transparent 3-D Heading For The Hyperlinks 3 Page This exercise will give you practice downloading and installing your own SuperBladePro presets, creating a transparent heading
More informationHTML Exercise 11 Making A Transparent 3-D Heading For The Hyperlinks 2 Page
HTML Exercise 11 Making A Transparent 3-D Heading For The Hyperlinks 2 Page This exercise will give you practice downloading and installing your own SuperBladePro presets, creating a transparent heading
More informationHTML Exercise 15 Creating An Engraved Metal Heading For The Text Wrap Page
HTML Exercise 15 Creating An Engraved Metal Heading For The Text Wrap Page 1. Click Start, point to Programs, point to the Jasc Software folder, and select Paint Shop Pro 7. 2. Maximize the Paint Shop
More informationHTML Exercise 9 Making A Transparent 3-D Heading For The Hyperlinks 1 Page
HTML Exercise 9 Making A Transparent 3-D Heading For The Hyperlinks 1 Page Paint Shop Pro will make many different kinds of text. Here is a way to make a transparent 3-D heading. The heading must be transparent
More informationMaking Backgrounds With Paint Shop Pro
Making Backgrounds With Paint Shop Pro A good Web site deserves a good background. Whether you decide on a single color, a faded repeated logo, a textured tile, or a border, the background of your Web
More informationHTML Exercise 24 Tables
HTML Exercise 24 Tables Tables allow you to put things in columns and rows. Without tables, you can only have one long list of text and graphics (check Exercise 20). If you have ever made a table in a
More informationHTML Exercise 27 Creating A Van Gogh Background Using Plug-in Filters
HTML Exercise 27 Creating A Van Gogh Background Using Plug-in Filters Background pictures need to be small so the Web page will download quickly. The browser automatically will repeat the picture to fill
More informationHTML Exercise 29 Adding JavaScript To Your Web Pages
HTML Exercise 29 Adding JavaScript To Your Web Pages Here s Joe Burn s explanation of JavaScript. What is the difference between Java and JavaScript anyway? They are both similar and quite different depending
More informationCreating a Web Page with Microsoft Front Page Express Exercise 1
Creating a Web Page with Microsoft Front Page Express Exercise 1 Today you are going to build your first Web page. Normally, Web pages are written in a language called Hypertext Markup Language (HTML).
More informationCropping an Image for the Web
Cropping an Image for the Web This guide covers how to use the Paint software included with Microsoft Windows to crop images for use on a web page. Opening Microsoft Paint (In Windows Accessories) On your
More informationUsing Dreamweaver. 4 Creating a Template. Logo. Page Heading. Home About Us Gallery Ordering Contact Us Links. Page content in this area
4 Creating a Template Now that the main page of our website is complete, we need to create the rest of the pages. Each of them will have a layout that follows the plan that is shown below. Logo Page Heading
More informationCreating a Website in Schoolwires
Creating a Website in Schoolwires Overview and Terminology... 2 Logging into Schoolwires... 2 Changing a password... 2 Navigating to an assigned section... 2 Accessing Site Manager... 2 Section Workspace
More informationExercise 19 Adding Graphic Images To Microsoft Word 2000
Exercise 19 Adding Graphic Images To Microsoft Word 2000 Graphic images include clip art files, photographs, drawings, and Word Art. Graphic images can be inserted in a document from many sources. For
More informationLibraries. Multi-Touch. Aero Peek. Sema Foundation 10 Classes 2 nd Exam Review ICT Department 5/22/ Lesson - 15
10 Classes 2 nd Exam Review Lesson - 15 Introduction Windows 7, previous version of the latest version (Windows 8.1) of Microsoft Windows, was produced for use on personal computers, including home and
More informationAttributes & Images 1 Create a new webpage
Attributes & Images 1 Create a new webpage Open your test page. Use the Save as instructions from the last activity to save your test page as 4Attributes.html and make the following changes:
More informationAcrobat X Professional
Acrobat X Professional Toolbar Well Page Navigations/Page Indicator Buttons for paging through document Scroll Bar/box page indicator appears when using the scroll button to navigate. When you release
More informationIntroduction to Dreamweaver
COMMUNITY TECHNICAL SUPPORT Introduction to Dreamweaver What is Dreamweaver? Dreamweaver helps you to create Web pages while it codes html (and more) for you. It is located on the bottom tray or in the
More informationFrontPage. Directions & Reference
FrontPage Directions & Reference August 2006 Table of Contents Page No. Open, Create, Save WebPages Open Webpage... 1 Create and Save a New Page... 1-2 Change the Background Color of Your Web Page...
More informationRenWeb Handout Manual
RenWeb Handout Manual Tiffany Gurgel October 2013 RenWeb Handout Manual Table of Contents Pre-Training Handout: Creating a Document as a PDF 2 Handout 1A: Adding Homework & Web Document 4 Handout 2A: Creating
More informationDazzle the Web with Dynamic Dreamweaver, Part II
Dazzle the Web with Dynamic Dreamweaver, Part II In the second Dreamweaver workshop we will learn the following skills: 1. Adding hyperlinks to our home page 2. Adding images to our home page 3. Creating
More informationCentricity 2.0 Section Editor Help Card
Centricity 2.0 Section Editor Help Card Accessing Section Workspace In order to edit your section, you must first be assigned Section Editor privileges. This is done by the Director of your Site, Subsite,
More informationUnit 8. Lesson 8.1. Microsoft FrontPage. Introduction. Microsoft FrontPage-1. Microsoft FrontPage
Microsoft FrontPage Unit 8 Microsoft FrontPage Introduction Lesson 8.1 Microsoft FrontPage-1 A number of Software Packages are available in market for creating a website. Among popular software s are Dreamweaver,
More informationDreamweaver MX Overview. Maintaining a Web Site
Dreamweaver MX Overview Maintaining a Web Site... 1 The Process... 1 Filenames... 1 Starting Dreamweaver... 2 Uploading and Downloading Files... 6 Check In and Check Out Files... 6 Editing Pages in Dreamweaver...
More informationForms/Distribution Acrobat X Professional. Using the Forms Wizard
Forms/Distribution Acrobat X Professional Acrobat is becoming a standard tool for people and businesses to use in order to replicate forms and have them available electronically. If a form is converted
More informationImage Optimisation. Image Dimensions...1 Image File Formats...2 Adding Images...5 Thumbnails...13 Summary...15
Table of Contents Image Optimisation Image Dimensions...1 Image File Formats...2 Adding Images...5 Thumbnails...13 Summary...15 Introduction Images are placed on a website to enhance its appearance. However,
More informationUsing Microsoft Word. Working With Objects
Using Microsoft Word Many Word documents will require elements that were created in programs other than Word, such as the picture to the right. Nontext elements in a document are referred to as Objects
More informationPage Content. Inserting Text To add text to your document, you can type the text directly or use Cut or Copy and Paste or Paste Special.
This section describes how to add content to your pages including text, Microsoft Office documents, images, Flash, and other media content. Inserting Text To add text to your document, you can type the
More informationPowerPoint Tips and Tricks
PowerPoint Tips and Tricks Viewing Your Presentation PowerPoint provides multiple ways to view your slide show presentation. You can access these options either through a toolbar on your screen or by pulling
More informationInformation Systems Center. FrontPage 2003 Reference Guide for COMM 321 & 421
Information Systems Center FrontPage 2003 Reference Guide for COMM 321 & 421 September 2008 Table of Contents Portfolio Web Sites & Web Pages... 1 Open Your Portfolio Web Site in FrontPage for Editing...
More informationNauticom NetEditor: A How-to Guide
Nauticom NetEditor: A How-to Guide Table of Contents 1. Getting Started 2. The Editor Full Screen Preview Search Check Spelling Clipboard: Cut, Copy, and Paste Undo / Redo Foreground Color Background Color
More informationHandout created by Cheryl Tice, Instructional Support for Technology, GST BOCES
Handout created by Cheryl Tice, Instructional Support for Technology, GST BOCES Intro to FrontPage OVERVIEW: This handout provides a general overview of Microsoft FrontPage. AUDIENCE: All Instructional
More informationROLLA PUBLIC SCHOOLS WEB EDITING REFRESHER
ROLLA PUBLIC SCHOOLS WEB EDITING REFRESHER Logging in 1. In the address line of Internet Explorer, enter the following URL: www.rolla.k12.mo.us/typo3 Or From the RPS Home page, select Staff Inside RPS
More informationLava New Media s CMS. Documentation Page 1
Lava New Media s CMS Documentation 5.12.2010 Page 1 Table of Contents Logging On to the Content Management System 3 Introduction to the CMS 3 What is the page tree? 4 Editing Web Pages 5 How to use the
More informationCreating a Web Presentation
LESSON 9 Creating a Web Presentation 9.1 After completing this lesson, you will be able to: Create an agenda slide or home page. Create a hyperlink to a slide. Create a Web presentation with the AutoContent
More informationSection 5. Pictures. By the end of this Section you should be able to:
Section 5 Pictures By the end of this Section you should be able to: Use the Clip Gallery Insert and Delete Pictures Import Pictures Move, Resize and Crop Pictures Add Borders and Colour Wrap Text around
More informationThere are four (4) skills every Drupal editor needs to master:
There are four (4) skills every Drupal editor needs to master: 1. Create a New Page / Edit an existing page. This entails adding text and formatting the content properly. 2. Adding an image to a page.
More informationSection 3. Editing a Web Page
New CLAIT FrontPage 2003 Section 3 Editing a Web Page By the end of this Section you will be able to: Work in Page View Enter Text Insert Text Edit the Page Format Text Insert an Image Preview the Page
More informationFileNET Guide for AHC PageMasters
PageMasters have the permissions necessary to perform the following tasks with Site Tools: ACADEMIC HEALTH CENTER 2 Application Requirements...3 Access FileNET...3 Log in to FileNET...3 Navigate the Site...3
More informationCreating Web Pages with SeaMonkey Composer
1 of 26 6/13/2011 11:26 PM Creating Web Pages with SeaMonkey Composer SeaMonkey Composer lets you create your own web pages and publish them on the web. You don't have to know HTML to use Composer; it
More informationSoftChalk 10. Level 1. University Information Technology Services. Learning Technologies, Training, Audiovisual, and Outreach
SoftChalk 10 Level 1 University Information Technology Services Learning Technologies, Training, Audiovisual, and Outreach Copyright 2018 KSU Division of University Information Technology Services This
More informationExercise 2 Adding Graphics, Animation, and Sound To A Presentation
Exercise 2 Adding Graphics, Animation, and Sound To A Presentation 1. Click Start on the Menu bar, point to Programs, and select Microsoft PowerPoint. 2. The PowerPoint dialog box opens. 3. Select Design
More informationBeginners Guide to Snippet Master PRO
Beginners Guide to Snippet Master PRO This document assumes that Snippet Master has been installed on your site. If not please contact the Bakas IT web team at webreg@bakasit.com.au. Initial Login Screen...
More informationWEB EDITING REFRESHER
WEB EDITING REFRESHER ROLLA PUBLIC SCHOOLS January 2010 Logging in 1. In the address line of Internet Explorer, enter the following URL: www.rolla.k12.mo.us/typo3 Or From the RPS Home page, select Staff
More informationExercise 5 Animated Excel Charts in PowerPoint
Exercise 5 Animated Excel Charts in PowerPoint This is a fun exercise to show you how even graphs can become even more interesting if you use multimedia. You will write some slides on your own to summarize
More informationThis Tutorial is for Word 2007 but 2003 instructions are included in [brackets] after of each step.
This Tutorial is for Word 2007 but 2003 instructions are included in [brackets] after of each step. Table of Contents Just so you know: Things You Can t Do with Word... 1 Get Organized... 1 Create the
More informationCreating Web Pages Using Netscape Composer AGENDA FOR THIS WORKSHOP. 1. How does it all work? 2. What do I need to get started at Fairfield?
Creating Web Pages Using Netscape Composer AGENDA FOR THIS WORKSHOP 1. How does it all work? 2. What do I need to get started at Fairfield? 3. What is HTML coding? 4. The 10 HTML Tags that you should know.
More informationFileNET Guide for AHC PageMasters
ACADEMIC HEALTH CENTER 2 PageMasters have the permissions necessary to perform the following tasks with Site Tools: Application Requirements...3 Access FileNET...3 Login to FileNET...3 Navigate the Site...3
More informationUsing Dreamweaver CS6
Using Dreamweaver CS6 7 Dynamic HTML Dynamic HTML (DHTML) is a term that refers to website that use a combination of HTML, scripting such as JavaScript, CSS and the Document Object Model (DOM). HTML and
More informationThe City School. Prep Section. ICTech. 2 nd Term. PAF Chapter. Class 8. Worksheets for Intervention Classes
The City School PAF Chapter Prep Section ICTech Class 8 2 nd Term Worksheets for Intervention Classes Name: Topic: Flowchart Date: Q. Write the name and description of the following symbol. Symbol Name
More informationThe City School. Prep Section. ICTech. 2 nd Term. PAF Chapter. Class 7. Worksheets for Intervention Classes
The City School PAF Chapter Prep Section ICTech Class 7 2 nd Term Worksheets for Intervention Classes Name: Topic: Scratch Date: Q.1: Label the diagram 1 2 3 4 5 6 7 12 8 9 11 10 1. 2. 3. 4. 5. 6. 7. 8.
More informationThe Dreamweaver Interface
The Dreamweaver Interface Let s take a moment to discuss the different areas of the Dreamweaver screen. The Document Window The Document Window shows you the current document. This is where you are going
More informationCOMSC-031 Web Site Development- Part 2. Part-Time Instructor: Joenil Mistal
COMSC-031 Web Site Development- Part 2 Part-Time Instructor: Joenil Mistal Chapter 9 9 Creating Pages with Frames You can divide the display area of a Web browser into multiple panes by creating frames.
More informationNVU Web Authoring System
NVU Web Authoring System http://www.nvu.com/index.php Table of Contents Using Nvu as Your Web Page Authoring System: Getting Started Opening a page, saving, and previewing your work...3 Formatting the
More informationUsing Adobe Contribute 4 A guide for new website authors
Using Adobe Contribute 4 A guide for new website authors Adobe Contribute allows you to easily update websites without any knowledge of HTML. This handout will provide an introduction to Adobe Contribute
More informationJoomla! 2.5.x Training Manual
Joomla! 2.5.x Training Manual 1 Joomla is an online content management system that keeps track of all content on your website including text, images, links, and documents. This manual includes several
More informationADOBE DREAMWEAVER CS4 BASICS
ADOBE DREAMWEAVER CS4 BASICS Dreamweaver CS4 2 This tutorial focuses on the basic steps involved in creating an attractive, functional website. In using this tutorial you will learn to design a site layout,
More informationGoogle Earth: Significant Places in Your Life Got Maps? Workshop June 17, 2013
Google Earth: Significant Places in Your Life Got Maps? Workshop June 17, 2013 1. Open Google Earth. 2. Familiarize yourself with Google Earth s navigational features by zooming into Furman s campus, your
More informationCreating a Website in Schoolwires Technology Integration Center
Creating a Website in Schoolwires Technology Integration Center Overview and Terminology... 2 Logging into Schoolwires... 2 Changing a password... 2 Accessing Site Manager... 2 Section Workspace Overview...
More informationHTML, XHTML, and CSS 8/21/2011. Chapter Objectives. Chapter 4. Chapter Objectives. Chapter Objectives
HTML, XHTML, and CSS Sixth Edition Chapter 4 Creating Tables in a Web Site Using an External Style Sheet Chapter Objectives Define table elements Describe the steps used to plan, design, and code a table
More informationRenWeb Training. Creating Your Classroom Website
RenWeb Training Creating Your Classroom Website October 2013 RenWeb Training Manual Table of Contents Ren Web Survey 3 Pre-Training Handout: Saving a Document as a PDF 4 Lesson 1: Adding Homework & Web
More informationUTAS CMS. Easy Edit Suite Workshop V3 UNIVERSITY OF TASMANIA. Web Services Service Delivery & Support
Web Services Service Delivery & Support UNIVERSITY OF TASMANIA UTAS CMS Easy Edit Suite Workshop V3 Web Service, Service Delivery & Support UWCMS Easy Edit Suite Workshop: v3 Contents What is Easy Edit
More information1.0 Overview For content management, Joomla divides into some basic components: the Article
Joomla! 3.4.x Training Manual Joomla is an online content management system that keeps track of all content on your website including text, images, links, and documents. This manual includes several tutorials
More informationInsert/Edit Image. Overview
Overview The tool is available on the default toolbar for the WYSIWYG Editor. The Images Gadget may also be used to drop an image on a page and will automatically spawn the Insert/Edit Image modal. Classic
More informationPBwiki Basics Website:
Website: http://etc.usf.edu/te/ A wiki is a website that allows visitors to edit or add their own content to the pages on the site. The word wiki is Hawaiian for fast and this refers to how easy it is
More informationStep 1 Download and Install KompoZer Step by step instructions to build your first web page using KompoZer web editor.
All Creative Designs HTML Web Tutorial for PC Using KompoZer New version 2012 now available at: http://www.allcreativedesigns.com.au/pages/tutorials.html Step 1 Download and Install KompoZer Step by step
More informationMicrosoft Expression Web Basics of Creating a Web Site
Information Technology Department Pyle Center 1204 Wilmington College Wilmington, OH 45177 (800) 341-9318, ext. 459 helpdesk@wilmington.edu Microsoft Expression Web Basics of Creating a Web Site The first
More informationLesson 6 Adding Graphics
Lesson 6 Adding Graphics Inserting Graphics Images Graphics files (pictures, drawings, and other images) can be inserted into documents, or into frames within documents. They can either be embedded or
More informationINFS 2150 / 7150 Intro to Web Development / HTML Programming
XP INFS 2150 / 7150 Intro to Web Development / HTML Programming Working with Graphics in a Web Page 1 Objectives Learn about different image formats Control the placement and appearance of images on a
More informationBHM Website Teacher User Guide
BHM Website Teacher User Guide How to Login 1. Go to HUhttp://bhmschools.org/userUH 2. Enter your username and password and click Log in How to Change Your Password 1. Go to My Account in your Nav bar
More informationAdobe Acrobat Pro DC for Windows
Adobe Acrobat Pro DC for Windows Creating Interactive PDF Forms University Information Technology Services Learning Technologies, Training & Audiovisual Outreach Copyright 2017 KSU Division of University
More informationpage 1 OU Campus User Guide
page 1 OU Campus User Guide Logging Into OU Campus page page 2 1. Navigate to a page on your site that you wish to edit. 2. Scroll down to the footer and click the symbol. 3. Enter your OU Campus username
More informationTable Basics. The structure of an table
TABLE -FRAMESET Table Basics A table is a grid of rows and columns that intersect to form cells. Two different types of cells exist: Table cell that contains data, is created with the A cell that
More informationMicrosoft Expression Web Quickstart Guide
Microsoft Expression Web Quickstart Guide MS-Expression Web Quickstart Guide Page 1 of 24 Expression Web Quickstart Guide (20-Minute Training) Welcome to Expression Web. When you first launch the program,
More informationAbout Netscape Composer
An About Netscape Composer The pictures and directions in this handout are for Netscape Composer that comes with the Netscape Communicator 4.7 package available for free from Netscape s web site at http://www.netscape.com.
More informationDo It Yourself Website Editing Training Guide
Do It Yourself Website Editing Training Guide Version 3.0 Copyright 2000-2011 Sesame Communications. All Rights Reserved. Table of Contents DIY Overview 3 What pages are editable using the DIY Editing
More informationEditing Drupal 7 Sites. Basic page editing. June To begin editing, log in by clicking Login at the bottom of the homepage. Username.
Editing Drupal 7 Sites June 2013 Basic page editing To begin editing, log in by clicking Login at the bottom of the homepage Username Password Navigate to the page you want to edit Click the Edit tab at
More informationUsing Dreamweaver CS6
Using Dreamweaver CS6 4 Creating a Template Now that the main page of our website is complete, we need to create the rest of the pages. Each of them will have a layout that follows the plan shown below.
More informationFrontPage 98 Quick Guide. Copyright 2000 Peter Pappas. edteck press All rights reserved.
Master web design skills with Microsoft FrontPage 98. This step-by-step guide uses over 40 full color close-up screen shots to clearly explain the fast and easy way to design a web site. Use edteck s QuickGuide
More informationMicrosoft FrontPage. An Introduction to. Lecture No.1. Date: April Instructor: Mr. Mustafa Babagil. Prepared By: Nima Hashemian
An Introduction to Microsoft FrontPage Lecture No.1 Date: April 20. 2007 Instructor: Mr. Mustafa Babagil Prepared By: Nima Hashemian 2006 An Introduction to FrontPage Mathematics Department Eastern Mediterranean
More informationCreating Interactive PDF Forms
Creating Interactive PDF Forms Using Adobe Acrobat X Pro for the Mac University Information Technology Services Training, Outreach, Learning Technologies and Video Production Copyright 2012 KSU Department
More informationQRG: Using the WYSIWYG Editor
WYSIWYG Editor QRG: Using the WYSIWYG Editor WYSIWYG stands for What You See Is What You Get. The WYSIWYG Editor is the reason you don t need to be an IT Programmer to write content for your web page.
More informationCreate, Add, and Manage Videos
CHAPTER 4 Revised: May 31, 2011 Topics in this section describe ways that you can contribute video and supplemental files to your Cisco Show and Share community. Prerequisites, page 4-1 Procedures, page
More informationClipArt and Image Files
ClipArt and Image Files Chapter 4 Adding pictures and graphics to our document not only breaks the monotony of text it can help convey the message quickly. Objectives In this section you will learn how
More informationFireworks 3 Animation and Rollovers
Fireworks 3 Animation and Rollovers What is Fireworks Fireworks is Web graphics program designed by Macromedia. It enables users to create any sort of graphics as well as to import GIF, JPEG, PNG photos
More informationCROMWELLSTUDIOS. Content Management System Instruction Manual V1. Content Management System. V1
Content Management System Instruction Manual V1 www.cromwellstudios.co.uk Cromwell Studios Web Services Content Management System Manual Part 1 Content Management is the system by which you can change
More informationADOBE Dreamweaver CS3 Basics
ADOBE Dreamweaver CS3 Basics IT Center Training Email: training@health.ufl.edu Web Page: http://training.health.ufl.edu This page intentionally left blank 2 8/16/2011 Contents Before you start with Dreamweaver....
More informationMicrosoft Excel 2000 Charts
You see graphs everywhere, in textbooks, in newspapers, magazines, and on television. The ability to create, read, and analyze graphs are essential parts of a student s education. Creating graphs by hand
More informationFrontPage 2000 Tutorial -- Advanced
FrontPage 2000 Tutorial -- Advanced Shared Borders Shared Borders are parts of the web page that share content with the other pages in the web. They are located at the top, bottom, left side, or right
More informationCorel Ventura 8 Introduction
Corel Ventura 8 Introduction Training Manual A! ANZAI 1998 Anzai! Inc. Corel Ventura 8 Introduction Table of Contents Section 1, Introduction...1 What Is Corel Ventura?...2 Course Objectives...3 How to
More information< building websites with dreamweaver mx >
< building websites with dreamweaver mx > < plano isd instructional technology department > < copyright = 2002 > < building websites with dreamweaver mx > Dreamweaver MX is a powerful Web authoring tool.
More informationDREAMWEAVER QUICK START TABLE OF CONTENT
DREAMWEAVER QUICK START TABLE OF CONTENT Web Design Review 2 Understanding the World Wide Web... 2 Web Browsers... 2 How Browsers Display Web pages... 3 The Web Process at Sacramento State... 4 Web Server
More informationVirus from hack - Original page
Virus from hack - Original page Virus Adding images to your web pages File types Most web browsers support 3 types of image files.jpg.gif.png Simplified definition of usage: JPG s used for big images (most
More informationAll Creative Designs. Basic HTML for PC Tutorial Part 1 Using MS Notepad (Version May 2013) My First Web Page
All Creative Designs Basic HTML for PC Tutorial Part 1 Using MS Notepad (Version May 2013) My First Web Page Step by step instructions to build your first web page Brief Introduction What is html? The
More informationIndependence Community College Independence, Kansas
Independence Community College Independence, Kansas C O N T E N T S Unit 1: Creating, Modifying, and Enhancing FrontPage Webs and Pages 1 Chapter 1 Investigating FrontPage 2002 3 Exploring World Wide Web
More informationChapter 1 Introduction to Dreamweaver CS3 1. About Dreamweaver CS3 Interface...4. Creating New Webpages...10
CONTENTS Chapter 1 Introduction to Dreamweaver CS3 1 About Dreamweaver CS3 Interface...4 Title Bar... 4 Menu Bar... 4 Insert Bar... 5 Document Toolbar... 5 Coding Toolbar... 6 Document Window... 7 Properties
More informationThis Tutorial is for Word 2007 but 2003 instructions are included in [brackets] after of each step.
This Tutorial is for Word 2007 but 2003 instructions are included in [brackets] after of each step. Table of Contents Get Organized... 1 Create the Home Page... 1 Save the Home Page as a Word Document...
More informationRecitation 3 Further Work with Dreamweaver and Photoshop: Refining your Web Site
Recitation 3 Further Work with Dreamweaver and Photoshop: Refining your Web Site More Photoshop skills Selecting areas of the image - using the selection tools In Recitation 2 we learned there are several
More informationAGENT123. Full Q&A and Tutorials Table of Contents. Website IDX Agent Gallery Step-by-Step Tutorials
AGENT123 Full Q&A and Tutorials Table of Contents Website IDX Agent Gallery Step-by-Step Tutorials WEBSITE General 1. How do I log into my website? 2. How do I change the Meta Tags on my website? 3. How
More informationPART 7. Formatting Pages
PART 7 Formatting Pages In the preceding part, you learned how to format characters and paragraphs. In this part, you learn how to apply formatting that affects entire pages. You ll start with changing
More information