Ең алдымен дизайнерлер өздерінің веб-беттерін құрастырған кезде ойлайды, бұл үшін шешім қабылдау. Бұл сіздің дизайныңыздың қаншалықты кең болуы керектігін шеше алады. Енді стандартты веб-сайт ені сияқты ештеңе жоқ.
Неге шешімді қарастыру керек?
1995 жылы стандартты 640x480 мониторлар ең үлкен және ең жақсы мониторлар болды. Бұл веб-дизайнерлер осы қарарда 12-дюймнан 14-дюймдік мониторға барынша кеңейтілген веб-браузерлерде жақсы көрінетін беттерді жасауға бағытталған.
Қазіргі уақытта 640x480 рұқсат веб-торап трафигінің 1 пайызынан азын құрайды. Адамдар компьютерлерді 1366x768, 1600x900 және 5120x2880 сияқты жоғары ажыратымдылықта пайдаланады. Көптеген жағдайларда 1366x768 рұқсат экранын жобалау жұмыстары жүргізілуде.
Біз веб-дизайн тарихында тұрмыз, онда біз шешуге қатысты алаңдамауға тиіс емеспіз. Адамдардың көпшілігінде кең, кең экран мониторлары бар және олар браузер терезесін барынша арттырмайды. Сондықтан 1366 пиксельден аспайтын бетті жасауға шешім қабылдайтын болсаңыз, сіздің бетіңіз көп браузер терезелерінде де жоғары ажыратымдылығы жоғары үлкен мониторларда көрінеді.
Браузердің ені
Ойланудан бұрын «жақсы, мен беттерімді 1366 пиксельге дейін кеңейте беремін», - дейді ол. Веб-беттің енін шешкенде, жиі назардан тыс қалған мәселе, сіздің тұтынушыларыңыз браузерлерді қаншалықты сақтап қалады. Нақтырақ айтқанда, олар браузерлерді толық экран өлшемінде барынша арттыра ма, әлде олар толық экраннан кішірейе ме?
Компанияның стандартты 1024x768 ноутбукті пайдаланатын қызметкерлерінің бейресми сауалнамасында, олардың барлығы қосымшаларын барынша арттырды. Қалғаны түрлі себептермен әр түрлі өлшемді терезелерді ашты. Бұл компанияны интранетті 1024 пиксельде құрастырған болсаңыз, пайдаланушылардың 85 пайызы бүкіл бетті көру үшін көлденең айналдыру керек болатынын көрсетеді.
Клиенттерді барынша арттыратын немесе есептемегеннен кейін, браузер шекаралары туралы ойланыңыз. Әрбір веб-браузерде жылжыту жолағы бар және қол жетімді кеңістікті 800-ден 740 пиксельге дейін немесе 800х600-ке жетеді және 1024x768 ажыратымдылықтағы максималды терезелерде 980 пикселге дейін азайтатын тараптармен шектеседі. Бұл браузер «хром» деп аталады және ол сіздің бетіңіздің дизайнына қолайлы кеңістіктен кетуі мүмкін.
Тіркелген немесе сұйық ені беттер
Нақты сандық ені веб-сайттың енін жобалау кезінде ойлану керек нәрсе емес. Сондай-ақ, тіркелген ені немесе сұйық ені болатынын анықтау керек. Басқаша айтқанда, енді белгілі бір санға (тіркелген) немесе пайызға (сұйықтыққа) қою керек пе?
Бекітілген ені
Бекітілген ен беті дәл олар естіледі. Ені белгілі бір нөмірге бекітіледі және браузер қаншалықты үлкен немесе кішкентай болса да өзгермейді. Бұл сіздің оқырмандарыңыздың браузерлері қаншалықты кең немесе тар болса да, бірдей көріну үшін сіздің дизайныңыз қажет болса, бұл жақсы болуы мүмкін, бірақ бұл әдіс сіздің оқырмандарыңызды ескермейді. Браузерлері бар адамдар сіздің дизайныңыздан гөрі көлденең жылжып, кең браузерлері бар адамдарда экранда үлкен бос орын болады.
Тіркелген ен беттерін жасау үшін, бет бөлімдерінің ені үшін арнайы пикселдік нөмірлерді пайдаланыңыз.
Сұйық ені
Сұйық ені беттер (кейде икемді ен беті деп аталады) браузер терезесінің қаншалықты кең екеніне байланысты ені бойынша өзгереді. Бұл тұтынушыларға көбірек көңіл бөлетін беттерді жасауға мүмкіндік береді. Сұйықтық ені беттерімен мәселе оқуға қиын болуы мүмкін. Егер мәтін жолының сканерлеу ұзындығы 10-нан 12-ке дейін немесе 4-тен 5-ке дейінгі сөзден қысқарса, оны оқу қиын болуы мүмкін. Бұл үлкен немесе кішкентай шолғыш терезелері бар оқырмандарға қиындық тудыратындығын білдіреді.
Икемді ен беттерін жасау үшін, бет бөлімдерінің ені үшін пайыздар немесе ems- ді ғана пайдаланыңыз. Сондай-ақ CSS max-width сипатымен танысуыңыз керек. Бұл сипат енін пайызбен орнатуға мүмкіндік береді, бірақ содан кейін оны соншама үлкен емес адамдар оқымайтындай шектеу.
Жеңімпаз: CSS Media сұраулары
Ең жақсы шешім бүгінгі күні CSS шолғышының сауалдарын және оны қарайтын шолғыштың еніне реттелетін бетті жасау үшін жауап беретін дизайнды пайдалану болып табылады. Сәйкес веб-дизайн 5120 пиксель ені немесе ені 320 пиксельді көресіз, жұмыс істейтін веб-бетті жасау үшін бірдей мазмұнды пайдаланады. Түрлі өлшемдегі беттер әртүрлі көрінеді, бірақ оларда бірдей мазмұн бар. CSS3-дегі мультимедиа сұрауы бойынша, әрбір қабылдайтын құрылғы сұрауды оның өлшемімен жауап береді және мәнер парағы нақты өлшемге сәйкес келеді.