HTML CSS and JavaScript
URL Encoding
For a browser to properly display a page’s contents, it has to know the charset in use. In URLs, for example, browsers can only use ASCII encoding, which only allows alphanumerical characters and certain special characters.
Therefore, all other characters outside of the ASCII character-set have to be encoded within a URL. URL encoding replaces unsafe ASCII characters with a % symbol followed by two hexadecimal digits.
Some common character encodings are:
| Character | Encoding |
|---|---|
| space | %20 |
| ! | %21 |
| ” | %22 |
| # | %23 |
| $ | %24 |
| % | %25 |
| & | %26 |
| ’ | %27 |
| ( | %28 |
| ) | %29 |
A full character encoding table can be seen here.
Usage
Each of these elements is called a DOM (Document Object Model). The World Wide Web Consortium (W3C) defines DOM as:
"The W3C Document Object Model (DOM) is a platform and language-neutral interface that allows programs and scripts to dynamically access and update the content, structure, and style of a document."
The DOM standard is separated into 3 parts:
Core DOM- the standard model for all document typesXML DOM- the standard model for XML documentsHTML DOM- the standard model for HTML documents From the above tree view, we can refer to DOMs asdocument.headordocument.h1, and so on. This is also useful when we want to utilize front-end vulnerabilities (likeXSS) to manipulate existing elements or create new elements to serve our needs.
CSS (Cascading Style Sheets)
CSS defines the style of each HTML element or class between curly brackets {}, within which the properties are defined with their values (i.e. element { property : value; }).
Each HTML element has many properties that can be set through CSS, such as height, position, border, margin, padding, color, text-align, font-size, and hundreds of other properties. All of these can be combined and used to design visually appealing web pages.
CSS can be used for advanced animations for a wide variety of uses, from moving items all the way to advanced 3D animations. Many CSS properties are available for animations, like @keyframes, animation, animation-duration, animation-direction, and many others. You can read about and try out many of these animation properties here.
JavaScript
JavaScript is one of the most used languages in the world. It is mostly used for web development and mobile development. JavaScript is usually used on the front end of an application to be executed within a browser. Still, there are implementations of back end JavaScript used to develop entire web applications, like NodeJS.
JavaScript is usually used to control any functionality that the front end web page requires.
Frameworks either use JavaScript as their programming language or use an implementation of JavaScript that compiles its code into JavaScript code.
Some of the most common front end JavaScript frameworks are: