A Glimpse Into BrainStation’s Intro to Web Development Workshop

By Kara Harrington November 3, 2015
Share

photo-1429051883746-afd9d56fbdaf

Each month, BrainStation hosts Intro to Web Development workshops to teach HTML & CSS. The workshop starts out with an intro of HTML & CSS and afterwards, attendees break out into project time where they are able to code away their own webpage!

Here is a taste of what you’ll learn (and a teaser for our Intro to Web Development course!)

HTML – (Hyper Text Markup Language) is a standardized system for tagging text files to achieve font, colour, graphic, and hyperlink effects on World Wide Web pages. HTML is like scaffolding or blueprint of a website. When writing HTML, you use tags to provide the structure of your website.

When you write / use tags, you use opening and closing tags.

Open Header Tag – Links, content etc. go in between.

End Header Tag – You must use opening or closing tags, always. If you don’t put a closing tag, the rest of your page will inherit the tag styles, fonts, etc.

Here is a list of commonly used HTML Tags.

CSS – A style sheet language used for describing the presentation of a document written in a markup language. CSS provides the aesthetic, rich appearance of a website i.e colours, fonts, sizes, etc.

How to write CSS properties
h1{ ←- where you are addressing the Tag in HTML
colour:red;
}

By doing this, you will change the colour of the header to RED.

If you are looking for a specific HTML colour codes, this is a helpful resource.

Here is a more in depth list of commonly used CSS Tags.

HTML AND CSS INTERACTION

Html tags have attributes called classes and id’s.

Written class = “example”; id = “example”.
CSS targets html tags like the following: #example targets tags with id called example, and .example targets the class example.

Tip: When you are looking at some of your favourite websites on Chrome or Firefox, you can right click and select “Inspect Element” to see exactly how they have built their HTML & CSS and learn to build an effective and relevant website.

Want to dive even deeper into web development? BrainStation also offers a more intensive, full-time course, the Web Development Immersive Program. In this course, you’ll learn both front-end AND back-end.