ckportfolio.com - Beyond HTML and CSS

Beyond HTML and CSS

Applying HTML/CSS at Workplace

Despite the complex exterior of the heavily abstracted web industry, HTML and CSS still remain core technologies that fuel all websites and web applications, past and present (and probably future). Whether one seeks to build a personal website or the next big social media platform, we owe to these two technologies.

Admittedly, our knowledge of HTML and CSS has limited applicability in today's (practical) web projects. One rarely takes on a project to build a website from scratch, unless one explicitly decides to create a website with minimal dependence on third-party solutions; instead, one is often tasked with a job to customize an existing WordPress or Squarespace-based website.

However, the biggest benefit in learning HTML and CSS is that one can now communicate much more effectively with traditional web developers. There will be no more of blindly handing off AI files to the programmer (only to be disappointed later). One can now take charge in the web development process as well, as one now understands the challenges in codinga website layout. All in all, it's a step towards the middle ground between design and programming: a gap that seems ever-so-difficult to bridge.

Tip of the Iceberg

As empowering as HTML/CSS knowledge may be, we may have simply scratched the surface of a much larger question: what other technologies are out there? Sometimes dubbed the "holy trinity" of modern web development, the following is the list of technologies that fuel the majority of today's web-based projects:

  • HTML/CSS
  • PHP and MySQL
  • JavaScript

As mass-market paperback books evolved into the Kindle-fueled ebook market augmented with iPad's multimedia experience, there are many other technologies beyond HTML/CSS that address challenges that HTML/CSS alone cannot handle --- and they are all indispensable in today's modern web projects.

PHP and MySQL

Available as part of the popular LAMP stack, PHP and MySQL are responsible for processing user input and requests, running complex calculations, and saving and retrieving user data. MySQL is a spreadsheet-like database system that handles a large amount of data, and PHP bridges the gap between MySQL and HTML so that otherwise "boring-looking data" can be displayed as per the developer's layout.

Responsible for back-end needs in web technologies, it is also important to note that PHP and MySQL are not standard technologies certified by the W3C, but remain most popular in the market of web technologies.

JavaScript

JavaScript is another standard technology (alongside HTML and CSS) that serves as a common programming language for the web. Designed to augment HTML ("markup") and CSS ("style"), responsible for static website experiences, JavaScript allows the developer to manipulate browser behaviour, animate website objects, and make the website generally more interactive.

Originally ridiculed by old-school developers for sharing the same name as the popular Java language and being amateurish in design, JavaScript is now the dominant language on the Web, with major stakeholders looking to bring JavaScript to platforms beyond web browsers. Google especially embraced the early surge in its popularity, and built many of its applications using JavaScript and optimized Chrome for JavaScript speed.

Despite its rather shaky foundation (due to its origin as a niche gimmick for Netscape Navigator) compared to other popular programming languages, JavaScript enjoys its popularity as an easy-to-learn language --- and a gateway to other programming languages. At this point, JavaScript is a natural next step for HTML/CSS learners.

JavaScript Frameworks and Bootstrap

Despite its reputation as a powerful, easy-to-learn language, JavaScript presents a number of challenges to newcomers with complicated syntax and lack of cross-browser support --- and is often best learned using a framework: a collection of preset code that does plenty of "heavy-lifting" for developers.

In this competitive market where different industry giants offer and maintain their own frameworks (Angular by Google, React by Facebook), Bootstrap stands as an interesting open-source toolkit that dominates the market. True to its mission to help developer "build responsive, mobile-first projects on the web," Bootstrap offers a set of readymade "lego" pieces that one can use to build complex website layouts. With more focus on HTML and CSS rather than complex JavaScript functions, Bootstrap remains a popular choice for many web developers.

Fin