Web Languages and Acronyms

I wanted to have a goto article where people not familiar with the various web languages and technologies could quickly look up phrases they didn’t understand .You don’t need to know any programming , or any languages , to maintain a website, but it doesn’t hurt to know a little about how your site works! I am going to start with the languages that WordPress runs on, and add more as time goes on.


WordPress

WordPress is a CMS ,which is Content Management System. You could say it is THE CMS, as it is by far the most popular in the world. A CMS stores everything in a database and dynamically creates the site people see from this database. Almost everything is user editable , which makes it ideal for people who don’t know (or want to know) how to code , to create their own website and maintain it. This is the core idea of a CMS, it’s a website for non technical people. You have a login which enables you to access the admin section, where you can change the appearance of the site by adding themes, logos, and most importantly content.

There are other CMS platforms out there, but none with the sort of support that WordPress enjoys.

http:wordpress.org

Code Example
function university_files() {
  wp_enqueue_style('custom-google-fonts', '//fonts.googleapis.com/css?family=Roboto+Condensed:300,300i,400,400i,700,700i|Roboto:100,300,400,400i,700,700i');
  wp_enqueue_style('font-awesome', '//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');
  
  if (strstr($_SERVER['SERVER_NAME'], 'fictional-university.local')) {
    wp_enqueue_script('main-university-js', 'http://localhost:3000/bundled.js', NULL, '1.0', true);
  } else {

HTML – Hyper Text Markup Language

This sounds complex, but it’s actually the most simple web language to learn, and also the basic language of web. HTML has been around since the very start of the World Wide Web, and it is one of the only languages that on it’s own can render a web page. But it is generally used as part of a package of web languages to render what you see in your browser. It is not a true programming language, but rather a ‘markup’ language, of which there are many. This means it tells the browser what should go where, for instance <h1> means Heading 1, <p> means paragraph, and so on.

You can actually run HTML on a local machine which makes it easy to learn. No complex editor is required, you can literally type out an html page and then open it in a browser like a file. HTML has various standards and good practice that need to be followed to avoid problems, but it is a friendly language and much loved by web developers.

https://dev.w3.org/html5/html-author/

Code Example
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>

</body>
</html>

PHP – Personal Hypertext Processor

PHP is also an old language now, but still massively popular, mainly due to it’s huge installed base. It is not the easiest language to learn however, and has a reputation among developers of being profoundly disliked as it can be a bit messy, and has a lot of quirks. More modern languages are streamlined and designed to be OOP (Object Orientated Programming) from the start, PHP wasn’t, and had this bolted on at a later date. This made it a little painful, and updating an old PHP site to newer code is a very painful experience. 

However PHP is a language I am very fond of, as it was one of the first I learnt almost 20 years ago, and it is still used in popular frameworks like Laravel . Languages that stay around this long tend to last , so PHP is still a good choice to learn. WordPress is based on PHP, so if you intend to learn how to edit the actual base code of a WordPress site you need to know at least a little PHP.

https://www.php.net

Code Example
if(!is_admin() AND is_post_type_archive('event') AND $query->is_main_query()){
    $today = date('Ymd');
    $query->set('meta_key','event_date');
    $query->set('orderby','meta_value_num');
    $query->set('order','ASC');
    $query->set('meta_query',array(

CSS – Cascading Style Sheets

Along with HTML, CSS is a must know for web developers. Years and years ago, the first web pages had everything on one page, including the styles, so each HTML tag ( like <p>this is a paragraph</p>) had it’s own style associated with it. As web pages got larger, and more complicated, the decision was made by authority that looks after HTML to separate the styles from the markup, and CSS was born. A CSS file contains all the styling for a web page, and is also pretty easy to learn the basics, for instance to make text go green inside paragraphs, you would add the following p { color:green;}. Thats it. However, CSS gets complicated when you have to start structuring pages, and it used to be an absolute nightmare trying to make websites look the same across browsers like Internet Explorer 5 and Firefox, which tended to interpret CSS differently, so you had to write browser specific CSS. Those days are mostly gone now.

https://www.w3.org/Style/CSS/Overview.en.html

Code Example
.metabox p {
    margin: 0;
    font-size: .9rem;
    color: darkgrey;
}

Javascript

Along with HTML and CSS, Javascript is one of the three core web languages. HTML deals with marking up what content actually is, CSS styles it, and JS deals with any interactions, like clicking on a button, or submitting a form. Javascript has grown and expanded to be possibly the most popular and widely used language of the web, partly because it can do almost anything. PHP is a server side language, and cannot be used on the front end. HTML and CSS are front end languages. JS can work on both, able to pull data from the server as well as render stuff in the browser. It has various frameworks that make building sites fast and easy, and enormous developer support. The three most popular JS frameworks are Angular, React and Vue Js. 

However it is not all rosy. JS is hard to learn, or at least I have found it to be, and changes very rapidly. There are also multiple versions and a huge amount of libraries out there to get to the bottom of. Out of all the languages on this page, Javascript is my least favourite! It also has nothing whatsoever to do with Java, which is a hard core programming language used mainly for business applications.

https://www.javascript.com

Code Example
<script>
document.getElementById("demo").innerHTML = document.getElementById("mySelect").form.id;
</script>

Bootstrap

This is a HTML and CSS framework that can be used to make an entire website on it’s own, and I have actually done that in the past. It has a complete set of amazing styles , totally free to use, which make it easy to create a responsive and great looking website.

However these days Bootstrap is normally not used on it’s own, but integrated into other frameworks. A classic example fo this is Laravel, which has a number of pre built options for it’s front end, one of which is bootstrap . If you select this Laravel automatically generates a bootstrap setup for you, saving a lot of time.

Bootstrap creates a grid like structure with columns and rows, which can changed dynamically depending on the screen size you are viewing the content on. This is great because making websites look good on multiple devices is one of the hardest things to achieve in modern website design.

https://getbootstrap.com/docs/4.0/getting-started/introduction/

Code Example
<div class="container">
  <!-- Content here -->
</div>