_                              _                                    _             _      _       
 | |                            (_)                                  | |           (_)    | |      
 | |__   ___  ___ ___  _ __ ___  _ _ __   __ _    __ _  __      _____| |__     __ _ _ _ __| |_   _ 
 | '_ \ / _ \/ __/ _ \| '_ ` _ \| | '_ \ / _` |  / _` | \ \ /\ / / _ \ '_ \   / _` | | '__| | | | |
 | |_) |  __/ (_| (_) | | | | | | | | | | (_| | | (_| |  \ V  V /  __/ |_) | | (_| | | |  | | |_| |
 |_.__/ \___|\___\___/|_| |_| |_|_|_| |_|\__, |  \__,_|   \_/\_/ \___|_.__/   \__, |_|_|  |_|\__, |
                                          __/ |                                __/ |          __/ |
                                         |___/                                |___/          |___/
  

Hello, World!

I'm studying to be a frontend web developer and this space is for my notes, random questions, to-dos, code tests, all that stuff.


Little reminders because I'm a dumbass who forgets everything:


Dynamic Images

I learned how to change images dynamically based on the screen size without using media queries. You basically just use HTML, but the downside is that you need the image file in different sizes. So yeah, because of that, you can't really do it for every image on the site, only the ones that actually matter.

Also, the order of the factors really does matter in this case, so the source elements need to be in the correct order or everything gets messed up.

Try opening this page on your phone or resize your browser window to see the images changing.

dynamic image

The code I used was the following:


Audio & Video

Honestly, I didn't know adding an audio player to a site was that simple. I guess I just didn't know how to add one yet because I never actually looked it up. I'm putting it on this page just for learning purposes.

Music: Crunchy Leaves by Vlad Gluschenko is licensed under a Creative Commons License.

The same goes for videos. I've been wanting to make those one-minute-a-day vlogs and store them on my site, but that might get way too heavy. Either way, now I know how to add locally hosted videos to my pages. My honest take? For something like mine, it's way better to just make a YouTube channel or something similar and host the videos there.

The code used was the following:

🚨 Just like I used picture to make dynamic images, you can do something similar with audio and video. But instead of changing the format based on the browser window size, it switches the format if it can't load the default one.