00-Notes On Teachers Topics

Site Basics

  • Keyword are an important part of your sites’ behind the scene coding, allowing search engines to find your site based on desired terms.

Editing Your Home Page

  • Experiment to determine the optimum dimensions for your logo. This varies based on your template selection.

Beginning WYSIWYG

  • Buttons are explained on the Quick Reference Card in the front pocket.
  • Highlight desired text first before applying formatting.
  • A good rule of thumb for links – open them in a new window if they are links to content outside your site. That way your site visitors don’t lose your site when they click a link.
  • To clean up behind-the scenes formatting, Copy and Paste outside content into Windows Notepad or a similar text only editor. Then Copy and Paste the content into the WYSIWYG editor.

Menu System

  • This is a critical component of your web site which can either make the site very user friendly or extremely frustrating.
  • Take time to plan your menu system with your site visitors in mind. Everything doesn’t have to be in the menu!
  • Not all templates allow for fly-out sub items.

Templates

  • Take the “Tour of Templates” at bit.ly/fwtemptour.
  • Templates can be different for each sub-site, but consider using only minor changes to add to the seamlessness and professionalism of the site.
  • Considering a template change? Create a “behind the scenes” sub-site with a copy of some of your content to test drive the new look before making a switch.

Color Editor

  • Edit color codes in the pop-up color picker area
  • Sections of the color palette control different areas in different templates. Some older templates do not have the Color Editor option.
  • Hex codes at bit.ly/fwhexa and RGB codes at bit.ly/fwrgb
  • Work with color palettes at bit.ly/fwcolor
  • Generate color palettes to match an image or your logo at kuler.adobe.com or with the Google Chrome extension Palette for Chrome

Topbar Images

  • Royalty free topbar images sized for the various templates can be found at bit.ly/fwimages.

Image Editing in PicMonkey

  • Start with an image that is at least as wide and tall as the image you want to end up with. You can always make images smaller but you shouldn’t make them larger because you lose image quality.

Document Libraries

  • The universally acceptable format for sharing files via the web is PDF. It’s easy to convert files created in a variety of software to PDF using free software available on the web including PDFill, Cute PDF and Primo PDF. Do a search to find out more about these tools.

Photo Galleries

  • Two steps for setting up galleries:
  • Create the gallery by naming it, typing a description and uploading an image to represent the gallery. This image should typically be less than 200 pixels square.
  • Add the gallery images. These images can be larger, but typically for web display and speed of loading you don’t want them to be larger than 800 pixels square. The FinalWeb system will generate small “thumbnail” versions of each image added for display in the gallery.

Web Page Components

  • Dynamite Dynamic Pages - bit.ly/fwdynamic

Columns & Text/Images

  • Consider a very light complementary color for a narrower side column
  • Consider an empty text box near the top of a home page which can be used as needed to display important announcements

Calendar

  • Two options:
    1. Calendar Preview – Listing of upcoming events. Good for narrow columns.
    2. Calendar – Full calendar layout. Best in a wide column.

Images

  • If desired, an image can link to a web page OR to a larger image (not both).
  • A large selection of logo images from WELS organizations is available on the FinalWeb servers for display on your site including the synod schools, NPH, LWMS, Pioneers and Girl Pioneers.

Embed Code

  • Use Comment tags in Source view to hide code from view which you want to reuse
  • Before the code: <!--
  • After the code: -->
  • Paste embed code from various sites into the Source view.
  • Embed code typically contains several references to the display dimensions (width and height) of the content and can be manually “tweaked” to fit your site as long as you maintain the same ratio of the dimensions.