Imperial Valley College Faculty Websites

You are here:Instructors»Robert Gallegos»CIS 212»Homework #3
Tuesday, 13 September 2011 07:30

Homework #3

Written by Robert Gallegos
Rate this item
(0 votes)

CIS 212 Fall 2011
Homework 3
Date handed out: 09/12/2011
5 Meeting the Media: adding images to your pages
6 Serious HTML: standards, compliance and all that jazz

Note: Your answers must be turned in handwritten (no typed responses will be accepted).

Homework due at beginning of class on Monday September 19th:

  1. ____________________, ____________________, or ____________________ - these are going to be your choices when “developing pictures” for the web.
  1. Two of those formats are commonly used on the Web: ____________________ and GIF.
  1. Use ____________________ for photos and complex graphics. Use  ____________________ for images with solid colors, logos and geometric shapes.
  1. Can represent images with up to 16 million different colors. Is a “lossy” format because to reduce the file size, it throws away some information about the image.
    Does not support transparency.

  2. Compresses the file to reduce it’s size, but doesn’t throw anything away. So, it is a “lossless” format.
    Represents images with up to 256 different colors. Allows one background color to be set to “transparent” so that anything underneath the image will show through.
  3. The ____________________ element is an inline element. It doesn’t cause linebreaks to be inserted before or after it.

  4. The ____________________ attribute specifies the location of an image to be included in the display of the Web Page.

  5. The src attribute can be used for more than just relative links; you can also put a ____________________ in your src attribute.
  1. To include an image using its URL, just put the whole ____________________ of the image in the src attribute.
  1. Browsers often retrieve the images ____________________. That is, the browser makes requests for multiple images at the same time.
  1. If I see an image on a Web page, how do I determine it’s URL so that I can link to it?

  2. What makes a JPEG photo better than a GIF photo, or a GIF logo better than a JPEG logo?

  3. The ____________________ image format can support both JPEG and GIF styles of images and has more advanced transparency features than GIF.
  1. The ____________________ attribute (when used with the <img> element) just requires a short bit if text that describes the image. If the image can’t be displayed, then this text is used in its place.
  1. There’s one last attribute of the <img> element you should know about – actually, they’re a pair of attributes:  ____________________ and  ____________________. You can use these to tell the browser the size of an image in your page.
  1. The browser downloads images after it downloads the HTML file and begins to display the page. The browser can’t know the size of the images before it downloads them unless______________________ ___________  _______________________.  (three words).
  1.  True      of       False          You can also supply width and height values that are larger or smaller than the size of the image and the browser will scale the image to fit these dimensions. There are many reasons not to use width and height for this purpose.
  1.  ____________________ pixels is the typical width that most people set their browsers to. So it’s a good rule of thumb for the maximum width of your images (and your Web pages too.)
  1.  A browser always displays ____________________ space before and after a block element.
  1.  Whenever you see a checkered pattern (in most photo editing applications), that indicates a ____________________ area in the image.
  1.  Halos happen (in GIFs) because the photo editing applications creates a “____________________” to soften the text’s edges against the background color.
  1.  Words that are ____________________ on a computer screen are more readable and more pleasant to the eye. (Hint: soft around the edges)
  1.  The ____________________   ____________________   ____________________ (nickname:W3C) brought order to the Universe by creating the ONE HTML “standard” to rule them all.
  1.  XHTML inherited traits from both parents: popularity and ____________________- ____________________  from HTML and extensibility and strictness from ____________________.
  1.  <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “”> This line is called a ____________________ ____________________    ____________________.

  2.  Being compliant is just another way of saying your web pages meet the (current) ____________________.
  1. Checking to make sure you’re spelling your tags names right, your elements are nested properly, that your inline elements are inside block elements and so on is called a  ____________________.
  1. There three ways you can check your HTML (using the W3C online validation service):
  1. “ ____________________ ” means we’re going to tell the browser something about the page.
  1. You’re going to throw this line in as the first thing inside your <head> element of your html.




  1. ____________________ is the character encoding for “Latin-1” characters, which can represent almost all the European languages.

  2. There are actually two DOCTYPEs, one for those ____________________ to HTML 4.01, and a more ____________________ DOCTYPE for those who are already there.

  3. To move from transitional HTML 4.01 to strict, we change the ____________________ to the strict version.

  4. The difference between transitional and strict DOCTYPEs is?
  1. In the current (HTML strict) standard, inline elements belong inside ____________________ elements.

  2. In HTML 4.01 (strict), <____________________> is an example of a block element that you can’t nest inline elements directly inside.

  3. The <head> element is the only place you should put your <____________________>, <____________________> and <____________________> elements.

  4. KEEP BLOCK ELEMENTS OUT OF YOUR INLINE ELEMENTS. The only things you can put in an inline element are ____________________ and other inline elements. ____________________ elements are not allowed under any circumstances.

  5. KEEP BLOCK ELEMENTS OUT OF YOUR <____________________> ELEMENT. Paragraphs are for text, so keep block elements out of your paragraphs.

  6. LISTS ARE FOR LIST ITEMS. Only the <____________________> element is allowed in the <ul> and <ol> elements.

  7. When it comes to the <li> element: you can put ____________________, ____________________ ellements, or ____________________ elements inside your list items.
  1. Always put your text and inline elements inside ____________________ elements before adding them to a <blockquote>.

  2. Never nest an <a> element inside another < ____________________ > element because that would be too confusing for our visitors.

  3. The ____________________ attribute is required on images for accessibility, so that, for instance, the visually impaired can know what the image is, even if they can’t see it.

  4. The other required attribute is the ____________________ attribute on an image – what good is an <img> element if it doesn’t point to an image.

  5. By adhering to ____________________, your pages will display more quickly and with fewer display differences between browsers.