0:00
Hello guys. Welcome to the course "Web technologies  and web design for beginners" and today  
0:08
we're gonna talk about cross browser  and cross-platform programming.
0:13
Why cross-platform programming is important? Internet is nowadays a huge part of human life.
0:21
Almost four and a half billion users worldwide use it, which is fifty six percent of the entire population 
0:30
of the Earth. It's obvious that they use wide  variety of technologies. To create document that  
0:36
will fit everyone we should consider support  of different browsers, different screen sizes,
0:44
and different platforms. Nowadays most people  use Google Chrome but there are those who use  
0:50
Safari, those who use Firefox, Internet Explorer and  Mozilla. Most of the CSS properties present in the  
0:59
approved standards are supported by all modern browsers and devices. Currently the  
1:06
line between the computers and portable devices with which users visit web pages almost erased.
1:13
All devices can be classified into groups by  screen size, proportions, screen navigation method, etc.
1:22
Each of these parameters affects the usability  of web page that you're designing. Comparing the  
1:29
screen of a desktop computer or laptop to a mobile  device you can see, that despite the same declared  
1:35
resolution in pixels the actual physical size  of the mobile device is several times smaller.
1:42
Nowadays users mostly use smartphone to browse  websites. Less of them use laptops, even less use  
1:51
tablets, some of them still use computers and one  percent of users use netbooks or even smart TVs.
2:03
If you design for mobile browser you should  consider that the page elements, which size is  
2:11
set in pixels, can be displayed correctly in  a computer but will be unacceptably small on  
2:17
a mobile device. In this case mobile browser  will try to squeeze the page to fit it all  
2:24
into a mobile phone screen and will make  it hardly readable. Or it will add horizontal  
2:31
and vertical scrolls which may make reading  quite hard. Unless special instructions are given  
2:39
the browser will decide itself how to handle your  page. The correct page should have only vertical  
2:47
scroll and should have the font size easily  readable for users even on smallest devices.
2:54
To handle this there is a special meta tag  which is called "viewport" with which help  
3:02
you can manage initial settings and even  the settings the user can handle himself.
3:14
Web page elements can be measured in absolute and  relative values. Absolute units of measurements do  
3:21
not depend on anything, they will not change  their value with any changes or settings.
3:28
In HTML and CSS there are five absolute units of  measurement that are still present. First of all  
3:35
these are inches - European unit of measurement with  a distance equal to 2.54 centimeters, marked as "in".
3:43
The second one is centimeter, which is equal  to almost 40 percent of inch. It's denoted as "cm".
3:56
Also we have millimeter which is 10 percent of a  centimeter. The fourth element of measurement  
4:04
is points which is standard printing unit of  measurement. And pica which is also standard  
4:12
printing unit of measurement but it's rarely used.  Relative units of measurement are characterized by  
4:20
the fact that their value is calculated relative  to some other value. The dimensions denoted by  
4:27
these values may change due to external factors such as screen size, viewports, width,
4:35
user settings etc. There are four relative units  of measurement in HTML nowadays. First of all  
4:44
it's "em" - letter M of typographical font which is  used in the current web page it's equal to the  
4:53
size of a huge letter M. The next one is letter Єx"  which is basically the same but it's calculated  
5:03
by the height of a lowercase letter x. The next  one surprisingly is pixel, because pixel element  
5:12
is monitor screen element which can be painted  with only one color. A pixel is relative value,
5:21
because of its ability to scale depending on the  monitor screen size. In fact the pixel depends on  
5:29
the diagonal of the screen, which is constant, and  the resolution, which waries depending on the user  
5:36
settings. The last relative unit of measurement  is percentage. Percentage value is a real number  
5:44
calculated by browser and it depends on the  property, to which it's assigned - either it is  
5:51
calculated by the another property of this element  or it depends on the parent element or whatever.
5:58
Next time guys we will talk about  media requests and dynamic adapting  
6:05
of the page depending on the different screen size. Thanks for watching and stay tuned!