WEB Design

Web design

Responsive Web Design(RWD) – отзывчивый веб-дизайн Adaptive Web Design(ADW) – адаптивный веб-дизайн
Fluid grid(“резиновый макет”) –

Жидкая сетка имеет гибкую
ширину содержимого, которая идет от края до края
в соответствии с размером экрана.
В гибкой сетке столбцы либо увеличиваются,
либо сжимаются, чтобы адаптироваться к
доступному пространству.

подстраивает макет сайтапод размер экрана пользователя
пример кода:
.menu {
width: 55%;
float: Right;
}Fluid Grid Layout Creation For Responsive Web Design

 Используют несколько шаблонных размеров
планшеты – 764px
телефоны – 320px
ПК – 1680px
Это изображение имеет пустой атрибут alt; его имя файла - pilt-1.pngПример адаптивного веб-дизайна, можно выбрать в каком режим будет просматриваться страница.

Дополнительные примеры находятся ниже,примеры для пк,планшета и телефона
Flexible Media(“гибкие изображения”) – подстраивает всяческие картинки и видео под экран пользователя.
пример кода:
.width-height-90 { width: 80%; height: 75%; }Отзывчивый веб-дизайн
Media Queries(“медия запросы”) позволяют изменять все элементы сайта в зависимости от размера экрана ползователя.
пример кода:
@media screen and (max-width: 400px) {
.topnav a {
float: none;
width: 100%;
}
ПРОСМОТР В ФОРМАТЕ ПК
ПРОСМОТР В ФОРМАТЕ ПЛАНШЕТА
ПРОСМОТР В ФОРМАТЕ ТЕЛЕФОНА
Вывод:Для меня в использовании больше удобен Responsive Web Design, потому что шаблон подстраивается под размер экрана, а также подходит для одной версии веб-сайта в использовании всех возможных устройств.Столбцы либо увеличиваются,
либо сжимаются.
Conclusion:For me, Responsive Web Design is more convenient to use, because the template adjusts to the screen size, and is also suitable for one version of the website in use of all possible devices.The columns either grow or shrink.