Technology Analysis

Anna Zabolotnaya

Student number 11880414

Tutorial group: 95564

Due date: 29 April 2014

Word count: 1605 words

The validation result

Introduction

The main course project is planned to be completed in three stages. Firstly, it is planned to create and design aStore, using Amazon.com instruments, and embed it into a working Wordpress blog. Secondly, the blog will migrate from a Wordpress CMS to the Ghost platform. Thirdly, the basic Ghost theme should be redesigned accordingly to the design plan.

Considering these aspirations, proper technologies should be chosen. In this analysis several key characteristics of xHTML, HTML5, Flash, Markdown, CSS3, LESS, JavaScript, Node.js, Mustache, Handlebars.js, MySQL and SQLite are listed.

In conclusion the optimal technologies will be selected, considering goals and a time-frame of a particular project.

xHTML and HTML5

xHTML (EXtensible HyperText Markup Language) was developed as a stricter and cleaner version of HTML to help smaller devices to understand written code, hence its elements must be properly nested and clearly composed. HTML5 is not as sensitive to mistakes as xHTML. In particular, ‘even minor syntax errors will prevent a document labeled as XML from being rendered fully’ (W3C 2014), while such errors could be ignored in HTML5.

A recent open letter to marketers, signed by such companies as Google, AOL and The Wall Street Journal, ask advertisers to use a mobile-compatible format — 'And the one open, industry-standard, universal format for building mobile-ready creative is HTML5.' (AOL et al. 2014) As HTML5 has a Candidate Recommendation status of W3C (Berjon 2012), using it along with other recommended web technologies can cut down the development time and improve accessibility.

HTML5 is backwards compatible with all the features of HTML4 with additional improvements, semantic elements and standardising functionality. (Clark et al. 2012) In contrast to XHTML 2.0, HTML5 is more of a pragmatic approach to markup, and it is clear that it will be supported, developed and documented thoroughly in the nearest future. At least until 2022, when HTML5 is supposed to be given the final Proposed Recommendation status. (James 2008)

HTML5 along with CSS3 appears to be the most important technology to be well acquainted with working on a study project, as currently available WYSIWYG (What You See Is What You Get) editors produce low quality code, that usually could not be validated.

Writing and altering code manually should help to understand not only documented industry standards, but also the internal ones. As an example, Code Guide project (@mdo 2014) lists standards for developing flexible, durable, and sustainable HTML and CSS, while the Idiomatic CSS project (Gallagher 2014) outlines a reasonable style guide for CSS development. It is a good practice to research conventional norms while entering into the new professional area.

HTML5 and Flash

While developing the dynamic web-site, it could be considered to choose Flash over HTML5.

The latter is simple to understand, uses an established syntax, enhances SEO and provides the smoothest form of animation in a browser. In contrast, Flash could not be considered as an open-source technology, and it should be separately installed as an updated plugin. Moreover, Flash sites are unavailable on the large proportion of mobile devices, especially iOS based ones, and hence is evaluated by many experts as an outdated technology. (see Storey 2012)

Furthermore, it is known that even the Flash developer, Adobe, is concentrating now more on a HTML5 playback and encoding solutions, than on a Flash itself. (Warren 2012)

Taking all these factors in consideration, it was decided not to list it as an option.

Markdown

As a core technology for web, HTML5 hardly has any serious alternatives. Nevertheless, there are some lightweight markup languages, one of which will be used in this particular course project.

One of the key features of a Ghost blogging platform is that it uses Markdown markup language for instant editing the written content in a frame. Using a plain text formatting syntax, Markdown is not supposed to substitute HTML5, XML or xHTML, it is used rather for simplifying the writing process, converting text to HTML. (Gruber 2014)

Even though the latest update of the Markdown was made ten years ago in 2004, it is overly simple and could be learned in a day.

CSS3

CSS (Cascading Style Sheets) is a core technology for the web design, created by World Wide Web Consortium (W3C), and its current version, CSS3, is an industry's standard, supported by main browser developers. (W3Schools 2014) There will never be a CSS4 or CSS5, as it was decided to modularise the specification with gradual updates of different modules. (Greig 2013)

Advanced techniques of CSS3 allow to fully change the appearance of site with transformations, transitions and animation, using advanced selectors and multiple layout tools. ‘Modules like Fonts, Animations, Backgrounds and Borders, Color, Grid Layout, Speech — over 40 modules in all — can each be drafted and rolled out independently.’ (Cook & Garber 2012)

All parts of the future project could be enhanced using CSS3, including Amazon’s aStore, Wordpress CMS, Ghost platform, themes for Wordpress and Ghost and Disqus commenting frames.

LESS

One of the partial CSS alternatives to consider is LESS, a CSS pre-processor. Originally written in Ruby in 2009 by Alexis Sellier, LESS then have been ported to JavaScript and several other programming languages, including Python and PHP. (Less.js 2014a) Being an open-source dynamic stylesheet language, LESS adds a new syntax, variables and mixins in order to extend the CSS language, reuse and regroup different pieces of its code. (Less.js 2014b)

Some of advanced Ghost themes authors use LESS as an additional stylesheet language. For example, at the moment of writing this analysis there were 13 such Ghost themes on ThemeForest. (Envato 2014) It could be useful to understand LESS basic principles in order to reform and adopt such themes for project’s design needs.

With the main focus remained on CSS3 syntax, experiments with LESS could be seen as an educational opportunity to acquire some JavaScript technologies as well.

JavaScript, Mustache and Handlebars.js

JavaScript is a lightweight, object-oriented interpreted programming language. Its standard ECMAScript is fully supported by most current versions of modern browsers. (MDN 2014)

JavaScript is used to add interactivity to a web page along with CSS3, so it could interact with user, control the browser and dynamically create HTML content. The main advantage of it in the scope of our project is its powerful ability to dynamically generate HTML. (Flanagan 2001) Some other JavaScript abilities to consider: HTML forms interactions for commenting, work with visitors' Cookies for multi-site registration, and some image roll-over for the infinite scroll.

Another practical example of JavaScript technologies employed in the course project is a Ghost theme. All of them are written in Mustache templating language, created by Chris Wanstrath, and Handlebars.js (wycats 2014) as its extension. To install, set up, change and update any Ghost blog, the familiarity with JavaScript is necessary.

Server-side JavaScript and PHP

The Ghost platform, the final destination of this courses project, runs on a base of Node.js. Alternatively, Wordpress uses PHP as its server-side scripting language, along with approximately 82 percent of top 10 million websites as of 28 April 2014. (W3Techs 2014)

PHP (recursive acronym for PHP: Hypertext Preprocessor) is an open source server-side scripting language, that was designed for the web development and can be embedded into a HTML page. In spite of its extreme popularity and probable renaissance (Lockhart 2014), some authors consider PHP to be slightly outdated comparing to more lightweight languages. As an example, one of the Ghost creators explains why the Node.js was chosen over PHP:

‘As PHP (what WordPress is using) is technically dated, and as much as the community is keeping it alive, PHP is no longer fit for very very advanced functionality, and performance suffers in most cases.’ (Javorszky 2013)

Node.js is a platform built on Chrome's JavaScript runtime, that uses an event-driven, non-blocking I/O model. (Nodejs.org 2014) Using server-side JavaScript guarantees reliability that client-side JavaScript could lack.

The additional possibility to learn client-side JavaScript lays in using Disqus comment widget, that is written in JavaScript, serving the content through third party JavaScript widgets. (Disqus Support 2014). As it is the main commenting system on Wordpress site, its should be moved to the Ghost blog completely with some alterations made during the transfer.

MySQL and SQLite

The Ghost platform uses SQLite by default, while Wordpress CMS is based on MySQL.

MySQL is the most popular Open Source SQL database management system, distributed by Oracle Corporation. Although the MySQL Database server is fast and reliable, it still needs to be installed and set up and is more resource intensive. (Oracle 2014)

At the same time, SQLite is a widely deployed SQL database engine with the source code in the public domain. Using it as the database for websites is one of the basic applications recommended by SQLite developers. (SQLite.org 2014b)

As it supports terabyte-sized databases and gigabyte-sized strings and blobs, SQLite could be considered sufficient for the private blog with the maximum load of 100000 visits per month: ‘Generally speaking, any site that gets fewer than 100K hits/day should work fine with SQLite.’ (SQLite.org 2014a)

It is recommended for standalone application and fits well into small blog project with one owner, as SQLite does not support multi-user applications. (Tezer 2014)

Conclusion

Taking in consideration particular goals of a current study project along with its prerequisite requirements, specific technologies were chosen.

To move a small blog from the Wordpress CMS to the Ghost platform, it is recommended to use HTML5 with CSS3 and JavaScript (Node.js, Mustache, Handlebars.js) as instruments and SQLite as a database — with some probable implementations of Markdown and LESS.

Bibliography:

@mdo 2014, Code Guide by @mdo. Standards for developing flexible, durable, and sustainable HTML and CSS., viewed 27 April 2014, <http://codeguide.co>.

AOL, Conde Nast, Forbes, Google, IDG, Millenial Media, New York Post, The New York Times, Slate, Time Inc., Undertone, Conversant, The Wall Street Journal, The Weather Company & BlogHer 2014, Open letter to Marketers, 2014 Interactive Advertising Bureau, viewed 25 April 2014.

Berjon, R. 2012, HTML5 — smile, it’s a snapshot!, W3C, W3C Blog, viewed 25 April 2014, <http://www.w3.org/blog/2012/12/html5-smile-its-a-snapshot/>.

Clark, R., Studholme, O., Murphy, C. & Manian, D. 2012, 'HTML5 moving forward!', Beginning HTML5 and CSS3, Springer Science+Business Media New York, New York, USA, pp. 1-17.

Cook, C. & Garber, J. 2012, 'Getting Started', Foundation HTML5 with CSS3, Apress, pp. 1-16.

Disqus Support 2014, JavaScript configuration variables | Disqus, Disqus Developers, viewed 27 April 2014, <http://help.disqus.com/customer/portal/articles/472098-javascript-configuration-variables>.

Envato 2014, LESS | Theme Forest, Envato, viewed 25 April 2014, <http://themeforest.net/search?utf8=✓&category=blogging%2Fghost-themes&term=LESS>.

Flanagan, D. 2001, '1.6. Client-Side JavaScript Features', JavaScript: The Definitive Guide, Fourth Edition, O'Reilly Media, Inc.

Gallagher, N. 2014, Principles of writing consistent, idiomatic CSS, GitHib, Inc., viewed 27 April 2014, <https://github.com/necolas/idiomatic-css>.

Greig, S. 2013, 'Introduction', CSS3: Pushing the Limits, John Wiley & Sons, pp. 1-7.

Gruber, J. 2014, Daring Fireball: Markdown, The Daring Fireball Company LLC., viewed 25 April 2014, <http://daringfireball.net/projects/markdown/>.

James, J. 2008, 'HTML 5 Editor Ian Hickson discusses features, pain points, adoption rate, and more', TechRepublic, viewed 27 April 2014, <http://www.techrepublic.com/blog/software-engineer/html-5-editor-ian-hickson-discusses-features-pain-points-adoption-rate-and-more/718/#.>.

Javorszky, G. 2013, Can I move my entire Wordpress site to Ghost?, viewed 27 April 2014, <https://ghost.org/forum/plugins/2407-can-i-move-my-entire-wordpress-site-to-ghost/>.

Less.js 2014a, About | Less.js, The Core Less Team, viewed 25 April 2014, <http://lesscss.org/about/>.

Less.js 2014b, Getting started | Less.js, The Core Less Team, viewed 25 April 2014, <http://lesscss.org>.

Lockhart, J. 2014, The new PHP, O'Reilly Programming, viewed 27 April 2014, <http://programming.oreilly.com/2014/03/the-new-php.html>.

MDN 2014, JavaScript technologies overview, Mozilla Developer Network and individual contributors, viewed 27 April 2014, <https://developer.mozilla.org/en-US/docs/Web/JavaScript/JavaScript_technologies_overview>.

Nodejs.org 2014, Node.js, Joyent, Inc., viewed 25 April 2014, <http://nodejs.org>.

Oracle 2014, 1.3.1 What is MySQL?, viewed 27 April 2014, <http://dev.mysql.com/doc/refman/5.7/en/what-is-mysql.html>.

SQLite.org 2014a, Appropriate Uses For SQLite, SQLite.org, viewed 27 April 2014, <http://www.sqlite.org/whentouse.html>.

SQLite.org 2014b, Features Of SQLite, SQLite.org, viewed 27 April 2014, <https://sqlite.org/features.html>.

Storey, D. 2012, 'CSS3 Fundamentals', Pro CSS3 Animation, Apress, pp. 1-8.

Tezer, O.S. 2014, SQLite vs MySQL vs PostgreSQL: A Comparison Of Relational Database Management Systems, DigitalOcean™ Inc., New York, USA, viewed 27 April 2014, <https://www.digitalocean.com/community/articles/sqlite-vs-mysql-vs-postgresql-a-comparison-of-relational-database-management-systems>.

W3C 2014, 1.6 HTML vs XHTML. HTML 5.1 Nightly. A vocabulary and associated APIs for HTML and XHTML, W3C, viewed 27 April 2014, <http://www.w3.org/html/wg/drafts/html/master/introduction.html#html-vs-xhtml>.

W3Schools 2014, CSS3 Browser Support Reference, Refsnes Data, viewed 25 April 2014, <http://www.w3schools.com/cssref/css3_browsersupport.asp>.

W3Techs 2014, Historical trends in the usage of server-side programming languages for websites, Q-Success, viewed 28 April 2014, <http://w3techs.com/technologies/history_overview/programming_language>.

Warren, C. 2012, 'The Life, Death and Rebirth of Adobe Flash', Mashable, viewed 25 April 2014, <http://mashable.com/2012/11/19/history-of-flash/>.

wycats 2014, wycats/handlebars.js | GitHub, GitHub, Inc., viewed 25 April 2014, <https://github.com/wycats/handlebars.js/>.