Creating design system documentation
Helped promoting women in tech
Learnt HTML
Learnt css
+2

<Girls4Tech>


Introduction to programming

Girls 4 Tech was born from a partnership between EBANX and Junior Achievement, in 2018, with two main purposes: sharing knowledge and arousing interest in programming for women. Based on video lessons taught by EBANX developers, with evaluations, support materials and a forum for debates among the students, the online course was offered through an online platform, on demand and is divided into 3 modules.

Module 1 - Introduction:
  • Brief history of women in computing
  • Why learn programming?
  • How a web page works; Short story about HTML and CSS; HTML and CSS concept

Module 2 - HTML: Introduction - Structure:
  • What is HTML? What is a TAG? Initial structure of an HTML file
  • Adding elements:
    • What is TAG HEAD?; Operation of TAG Title; Operation of the TAG META; What is DOCTYPE?; What is TAG BODY?; How to add titles to a page (TAGS H1, H2, H3); How to add paragraphs to a page (TAG P); Formatting TAGS; How to make text bold (TAGS B/STRONG); How to make text in italics (TAGS I/EM); How to make text big and small (TAGS SMALL/BIG); How to make text highlighted (TAG MARK); Example of opening and closing tags (correct and wrong example)
  • Adding links and images:
    • How does the TAG IMG work; Attributes of TAG; Alt, Title, SRC; How does TAG A work?; Attributes: HREF; TARGET 
  • Adding Lists:
    • Ordered lists (TAG OL); Unordered Lists (TAG UL)
    • Definition lists (TAG DL)
  • Positioning of elements:
    • Flex; How to add tables (TAG Table); TR; TD; THEAD; TBODY; TFOOT
  • Table attributes:
    • Colspan; Rowspan; Alignment; Border

Module 3 - CSS:
  • What is CSS?; Initial structure of a CSS 
  • Selection attributes:
    • Class; ID; Elements; Cascading selection. 
  • CSS and HTML:
    • Inline CSS; External CSS; Internal CSS 
  • CSS Properties:
  • How to change font type; How to change font size; How to change font weight; How to change line spacing; How to change font color; How to change text alignment
  • CSS Properties in DIVS:
    • What is a DIV?; Width/height; Margin; Padding; Background-color; Border
  • Image manipulation:
    • How to add filters
  • How to Rotate CSS Images in Links:
  • Properties; Link; Visited; Hover; Active; How to change the cursor