Adjust text size: A- | A | A+

Welcome

Introduction

test image

In order to help maintain Fullerton College's identity standards, this web site template has been provided by Academic Computing Technologies for use by departments and faculty. To use this template, you should have a basic knowledge of HTML and/or be familiar with a WYSIWYG editor such as Microsoft Frontpage or Adobe Dreamweaver.

The menu on the right...

The menu found on the right side of this template should contain all the major links for your entire web site. Should you create additional pages for your web site, be sure to include them in your side menu. Keep in mind that if you add or remove a link to the menu on Page A, for example, you should add or remove the same link from the menu on Pages B, C, D, etc. Such a practice will ensure ease-of-use for your visitors. Below are explanations of the pages included with this template (all the links found on the menu to the right):

  • Home (filename: index.html) - This is the first page visitors will see when they enter your web site.
  • About (filename: about.html) - This page might be used to give visitors a little background about your department or information on your teaching credentials.
  • Courses (filename: courses.html) - This page could be used by either departments or professors. An example layout for course listing has been included.
  • Contact Information (filename: contact.html) - This page should contain contact information such as your full name, email address, phone number, and office hours. Example contact information layouts for both a department as well as an individual have been included.
  • Biology 101 F/Biology 109 F (filename: sampleClass1.html/sampleClass2.html) - This page should be renamed according to the course's title/section. First, type in the correct title of the course. Next, change the name of the file itself to accurately describe the course. For example, a professor with a Math 130 F class might rename the sampleClass.html file to "math130.html".
    • Class Syllabus - This might be a link to either another page on your site or an Adobe PDF file.
    • Assignments - This might be a link to either another page on your site or an Adobe PDF file.

Other considerations:

  • To create a links header within the menu (the gold-colored "Courses" header on a white background), simply encase the desired text in a <strong> tag. Most WYSIWYG editors such as Microsoft Frontpage, Microsoft Expressions, and Adobe Dreamweaver will have B a button that will add the <strong> tag for you.

HTML Tips

  • Page Title - To change the title of a page (the text that appears in the title bar of the users' browser), change the text found between the <title> tag.
  • Images - Images that are added to the main content area of a page will automatically have a white frame and dark gray border. A WYSIWYG editor will have tools to help you add an image. Alternatively, you can add the HTML tag by hand by using the <img> tag. For example, the HTML for the default banner graphic of this template is:
    • <img src="images/departmentBanner.png" border="0" usemap="#fullertonCollegeHome" alt="Department Banner" />
    • Keep in mind that all images should be saved to the "images" folder.

Examples

Below are some examples of various HTML elements you might find useful for your web site:

Headers

<h1>header level 1</h1>

<h2>header level 2</h2>

<h3>header level 3</h3>

<h4>header level 4</h4>

<h5>header level 5</h5>
<h6>header level 6</h6>
Blockquote

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate eros sed tellus fermentum eget sollicitudin libero interdum. Morbi a arcu dolor. Phasellus ante elit, condimentum molestie vestibulum quis, suscipit a sapien. Fusce gravida iaculis pretium. Proin quis iaculis augue. Maecenas et magna ligula. Ut non velit nec libero porttitor vulputate. Phasellus auctor magna id metus auctor elementum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris sit amet facilisis nisl.

Duis malesuada mi in ligula vestibulum at mattis lectus rhoncus. In vestibulum, risus vel consectetur venenatis, tortor tellus aliquam purus, id viverra leo enim sit amet purus. Morbi in lectus ac arcu auctor volutpat. Vestibulum quam ante, imperdiet eget elementum quis, ultricies in arcu.

Lists
  • Unordered list (level 1)
    • Unordered list (level 2)
  • Unordered list (level 1)
  1. Ordered list (level 1)
    1. Ordered list (level 2)
  2. Ordered list (level 1)
Table

Heading 2

Heading 2

Row number 1 Row number 1
Row number 2 Row number 2
Row number 3 Row number 3
Image

By default, an image will be aligned on the left. Text will not "float" to the right or left.

Fullerton College Seal

If you would like text to dynamically flow (float) around an image, add class="left" or class="right" to the image's <img> tag. Below are examples of images with the class="left" and class="right" in their <img> tag, respectively.

Fullerton College Seal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate eros sed tellus fermentum eget sollicitudin libero interdum. Morbi a arcu dolor. Phasellus ante elit, condimentum molestie vestibulum quis, suscipit a sapien. Fusce gravida iaculis pretium. Proin quis iaculis augue. Maecenas et magna ligula. Ut non velit nec libero porttitor vulputate. Phasellus auctor magna id metus auctor elementum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris sit amet facilisis nisl. Duis malesuada mi in ligula vestibulum at mattis lectus rhoncus. In vestibulum, risus vel consectetur venenatis, tortor tellus aliquam purus, id viverra leo enim sit amet purus. Morbi in lectus ac arcu auctor volutpat. Vestibulum quam ante, imperdiet eget elementum quis, ultricies in arcu. Proin quis iaculis augue. Maecenas et magna ligula. Ut non velit nec libero porttitor vulputate. Phasellus auctor magna id metus auctor elementum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris sit amet facilisis nisl.

Fullerton College Seal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate eros sed tellus fermentum eget sollicitudin libero interdum. Morbi a arcu dolor. Phasellus ante elit, condimentum molestie vestibulum quis, suscipit a sapien. Fusce gravida iaculis pretium. Proin quis iaculis augue. Maecenas et magna ligula. Ut non velit nec libero porttitor vulputate. Phasellus auctor magna id metus auctor elementum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris sit amet facilisis nisl.

Contact Form

Do you have comments, questions, or feedback? Let us know! We'd love to hear from you. Please fill out the form below:


Note: This form does not work by default.

top