Web Development: Tabs vs.
Form Elements
Category Name Purpose HTML Tag / Type Example Use
Form Element Text box User types text <input type='text'> Enter name, username
Form Element Email box User types email <input type='email'> Enter email address
Form Element Password box User types password (hidden)<input type='password'> Login or signup
Form Element Number box User types a number <input type='number'> Enter age or quantity
Form Element Checkbox Select multiple options <input type='checkbox'> Sports, Music, etc.
Form Element Radio button Select one option from many <input type='radio'> Male/Female choice
Form Element Dropdown menu Select from a list <select> <option> Choose country
Form Element File upload Upload files <input type='file'> Upload profile picture
Form Element Link (signin/signup) Navigate to another page <a> Go to login page
Navigation Tab Top navigation tab Navigate to different pages <ul>, <li>, <a> Home, About, Contact
Navigation Tab Content switching tab Show/hide different content areas
<div>,
on JavaScript
same page Overview, Features, Pricing
Navigation Tab Vertical tab Same as content tabs but vertical
<div>,
layout
JavaScript Dashboard menu
Navigation Tab Icon tab Tab with icons instead of text <i>, <span> Social media feed icons
Browser Tab Browser tab Shows different sites in browser
Not HTML, part of browser UI Chrome tabs
