In this study group activity "Web Front-End Journey" we will begin to recognize and learn HTML & CSS, which are two technologies that must be mastered if you are interested in web platforms. We will learn everything from the basics (you don't need to worry if you don't have experience, we will learn together), and for those who are experienced, you don't need to worry, you can help other friends and we will discuss more advanced things (accessibility, semantics, browser compatibility, HTML technical summary, etc.).

1. Web Front-End Journey #1
HTML & CSS
GDSC Universitas Mikroskil Study Group
Universitas Mikroskil

2. Make This Session Fun & Lively
● 🎥 Open your webcam
● 🎤 Mute your mic when not speaking
● 💬 Use the chat feature if the mic is not possible
● ❓ Use the QnA feature or rise hand to ask questions
● 🗣 Chat as comfortably as possible but remain polite
● 💸 Pinjam dulu seratus

3. Kamuh mawuh belajar apah
malam ini?
ⓘ
Click Present with Slido or install our Chrome extension to activate this poll
while presenting.

4. Ciapa pernah bikin website
ⓘ
Click Present with Slido or install our Chrome extension to activate this poll
while presenting.

5. Edwin Tantawi
GDSC Lead
Universitas Mikroskil
"If You Have
Knowledge, Let
Others Light Their
Candles In It."
~ Margaret Fuller

6. HTML
https://developer.mozilla.org/en-US/docs/Web/HTML
Universitas Mikroskil

7. HTML - Prerequisites
https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_
HTML#prerequisites

8. HTML - Anatomy
https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_
the_web/HTML_basics#anatomy_of_an_html_element

9. HTML - Head & Metadata
https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_
HTML/The_head_metadata_in_HTML

10. HTML - Text
https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_
HTML/HTML_text_fundamentals

11. HTML - Hyperlink
https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_
HTML/Creating_hyperlinks

12. HTML - Text Formatting
https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_
HTML/Advanced_text_formatting

13. HTML - Website Structure
https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_
HTML/Document_and_website_structure

14. HTML - Debugging
https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_
HTML/Debugging_HTML

15. HTML - Video & Audio
https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_e
mbedding/Video_and_audio_content

16. HTML - Vector Graphics
https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_e
mbedding/Adding_vector_graphics_to_the_Web

17. HTML - Form
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form

18. HTML - Tables
https://developer.mozilla.org/en-US/docs/Learn/HTML/Tables

19. CSS
https://developer.mozilla.org/en-US/docs/Learn/CSS/
First_steps/What_is_CSS
Universitas Mikroskil

20. CSS - Structure
https://developer.mozilla.org/en-US/docs/Learn/CSS/First_steps/How_C
SS_is_structured

21. CSS - Selectors
https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/S
electors

22. CSS - Cascade,
Specificity, & Inheritance
https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/C
ascade_and_inheritance

23. CSS - Box Model
https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/T
he_box_model

24. CSS - Backgrounds &
Borders
https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/B
ackgrounds_and_borders

25. CSS - Overflow
https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/O
verflowing_content

26. CSS - Values & Units
https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/V
alues_and_units

27. CSS - Debugging
https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/D
ebugging_CSS

28. CSS - Font Styling
https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Fund
amentals

29. CSS - Layout
https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout

30. Let's Build Something!
Resume/CV, Blog/Artikel, Marketplace, etc

31. What Next?
Learn Javascript!

32. 🎁 Gift For You!
- Dicoding token for all of you (Belajar Dasar Pemrograman Web)
- 3 Dicoding subscription token 30 days
for 1 Active participant, 1 Best question & 1 Lucky participant

33. 󰗞 Thank you
Don't decide that learning is just an event, but make it a habit and Stay
connected with each other learning outside of the event

34. 📷 Poto dulu ga ci?
“GDSC Logo style, With the items closest to you, Freestyle 😎”