Training Sister Hicks

Size: px

Start display at page:

Download "Training Sister Hicks"

Claire Deirdre Stevenson
5 years ago
Views:

1 VMT CONSULTING Hand-out Vernell Turner 5/18/2016

2 2 Training Agenda 1. Images 2. Web Pages General 3. FBH Website

3 3 Images Tips for Using Images in a MS Word Document: 1. Type your text first before inserting an image if possible. 2. Use the Picture Tools menu tab to change text wrapping. By default, pictures are inserted In Line with Text. This option limits how and where you can move an image. 3. Experiment with the various wrapping options and other options on the Picture Tools menu. 4. Position Predefined image positions with text wrapping. 5. Avoid distorting your picture when you resize them. Pull by the corners not the horizontal or vertical handles. 6. Crop and/or resize your pictures if needed. Example: Open a new document. Type: =rand(3,8) This function with the options listed will create 3 paragraphs with 8 sentences of random text Place your cursor where you want to insert a picture. Select Square as your text wrapping option. Text should wrap around the border of the image. Move the image and text will reflow around it. Select Tight text should wrap tightly around the image use this for irregular shaped images. Select In Front of Text image will cover text. This is mostly used with watermarks. Select Top and Bottom the image will get its own line. Select Through is almost the same as tight, except it allows text to fill holes in the image depending on the wrapping points. You can edit the wrapping points. Select Behind the Text text will display over the image. But it may be hard to select the image or move it after you choose this option (you may have to move the text).

4 4 Web Pages Fundamentally, when you look at a webpage in a Web browser (IE, Firefox, Chrome, Safari), you see words. But most of the time web pages contain styled text rather than plain text. Web pages may also contain images, video clips, and background music. They may include dropdown menus, search boxes, or links you can follow to access other pages (whether on the same site or another site). A typical webpage depends on several technologies (such as CSS, JavaScript, Flash, etc.) to control what the end-user sees, but most fundamentally, developers write web pages in HTML, without which there can be no web pages. To display the page on a client-side device, a browser starts out by reading the HTML. HTML (Hyper Text Markup Language) is a markup language. It is a language with specific syntax that instructs a Web browser how to display a page. HTML separates "content" (words, images, audio, video, and so on) from "presentation" (instructions for displaying each type of content). HTML uses a pre-defined set of elements to define content types. Elements contain one or more "tags" that contain or express content. Tags are enclosed by angle brackets, and the closing tag begins with a forward slash. HTML attaches special meaning to anything that starts with the less-than sign ("<") and ends with the greater-than sign (">"). Such markup is called a tag. Make sure to close the tag, as some tags are closed by default, whereas others might produce unexpected errors if you forget the end tag. For example: <p></p> - paragraph tag and its associated closing tag HTML documents are written in plain text. You can write HTML in any text editor that lets you save content as plain text (e.g. Notepad, Notepad++, or Sublime Text), but most HTML authors prefer to use a specialized editor that highlights syntax, allows creation and editing of style sheets and other functions associated with a page Dreamweaver and CoffeeCup are examples of specialized editors that use a WYSIWYG interface to build HTML.

5 5 Example: We are going to build a small web page. In preparation, create a folder name it web-pages. Open Notepad and type the following: <html> <head> <title>sister Hicks 1 st Web Page</title> </head> <body> <h1>my 1 st Web Page</h1> <p>this is my very first web page. It s not hard to do at all.</p> </body> </html> Save the file in your web-pages folder as hicks1.html. Be sure to change the document type when you save it to html or htm Now: let s look at our web page in the browser window: Use File Explorer to locate your file within the web-pages folder. Right-click on the folder and choose the Open With option select the browser you want to use to view the page. The code above contains the basic elements of any web page. It must start with the tag identifying that the code is HTML. All, the text within the tag will appear in the browser title bar. The content you want to display on your web page will appear within the BODY tag. <p> is a paragraph tag that indicates the text following it is a new paragraph. Example: Let s add an image to the web page. Find an image and copy it to your web-pages folder. Copy hicks1.html as hicks2.html Open hicks2.html

6 6 Anywhere within the BODY tag, type the following: <img src= name of your image including the file suffix > Save your file. Now, let s look at our web page in the browser. FBH Website The website needs to be redesigned. It s 14 years old and the dynamic menu code does not work on all browsers. Users need to use the Site Map links to navigate the site, but there are no directions to alert them to that fact. I have prepared a redesign document to highlight why we should redesign, define the goals of a new site, and understand the issues with content on the current site (to avoid repeating those issues in the redesign). You can read the redesign document on that page to understand what I m trying to do at I welcome your comments and suggestions. The webpage referenced above also lists my plan of action Currently I am working on Content Inventory. I have the inventory lists, but I need help to review the pages of content. For sure, I need to purchase a content management system so that designated persons can assist in keeping their content up to date. Training will be provided, but you wouldn t have to learn to code.

HTML. Mohammed Alhessi M.Sc. Geomatics Engineering. Internet GIS Technologies كلية اآلداب - قسم الجغرافيا نظم المعلومات الجغرافية

HTML. Mohammed Alhessi M.Sc. Geomatics Engineering. Internet GIS Technologies كلية اآلداب - قسم الجغرافيا نظم المعلومات الجغرافية HTML Mohammed Alhessi M.Sc. Geomatics Engineering Wednesday, February 18, 2015 Eng. Mohammed Alhessi 1 W3Schools Main Reference: http://www.w3schools.com/ 2 What is HTML? HTML is a markup language for