My website
Clear layouts, readable text and contact options for everyone.
- HTML
- CSS
- JavaScript basics
Chrysa L.
Front-end learner with a print shop eye for layout
About me
I work in a print shop in Volos, laying out posters, menus and business cards. I am hard of hearing, so I notice quickly when a video has no captions or a form only says 'call us'. I want to design websites that work for everyone from the first click.
My work
Landing Page for a Print Shop
A one-page site for the print shop where I work, with services, prices and contact by email or message. Flexbox lays out the service cards, and every colour pair passed a contrast check.
- HTML
- CSS
- Flexbox
- Accessibility basics
Poster Gallery with CSS Grid
A grid of posters I designed, where the larger ones span two columns. I learned grid-column and span, and wrote alt text that gives each poster's message.
- CSS Grid
- Responsive design
- Accessibility basics
Print Cost Calculator
A small calculator that gives a price from the number of copies and the paper size. I used a function with a switch and showed the result with textContent.
- JavaScript basics
- Functions
- Conditions
- DOM
My learning journey
- HTML lesson: rebuilt one of our shop posters as a web page
- CSS lesson: learned the box model, which felt a lot like layout in print
- Flexbox and Grid: a landing page and a poster gallery
- JavaScript lesson: a print cost calculator with a function and a switch
- Final project: a contact section with email and message options, not only a phone number