You have no items in your shopping cart.
Course Details
Topic 1. Introduction to Responsive Web Design
- What is Responsive Web Design
- Demo Responsive Websites
- Responsive Design Strategy
- Install Sublime Text and Google Chrome
- Testing website with Chrome Emulator
Topic 2. Preparing HTML Structure for homepage
- Creating Homepage Sections
- Creating the Hero Banner with background and info text markup
- Importing Google Fonts for styles
- Styling the Homepage Hero Banner
- Adding background image to the Hero Banner
Topic 3. Media Queries
- Understanding the before/after impact of adding Meta Viewport tag
- Understanding Fixed vs Fluid Layouts
- Understanding Media Queries
- Adding Media Query breakpoints for mobile and tablet
- Adding custom styles for the mobile breakpoint
- Adding custom styles for the tablet breakpoint
Topic 4. Phone Sections
- Creating the phone specs section markup
- Styling the specs section using fluid grid
- Using online sprite creator tool
- Using CSS Sprite for displaying icons in the spec section
- Adding clearfix and other utility classes
- Adding custom styles for the mobile breakpoint
- Adding custom styles for the tablet breakpoint
Topic 5 - Gallery Section
- Creating the gallery images markup
- Styling the image gallery using Fluid Grid layout
- Fixing layout with clearfix
- Adding custom styles for the mobile breakpoint
- Adding custom styles for the tablet breakpoint
Topic 6 - Phone Display and Performance
- Creating the phone display and performance section markup
- Styling the phone details section and adding background banner
- Styling the performance section
- Styling the performance metrics using Fluid Grid layout
- Styling for the mobile breakpoint
- Styling for the tablet breakpoint
Topic 7 - Phone Feature and Tabular Data
- Creating the markup for phone features section with tabular data
- Adding styles for the Phone Features tabular data
- Updating the feature table layout for mobile breakpoint
- Understanding Mobile First Designs
Topic 8. Create Responsive Layout for Print
- Strategy and Media Query for Printing
- Setting up styles for printing
- Styling the gallery and phone info section for Print
- Styling tab layout to single page layout for print
Course Info
Promotion Code
Your will get 10% discount voucher for 2nd course onwards if you write us a Google review.
Minimum Entry Requirement
Knowledge and Skills
- Able to operate using computer functions
- Minimum 3 GCE ‘O’ Levels Passes including English or WPL Level 5 (Average of Reading, Listening, Speaking & Writing Scores)
Attitude
- Positive Learning Attitude
- Enthusiastic Learner
Experience
- Minimum of 1 year of working experience.
Target Age Group: 18-65 years old
Minimum Software/Hardware Requirement
Software:
Hardware: Window or Mac Laptops
Job Roles
- Those who want to apply advanced HTML5 and CSS3 technique to responsive web design
Trainers
Shahul H. Maricar: Shahul H. Maricar is a ACTA certified trainer. Shahul H. Maricar has been a content developer and webmaster, building educational websites and applications with HTML, CSS and JavaScript. He then served as an IT analyst, writing programs for automating custom workflows as well as data extraction and analysis in the healthcare field.
He is currently a freelance educator and is actively involved with development projects in game programming, computer-aided design and computer graphics.
Mohamed Afiq: Mohamed Afiq is a ACTA certifed trainer. Mohamed Afiq startup CTO for 3 years building proprietary delivery system from scratch and then managing a team of 20 developers. He builted multiple web apps using MEAN or similar stacks. He is also a founder and sole developer for PlayTours: https://playtours.app/ . He leads instructor at CodeNinja, teaching coding to kids 9-16 years old and teach adults front-end and back-end for web development.
Peter Goh: Peter Goh is a ACTA certified trainer. Peter Goh is the Technology Evangelist at Disruptive Digital, a full-service digital agency based in Singapore, offering innovative & effective web and native mobile application development. He specializes in bleeding edge software development and have more than 10 years' experience in developing customized applications for desktop, web and mobile platforms. He has extensive domain knowledge in .Net and Java programming, iOS development and has helped many to create e-commerce web sites on Amazon AWS and Microsoft Azure.
Customer Reviews (3)
- will recommend Review by Course Participant/Trainee
-
Notes text are really too small . Improve please. (Posted on 9/24/2020)1. Do you find the course meet your expectation? 2. Do you find the trainer knowledgeable in this subject? 3. How do you find the training environment - Will Recommend Review by Course Participant/Trainee
-
Should make it a 2-day course (Posted on 6/14/2016)1. Do you find the course meet your expectation? 2. Do you find the trainer knowledgeable in this subject? 3. How do you find the training environment - Might consider recommend Review by Course Participant/Trainee
-
Extend to two days (Posted on 6/14/2016)1. Do you find the course meet your expectation? 2. Do you find the trainer knowledgeable in this subject? 3. How do you find the training environment
Write Your Own Review
You May Be Interested In These Courses
Build Web Apps with ASP.NET Core and C# for Beginners
$600.00 (GST-exclusive)
$654.00
(GST-inclusive)
