COURSEFORBEGINNER A STEP BY STEP GUIDE VOLUME 3 FATIMAH ZAHRA - HARZULAILI- FAZILAH - ATIJAH - ROZIYALINEY
A STEP BY STEP GUIDE HTML COURSEFORBEGINNER VOLUME 3 FATIMAH ZAHRA - HARZULAILI- FAZILAH - ATIJAH -ROZIYALINEY
PREFACE i This Book guides the reader step by step to learn basic HTML. This book presents three steps include STEP 1 - Introduction to HTML Forms, STEP 2 - Creating Form using HTML and STEP 3 - GET and POST Method. How Do They Differ? Besides that, it comprises of exercises such as a structured question and essay to develop more attractive and interesting learning sessions. This book also accompanied by related videos to give a clearer understanding about the topic. Readers can scan the QR code to open the link. This book is suitable for the beginners who want to deepen the world of HTML at a basic level. It is hoped that this book can bring a positive impact on all readers.
HTML COURSEFORBEGINNER VOLUME 3 A STEP BY STEP GUIDE ii EDITOR Atijah binti Marsithi WRITERS Fatimah Zahra binti W Razali Roziyaliney binti Muhammad Harzulaili binti Saleh Atijah binti Marsithi Fazilah binti Ismail REVIEWER Siti Norhidayah binti Saad CONTENT & COVER IMAGE Canva DESIGNER Atijah binti Marsithi First Published August 2023 All rights reserved. This book or any portion thereof may not be reproduced or used in any manner whatsoever without the express written permission of the publisher e ISBN Published by POLITEKNIK MUADZAM SHAH Lebuhraya Tun Abdul Razak 26700 Muadzam Shah Pahang Darul Makmur. Tel. No : 09-4502005/ 2006/ 2007
In the name of ALLAH, the Most Gracious and Most Merciful. Praise be to Allah SWT, whose blessing and guidance have helped us in completing this eBook entitled A step by step guide HTML Course for Beginner Vol. 3. We would like to express our sincere gratitude to our family and friends for their kind, support, and motivation. Our sincere thanks also specially to committee member of eLearning Unit of Politeknik Muadzam Shah and the Instructional and Digital Learning Division, Department of Polytechnic and Community College Education for the opportunities in their digital learning project and leading us working on diverse, exciting for writing this eBook. We would like to thank the rest of our reviewer and supporter. Our honor goes to Madam Fazilah Ismail as a Head of Department, Information Technology and Communication Department and Madam Siti Norhidayah Saad as a content expert reviewer for this eBook content. APPRECIATION iii
STEP 1 : Introduction to HTML Forms 01 Test Yourself 25 STEP 2 : Creating Form using HTML 04 References 27 STEP 3 : GET and POST Method. How Do They Differ? 19 Table of Contents A Step by Step Guide : HTML Course for Beginner Vol. 3 iv
Introduction A Step by Step Guide : HTML Course for Beginner Vol. 3 to HTML Forms
T h e H T M L < f o r m > ele m e n t i s u s e d t o c r e a t e a n H T M L f o r m f o r u s e r i n p u t . T h e < f o r m > ele m e n t i s a c o n t a i n e r f o r d i f f e r e n t t y p e s o f i n p u t ele m e n t s , s u c h a s : t e x t fi e l d s, c h e c kb o x e s, r a d i o b u t t o n s, s u b m i t b u t t o n s, e t c . H T M L F O R M S 0 2
02 T h e H T M L < i n p u t > ele m e n t i s t h e m o s t u s e d f o r m ele m e n t . A n < i n p u t > ele m e n t c a n b e d i s pla y e d i n m a n y w a y s , d e p e n d i n g o n t h e t y p e a t t r i b u t e . H T M L F O R M S < i n p u t > 0 3
CREATING A Step by Step Guide : HTML Course for Beginner Vol. 3 HTML Forms
TYPES OF <input> A Step by Step Guide : HTML Course for Beginner Vol. 3 05 Text Box Radio Button Combo Box Text Area Hidden Textfield Password Textfield Submit Button
HTML Text Box A Step by Step Guide : HTML Course for Beginner Vol. 3 06 Output
02 The <input type= "text"> defines a single-line input field for text input. 07
HTML Text Box Add this coding and see the difference A Step by Step Guide : HTML Course for Beginner Vol. 3 08 Output
HTML Radio Button A Step by Step Guide : HTML Course for Beginner Vol. 3 09 Output
02 The <input type= " radio " > defines a radio button. Radio buttons let a user select ONE of a limited number of choices. 10
HTML Combo Box A Step by Step Guide : HTML Course for Beginner Vol. 3 11 Output
HTML Text Area A Step by Step Guide : HTML Course for Beginner Vol. 3 12 Output
HTML Hidden Text Field A Step by Step Guide : HTML Course for Beginner Vol. 3 13 Output
HTML Hidden Text Field A Step by Step Guide : HTML Course for Beginner Vol. 3 14 Output
02 A hidden field let web developers include data that cannot be seen or modified by users when a form is submitted.
HTML Password Text Field A Step by Step Guide : HTML Course for Beginner Vol. 3 16 Output
02 The <input type= " password" > defines a password field (characters are masked) 17
HTML Submit & A Step by Step Guide : HTML Course for Beginner Vol. 3 18 Output Reset Button
GET and POST Method A Step by Step Guide : HTML Course for Beginner Vol. 3 How Do They Differ?
02 The method attribute specifies how to send form-data (the form-data is sent to the page specified in the action attribute) POST and GET Method 20
02 The form-data can be sent as URL variables (with method= " get") or as HTTP post transaction (with method= " post") POST and GET Method 21
HTML – GET Method A Step by Step Guide : HTML Course for Beginner Vol. 3 22 Appends formdata into the URL in name/value pairs The length of a URL is limited (about 3000 characters) Useful for form submissions where a user wants to bookmark the result GET is better for non-secure data, like query strings in Google Never use GET to send sensitive data! (will be visible in the URL)
HTML – POST Method A Step by Step Guide : HTML Course for Beginner Vol. 3 23
HTML – GET Method A Step by Step Guide : HTML Course for Beginner Vol. 3 24
A Step by Step Guide : HTML Course for Beginner Vol. 3 25 HTML – POST Method
A Step by Step Guide : HTML Course for Beginner Vol. 3 Test Yourself
TEST YOURSELF Choose one of activities below and create a form for : A Step by Step Guide : HTML Course for Beginner Vol. 3 27 Purchasing flight ticket Shopping cart New Student Profile Create new email Sign up for membership movie card Your form need to have table, text box, radio button and submit or reset button
References A Step by Step Guide : HTML Course for Beginner Vol. 3
1) Donald. I. (2020). Web Design with HTML and CSS Training Course Kindle Edition. Kindle. (ASIN: B08SNQPMLW) 2) Olofu. M. (2020). HTML5 Website Design Guide Kindle Edition. Kindle. (ASIN: B08RS5SY8G) 3) Aryuk. P. (2020). Web Software: Website Design Software For Newbies and Professionals 2020. Aryuk Publications. (B08SQZWRNK) 4) MacDonald. M. (2020). WordPress: The Missing Manual: The Book That Should Have Been in the Box 3rd Edition. O'Reilly Media. (ISBN: 1492074160) 5) N R Jennifer (2018) Learning Web Design: A Beginner's Guide to HTML, CSS, JavaScript, and Web Graphics 5th Edition. O'Reilly Media. Canada. (ISBN: 9781491960202) A Step by Step Guide : HTML Course for Beginner Vol. 3 29
POLITEKNIK MUADZAM SHAH Lebuhraya Tun Abdul Razak 26700 Muadzam Shah Pahang Darul Makmur. Tel. No : 09-4502005/ 2006/ 2007