Teachers Network

Tim Kehres

Site Design Notes

Last Updated: February 6, 2020

Just a few personal notes about the site design.   We’ll start with how each of the header tags are currently being rendered.  The list below is really not for discussion but rather a design aid as we work on cleaning up the tags and underlying CSS that go with them.

H1 Tag Rendering

text after H1…..

H2 Tag Rendering

text after H2…..

H3 Tag Rendering

text after H3….

H4 Tag Rendering

text after H4….

H5 Tag Rendering

text after H5….

H6 Tag Rendering

text after H6….

Image Guidelines

The intent here is to document some standard image sizes we use on the Teachers Network site.  My image sizes we mean primarily image WIDTH as this is the metric that most often will break rendering as we move between viewport sizes.  What follows below shows representative images in each width, a description of when and where to use, and the appropriate CSS class to label the image width with.

Note: additional css class: tn-image-sm – (shrink margin) will assign -20px to both top and bottom margins.  Useful for first graphics on page types where the paragraph style inserts unwanted space.

300 Pixel Width
Used for large section header graphics.  This will take up most of the screen width on smaller devices such as most cellphones however is large enough to look reasonable on larger screens.  Normally right justified in a section.  Note: it could be argued that a larger size image should be specified here that displays better on desktop monitors and that could be used as more of a banner.  To do: floats need to be added for small screen sizes to force other content below.
CSS: tn-image-300
200 Pixel Width
Standard side graphics for use in articles.  Early articles used 150 and in some cases 100 pixel wide images but they looked out of place on larger displays.   The 200 pixel width should be used instead for most articles.   Note: currently 200 pixels does look a bit large and out of place on the smallest of devices (small cellphones with a 320 pixel viewport).  This will be eventually corrected in the mobile responsive CSS definitions to resize when appropriate.
CSS: tn-image-200
150 Pixel Width
This is the old standard side graphics image size.  Probably should not be used anymore in preference to the 200 pixel option.
CSS: tn-image-150
100 Pixel Width
Small image size that occasionally comes in handy when used with lists or tables.
CSS: tn-image-100

Other CSS to document: tn-image-border, tn list columns

Home Page

Last Updated: July 17, 2021

Welcome to Tim’s Place

I’m Tim and the lead developer for this site.   We’ve been using and testing the site now for several months and most of the core functions are working and stable.  There is still work to do yet though on the classified ads, event calendar, and jobs board.  Documentation is in an early stage but actively being worked on.  Please be patient as we get things cleaned up and better working.   If you encounter any problems or have suggestions, please let me know.   I’ll continue to update this page as new issues are uncovered and old issues resolved (removed).

Current Work

The following is a list of ongoing tasks which need to be resolved.

  • Friends Online: avatars stacking vertically
  • Friends Online: extend time window
  • Member Password – problem with less than secure passwords
  • Blog Author Edit/Delete button placement

Please feel free to send me a message with any items that I’ve missed (I’m sure there are many).

How To Guides

The initial structure of the How-To Guides has been setup and is in place.   Several of the guides however still need to be written.  The following guides will be written (in order of priority):

  • Forums
  • Document System
  • File Storage System

Community Page Redesign Notes

  • Classified Ads – verify backend and update accordingly
  • Event Calendar – verify backend and update accordingly
  • Job Board – verify backend and if OK add to the menu.   Otherwise delete.
  • Forums – cleanup and simplify wording
  • Email discussion lists:
    • port mailman 3 and kitty archiver
    • configure and test
    • initial teachers-network lists: makers, contributors, news

Groups I’m Involved With

At the moment most of my time is spent in the development, testing, and roll-out of this site.  In the course of my part time teaching assignments I also work with some of the hidden groups here, mainly in the areas of writing.  The public groups which I intend to re-focus my efforts on once we get into a production mode of operation on include STEM for Young Learners and Eco-Travel.  We also plan once this site is in production to gradually split out some of the larger (in terms of what we have material for) education areas into their own sub-sites.  Already on the drawing board are ece.teachers-network.com (electrical and computer engineering), maker.teachers-network.com, english.teachers-network.com, and shop.teachers-network.com.

About Me

More information about me can be found on my personal website.