Създаване на "каучук" на сайта за различни резолюции на екрана

При създаване на дизайн на уеб страници, което трябва да се вземат предвид няколко неща. Главен сред тях са размерът на монитора и резолюцията на екрана на публиката на вашия сайт. Уеб страниците трябва да бъдат достатъчно гъвкави, за да бъдат показани правилно различните браузъри (виж статията за съвместимост различни браузъри) и екран конфигурация.

Каква е резолюцията на екрана?

Най-видимата област на екрана, не зависи от различни разделителни способности поддържаните от монитора ви. "Resolution" - е количеството информация (пиксели), което може да показва на монитора. С по-висока резолюция показва повече информация, отколкото с по-малко.

Въз основа на тази информация, до следните изводи:

Размерът на всеки пиксел се намалява с увеличаване на резолюция. Това е така, защото в същата област на екрана се показва повече пиксели.

Илюстрации и размера на текста х от у пиксела също намалява с увеличаване на резолюция.

Тези снимки представляват два монитора с еднакъв размер (същият видимата област), действащи на различни резолюции. Мониторът работи с висока разделителна способност от монитора в и следователно показва по-голям брой по-малки пиксели.

Фиксирана маса срещу роднината

За да се убедите в това, разгледаме следния пример. Ако създадете таблица с четири клетки, всяка от които с ширина от 100 пиксела, тази таблица ще бъде фиксирана, като точните размери на снимачната площадка. Ширината на масата винаги ще бъде равна на 400 пиксела (4 х 100). Напротив, ако създадете таблица с четири клетки, ширината на която е равна на 25% от общата ширина на екрана, shiriga маса в пиксели ще зависи от текущото разделителната способност на екрана.

Препоръчителна програма за четене, в което можете да направите дизайн прототип страница

Например, ако резолюцията е настроен на 800 х 600, всяка клетка на масата ще има ширина от 200 пиксела. Ширината на цялата таблица ще бъде равна на 800 пиксела. Ако една и съща маса, за да погледнем в резолюция 1024 × 768, то ще бъде по-широк. Всяка клетка ще има ширина от 256 пиксела, а ширината на таблицата е равна на 1024 пиксела.

Всеки метод има своите предимства и недостатъци. С фиксирани маси по-лесно да се работи с тях, защото не е нужно да се притеснявате за промяна на размера на таблицата за различните посетителите на страницата.

Всички елементи на масата трябва да бъдат напълно изтеглени преди браузърът започва да ги покажете. Ако използвате фиксирани маси, дизайнерът може да принуди браузъра, за да започне да показва данните в таблицата, без да се чака за пълно натоварване. За да направите това, използвайте следната CSS стил:

Основният недостатък на използването на фиксирани маси е неизползване на ценно пространство на по-високи разделителни способности.

Нека се върнем към относителните маси, те изискват повече работа на дизайнера. Трябва да сте сигурни, че уеб страницата се изписва еднакво добре на различни резолюции. Ако всичко е направено правилно, страницата е силно мащабируем и използва цялата площ на екрана. В случай на грешки, форматирането на страницата може да направи почти нечетлив.

Текст: пиксела срещу селища

Както бе споменато по-горе, на пиксела е основната единица за измерване на разделителната способност на екрана. Ето защо, всичко, което е свързано с размера на монитора, като се смята, в пиксели. Стандартната единица за измерване на размера на шрифта е "точка". Първоначално тя е била използвана при печатната дейност и не е предназначен за използване в мрежата на.

Препоръчителна чете 5 причини, за да проектират обекти в Axure

За разрешение да се движите?

Трудно е да се разработи интернет страница с правилния баланс между форма и функция, която еднакво добре ще бъде показан на различни платформи. Това е една от основните цели на дизайнера. Трябва да сте сигурни, че промяната няма да повлияе на решението на впечатление един посетител на вашия сайт.

Сега може да попитате: "На каква резолюция трябва да се ръководи?" Отговорът зависи от вашата аудитория.

Статистика на сайта могат да бъдат полезни при определяне на идеалното решение за вашия сайт. Има и други източници, които ще ви помогнат да направите това решение. Да започнем с това, че е полезно да се види резолюцията на статистиката монитор.

Фиксиран размер на мястото срещу роднина: всеки метод си има своите предимства и недостатъци.

Фиксирана дизайн по-лесно, тъй като те не трябва да се притеснявате за преоразмеряване на различни резолюции на екрана.

Основният недостатък на използването на определени обекти е неизползването на ценно пространство на по-високи разделителни способности.

Кой сайт се фиксира или гума? Решаването на този въпрос най-добре остави на професионалистите.

Сега оформлението се използват таблици остаряла. Причините са ясни: не семантично оформление, страницата е претоварен с HTML-тагове, дълго товари, което също се отразява отрицателно на резултатите от търсенето.

Сайтът трябва да се отпечатва с помощта divs. Що се отнася до оформлението използване divs можете да видите пример за безплатни CSS-шаблони. С цел ограничаване на ширината на прозореца на браузъра, използван мин ширина имот за IE.