|
|
| (44 intermediate revisions by 6 users not shown) |
| Line 1: |
Line 1: |
| | [[Image:GoLive1.png|frame|right]] | | [[Image:GoLive1.png|frame|right]] |
| − | '''Adobe GoLive CS2''' is the latest version of [[Adobe GoLive]], a [[website]] creation tool, written by [[Adobe]]. GoLive CS2 is used throughout campus to maintain the 鶹Ƶ website, and is currently used in the [[Culpeper Language Center]] by the Spanish and French sections to create [[ePortfolios for Culpeper|ePortfolios]].
| + | GoLive CS2 is no longer the primary program used at 鶹Ƶ for maintaining websites. [[Adobe Contribute|Contribute CS5]] was also a former program used at 鶹Ƶ for maintaining websites. For more information visit the Contribute wiki article. Below are the instructions for using GoLive CS2. |
| − | <div class="clear"></div>
| |
| | | | |
| − | ==Working with sites==
| + | '''Adobe GoLive CS2''' is the last version of [[Adobe GoLive]], a [[website]] creation tool, written by Adobe. GoLive CS2 was used to be used throughout campus to maintain the 鶹Ƶ website, but is no longer supported and has been since been replaced by [[Concert]]. |
| − | While GoLive allows one to directly connect to and edit files on the web server with its built-in [[FTP]] browser, this method is '''not''' recommended for editing 鶹Ƶ websites, because new [[hyperlinks]] and embedded files can sometimes be referenced from the user's local computer rather than the web, causing them not to work.
| |
| | | | |
| − | Instead, users should use either a '''GoLive site''' if only one person is maintaining a website, or if multiple people need to maintain the same site, a '''Version Cue site''' should be set up to ensure that people don't overwrite each other's work.
| + | ==See also== |
| − | * [[/Site|Using a site]]
| + | * [[Adobe Contribute]] |
| − | * [[/Version Cue site|Using a Version Cue site]]
| + | * [[鶹Ƶ template]] |
| − | | |
| − | ==Content==
| |
| − | Writing for the [[Web]] is fundamentally different than most styles of writing and document creation. Most of the content should be organized into concise, easy-to-skim sections, limiting each paragraph to one idea. And '''keyword highlights''' like [[hyperlink|links]] and bold text are a great way to empasize text, as long as they're not overused. For example, making entire paragraphs or even whole sentences bold is usually ineffective.
| |
| − | | |
| − | When organizing a site, careful thought must be put into '''who your audience is''' and what they're looking for. '''Define ultimate goals''' and objectives for your website. Decide what information is most important and thus needs to be the easiest for visitors to find.
| |
| − | | |
| − | You should make an outline of your site and base its file structure around that. Put yourself in your audience's shoes. What information do visitors look for most frequently? What's the most important? On the web, it's better to err on the side of making information glaringly obvious than having it be obscure and hidden.
| |
| − | | |
| − | ==Formatting== | |
| − | [[HTML]] is the language of the web, and HTML code lies behind every webpage you see. While <acronym title="What You See is What You Get">WYSIWYG</acronym> editors like Adobe GoLive give people the power to author webpages without requiring a working knowledge of HTML, the program can also produce clunky, semantically incorrect code.
| |
| − | | |
| − | In HTML code, information is organized into '''elements''' by surrounding text and other content in '''tags'''. These tags have very specific semantic meanings which reflect what type of information is contained in the element:
| |
| − | ===Paragraphs===
| |
| − | A '''paragraph''' (<code><p></code> tag) is a simply a collection of text sentences.
| |
| − | ===Headings===
| |
| − | [[Image:GoLiveHeading.jpg|thumb|right|Creating headings in [[GoLive_CS2|Adobe GoLive]]]]'''Headings''' (<code><h1></code>, <code><h2></code>, ..., <code><h6></code> tags) are short pieces of text found at the beginning of sections of content. They are used to help give a document a hierachrical structure. | |
| − | | |
| − | The higher a heading number, the more specific or nested in the hierachrical structure it is. Generally you should start off your page with an <code><h1></code> heading and as you need more specific subsection headings, work your way up incrementally to larger heading levels.
| |
| − | | |
| − | However, if you're creating pages using the [[鶹Ƶ Template]], there's already a 鶹Ƶ <code><h1></code> heading and a <code><h2></code> heading for your page's title, so if you have to seperate your content into sections, you should consider the <code><h3></code> heading level to be the most broad.
| |
| − | | |
| − | ===Lists===
| |
| − | [[Image:GoLiveLists.jpg|thumb|right|Creating lists in [[GoLive_CS2|Adobe GoLive]]]]'''Lists''' (<code><ul></code> or <code><ol></code> tags, containing items in <code><li></code> tags) are a common way of organizing information on the web. If you find yourself listing several things in a sentence with a lot of commas, chances are that information would make more sense in a list. However, instead of manually typing in asterisks, hyphens, or numbers, HTML offers a specific container for lists.
| |
| − | | |
| − | There are a couple ways to create a list. One way is to make the list by putting several items on new lines, then highlight the collection and click the '''Numbered List''' or '''Unnumbered List''' button, depending upon what kind of list it is. Alternatively, you can go to a new line and click one of those buttons to start typing the list, and hitting the '''Enter''' or '''Return''' key will take you to the next list item. Click the same button in the toolbar again to return to normal editing mode.
| |
| − | | |
| − | ===Tables===
| |
| − | '''Tables''' are one of the most frequently abused HTML elements. The tables element was a great innovation back when HTML was still in its infancy, because it allowed developers to arrange text and images in more complex layouts than was previously possible. However, since the introduction of [[CSS]] in the late 1990's, the practice of using tables for layout purposes has become increasingly deprecated and undesirable. It should be avoided on the web today, as it adds a lot of semantically incorrect bulk to a page's code and makes your page [[inaccessible|accessibility]].
| |
| − | | |
| − | Tables are only meant for '''tabular data'''. If you have a two-dimensional array of data (i.e. where the cells in a column are related to each other '''and''' the cells in a row are related to each other), you should use a table to display the information. Otherwise, you should stick to basic HTML elements that more accurately describe your content, then use '''CSS''' to control the look and feel of those items. Contact [[web services]] if you'd like more advanced help with this.
| |
| − | | |
| − | A common question about tables in GoLive is how to add a new row to the end of an existing table. If you place your cursor at the end of the last cell in the table and press tab, a new row should appear. You can also go '''Special > Table > Insert Row Below'''.
| |
| − | | |
| − | ===Anchors===
| |
| − | '''Anchors''' elements are used to create [[hyperlink|hyperlinks]] to other documents or to create a named bookmark in-page which other anchors can link directly to.
| |
| − | | |
| − | To create an anchor, highlight the item you want to become the link (such as text or an image), then in the [[inspector]] either enter the location of the page you're linking to if you're creating a link, or enter a unique name and id if you're creating an in-page bookmark.
| |
| − | | |
| − | Try to make your link text as descriptive as possible. Avoid generic link text like "click here."
| |
| − | | |
| − | ===Images===
| |
| − | '''Images''' can be a great way to enhance a webpage, if used properly. Images are most effective when they are directly related to the text content that they're next to.
| |
| − | | |
| − | If you're using a [[GoLive_CS2/Site|GoLive site]] or [[GoLive_CS2/Version_Cue_site|Version Cue site]], you need to move an image (and actually any file) into your site before you can use it in a webpage. Simply drag the file from your local computer into the site.
| |
| − | | |
| − | There are several ways to insert an image into a page. The easiest is to simply drag and drop the image from your site into a webpage. Alternatively, you can drag the image icon from the '''Tools''' window into your document as a blank image placeholder, then click on the placeholder and in the '''inspector''', specify the source of the image (the file location).
| |
| − | | |
| − | Be sure to give your image an '''Alt Text''' value in the '''inspector'''. This will make your webpage more accessible.
| |
| − | | |
| − | ====Resizing====
| |
| − | While it seems like Adobe GoLive gives you the ability to adjust an image's width and height in the inspector or by clicking and dragging the corner of the image, this only just adjusts the dimensions to which a user's [[web browser|browser]] will ''render'' the image. This means that larger images will still take a long time to download, even if they're ''displayed'' smaller on the page. The best way to resize a picture is to edit it in an external program first, like [[Adobe GoLive]].
| |
| − | | |
| − | ====My picture doesn't show up====
| |
| − | There could be a few different reasons for this:
| |
| − | *You may need to simply refresh your web browser; [[right-click]] within the part of you page where the image should be and choose '''refresh''' or '''reload'''.
| |
| − | *The [[path]] of the image source might be wrong;
| |
| − | **Click on your image in GoLive and look at the '''Source''' field. If this field starts off with a local drive or several [[Path#Special_Symbols|parent path symbols]] ("../../../"), you should re-specify the path of the source. Either reinsert the picture or use the [[Fetch URL]] tool to select the image in your site.
| |
| − | If the image still doesn't show up, please contact [[Web Services]] for assistance (or if you're working on an [[ePortfolio]], please ask a center assistant or [[Alison Sommer]] for help).
| |
| − | | |
| − | ==Frequently asked questions==
| |
| − | These FAQs are intended as a help guide for students using GoLive for to create and maintain language [[ePortfolios for Culpeper|ePortfolios]]. Please see the center assistants or Culpeper director for any additional help.
| |
| − | | |
| − | ===How do I create a new .html document?===
| |
| − | There are two ways to create a new .html document if you are working with one of the pre-constructed language templates. The easiest way is to open the document “blank.html” and choose “save as” and name it something new, this will create a new .html file without erasing the “blank.html” file. Or you can right-click within the GoLive directory and choose New > HTML Page. If you are not owrking within the template, the second option will be the only option available to you.
| |
| − | | |
| − | ===How do I change the background or text colors?===
| |
| − | First, click on the button marked “properties” on your site page, a new set of options should then appear in the inspector, check the box next to the color you wish to change, then go to the color pallet bellow and pick a color.
| |
| − | | |
| − | ===How do I add a sound file?===
| |
| − | Adding a sound file is essentially the same as adding an image, but instead of dragging the image icon over, you will choose the sound icon. Then follow the same steps as for an image.
| |
| − | | |
| − | ===My sound file shows up as a black box, what’s wrong?===
| |
| − | The program might have the sound type wrong. Click on the sound icon and then look over at the inspector, make sure to choose the “Audio Basic” option under the MIME menu.
| |
| − |
| |
| − | If that doesn’t fix you file make sure your file is in .mp3 format, if not you will have to fix the file before you will be able to embed it to make it an mp3 (use [[Audacity]] for this).
| |
| − | | |
| − | ===How do I italicize, bold or change the font size?===
| |
| − | Up at the top of the program there are these choices, much like in Word, they just look a bit different, as they are all demonstrated using the letter T. Simply select the text you with to make bold or italic, then clic on the appropriate button above.
| |
| − | | |
| − | ===How do I add an e-mail link?===
| |
| − | To add an [[e-mail link]] to your web page, first select the text that you want to make a link. Then, in the link source box in the Inspector palette, type <nowiki>"mailto:username@gustavus.edu"</nowiki> without the quotes and replace the e-mail address with the e-mail address you would like to link. Finally, press the return key to set your link.
| |
| − | | |
| − | Note: it may be be more usable to use your full name as the text for your e-mail link, rather than your actual email address.
| |
| − | {{GoLive help}}
| |
| | | | |
| | ==External link== | | ==External link== |
