Client Side Web Development For Beginners (HTML/CSS/JS)

Client Side Web Development For Beginners (HTML/CSS/JS)


Published by Maks Uri at Shakespir

Do you want to make a website but don’t know where to begin? Client Side Web Development For Beginners (HTML/CSS/JS) is perfect for beginners and intermediate programmers that want to make a website for free. All you need is this book and a Mac or Windows computer to begin.

Chapter 1: Web Development Basics and Setup

Section 1: How to Start Writing HTML, CSS, and  JS on Your Computer

Section 2: HTML Coding Basics

Section 3: CSS Coding Basics

Section 4: JS Coding Basics

Chapter 2: Using A Website Hosting Company

Section 1: Sign Up and Upload Your Code

Chapter 3: How To Continue Programming

Section 1: Moving On

Chapter 1: Web Development Basics and Setup


How to Start Writing HTML, CSS, and JS on Your Computer:

Macintoshes come with an application called TextEdit which can edit HTML, CSS, and JS. Simply open up TextEdit, click “TextEdit” on the menu bar, which is the bar on the top of the screen of a Mac, then select “Preferences”. Once you have done that click on “Plain Text” under Format and turn off Smart Quotes under Options. Proceed to click “Open and Save” on the top of the pop-up window and then make sure “Display HTML files as HTML code instead of formatted text” is on. If you are on a Mac and you want to color coordinate your code or not use TextEdit then you can download TextWrangler from Bare Bones Software Incorporated. If you are not on a Mac but instead on a Windows you can download Notepad++ for free at notepad-plus-plus.org, a safe site for coding.

HTML Coding Basics:

HyperText Markup Language (HTML) is a very easy programming language to learn. HTML is used to create a structure for your website. To program in HTML simply use tags which are specific words with “<” in front and “>” in the back. For example “

” would be the beginning of a paragraph and the paragraph would end with “

”. Similarly the tag that begins HTML is and the tag that ends HTML is


For example:


Hello World


Would Output:


Hello World


You can try this yourself. Open up your Coding Application: TextEdit, TextWrangler, or Notepad++. Copy and paste the previous code, save the document, name it “example.html”, right click the document, then chose to open with an internet browser, Chrome, Firefox, Safari, or Internet Explorer for example. The page should load with the words “Hello World” on the top left of the screen.

Here are some HTML tags along with what they do:



: Displays text with the size depending on the number

: Displays objects inside in the middle of the screen

: Works like an “Enter” key (Doesn’t use a