In these next series of lessons you will learn how to create your own web page.
Using basic elements that you will use to control both layout and style of a web page.
Also, you will be guided through steps on how to get your web page to support interactivity.
LEARNING OBJECTIVES
- Understanding the purpose of HTML, CSS & JavaScript
- Use HTLM to create a basic web page
- Use CSS to change text styles/layout
- Get to grips using bootstrap library (used for quick and easy coding)
- Use Javascript variables/functions for interactive content and respond in real-time to user input
HTML CODE – LEARNING OBJECTIVES
- Write different tags
- Use hyperlinks to make connections between pages & create HTML navbar
- Look at world’s first webpage World Wide Web
- Learn how to set up a dev environment
- Make structured documents, embed images, create lists
WEB PAGE INTRODUCTION
- Client Side (laptop)
- Sever Side (sever)
- Web browser (is a client side as it accesses information)
- Internet (connected network of machines worldwide)
- Worldwide Web (information on internet)
- Uniform Resource Locator URL (to search for information)
WEB PAGE PROCESSES
- URL (sends request to sever) >> Sever (gets data and sends to client)
- What you people see is a rendered page (pictures, text, headings, colours, ect.)
- What programmers see is the source code (plain text formatting in web page)
TAKE A LOOK AT SOURCE CODE
- Right Click >> Inspect Element
- Tells browser how to display content on web page
OVERVIEW OF WEB PAGE
- HTML (page structure)
- CSS (page appearance)
- JavaScript (page interactivity)
4 PLAIN TEXT EDITORS
- TextWrangler (OSX)
- Notepad++ (PC)
- Sublime Text (OSX, Windows, Linux)
- Atom (OSX, Windows, Linux)
In the next articles you will learn how to set up the dev environment, and how to write HTML.
Featured image supplied free from Unsplash.
Copyright © 2016 Zoë-Marie Beesley
Licensed under a Creative Commons Attribution 4.0 International License.

More donations, more content!
A$5.00
Share this:
- Click to share on Twitter (Opens in new window)
- Click to share on Facebook (Opens in new window)
- Click to share on LinkedIn (Opens in new window)
- Click to email a link to a friend (Opens in new window)
- Click to share on Reddit (Opens in new window)
- Click to share on Tumblr (Opens in new window)
- Click to share on Pinterest (Opens in new window)