SIZING
UNITS
A "ONE SIZE FITS ALL" GUIDE TO UNITS IN WIX STUDIO
SIZING
UNITS
A "ONE SIZE FITS ALL" GUIDE TO UNITS IN WIX STUDIO
But before we geek out on each unit and its quirks, let’s rewind a bit. To really get the “why” behind them, we need to peek into their history and the context that shaped the units we use today.
Understanding units gives you real control over how your design looks and behaves. Pixels, percentages, vh, vw — once you get them, they stop being mysterious and start being powerful tools.
Contrary to popular belief, size does matter — at least when you’re building responsive websites. Get it wrong, and your layout starts behaving like it’s had too much coffee.
Contrary to popular belief, size does matter — at least when you’re building responsive websites. Get it wrong, and your layout starts behaving like it’s had too much coffee.
Understanding units gives you real control over how your design looks and behaves. Pixels, percentages, vh, vw — once you get them, they stop being mysterious and start being powerful tools.
But before we geek out on each unit and its quirks, let’s rewind a bit. To really get the “why” behind them, we need to peek into their history and the context that shaped the units we use today.
CHAPTER I
1989
–
1995
BIRTH OF THE WEB
On 30 April 1993, CERN put the World Wide Web software in the public domain. Later, CERN made a release available with an open license, a more sure way to maximize its dissemination. These actions allowed the web to flourish.
1993
The first website at CERN – and in the world – was dedicated to the World Wide Web project itself and was hosted on Berners-Lee's NeXT computer.
1992
Step into history: explore the very first web browser ever created.
Type a command or click to navigate, just as Tim Berners-Lee once did.
Step into history: explore the very first web browser ever created.
Type a command or click to navigate, just as Tim Berners-Lee once did.
There was no CSS yet, no fancy units to measure or control the layout.
Everything was structured with simple HTML tags like <h1>, <p>, and <br>, which dictated the basic flow of text on the page.
1989
The web was born at CERN, in 1989, thanks to Tim Berners-Lee.
At this stage, web pages looked more like research papers than websites.
The line-mode browser, launched in 1992, was
the first readily accessible browser for the Web.
CHAPTER II
1996
–
2009
PIXELS TAKE THE STAGE
When CSS arrived, it gave designers their first real toolbox for controlling size.
Suddenly, you could choose between pixels, points, centimeters, or milimeters (legacy print units)
Out of all these options, one unit stole the spotlight: the pixel.
1996
PIXEL
1996
"We wanted people to use HTML. But we also wanted people to say something about font size, colours, typography, layout, margins and shadows and such. "
Click to Style
Hello World
Hello World
.styling {
font-family: "Courier New";
padding: 20px;
color: chartreuse;
}
1997
Designers loved it because it promised “pixel-perfect” layouts that looked the same on every screen, or so they thought.
“Pixel-perfect design”
became the mantra.
1994
When it comes to web design, few people have been more important or influential than Håkon Wium Lie. Working at CERN alongside Tim. Lie is the man who gave it its familiar look by inventing CSS.
"If we hadn’t developed CSS, we could have ended
up with the web being a giant fax machine" 📠
CHAPTER III
2010
–
2016
THE FLUID WEB
When CSS arrived, it gave designers their first real toolbox for controlling size. Suddenly, you could choose between pixels, points, centimeters, or millimeters (legacy print units).
Out of all these options, one unit stole the spotlight: the pixel.
1996
1996
The idea of one design that fits all screens changed everything. Percentages became crucial for fluid grids.
.png)
1997
Designers loved it because it promised “pixel-perfect” layouts that looked the same on every screen, or so they thought.
2010
Then came the revolution. As phones entered the picture, fixed pixels shattered. In 2010, Ethan Marcotte coined the term “Responsive Web Design” and designers began to think in relationships rather than absolutes to let layouts scale naturally. The idea of one design that fits all screens changed everything.
"When we are designing for the web,
we're designing for an infinite canvas"
1996
The idea of one design that fits all screens changed everything. Percentages became crucial for fluid grids.
