Microsoft Word Week 1 Hot Potatoes Software Heidi Edit docx
Yüklə 316,08 Kb. Pdf görüntüsü
|
- Bu səhifədəki naviqasiya:
- What is HTML
- Embedding Code into Hot Potatoes
|
HOT POTATOES PLUS:
ADDING IMAGES Once you have the basics of Hot Potatoes, it is easy to branch out to more sophisticated activities. The key is to take your time, play with all the available options, and allow for failure. While the below instructions can seem very technical, it breaks down to three basic pieces of computer code. With only these three pieces of code, a wide variety of activities can be made. What is HTML? Hyper Text Markup Language is the language that makes web pages possible. It works by containing instructions within a set of < > brackets. These brackets tell the computer that the information inside them is a set of instructions. For example a word in bold in HTML looks like this: Hot Potatoes. If this were placed on a webpage all the reader would see is Hot Potatoes. americanenglish.state.gov Embedding Code into Hot Potatoes A great place to practice embedding code into Hot Potatoes is with an image. 1. Begin by creating a new Hot Potatoes activity. Like the example above, a JQuiz is a good place to practice. 2. After starting a new activity, be sure to save it first. This will create a working .jqz file of the activity. Be sure to save the file in its own folder. 3. To embed an image into the activity, the HTML image code is needed: a. cat.jpg" alt="Cat" > b. What is important to remember with HTML code is that text appearing between the “quotations” can be changed and the code will still work. For example in the code above ="width:304px;height:228px;" can be changed to ="width:500px;height:500px;" and the code will run with a new image size. c. Important: If you use an image saved locally (on the computer), keep it in the same folder as the Hot Potatoes activity. If it is not in the same folder, the Hot Potatoes activity will not find the image, and it will not appear in the activity. 4. By adding the code into the question text block, the image appears as part of the question. a. Remember – the final activity will read everything within the < > as instructions. 5. After the code has been inserted and the .htm file produced, the image will be displayed in the activity. 6. If the picture is too large or too small, the size can be changed by adjusting the width and height. a. For practice, change the numbers in the "width:304px;height:228px;" in the activity. Save the file and then change the width and height numbers. See how the image changes size. 7. This code is extremely flexible and can be used to include images from the internet as well. a. For example: Let’s start with the code cat.jpg" alt="Cat" > The cat.jpg can be replaced with the web address of an image. |