Village Grande at English Mill Homeowners Association

Home . About . Committees . Board . Resources

Website Support

If you are interested in supporting the website let us know, all are welcome.

TOC

  1. Initial Vision
  2. Other HOA Websites
  3. Expected Meetings
  4. Content Guidelines
  5. Expected Maintenance Intervals
  6. Content Submissions Visual Quality
  7. HOA Management Companies and Website Tools
  8. Software Tools For Open Source Website
  9. Managing The Software and Website on Your PC
  10. Building a Website - Video
  11. Sans Serif Fonts
  12. Color
  13. Website Structure
  14. Webpage Authoring
  15. File Naming Convention
  16. Advanced Website Support
  17. Where Did The Internet Come From
  18. Technology

Initial Vision

The goal of the website is both social and business communications.

Initially it will

  • Provide information on upcoming social events
  • House previous social event presentations
  • House VGEM News and the archived versions of the Grande Gazette (this will NOT replace the physical paper)
  • Perhaps house some community related info / links
  • House the HOA bylaws
  • Provide information on upcoming HOA meetings
  • House the HOA Minutes
  • House the budget info presented at the meetings

Setup Hosting and Costs

Other HOA Websites

Expected Meetings

  • Website maintenance meeting weekly initially then monthly then quarterly
  • Website training periodically as interest surfaces

Content Guidelines

  • It is of value to the residents
  • It is current and accurate
  • It is easy to read - black text white background
  • It is minimalistic so residents are not lost in irrelevant information or waste time
  • It is positive and does not preach or police resident behavior

Expected Maintenance Intervals

Maintenance includes updating content and links

Daily

  • Front page Announcements

Weekly

  • Flyers
  • Events
  • Review logs for popularity

Monthly

  • Minutes
  • Budget

Quarterly

  • Committees
  • Clubs
  • Gazette
  • Directory

Annually

  • Bylaws & Rules
  • Operations & Forms
  • Board
  • About us
  • Master plan
  • Review of website remaining links and structure

Content Submissions Visual Quality

The following applies to HOA submission. Residents can use this as a guide but do not spend your precious time on these items, just submit your content.

  • Submit content in the original editable file format so people in the future can build
  • Editable content is for archive reasons and may not be on the website
  • Convert all content to pdf and submit with original editable file
  • All files on the website will include a pdf version so any computer can display the content
  • Templates should be used for recurring content such as meeting agendas and minutes
  • Content should use a serif font so that visually impaired people can read the content (times new roman) and degraded paper copies remain legible through the years
  • Content formatting should be internally consistent (same size font for same type of content for items such as headings, main body, lists, etc)
  • Content should be visually pleasing and make use of lots of white space
  • For residents we can convert to pdf using a free converter such as cute pdf

HOA Management Companies and Website Tools

Software Tools For Open Source Website

These are the suggested tools for maintaining the website content. Unless stated otherwise all the tools are PC based.

AOLPRESS - This is used to author webpages. It is simple to use and still the most effective tool even after all these years because when you make links they work without using another tool to preview the results. The problem is it does crash and it is old so you can't build pages with cascading style sheets. However, we don't want to do that anyway because it then gets complex and most people will not be interested in authoring webpages. It was abandoned years ago but people have added what is needed to make it work on the latest windows platforms.

  1. Download AOLPRESS into your C:\z-places\shareware folder or the folder where you place your shareware
  2. Go to the location of the download and find AOLPRESS.zip (C:\z-places\shareware)
  3. Right click on the AOLPRESS.zip file, select properties, and uncheck Blocked, or the software will not run properly
  4. Unzip (uncompress) the file (make sure it is Unblocked)
    1. Right click on the zip file
    2. Select Extract All
    3. Select AOLPRESS folder
    4. Select the AOLPRESS folder that is inside AOLPRESS
    5. Copy the AOLPRESS folder
    6. OR
    7. Double click the AOLPRESS.zip file
    8. Select AOLPRESS folder
    9. Select the AOLPRESS folder that is inside AOLPRESS
    10. Select copy
  5. Paste the extracted (unzipped) AOLPRESS folder on your C drive as C:\AOLPRESS
  6. go to C:\AOLPRESS
  7. look for AOLpress.exe, create a shortcut on your desktop
    1. Copy AOLpress.exe
    2. Right click on the desktop and select Paste Shortcut
  8. Start AOLPRESS
  9. Watch the video: https://www.youtube.com/watch?v=MJwlrr2lpiw

AOLPRESS MAC Version - This is the MAC version of AOLPRESS. It is unproven.

Aolpress Users Guide - This is the Users Guide for AOLPRESS. Don't spend more than a few minutes on the manual. Just start using AOLPRESS. It is like typing a "document or an email" except they are HTML pages also called webpages. The new twist is adding links and realizing that you are typing multiple webpages that connect via the links. When reviewing the Users Guide keep in mind that Filezilla is used to publish to the website.

Notepad++ - This is a text editor. It is used to edit HTML code in the rare instances that AOLPRESS has difficulty.

Kompozer - This is used to author webpages. It is more complex than AOLPRESS but unlike AOLPRESS you need to preview your links in a separate web browser. This makes life harder. Is supports cascading style sheets.

Seamonkey - This is like Kompozer but it is available for the MAC. Also it does not offer a nice color coded Text view of an HTML webpage like AOLPRESS and Kompozer.

Filezilla- This is used to transfer files from the PC to the webserver housing the website.

Amaya - This is used to author and publish webpages. It is more complex but it does work on Mac, PC, and Unix platforms.

IrfanView - This is an image processing tool. It is used to crop, resize, and save images in different formats. It is fast and easy to use.

Photoed - This is an old Windows image processing program. It was last available on WinXP. It is used to crop, resize, rotate by small amounts, and save images in different formats. It is fast and easy to use.

Drupal - Open source content management system. Margate uses this approach.

Managing The Software and Website on Your PC

Managing the location of the website and program files on the PC is important. Things are easily lost especially if there is no consistent approach to managing the stuff. Do not try to use the billy gates approach to managing the files, even if that is how you currently do things. The issue is everything needs to be in one place -  webpages, images, documents and support tools. The suggested approach to managing the website and program files is:

  • Open windows file explorer and create a folder called z-places
    • click the folder in the bar at the bottom
    • or press the Windows key + E
    • pick the option to create a new folder or right click and select new folder
  • In z-places create a folder called shareware
  • In z-places create a folder called vgem
  • In z-places create a folder called vgem-office
  • In z-places create a folder called vgem-prototypes/yourname
  • Place downloaded software in the shareware folder
  • Place official website pages in vgem
  • The resulting directory structure will be C:\z-places\shareware and C:\z-places\vgem and etc.
  • z-places is your place for doing work

Any programs like AOLPRESS and Photoed that are .zip files, just unzip them in the shareware folder. You can copy the unzipped files anyplace on the PC or just keep them in the shareware folder. Look for AOLpress.exe select copy and then paste a shortcut on your desktop. Look for PHOTOED.EXE select copy and then paste a shortcut on your desktop. Make sure the desktop only has shortcuts NOT programs. Any files or programs on the PC desktop severely degrade the PC performance - get them off if you have any and make shortcuts. To copy and paste right click on your mouse and various options will appear.

Note that as you investigate AOLPRESS do NOT select Help => Show Tool Tips, make sure there is no check mark. This is what causes AOLPRESS to crash when used on PCs after WinXP. There is no info on the Internet on this topic. The download version has Show Tool Tips unset so it works for the newer PCs. It also has the missing .dll files that the Internet suggests.

Building a Website - Video

There is a youtube video on building a website. This video was developed in 2005 to help students build websites. The audio is poor but it gets better at the end. The audio was recorded in power point and there were issues at the time. For future audio I used Audacity.

Sans Serif Fonts

So why is everything today in Sans serif fonts? The short answer is because everything is being pushed to small displays like smart phones and pad computers. On these small displays you can pack more characters on the screen using sans serif and it does not look cluttered. This is fine if you are not reading a large block of text. However you can't run a civilization on 147 characters or 50 word snippets. This also goes for running a HOA. Also we should not forget that vision degrades with age. A sans serif font eventually starts to look like a bunch of circles. As time moves on and PCs are abandoned for hand held devices the serif question will be revisited.

Color

A quick lesson in color. Our eyes are not designed to see detail in blue color. The cone cells that are closest to the fovia see the detail and they detect red and green. The cone cells that detect blue are on the periphery of our vision and they detect movement not detail. Also the focal length of blue is different than for red and green. This means our eyes cannot focus in the presence of blue and other colors. This was a technique used by manufacturers to hide the lines in cheap display monitors. Unfortunately this abuse of technology exists everywhere and we find blue everywhere. Just because it is everywhere it does not mean it is right - its use can lead to myopia.

Eye Human Factors Examples . Colors

Website Structure

For a website to be maintainable and easy to navigate it needs to follow a structure philosophy. There are 2 approaches. The first is to write a style guide and the second is to produce a "what if" or example. It is easier to produce an example. The current structure is based on the following ideas:

  • Put the key links at the top for those that need to access the key information quickly, like who are you, who can I contact, search, get me home
  • Put the legal stuff, disclaimers, and outside interaction at the bottom
  • Put the detailed links on the right and group them in some way that people can relate to and remember
  • With smartphones the space is limited and the links on the right have moved to the bottom of the page for pages with lots of content
  • George Miller and the magical number 7 plus or minus 2 is critical

So as other people start to add content to the website it is critical that it follow the current structure and approach to content. Otherwise it will quickly degrade into a collection of disorganized content that no one will want to access. Ideas are welcome and the website needs to evolve. The evolution just needs to be effectively managed. For example a new website structure rollout should probably be limited to 1 per year with the ability to always access the previous websites.

Webpage Authoring

It is easy to edit a webpage using a hypertext editor like AOLpress. However, producing a webpage that is readable to all regardless of hardware platform and software browsers is more complex. For example, the same character type size, color and shape may differ widely from platform to platform. The following are guidelines for making the webpage viewable across a broad set of platforms.

  • Avoid fancy colors and blinking text
  • Select proper background and foreground colors
  • Use standard text size
  • Use format heading 1 for the page heading
  • Use format heading 2 for paragraph headings
  • Use plain text for the content
  • Highlight text with type styles bold or italic
  • Convert images to jpg, png, or gif format to minimize their size

File Naming Convention

  • The website will grow quickly and there needs to be a simple and effective file naming convention
  • No spaces use - instead of _ because it is clearly seen as a link
  • For files that multiple versions encode date as yyyy-mm-dd that way they are sorted by date on the computer making it easy to find them
  • There was a time when uppercase and lowercase letters were problematic, at that time the rule was make everything lower case

Advanced Website Support

It is unclear if we will go down this path. It is not needed to have a great website. To venture down this path one does need to be very technology literate with experience in writing serious software and developing serious systems. This is not to discourage anyone with an interest, just don't get frustrated if you can't do this type of activity.

HTML is a language that is used to format text. For example it has commands for bold, underline, color, etc. A web browser is a software application that reads HTML and renders or displays the text according to the HTML tags. So this is a publishing mechanism like word processing but it is universal. The file format is not proprietary and anyone can read it because it is in english. This allows for the display of what are called static web pages. They are static because the content does not change from what the author created.

Dynamic webpages are created by a computer. The computer has a software program that someone develops for a purpose and then based on some user input the computer authors a webpage that is then displayed to the user. Examples are search engines, forms processing, shopping carts, auction management, social media frameworks, etc. Currently we have an automated Communications and Trouble Reports tool.

These are links to get going in this area:

XAMPP is a webserver that runs on your PC. It includes PHP, PERL, and MariaDB.

The information below is old but the reality is this info built the multi trillion dollar Internet. After they did their great work others came in and started to make their mark and the Internet is now JAVA and some PHP based. However PERL is truly magical and nothing comes close to its power and simplicity. Also nothing does regular expression processing like PERL. It makes sense because the inventor of PERL was a linguist and wanted to mine vast amounts of text and other patterns.

PERL Manual

Regular Expressions

PERL Programs archive 1

Where Did The Internet Come From

The original intent of the Internet was to satisfy a vision presented in 1945 by Vannevar Bush and offered in The Atlantic magazine, called As We May Think. It introduced the Memex. Many erroneously think that the article predicted what was to come and that is incorrect Wiki As We May Think.

Vannevar Bush was a key scientific adviser in the USA and he and others in the Franklin D. Roosevelt administration were working on stopping what they thought was the start of a new dark age. Basically president Roosevelt asked his advisors what was happening and the response was that we were entering a new dark age. President Roosevelts response was to ask how long it would last in terms of 2, 3, or 5 years. The response was, no you don't understand, we are entering a dark age that might last 500, 700, 900 years. So they went to work.

As the war was ending and the outcome was clear president Roosevelt asked Vannevar Bush to identify what should happen after the war. The brain trust produced a document called Science The Endless Frontier.

Local . PDF.

https://www.nsf.gov/od/lpa/nsf50/vbush1945.htm (link was replaced by PDF)

This document established the policies of the USA after WW II up until approximately 1980 when the USA started to reject the New Deal. This document gave birth to the National Science Foundation (NSF), which is why it is on their site. It is also the reason why you enjoy your comfortable life and are able to read this information.

So everyone was working to build the Memex described by Vannevar Bush in 1945. The NSF and all other technology oriented government organizations (NASA, DOD, FAA) were funding various projects. This eventually culminated in 1968 with what is called The Mother Of All Demos. The technology was actually developed with NSF (Universities) while supporting DOD (Semi Automatic Ground Environment air defense), NASA (Space probes and Moon Landings), and the FAA (Project Beacon, NAS Stage-A, and later AERA and AAS which pushed workstation technology to new levels).

It was not until the late 1990's when computers became available to consumers that it was possible to finally have the Memex become a reality. Many software people working under government funding and for free in their homes started to build the tools that would allow anyone to build content and upload it to the Internet. America Online purchased a body of work from one of these people and called it AOLPRESS. It was because of AOLPRESS that everyone was able to produce a website and share their knowledge with the planet.

So the Internet is the Memex. It was originally developed to share knowledge and information from anyone to anyone on the planet. This allows people to study, contribute, and work using the greatest Library in human history. By the turn of the century websites with thousands of documents and webpages surfaced built by millions of people across the planet.

Today there are templates and content management systems but they are only meant to provide simple brochure like pages in some trivial business effort duplicating the yellow pages phone book of the past. They are unable to work with vast amounts of information that is actually needed when engaged in work, education, research, government, and community settings. Wordpress and Wiki mechanisms are too hard to work with because they do not offer a WYSIWYG.

So all we have is AOLPRESS and the modifications to make it work on the new computers. The WorldWideWeb source code was released long ago but no new easy web authoring tools have surfaced. They are either just browsers or very poor editors with no effective mechanism to link to many pages on the fly while you are just writing in a stream of thought. In other words they don't work for the Memex.

Technology

The Internet is not special. It is not technology because it is the Internet. Technology is everywhere and used for everything. When a new technology surfaces many think it will change human behavior and make the world better. The reality is that people imprint themselves on new technology. So eventually the technology falls into the hands of people who abuse the technology and cause harm. The following comes from "Systems Practices as Common Sense" when addressing the misuse of technology:

  • The technology adds no value to a system
  • The technology actually hurts the system but the stakeholders are unaware of the damage
  • The technology hurts the system, the stakeholders are aware of the damage, but are powerless to stop using it
  • The technology is prematurely abandoned
  • The technology is stopped because of status quo
  • The technology is viewed as a commodity
  • The technology only appeals to the ego
  • The technology is poorly understood
  • The technology is not sustainable

At what point does misuse of technology translate into deviant design practices? Some deviant design practices and misuse of technology are:

  • Wasting peoples time by forcing useless actions especially for ulterior motives
  • Fooling or deceiving people into taking undesired actions especially when the user is harmed
  • Consciously reducing performance even though the technology supports much higher levels of performance at no additional cost
  • Ignoring scientific knowledge and previous experience especially as related to human factors
  • Using technology to compromise inalienable rights

The Internet as known by the general population is over 30 years old. The reality is that few have bothered to learn and understand the Internet and its technologies. So we have a situation where people are unsure about how to proceed. The answer is simple. The Internet is the Memex. It is a place where knowledge should be shared and great libraries exist to help organizations and people engage in a positive life.

This information is intended only for the Village Grande residents, and may contain information that is confidential or privileged. If you are not a Village Grande resident, you are hereby notified that any dissemination, distribution or copying of this information is strictly prohibited.

Policy . Disclaimer . Advertising . Webmaster
Copyright © 2017