Fundamental of Web Design Using HTML5 and CSS3

MDIS


Course introduction

Every journey needs a starting point and the first step into the exciting world of web technology starts with learning how to use and understand the internet language known as HTML. This workshop serves as an introduction to vanilla HTML5 and CSS3, which are core skills essential to any aspiring frontend web developer or designer.



Course Benefits


At the end of the workshop, learners should be able to

  • Explain and apply the various HTML and CSS techniques in building a web page
  • Design and build a responsive website using the Bootstrap Framework
  • Make use of a Web Host to publish the website on the Internet



Course Pre-Requisites


Learners should have little or no knowledge of HTML programming, be able to communicate
and write in English and have a high motivation to learn.



Target Audience


This workshop is for learners who have a keen interest in picking up Web Design and serves as an
entry point into the Web Applications and Stack Development training paths.



Course Outline


Module 1: What is HTML?

  • What is the Hypertext Markup Language?
  • The basic HTML document type, structure and syntax
  • Creating a local web project folder
  • Installing and setting up a simple Text Editor
Module 2: Text and Formatting
  • Paragraphs and Headlines
  • Text Emphasis (bold, underline and italics)
  • Lists
  • Page (internal) and Site (external) Linking
  • Anchors and same page linking
Module 3: Tables
  • Basic HTML Table structure
  • Header, body and footer
  • Rows, columns and cells
  • Row and column span
Module 4: Objects
  • Differentiate between the various image file types
  • Apply full and relative paths to image source tags
  • Embed Videos and external Objects (e.g. Google Maps)
Module 5: Introducing Styles and the Cascading Stylesheet
  • CSS structure and syntax
  • The CSS “cascade” behavior
  • Inline and internal styles
  • Basic web color principles: RGB, RGBA and hexadecimal
  • Values and units used in CSS
  • Change the styling of elements in a web page
  • Create and call a CSS file
  • Style classes and elements
Module 6: An Introduction to HTML5
  • HTML5 Page Structure
  • The
    ,
    and
    sections
  • The
    and
    components
  • The CSS Box Model
  • Positioning content using
     
  • Block and inline
    structures
Module 7: Responsive Web Design
  • Responsive design patterns
  • CSS media queries
  • Breakpoints using
    containers
Module 8: The Bootstrap Framework
  • Introducing Bootstrap 4
  • How the Bootstrap Grid System works
  • Building a Navbar
  • Building a simple Carousel
  • Displaying Content with Cards
  • Displaying a Modal Window
Module 9: Publishing the Website
  • Purchasing a domain name
  • Getting a web host
  • Managing Nameservers and DNS Records
  • Using the File Transfer Protocol
  • Publishing the Website



Available Course Sessions


Please click here to stay updated on upcoming sessions.



Trainer Profile


Leslie Goh

Leslie Goh has over 17 years of experience as a web application architect. He specialises in designing
and building custom web solutions for small and medium enterprises and helps companies automate
and digitize their business processes. He started his own software company in 2002 and has worked
with clients across multiple industries.

Leslie is also a code trainer and mentor and has conducted training sessions and workshops on
internet technologies such as web design and development, SQL database and application design; as
well as non-technical courses such as entrepreneurship. He was worked with institutes such as the
Management Development Institute of Singapore (MDIS) and Lithan Academy.
Other than graduating with a Degree in Engineering (B.Eng) from the National University of
Singapore (NUS), Leslie is also a certified trainer and assessor and holds the Advanced Certificate in
Training and Assessment (ACTA) from the Singapore Institute for Adult Learning (IAL).



 

Top