For Web

Sites Built

Nannies of Distinction - August 2005

This site was produced to enable the company to advertise vacant nanny positions. Also however, it provided forms for both employers and employees to register there information and requirements. The aim was to marry the two together into a working relationship. The forms were designed to be very clear and unambiguous in a simple language as the typical client could be use to a different language than English.

Screen shots below give a flavour, link above goes to the local site.


HTML, CSS, JQuery (Front-End)

The 'front-end' of the website is the bit the user sees or user interface (UI). This is the design bit: layout, fonts, colours etc and are looked after by the HTML code, the cascading style sheets (CSS) and enhanced using Javascript. The HTML code should be very simple and meerly contain content and 'tags' that link to the style sheet. The style sheet specifies what each 'tag' is: <H1> might be 16 point text, bold, red, using Gill Sans font in the CSS. All we need in the HTML code is <H1>

A well structured CSS file is key to clean construction of the web front end and a template is a good place to start. Change a single entry in the CSS and all the pages in the site that have a relevant CSS <LINK> entry in the <HEAD> of the HTML code will be altered. Therefore CSS is a very powerful tool in front end production and design. Combine this with individual images cut from a layered Photoshop file that are then linked into the site via tags in the HTML code and you have yourself the front of the website the user will see.

.NET (Middle-Code)

This is the code that takes requests from the user at the 'front-end', queries the database at the 'back-end', processes the results and sends them to the 'front-end' again to be displayed nicely for the user. The code that does this comes in many different varieties. Chunks of code that do specific things can be ringfenced as a 'stored procedure' or SPROC.

These SPROCs can be used to 'call' external websites as well and gain data from their 'back-end' databases. These sites have Application Programming Interfaces (API)s that take these calls, process the request, query the database and send back the results. This part of the web site is it's engine.

Database (Back-End)

The 'back-end' of the website is where the site data is stored. Microsoft's SQL Server can control this and is much like an Excel spreadsheet to look at and is known as the database (DB). The data is stored in separate tables (separate Excel sheets if you like), with headings and subsequent data entries. The 'middle-code' queries these tables to gain the results required by the user.

Type some text in a box at the web site front-end and hit 'search'. The 'middle-code' looks at the text and asks the 'back-end' if it has this. The results that come back are again processed by the 'middle-code', to finally be displayed for the user at the 'front-end' in a search results page say.

Content Management Systems

Content Management Systems (CMS) come in many forms, whether bespoke or 'out of the box'. Managing site design, content and documents are being put into the hands of the user rather than the developer.

My bespoke experience comes from managing a team of developers building sites using .NET and JavaScript with a SQL back-end. My 'out of the box' experience lies in managing sites built using Sitecore, Sharepoint and Umbraco using .NET and HTML/CSS/JQuery to enhance.