HTML stands for Hypertext Markup Language and is the code that is behind web pages. HTML5 is the latest version of HTML. HTML5 is cross-platform and was designed to create almost anything a user would require without needing extra software such as browser plugins. HTML provides the ability to write web applications that work when the user is offline. They can also provide the physical location of the user to the website, manage high definition video, and deliver high-quality graphics.
CSS stands for Cascading Style Sheets which handles the presentation of the website. CSS is used in the presentation of web pages, including layouts, colours, and fonts. It can also allow for web pages to be responsive, which means that they adapt to devices with different screen sizes such as desktop computers and mobile phones.
Programming Environments
Programming with HTML and CSS can be done with simple software such as Notepad or Visual Studio Code which are free to install. There are so many different text editors out there, you are bound to find one which you like using! Alternatively, for more functionality, an environment such as Eclipse can be used which is structured with plug-ins that can aid with editing code.
More information on various HTML editors can be found here:
https://www.lifewire.com/best-free-html-editors-for-windows-3471313
For additional information and a step-by-step guide with images on what can be done with HTML can be found here: https://www.wikihow.com/Create-a-Simple-Web-Page-with-HTML
Incorporating CSS
CSS can be used with HTML in 3 different ways:
External style sheet - A reference to the external style sheet file inside the <link> element is needed in each page
Internal Style Sheet – An internal style sheet can be used if a single page has a unique style. It is defined within the <style> element, inside the <head> section of a HTML page.
Inline Styles - The style attribute needs to be included in the appropriate element, it can include any CSS property.
For more information on multiple style sheets and how to use CSS visit:
https://www.w3schools.com/css/css_howto.asp
What can be done with HTML – Advanced
You can incorporate Javascript into your website to add impressive functionality. Javascript reduces the strain on a server and can minimise the expenses of hosting files. The reason for this is because Javascript is regarded as client-side, meaning it runs on the user’s computer when they access a webpage.
What Javascript can do:
Even when the web user is offline, the website will still work on their computer
Provides dynamic functionality and permits the creation of highly responsive interfaces which can improve the user experience, without needing to wait until the server reacts and shows another page
Store content in a document when the user requires it, without reloading the whole page
JavaScript can be used to examine what is doable in your browser and respond accordingly, known as the principles of unobtrusive JavaScript
It can be used to aid in fixing browser issues or patch holes in browser support, for instance fixing CSS format issues in particular browsers.
5 things you likely did not know could be done with HTML can be found here:
https://www.creativebloq.com/how-to/5-things-you-didnt-know-you-could-do-with-html
Advantages of using javascript
1) Client-side JavaScript can be executed immediately within the client-side browser since it is very fast
2) JavaScript Node.js server can be used in many ways, therefore it is versatile
3) JavaScript is relatively simple to implement and learn
4) JavaScript is used everywhere on the web and there are numerous resources to learn JavaScript such as StackOverflow and GitHub.
Author: Rokas Stasiulaitis
Editor: Ruby Osborne
references:
[1]"w3schools.com," w3.css, [Online]. Available: https://www.w3schools.com/html/html_intro.asp. [Accessed 01 03 2019].
[2] "HTML Styles - CSS," w3.css, [Online]. Available: https://www.w3schools.com/html/html_css.asp. [Accessed 01 03 2019].
[3] "9 Best Free HTML Editors for Windows for 2019," Lifewire, [Online]. Available: https://www.lifewire.com/best-free-html-editors-for-windows-3471313. [Accessed 01 03 2019].
[4] "The purpose of JavaScript," WebPlatform, [Online]. Available: https://webplatform.github.io/docs/concepts/programming/the_purpose_of_javascript/. [Accessed 01 03 2019].
[5] "Advantages and Disadvantages of JavaScript," FreeCodeCamp, [Online]. Available: https://guide.freecodecamp.org/javascript/advantages-and-disadvantages-of-javascript/. [Accessed 01 03 2019].
[6] "Lesson 6: Advanced HTML," KillerSites, [Online]. Available: https://www.how-to-build-websites.com/advanced-html.php. [Accessed 01 03 2019].
[Figure 1] Free From Wix Images "html code". CC0. 2019.
[Figure 2] Infographic designed by Ruby Osborne. Content created by Rokas Stasiulaitis. 2019.
Comments