outline

Buku HTML Lengkap: Dari Pemula Hingga Mahir

Bab 1: Pengenalan HTML

1. Apa itu HTML?

   • Sejarah HTML

   • Peran HTML dalam pengembangan web

   • Perbedaan HTML dengan bahasa markup lainnya

2. Persiapan Belajar HTML

   • Software yang dibutuhkan (text editor, browser)

   • Setup lingkungan pengembangan

   • Browser developer tools

3. Struktur Dasar HTML

   • Anatomi dokumen HTML

   • DOCTYPE dan versi HTML

   • Tag html, head, dan body

   • Komentar dalam HTML

Bab 2: Elemen Dasar HTML

1. Text Elements

   • Heading (h1 hingga h6)

   • Paragraf (p)

   • Text formatting (bold, italic, underline)

   • Preformatted text (pre)

   • Line breaks dan horizontal rules

2. List dan Tabel

   • Ordered list (ol)

   • Unordered list (ul)

   • Definition list (dl)

   • Struktur tabel dasar

   • Spanning cells dan styling tabel

3. Links dan Images

   • Anchor tags (a)

   • Relative vs absolute paths

   • Image tags (img)

   • Image maps

   • Favicon

Bab 3: Forms dan Input

1. Dasar-dasar Form

   • Form structure

   • Method GET vs POST

   • Action attribute

   • Form validation

2. Input Elements

   • Text input

   • Password fields

   • Radio buttons

   • Checkboxes

   • Select dropdowns

   • Textarea

   • File upload

   • Hidden inputs

3. HTML5 Form Features

   • New input types (date, email, number, etc.)

   • Form validation attributes

   • Autocomplete

   • Datalist

   • Output element

Bab 4: Semantic HTML

1. Semantic Elements

   • Header dan footer

   • Nav

   • Article dan section

   • Aside

   • Main

   • Figure dan figcaption

2. Accessibility

   • ARIA roles

   • Alt text

   • Tab index

   • Screen reader compatibility

   • Semantic markup best practices

3. SEO Basics

   • Meta tags

   • Title optimization

   • Description

   • Keywords

   • Structured data

Bab 5: Multimedia dan Embedded Content

1. Audio dan Video

   • Audio element

   • Video element

   • Source dan track elements

   • Media controls

   • Fallback content

2. Embedded Content

   • iframes

   • Embedding maps

   • Social media widgets

   • YouTube videos

   • Third-party content

3. Canvas dan SVG

   • Basic canvas usage

   • SVG introduction

   • Responsive images

   • Picture element

   • Source sets

Bab 6: HTML5 APIs dan Advanced Features

1. Storage APIs

   • LocalStorage

   • SessionStorage

   • IndexedDB basics

   • Cache API

2. Drag and Drop

   • Draggable elements

   • Drop zones

   • Events handling

   • File drag and drop

3. Geolocation dan Device APIs

   • Getting user location

   • Device orientation

   • Battery status

   • Media capture

Bab 7: HTML Best Practices dan Optimization

1. Code Organization

   • File structure

   • Naming conventions

   • Documentation

   • Version control basics

2. Performance Optimization

   • Minification

   • Compression

   • Lazy loading

   • Resource hints

   • Critical rendering path

3. Cross-browser Compatibility

   • Browser support

   • Polyfills

   • Feature detection

   • Progressive enhancement

   • Graceful degradation

Bab 8: Project Praktis

1. Personal Website

   • Planning dan wireframing

   • Implementation

   • Testing

   • Deployment

2. Landing Page

   • Design principles

   • Responsive layout

   • Call-to-action

   • Analytics integration

3. Portfolio Gallery

   • Image optimization

   • Grid layout

   • Filtering

   • Lightbox implementation

Bab 9: Tools dan Workflow

1. Development Tools

   • Code editors

   • Browser extensions

   • Validation tools

   • Testing tools

2. Build Tools

   • Package managers

   • Task runners

   • Module bundlers

   • Development servers

3. Deployment

   • Web hosting

   • Domain setup

   • SSL certificates

   • Content delivery networks

Bab 10: Future of HTML

1. Emerging Technologies

   • Web Components

   • Progressive Web Apps

   • WebAssembly

   • WebXR

2. HTML Living Standard

   • Ongoing development

   • Proposal process

   • Browser implementation

   • Community involvement

3. Career Path

   • Front-end development

   • Full-stack development

   • Web design

   • UI/UX specialization

Appendix

1. HTML References

   • Tag list

   • Attribute reference

   • Entity reference

   • Color codes

2. Resources

   • Online learning platforms

   • Documentation

   • Community forums

   • Design resources

3. Glossary

   • Technical terms

   • Acronyms

   • Industry jargon

   • Common concepts