CIS 3630 - Test 2b.txt

  1. Creating links
    Allow readers to view topics, online information in a non-linear manner, which means that a Web site visitor does not have to read one page after another in a specific order
  2. Hyperlink / link
    • Text or an image that serves as a link
    • XHTML code that serves as a navigation point to another section of the same document, to another document, or to another Web site
    • Can be a text or an image

    • Using links, could be:
    • 1. A specific place on the Web page
    • 2. A different Web page at your Web site
    • 3. A different Web site

    A powerful feature of Expression Web is that it keeps track of all the links for your Web pages, which is why it's critical that you perform all your file management tasks using the Folder List task pane. For example, if you have a file that has hyperlinks, and if you move a file from one folder to another in the Folder List task pane, Expression Web will automatically update the XHTML code that establishes the links.
  3. Broken link
    • A link that does not function as intended
    • A link that does not work; may be an error in the XHTML code, the page may have been moved, or maybe the file or the Web site no longer exists
  4. Hyperlink view
    • Provides a diagram of all files that link to a selected file or are linked from a selected file
    • A view in Expression Web that shows the relationship between a page and the Web's hyperlinks
  5. Uniform Resource Locator (URL)
    Complete address of the Web site and page you view in the browser
  6. Communications protocol
    A series of agreed-to standards for sending voice, data, and video over communications lines
  7. Domain name
    Registered name of the file server where the pages for a particular Web site are stored
  8. Suffix
    • Also known as a top-level domain name, follows the domain name for Web sites
    • Further defines the nature of the Web site
    • Common suffixes include .com, .net, .edu, and .org
  9. Path
    Folder or folder directory of the Web page stored on the server
  10. Entering URL in a browser's Address text box
    • URL for a Web page has the following components: protocol://service/domainname.suffix/path/filename
    • For example, in the URL
    • * http is the protocol
    • * www is the service
    • * expressionusers is the domain name
    • * .org is the suffix
    • * tutorials is the path
    • * default.htm is the name of the Web page you are viewing
  11. Cybersquatting
    • Registering, trafficking in, or use of a domain name with the intent to profit from a trademark that belongs to someone else
    • The goal is not to use the domain name for personal use, but to buy and sell the domain name and make a substantial profit on the "investment"
    • Cybersquatters sometimes register variations of popular trademarked names, a technique known as typosquatting
  12. Link text
    Text, when clicked, serves as the source for a link
  13. Image map
    Single image is used as a source for several links
  14. Bookmark / anchor
    • Helps visitors locate a topic or a specific place on a Web page; great way for visitors to find what they want easily and efficiently
    • A place/location within a document that is used as a target to a link
    • Can be either text or image
    • XHTML refers to a Bookmark as an anchor
    • Once you create a Bookmark, you then create a link to the Bookmark
  15. Creating a Bookmark
    • Select the text to be used as the Bookmark
    • Click Insert on the menu bar, and then click Bookmark (or press the Ctrl + G keys)
    • In the Bookmark dialog box, enter a name for the Bookmark in the Bookmark name text box
    • Alternatively, select the text and then press the Ctrl + G keys

    Regardless of the order of which you create the Bookmark dialog box, Expression Web lists the Bookmarks in the order they appear on the page, from top to bottom
  16. Fold
    • The bottom of the first screen of a home page
    • If your home page is several screens long, you should create Bookmarks past the fold so that readers do not have to scroll to locate what they want
    • You should create Bookmarks even for items that appear before the fold
    • It's possible that your Bookmarks will be moved; what currently appear without difficulty at the top of the page might end up being moved to the middle or the bottom of the page
    • If the Web page is several screens long, make sure you don't strand the reader at the bottom of a page - include links back to the top of the page, the next (if there is one), the previous page (if there was one), and the home page (if the user is not already viewing there).
  17. To clear (delete) a Bookmark
    • Right-click the Bookmark
    • Click Bookmark Properties
    • Click the Clear button
  18. Tracer
    In Design view, a visual representation of the location of a Bookmark
  19. Tips about link text
    • In the link text, avoid meaningless expressions such as "click here." Choose text that describes the section of the page that readers see when they click the link text
    • The text in the link to a Bookmark does not have to match the text in the heading
  20. Linking to a Bookmark
    • Select the text to be used as the link
    • On the Common toolbar, click the Insert Hyperlink botton (or press the Ctrl + K keys)
    • In the Insert Hyperlink dialog box, click "Place in This Document" in the Link to bar
    • In the "Select a place in this document" panel, click the name of the Bookmark to which you want to link. (If you also want to provide a ScreenTip for the link, click the ScreenTip button. In the Set Hyperlink ScreenTip dialog box, enter the ScreenTip text.)
  21. Ctrl + G
    Create a Bookmark button
  22. Ctrl + K
    Insert Hyperlink button
  23. Definition lists
    • They make an excellent source for Bookmarks because a definition list is commonly used to create a chronology, which is a list of events in time or date order from first to last
    • Also commonly used to create a Works Cited page, where there is an alphabetic list of author names and other references
    • Also, often used to create a "question and answer" layout, where the question is on the first line and the answer is on the line(s) below the question
    • In the XHTML code, a definition list begins with the start [dl] tag. The start [dl] tag is followed by the defined term. The defined term is preceded by a start [dt] tag and ended with an end [/dt] tag. The definition data comes next. The definition data is preceded by a start [dd] tag and ended with an end [/dd] tag. An end [/dl] tag comes last.
    • Another advantage of using a definition list is that you can style the [dt] and the [dd] elements as you want. Expression Web makes it very easy to compose a definition list. As usual, all of the XHTML code is created for you.
  24. Referring page
    • The page that serves as a source for a link
    • The page where the link is included
  25. Target page
    • The page that is the object of a link
    • The page that appears when the user clicks the link
    • The page that will open
  26. Creating a link to another page
    • Select the word(s) to use for the link text
    • Click the Insert Hyperlink button on the Common toolbar
    • Click Existing File or Web page in the Link to bar
    • Click Current Folder or Browsed Pages to locate the Web page
    • Select the Web page to which you want to link
  27. Placeholder page
    • When you design the home page, it's common that the other pages of the site do not yet exist
    • Page that is still in the early stages of development
    • Typically has little or no content, but it still can be used as a target page for links
    • Later, the placeholder pages will be developed and given more content
    • You can use Expression Web to link to a page that is created or to one that is not.
    • You don't have to create the placeholder pages. Expression Web can create a link to an existing page or to one that does not yet exist.
  28. Create link placeholders
    • Web site development takes time. Developers don't always know what pages will be linked to the home page, and perhaps most or all of the pages to which the home page will link have not yet been created. Instead of creating placeholder pages (which takes time), developers can create placeholder links, using the # character. The developer would create an unordered list, but instead of using the actual filenames for the document links, the developer would use the # placeholder character instead. The list of placeholder links might look like this:
    • [ul]
    • [li][a href = "#"]Poodles[/a][/li]
    • [/ul]
    • The # placeholder character will give the appearance of the link, but the link will not actually do anything. The names of the actual pages to link to can be added later as those pages are created and developed.
  29. Magic targets
    • The group of special targets that determine where a linked document will be displayed
    • Although there is nothing magical about them, several target values have special meaning in XHTML
    • By changing the target setting, you can control what happens when a user clicks a link
    • The magic target of _top replaces the current browser window with a new Web site. Only one browser window remains open after the user has clicked a link
    • When you use the magic target of _blank, the link will open in a new browser window (or tab), but the other browser window will remain open
    • To open a document in the same window as the link, specify target as _self
    • Expression Web refers to the magic target of _blank as New Window, _top as Whole Page, and _self as Same Frame
  30. Creating an e-mail link
    • Select the word(s) for the link text
    • Click the Insert Hyperlink button
    • Click the E-mail Address button in the Link to bar
    • Enter the e-mail address
    • Optionally, enter a Subject

    • To send an e-mail, you must use the mailto: protocol, not the http protocol
    • As you type the e-mail address, Expression Web will automatically enter the mailto: protocol before the e-mail address
  31. Protocol
    An agreed-to standard for sending data over various media
  32. Using images with links
    • Images such as arrows and pointers are commonly used as navigational icons
    • Images that guide the reader from one place to another on Web sites are called navigational icons
    • If you use an image as a link, it's always a good idea to have some link text, just in case the user has set preferences in the browser to not display images
  33. Styling an image used as a link
    • To create some white space between the text and the image, you can use the margin property
    • Because this image appears at the left edge of the screen, it's a good idea to add some margin space above and to the right of the image
    • By default, a 2-pixel blue border is placed around an image used as a link; most Web designers remove this blue border around the image
    • Also, by default, the bottom of the image is aligned with a line of text beside it
    • You can use the vertical-align property to position the image so that the image is centered vertically
    • Although there are several values for the vertical-align property, the 3 most widely supported values are top, middle, and bottom
  34. Linking to other types of files
    • You can link to any file, not just XHTML files such as Microsoft Word, Adobe PDF, or multimedia file like .wav or .swf file
    • You should always include some text on your Web page that identifies the file as non-XHTML file
    • In the link to a non-XHTML file, include the file extension in the link text so that visitor will know the link is not to another Web page or Web site, but to a file from another software program. For example: Download the Word 2007 file: anniversary.docx or download the Adobe PDF file: anniversary.pdf. If you don't have Adobe Reader, you can download the free Adobe Reader software from the Web site.
    • When creating a link to a non-XHTML file, be sure that you specify a path to the document on the file server where the file will be stored, or include the document as one of the files in the Web site
  35. CSS Pseudo-class selector
    • Pseudo means "not genuine"
    • A selector for which there is no XHTML equivalent
    • For common pseudo-class selectors:
    • 1. a:link: Changes the appearance of link text for links that have not yet been visited; because you want your unvisited links to stand out, use bright colors for these links
    • 2. a:visited: Changes the appearance of link text for links that have been visited; because you don't want your visited links to stand out, use darker colors for these links; it's also common to remove any text decoration (underlining) in visited links
    • 3. a:hover: Changes the appearance of link text when the pointer hoves over a link; don't change the point size of the link text; however, it is common to change the color and add a contrasting background color to the link text
    • 4. a:active: Changes the appearance of link text when the visitor clicks a link; use a bright color

    CSS pseudo-class selectors allow you more variety in choosing the appearance of links and visited links. In addition, CSS can add "mouse over" (rollover) effects so that when the user passes the mouse pointer over a link, the link text can appear, for example, in a different color, background color, or font.

    • The order of the pseudo-classes does matter:
    • 1. The a:hover must be placed after the a:link and a:visited rules; otherwise, specificity will hide the color property of the a:hover rule
    • 2. The a:active must be placed after a:hover; otherwise, the active color will appear when the user clicks a link or hovers the pointer over the link
    • 3. To help you remember the correct order of styling pseudo-class selectors, use a mnemonic such as "Little Victor hates apples."

    • In the Firefox browser, the a:visited pseudo-class selector will not work unless the "Remember visited pages for the last_days" text box has a value greater than 0 (You will find this setting in the Options dialog box).
    • The a:visited works in Internet Explorer even if the "Days to keep pages in history" setting in the Options dialog box has a value of zero.
    • If you are testing visited links and want to refresh the screen in Internet Explorer or Firefox, clear or delete the browsing history in either browser, and then refresh the window.

    • The pseudo-class selectors can partially be styled as part of the page properties. However, the only option in the page properties is change the link color.
    • You can change the appearance of pseudo-selectors by modifying the code in Split view or Code view or modifying the style.

    It's common to change the link colors and remove the underscoring from visited links. However, do not change the point size of the text (it can be distracting) or create overly complex link styles
  36. Changing hyperlink colors
    • Right-click anywhere in the Editing window
    • Click Page Properties
    • Click the Formatting tab
    • Click the list arrow next to the corresponding hyperlink color option
    • Click a color

    By default, most browsers indicate links by underlining the link text and displaying the text in blue. After you click a link, it becomes a visited link, and the text and underline appear in purple
  37. Working with the Hyperlinks View
    • Click a page/document in the Folder List task pane
    • Click Site on the menu bar
    • Click Hyperlinks
    • Click the Hyperlinks button to see a diagram of the links for that file
  38. Verifying a Hyperlink
    • Click Task Panes on the menu bar
    • Click Hyperlinks
    • In the Hyperlinks task pane, click the "Verifies hyperlinks in the current web" button
    • Click Start in the Verify Hyperlinks dialog box
  39. Managing hyperlinks
    • You can also manage hyperlinks through the Hyperlinks task pane, which has 3 buttons to manage links:
    • 1. Use the "Verifies hyperlinks in the current Web" button to check the status of external links
    • 2. Use the Edit Hyperlink button to change the path for a link, either for the page or for the entire Web site
    • 3. Click the Show Internal Hyperlinks button to list all of the internal hyperlinks (such as Bookmarks) for the Web site

    Before working with the Hyperlinks task pane, it's a good idea to choose Save All from the File menu to ensure that the most recent versions of all documents are available
  40. _blank
    The magic target that opens a linked document in another browser window
  41. _self
    The magic target that opens a linked document in the same browser window frame
  42. _top
    The magic target that opens a linked document in a same browser window, took over the before link
  43. a:active
    A pseudo-class selector that changes the appearance of link text when the user clicks a link
  44. a:hover
    A pseudo-class selector that changes the appearance of link text when the pointer hovers over the link
  45. a:link
    A pseudo-class selector that changes the appearance of link text for links that have not yet been visited
  46. a:visited
    A pseudo-class selector that changes the appearance of link text for links that have been visited
  47. Anchor
    The term for how XHTML refers to an Expression Web Bookmark
  48. Link state
    One of the XHTML pseudo-selectors, such as link, hover, and active
  49. Chronology
    A list of events in time or date order from first to last
Card Set
CIS 3630 - Test 2b.txt
Chapter 5 only