Name: Julie Yarnold
Student Number: 84123455
For the purposes of development, I aim, as far as possible, to have a clear demarcation between content, style and functionality/automation, and to keep my options as flexible as possible to account for huge variations relating to devices, user behaviour, accessibility and browser compatibility. The desired result is a dynamic and accessible website that is interoperable and compliant with current web standards in the hope that this will extend the ‘shelf life’ of the web site.
Given my lack of experience, the reasons for my choices of technologies are that they have wide support, and are open source with plenty of resources available, both human and written/recorded. Despite my lack of experience, I want to develop familiarity with a variety of (chosen) technologies in case I decide to pursue education in any one in particular, and to help me effectively and knowledgeably lead and co-ordinate a development team. Crucially, the synergies between the chosen technologies should deliver the smoothest possible user experience.
The HTML prototype written by Tim Berners-Lee in 1992 was ‘…strongly based on SGML (Standard Generalised Mark-up Language), an internationally agreed upon method for marking up text into structural units such as paragraphs, headings, list items and so on (which) could be implemented on any machine’ (w3.org, 1998). The most recent versions of HTML currently used to define content in a web page are: HTML 4.01, XHTML 1.0, HTML5, and XML (w3schools.com, 2012).
XHTML is HTML 4.01 reformulated as XML (The Web Standards Project, 2003). While HTML 4.01 and XHTML 1.0 have much in common, XHTML is more consistent and stringent in its coding rules; for example, unlike HTML, XHTML requires all tags to be closed, and does not allow HTML-style self-closing tags such as the IMG tag. This consistency facilitates easier error detection than in the ‘looser’ Transitional format.
The use of XHTML, with the use of Extensible Style sheet Language Transformations (XSLT), also allows for the automatic creation of resources such as tables of contents, page overviews, printable versions and RSS feeds from the XHTML Document (The Web Standards Project, 2003).
The standard for HTML5 is not yet complete, and while its promise of seamless functionality and simplification for both developers and users (HTML5 Rocks, 2012) is appealing, the fact that no browsers at present have full HTML5 support (w3schools.com, 2012) could create issues in development and deployment that could be needlessly complex for the scale of my project.
Unless I need a particular feature of HTML5 on a page (such as embedded video) I plan to use XHTML 1.0 Strict because it is an established and current standard which should allow smooth future progress relating to developments and updates to web standards (The Web Standards Project, 2003) and therefore a long and stable 'shelf life' for my site.
Style sheets have existed in some form since HTML’s ancestor, Standardised General Markup Language (SGML) in the 1970s (Lane, J, 2008, pp101-102), indicating that presentational style and content should be separate. The syntax of CSS is simple, uses English keywords and, can be easily applied to any markup language; however, only in 1998 did CSS2 become an official recommendation (Lane, J, 2008, p102).
Hakon Wium Lie proposed Cascading Style Sheets in 1994 (Hakon Wium Lie, 2012).
CSS style rules can be embedded, only applying within an individual HTML document, but creating separate CSS documents and linking them to HTML documents allows for style rules to be globally applied and updated. Additionally, several style sheets can be provided, helping to allow for variations in browser support, and particularly for providing increased accessibility. Because users may deactivate style sheets or substitute their own, I will need to ensure that the readability of my pages is not completely dependent on the CSS rules, so that they remain logical and readable if styles are deactivated or substituted.
While CSS is the widespread standard for styling, ‘Less’ the ‘dynamic stylesheet language’, an open-source JavaScript-based application developed by Alexis Sellier, extends CSS with dynamic behaviour on both client and server sides while allowing fallback to conventional CSS (Less.org, 2012). The same cautions apply with regard to user manipulation of style sheets. At this stage, I feel including ‘Less’ and its open source compiler, simpLESS, would add an unnecessary level of structure to my site.
Style sheets enable global changes to formatting and placement across multiple pages, but are not able to apply the same content to multiple pages. For this, developers can implement server-side includes, or page templates, available in high-end HTML editors such as Dreamweaver. A page template can be created and used to create multiple pages containing the required repeating content. Editing the template causes all pages on which it is based to update (MacDonald, M, 2011, p268).
In relation to repeating content such as navigation, I plan to explore the use of PHP to insert the contents of separate files into pages, rather than copy/pasting code or using template pages. This is to allow maximum efficiency when applying changes and updates (tizag.com, 2012).
Browser support for CSS3 properties varies more than CSS2.1 (quirksmode.org 2012); however, I plan to use CSS3 rules that are supported by standards-compliant browsers, while attempting to ensure that any degradation does not destroy the visual logic of the page.
In addition to using using linked CSS files to define styling and placement, I plan to take advantage of CSS to add interactivity where it allows an alternative to JavaScript; for example, rollovers. I believe this will streamline and simplify coding and debugging my web site, and reduce the processing load on the browser. Given my lack of programming/scripting experience and aptitude, this is an important and valid consideration for me.
JavaScript was developed by Brendan Eich for Netscape in the 1990s to add interactivity to web pages (Young, A, 2010), and for manipulating the DOM (Document Object Model), that is, the display/interface (Veitch, N, 2012). JavaScript is a scripting language. Its relatively simple syntax means that even non-programmers should be able to learn and apply it without too much difficulty. JavaScript should not be confused with Java, a complex programming language developed by Sun Microsystems (w3schools.com, 2012). JavaScript allows interactivity to be incorporated in a web page on the client side. Like CSS, JavaScript can be embedded in a web page or linked separately to multiple pages. Also like CSS, a user can deactivate scripts, necessitating development of pages that can still function adequately without scripts running. While all browsers support JavaScript, support varies (quirksmode.org, 2012).
Dart, a new programming language developed by Google as an alternative to JavaScript would seem to have an uphill battle at this stage in terms of gaining a foothold (Shankland, S, 2011). JavaScript has wide community support, and vast amounts of easily available JavaScript resources, which make it far more attractive as a safe bet for coding my web pages.
Simple animations and interactions with user feedback (eg rollovers) are possible with both CSS and JavaScript. As with CSS, JavaScript can be deactivated by a user. I believe it would keep my development process simpler if I reserve the use of JavaScript for client-side form validation and for interactivity in an image gallery I plan to include on my site. As I have very little scripting experience, and it is my intention to simply be exposed to some scripting rather than develop a high level of working expertise, I intend to incorporate scripts, where possible, from an external library such as Jquery (via Google).
Created by John Resig (John Resig, 2012) and released in 2006 (jquery.org, 2012) Jquery is one of many JavaScript libraries--Scriptaculous and MooTools are two that I hear of frequently. A Jquery library can be installed on the web server; however, linking to an online resource such as the Google-hosted Jquery library (Google Libraries API, 2012) would reduce server load and latency because it will download from the Google server closest to the user (encosia.com, 2012). Further, using a JavaScript library such as Jquery would allow me to reduce the amount and complexity of scripting I would need to do. (webhostdesignpost.com, 2012).
In order to gain some familiarity with using a JavaScript library, I intend to incorporate Jquery into my site for client-side form validation and/or to provide interactivity.
PHP, a general-purpose scripting language for the web is is simple enough for a newcomer, but offers many advanced features for experienced programmers. PHP is embedded in the HTML code on the page. (The PHP Group, 2012). PHP was originally conceived and developed by Rasmus Lerdorf in 1994 and its current version is PHP5 (Welling, L, and Thomson, L, 2009, pp2-3). PHP is one of several server-side scripting languages, and can support many databases. The combination of PHP and MySQL is cross-platform, free and open source (w3schools.com, 2012).
In addition to server-side includes, I will incorporate PHP for server-side validation of data input into the forms on my website, to send email on submission of a form, and to connect to a MySQL database.
MySQL is a product of the Oracle Corporation, and is a relational database management system that utilises Structured Query Language, a common standardised language, to access the database (Oracle Corporation, 2012). The collection and management of data in my site will be fairly minimal and I believe this popular combination of technologies will be suitable for my site’s requirements. Even with almost no experience in deploying server-side technologies, I feel confident that the wide support and vast quantities of available resources for PHP and MySQL should keep the task manageable.
SQLite, a 'serverless' database would seem a simple, popular alternative; however, there are security implications as the SQLite database is web-accessible, and could possibly be more easily found and exploited (sqlite.org, 2012).
I will incorporate a simple MySQL database to store details of users who have signed up for a newsletter via a form on my site. The relational capabilities of MySQL will allow for further expansion--eg, linking the details of fitness plans and progress of a client, to their details, etc.
3 reasons why you should let Google host jQuery for you » Encosia viewed 20 May 2012, <http://encosia.com/3-reasons-why-you-should-let-google-host-jquery-for-you/>.
Google Libraries API - Developer's Guide - Make the Web Faster — Google Developers viewed 20 May 2012, <https://developers.google.com/speed/libraries/devguide>.
Hakon Wium Lie, Lie, H.W. & Bos, B. Cascading style sheets: designing for the Web Upper Saddle River, N.J., Addison-Wesley, c2005 (online), viewed 20 May 2012, <http://people.opera.com/howcome/>.
History – jQuery Project viewed 25 May 2012, <http://jquery.org/history/>.
HTML5rocks.com 2012, Why HTML5 Rocks - HTML5 Rocks, viewed 6 April 2012, <http://www.html5rocks.com/en/why>.
John Resig - About viewed 20 May 2012, <http://ejohn.org/about/>.
Lane, J., Lewis, J.R. & Moscovitz, M. 2008, Foundation website creation with CSS, XHTML, and JavaScript, Friends of Ed/Apress, Berkeley, CA.
MacDonald, M. 2011, Creating a Website: the missing manual, 3 edn, O'Reilly Media, Inc., Sebastopol.
Oracle Corporation 2012, MySQL :: MySQL 5.6 Reference Manual :: 1.3.1 What is MySQL? Oracle Corporation, viewed 6 April 2012, <http://dev.mysql.com/doc/refman/5.6/en/what-is-mysql.html>.
quirksmode.org 2011, Event compatibility tables, viewed 7 April 2012, <http://www.quirksmode.org/dom/events/index.html>.
quirksmode.org 2012, CSS - Contents and compatibility, viewed 8 April 2012, <http://www.quirksmode.org/css/contents.html>.
Raggett, D., Lam, J., Alexander, I. & Kmiec, M. 1998, '2 - A History of HTML', Addison Wesley Longman, Essex.
Shankland, S. 2011, Microsoft shoots down Google's Dart language, CNET News, viewed 3 April 2012, <http://news.cnet.com/8301-30685_3-57330431-264/microsoft-shoots-down-googles-dart-language/>.
SQLite CVSTrac viewed 20 May 2012, <http://www.sqlite.org/cvstrac/wiki?p=SqliteWebSecurity>.
SQLite Is Serverless viewed 20 May 2012, <http://www.sqlite.org/serverless.html>.
The PHP Group 2012, PHP: What is PHP? - Manual, The PHP Group, viewed 8 April 2012, <http://www.php.net/manual/en/intro-whatis.php>.
The Web Standards Project 2003, HTML Versus XHTML - The Web Standards Project, The Web Standards Project, viewed 5 April 2012, <http://www.webstandards.org/learn/articles/askw3c/oct2003/>.
tizag.com 2008, PHP Tutorial - Include File, viewed 9 April 2012, <http://www.tizag.com/phpT/include.php>.
Veitch, N. 2012, What on Earth is Google Dart? Google tries to solve the issues that in JavaScript, Future Publishing Limited, viewed 3 April 2012, <http://www.techradar.com/news/internet/web/what-on-earth-is-google-dart-1067920>.
w3schools.com 2012, HTML doctype declaration, viewed 4 April 2012, <http://www.w3schools.com/tags/tag_doctype.asp>.
w3schools.com 2012, HTML Tutorial, viewed 10 March 2012, <http://www.w3schools.com/html/>.
w3schools.com 2012, PHP Tutorial, viewed 4 April 2012, <http://www.w3schools.com/php/default.asp>.
Welling, L. & Thomson, L. 2008; 2009, PHP and MySQL Web development, 4th edn, Addison-Wesley, Upper Saddle River, NJ.
What is jQuery & Why use jQuery? viewed 25 May 2012, <http://www.webhostdesignpost.com/website/whatisjqueryandwhy.html>.
Young, A. 2010, History of Javascript: Part 1, viewed 3 April 2012, <http://dailyjs.com/2010/05/24/history-of-javascript-1/>
Click a button to check validation
