Frontend Development Tools: HTML 5

IBA Group
Alexei Zagorsky

Until recently, HTML was used exclusively to code web pages. At the early stages of the mass use of the internet, it was simple and clear that HTML is a markup language, CSS defines the styles of the webpage elements, and JavaScript is used to create specific effects that cannot be achieved with HTML and CSS.

This is of course an idealistic picture. The reality was that the browsers that existed at that time displayed the pages in an unpredictable way and met no standards. On the other hand, the standards did not catch up with the pace of life.

The situation gained momentum after the internet attracted the interest of large-scale businesses. It became quickly clear that with the internet one can dramatically increase sales. No additional software is needed! Just run the internet.

It is a browser that became the client part of a client-server application in the time when the word frontend was not yet used ‘right and left’. The word website became too generic in a way and the time came for web applications to step to the foreground.

The problems with HTML standards were not yet solved but the situation progressed quickly. Technologies improve dramatically, if they are in high demand. Even HTML and JavaScript allowed developers to create masterpieces when in capable hands. Web development was implementing a combination of features provided by different specifications, such as HTML 4.01 and XHTML 1.1, as well as well as widely-used methods, including different ‘workarounds’ to prevent browser errors.

HTML 5 simplified and, which is more important put in good order many things that were available before. It became a unified markup language that combined the capabilities of HTML and XHTML. In addition, it preserved compatibility with the earlier versions.

The main features of HTML 5 are the following:

• Tools for semantic markup of a document. Using relevant tags, one can easily identify the title, content, navigation, and etc. A similar approach can be applied to structure the content

• Multimedia and graphic support at the level of HTML tags. It radically simplifies implementation of audio and video content on a web page. As for the drawing capabilities provided by the canvas tag, they take one’s breath away

• New elements and attributes, and exclusion of the features that are better handled by CSS

• Improvement in web form handling, including new field types, additional attributes, and validation ‘on the fly’

• New JavaScript APIs for complicated web applications, including drag and drop, document editing, 2D drawing, and management of browsing history.

These are just basic innovations. For all HTML 5 features, visit the W3C website.
The web pages built on HTML 5 look simpler in terms of the code, are quicker to run and friendlier to search robots. Today, HTML 5 is indispensable for a professional website. Thanks to the new capabilities of HTML 5, web applications are actually similar to classic desktop applications in terms of frontend. One more important features of HTML 5 is its compatibility not only with PCs and notebooks but also with mobile devices, such as smartphones and tablets, as well as with modern TVs that have internet access. Therefore, it is possible to develop a unified interface that looks the same on different devices.

The HTML 5 standard is being further modified. The current version is available at the W3C website. However, one cannot be sure that the existing browsers fully embrace these specifications. Trust but prove :). We should also bear in mind that the standards developed by W3C are not mandatory and their implementation depends on browser producers. These are the captains of the IT industry like Google and Microsoft.

Frontend versus backend. Where to begin?

IBA Group
Alexei Zagorsky

This article opens a series of discussions devoted to frontend development. Until recently, this part of the development job was not treated properly. By this series, I intend to present my view of the modern trends in the development of user interface, as well as technologies that are used in web development.

It common knowledge that the internet is built on a client-server architecture. A server is a powerful remote computer or a group of computers called ‘cluster’ or ‘cloud’. Server software installed on a server serves customers. This software is also called ‘server’. With regard to WWW, it is a web server (Apache, IIS, nginx and other), i.e. a software complex that receives HTTP requests from customers and returns HTTP responses, typically with the requested data.

Operations related to processing of server data are called backend development. The following server programming languages are designed for backend development: PHP, Perl, Python, Ruby, ASP.NET, and Java. An important part of the operation of server programming languages is interaction with the database management server (BDMS). DBMS keeps well-organized information that is accessible at any time. The most popular DBMSs for WWW are MySQL, IBM DB2, Microsoft SQL Server, Oracle, PostgreSQL, FireBird, and MongoDB.

A client is generally speaking any device that enables the user to access the internet, including desktop, laptop, tablet, and smartphone. From a technical perspective, a client is a web browser that transmits to a web server HTTP requests for the resources specified in URL, as well as displays server responses in the form of HTML pages, files, media streams or other data.
Any user application needs a convenient and functional interface.

It is especially relevant for a web application because it is used by people who have different qualification and knowledge levels, as well as work in different professions. It is also essential that web interface work well from all modern browsers, including those on mobile devices. Thus we come to the frontend concept.

Frontend development is creation of the client part of a web application. Until recently, this application part was treated without due respect. Most efforts were focused on the server part of a project, such as business logic, data, and security. A frontend developer was perceived as ‘the guy who makes the project look more attractive’. It is quite clear that it is a misperception.
A modern frontend developer is ‘a Jack of all trades’, an expert in his or her domain and in many adjacent domains. A frontend developer writes code for a website, creates user interface, deals with usability, web design, and has an idea of the theory of colors. A frontend developer must have an excellent knowledge of HTML5, CSS3, JavaScript, and Ajax. Experience in such popular JavaScript frameworks as jQuery, Google Web Toolkit, Prototype, TwitterBootstrap, and many others are also of use.
Frontend developers deal not only with specific concepts and tasks, but also with abstract thinking. They belong to those few who are able to make a bridge between mathematics and art. As they are able to unify these two disciplines and apply user experience to logic processes, they are very valuable employees for any IT business.

Therefore, the current trend is to pay more attention to frontend development. In the following article, I would like to discuss the technologies that give a website a modern look and feel, and contribute to its powerful functionality.