Osman Web Chronicles

This web development progress record tracks my journey learning HTML, CSS, and JavaScript, offering tutorials, tips, and resources for those looking to start their own web development journey. Not all of them are tutorials per se, but rather notes or scribble pads that I have organized chronologically in order to preserve this journey.

I have tried to preserve these web-pages, as they were when I created them no matter how rubbish they might look.

Use inspect to investigate elements . Keep emmet cheatsheet at hand.

HTML

  1. Headings
  2. imgs
  3. Lists and tables
  4. Form Input
  5. Inline and Block
  6. Ids and Classes
  7. HTML Entities
  8. Semantic Tags

CSS

  1. Getting Started
  2. Selectors
  3. Fonts and Colors
  4. Background and Borders
  5. The Box Model
  6. Alignment
  7. Link Desinging
  8. Navigation
  9. Display and Position Properties
  10. Visibility and z-index
  11. Flexbox
  12. Responsive Design
    1. Size Units
    2. Media Queries
  13. Box and Text Shadows
  14. Grid

Projects

  1. First Project
  2. A Quick Site
  3. FoodHolics

Visit the Repo: Source

Although I would love to turn it into a neat home page some day, that is still beyond me at the moment. [Update: It isn't now. I'm just too lazy :]

Resources: