J. Goss web site action coming this spring


Explosive web action !
J. Goss + Associates will upgrade its website soon. In the spring the Toronto-based communications group plans to start selling campaign-type sites.

J. Goss + Associates has reviewed a number of sites including:

http://www.socialsignal.com/
http://www.openmedia.ca
http://www.usw.ca/
http://www.calculatedstyle.com/
http://opensourceecology.org/
http://www.cippic.ca/
http://ourpubliclibrary.to/
http://environmentaldefence.ca/
http://LuxCinema.ca
http://AndrewWatt.com
http://robcottingham.ca/
https://www.eff.org/

A discussion of these sites led to a lesson, copied below, in website architecture. The writer figures $1,500 could work as price point for a basic site. Maybe, a campaign-type site starts at $5,000. The writer and J. Goss + Associates are exploring possibilities.

Web site architecture explained


Server-side

Pages are either a static file served to the client such as a plain ".html" document, or when the content needs to be dynamic they are generated on the fly usually by a scripting language. Some common ones are PHP, ASP, Ruby, Perl, and C++.  C++ is actually not a scripting language, it's a compiled language, the difference being technical (I could explain it some time if you are actually interested) but suffice it to say it is much faster than the scripted languages but more complicated to maintain and update (update the code, not the page content) and therefore less common than the others.

Any type of file can be dynamically generated on the server side before it is sent to the client (images & style sheets as well as html files).  Although, it is most common for only the html file to be dynamically generated and not the others except for special purposes.

On the client side

Once the files reach your browser on your computer (or phone, or iPad, etc.) several things can happen.  First the html page is loaded.  Back in the day the html used to describe everything (except the individual images).  Colours, font sizes, borders, etc. were all embedded into it.  About 12 years ago web design moved away from that with the introduction of Cascading Style Sheets (commonly called CSS or just Style Sheets).  This is done with a separate file (.css) that is linked to the html page.  In this file are descriptions of the size, colour, font size, background colour or image, border, or drop-shadow etc. for various types of elements. The html page now only describes the content and basic placement of elements relative to each other and indicates which "style" to use with each element which can then be matched to the detailed information in the .css file.

Depending on your browser you may have seen a website load and look like a very rudimentary version of the same content, but in generic colours and fonts, but then change back to the way it should look.  This is because there was a problem or delay loading the style sheet.

Javascript

Just like there can be scripting going on on the server side, there can be on the client side as well. However it is almost always one language: Javascript.  Javascript can provide some level of interactivity for the user rather than a static page, it can check and manipulate data before sending it back to the server, it can remove, add or update parts of the page, or really do most things you could want it to to the page.

JQuery is a popular "framework" (an add-on to simplify things) for Javascript.  It works in a similar way to Style Sheets to make manipulating the page on the fly easier, and makes creating animation using Javascript simpler and easier.  It is often combined with something called AJAX.

AJAX is a feature of Javascript in modern browsers that allows them to reload new content from the server without reloading the entire page.  You see AJAX in action when you use Google search and the search results change as you are typing.

Flash

Flash, unlike these other features which are "open standards" is proprietary and made by one company, Adobe (formerly made by Macromedia which was bought by Adobe a few years ago).  Flash documents are embedded into html documents and can form the entire website or just small parts of it.  In order for somebody to view flash animation on their computer they must download the Flash Player plug-in for their browser from Adobe and install it.  This is totally free, so there is no cost to view and use Flash sites.  However to create Flash sites you must purchase software from Adobe at a cost.  There used to be some issues with ensuring people had Flash installed, but then YouTube came along and it relied on Flash, so anyone who had watched anything on YouTube (pretty much everybody) could be relied on to have Flash installed.

For many years Flash was pretty much the standard for higher-end websites that involved heavy animation or video.  It still is to a certain extent however many of the features of Flash can now be done with a combination of JQuery, CSS, and HTML5 (the new partially-adopted standard for html).  Some people have declared Flash "dead" now that HTML5 has arrived.  But there are still many things you can do in Flash that you just can't do with HTML5.  I've been trying to figure out how to do some of the smooth fading in and out of video content.

To complicate things Apple barred Flash from their mobile devices in order to push their "WebKit" tools.  WebKit is pretty much dead since HTML5 came out but unfortunately neither can really do everything Flash can.  Flash is available for other mobile devices (such as Android-based ones) but is loosing support and Adobe has announced they may not support it for much longer.

On top of that, the animation and video playback available with JQuery/HTML5 is often significantly slower and choppier than Flash.  Plus HTML5 is only available in the newest versions of most browsers.

All of this presents some problems when trying to build a higher-end website that you want to be available to everyone, including older browsers and both desktop and mobile devices.  It often involves many work-arounds and multiple versions of parts of or even the entire site.  This is why doing a high-end site can be significantly more expensive than a JQuery/HTML site.  You can't do as much with the JQuery/HTML but if you can get away with it it will work on multiple devices more easily and be less time consuming and expensive to develop.  But even then many features of HTML5 and CSS don't work right in every browser and there are a tonne of workarounds needed even for a basic site. Then of course nothing works right in Internet Explorer (Microsoft is totally uncooperative when it comes to adopting "open standards").  So web design can be a mess sometimes. But, in the end it's a navigable mess if you know what you are doing.