Images are the biggest assets that gets shipped with a web page according to these smarty pants (developer advocates for Google Chrome, my heros ❤), see the quote below.

50% of the bytes that go over the wire for any given page are on average images [from studies across web pages, as of 2020]— Suma

As a frontend developer, you should learn the tricks on how to make images impact the users’ bandwidth as little as possible and the user experience as much as possible. It’s the polite thing do, right?

However, there is a jungle out there. A jungle…

Again, this is a BIG thanks to Kevin Powell, who has taught be so much about what I know about web design. He also taught me this, the difference between using width: auto; and width: 100%; (the video is here), but I kept forgetting it, so I thought I would make a post about, possibly helping others with the same goldfish brain as mine 🙃

width: auto; means use the available space

With use the available space, it means that margins and paddings will be respected, and the element will not overflow its parent.

Kevin considers this a really unappreciated property in css, it basically helps us…

You can see the talk here:

I think Roberts made a great talk, teaching me a lot of interesting principles from the history of computing, and how we can apply them to CSS.

CSS is a relatively “young” computer language, born in 1996. The idea behind this talk, is that we can benefit from applying the learnings of the 37-year old head-start since the release of the first modern programming language in 1959 (FLOW-MATIC, according to Roberts).

I made this note for myself, hoping it would also benefit other that would like a quick reference when in need for…

Again, this is more like an acclamation of of Kevin Powell – the online guru that teaches «how to make the web and how to make it look good while they [(we)] are at it». Here is his video on responsive design made easy. Here, in this article, I have concluded his tips as a list to have an easy and accessible place to look to whenever in need for it.

Let’s take a look on Kevin’s tips on how to make a webpage responsive.

1. Lay the HTML elements out considering the desktop version of your page

The desktop…

First of all, I don’t want to take credit for something that is totally the work of some one else. Consider this article almost like a tribute to this awesome guy that really makes it easy to code on the web, and making it beautiful while we’re at it — his name is Kevin Powell.

I don’t know about you, but although I work as a frontend developer, I have never been educated in design and what rules to follow to make a design look good. Sure, I can implement beautiful sketches that I receive from the designer on my…

Yes, we’ve all been there. Nervous about our first job as a developer. Thinking “I don’t even know what a programmer really does!”. But don’t you worry, I’ve got your back. Or maybe you’re a senior developer looking for some ways to help that rookie at work to catch up some speed? This is for you as well.

Summer is around, which means a lot of you have recently graduated and will be entering work life soon. And you know what? It is super fun!

Ingvild Forseth

I am a software developer who also likes to write. This plattform is mostly used to document my process of learning.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store