CSS-рамак для адаптыўнага дызайну

Дата:

2019-08-21 19:00:12

Прагляды:

1084

Рэйтынг:

1Любіць 0Непрыязнасць

Доля:

Table of contents:

«Дзе будзем рабіць стан?», - запыталася іх высокасць (фільм пра баронаў Мюнхгаузене), але запыталася сябе, таму сама і адказала. Фреймворк - заўсёды добра, асабліва калі ён ад шляхетнага распрацоўніка: як ад twitter bootstrap, як foundation ад zurb, або як вішнёвае дрэва на лбе аленя, клапатліва пасаджанае тым самым баронам.

Усе CSS-рамак - гэта добра і практычна. Сам факт, што вядомая сутнасць зноў набыла значэнне і рушыла ў чарговы шлях на ўсе тыя ж вяршыні, кажа, што пытанне - дзе рабіць талію - яшчэ не знайшоў свайго канчатковага рашэння, і засталася вяршыня, якую пакуль не ўдалося скарыць.

Мінулае і сучаснасць

Адаптыўная вёрстка: браўзэры і девайсы

Інтэрнэт даступны ўсюды і заўсёды, але толькі праз браўзэр. Толькі з пэўнай электроннай платформы. Усе астатнія варыянты ляжаць па-за візуальнага інтэрфейсу. Браўзэр працуе ў межах магчымасцяў той ці іншай электроннай платформы: кампутара, ноўтбука, планшэта ці тэлефона. Магчымыя і іншыя варыянты, але названыя часцей за ўсё выкарыстоўваюцца.

CSS рамак

У час, калі «панаваў» IE, які з нараджэння не валодаў абсалютным панаваннем, а канкурэнцыя першапачаткова была пільным наглядам, былі спробы што-то стандартаваць.

Як працэс вытворчасці кампутарнай тэхнікі і мабільных прылад немагчыма кантраляваць, так і развіццё браўзэраў ўвесь час рухаецца ў дэмакратычным кірунку: усё кіруецца само сабой, што выклікае натуральнае адрозненне і цяжкасці для распрацоўшчыкаў. Інтэрнэт-прастору не прымае ні калгасаў, ні суполак, ні менску на вёску. А акрамя таго, усе супольнасці прыхільнікаў і паслядоўнікаў тых ці іншых інструментальных сродкаў бесперапынна мігруюць сябар у сябра, знікаюць і з'яўляюцца зноў.

Больш:

Міжнародная супольнасць

Міжнародная супольнасць "Элеврус": рэальныя водгукі, заробак ці падман

Заробак ў інтэрнэце - гэта тое, аб чым мараць усе. Праўда, рэалізаваць сваё жаданне можа не кожны. Таму ў інтэрнэце вельмі часта ідуць размовы на тэму так званых ўзаемных фондаў. Напрыклад, "Элеврус". Рэальныя водгукі аб дадзенай арганізацыі - гэта т...

Яшчук Наталля. Хто яна? Блогер, вайнер або тэлевядучая?

Яшчук Наталля. Хто яна? Блогер, вайнер або тэлевядучая?

Карыстальнікі інтэрнэту, напэўна, бачылі смешныя відэаролікі, званыя вайнами. У сетцы іх на сёння тысячы. Робяць іх абсалютна розныя людзі, і сюжэты таксама разнастайныя. Дык вось, адзін з аўтараў такіх ролікаў - неверагодная Яшчук Наталля! Хто ж яна...

Што такое лагін і навошта ён патрэбен.

Што такое лагін і навошта ён патрэбен.

Даволі часта сярод людзей, якія рэдка наведваюць інтэрнэт рэсурсы, узнікае мноства пытанняў, такіх як што такое лагін, і як зарэгістраваць пошту ў інтэрнэце. На самай справе існуе вялікая колькасць разнастайных трактовак паняцця Лагін. Так што канкрэ...

Натуральна, калі ёсць неабходнасць ствараць рэсурсы для інтэрнэт-прасторы, патрэбныя больш-менш надзейныя падставы, а не хісткія апоры на заўсёды зыбкай пяску інфармацыйных тэхналогій. Тэрміны "адаптыўная", "гумавая", "кроссбраузерная" і інш прыйшлі як бірка, як сімвал таго, што дасць магчымасць працы не прорву дарма, што яна будзе глядзецца аднолькава і выконваць сваю функцыю на любым прыладзе ў любым браўзэры.

CSS фреймворк Bootstrap

CSS-фреймворк Bootstrap

Сэнс і прызначэнне гэтага вырабы ў спрашчэнні працы праграміста. Лічыцца, што ён быў адным з першых, знаходзіцца сярод самых прасунутых і заслугоўвае ўсеагульнай увагі. Маючы ў сваім складзе:

  • сеткі, калонкі, блокі;
  • шаблоны, фіксаваныя, гумовыя і іншыя;
  • графіку, шрыфты і іх апісання;
  • медыя, кіраванне малюнкамі і фільмамі;
  • табліцы, звычайнае афармленне, сартаванне, новую функцыянальнасць;
  • формы, афармленне палёў уводу, сумежных падзей, назваў;
  • навігацыю, табы, ўкладкі, старонкі, меню, панэлі;
  • алерт, дыялогавыя вокны, падказкі, якія плаваюць элементы.

Гэты фреймворк дэкларуе вялікую свабоду творчасці для праграміста, які карыстаецца гэтым выдатным вопытам распрацоўкі ад кампаніі Twitter. Усё гэта выдатна, важна і цікава, але ўсё гэта трэба ўважліва вывучыць, перш чым заяўленыя магчымасці стануць даступныя распрацоўніку.

Bootstrap, яго паслядоўнікі і канкурэнты

Па сутнасці, усе рамак - HTML, CSS, JavaScript - гэта вядомая троіца ў розным спалучэнні. Кожны прад'яўляе распрацоўніку розную складанасць разумення і патрабуе пэўную колькасць часу на засваенне. Але, як ні падзяляй працэдуру сайтостроения на фронт-энд і баск-энд, а ўсё адно: з агульнай славеснай шалупіны, затмевающей толькі розум заказчыка (і то, толькі часова), заўсёды застаецца хэпі-энд - рэальная жыццё, рэальная задача і абавязак яе рашэння.

рамак html css

Сапраўды, распрацоўшчык, узброены Bootstrap, Foundation, Kube, Semantic UI, Uikit, UniCSS, Maxmertkit, ... цалкам можа працаваць па формуле 10/12 наўзамен формулы 1`000/100`000 (ручная праца) + Фактар «Пі». Вобразна кажучы, CSS-рамак эканомяць час распрацоўкі праекта з бясконцасці або вялікай колькасці гадзін (ручной працы), да 10-12 гадзін на любы праект.

Прыпамінаючы, што перш чым знесці яйка, нават курыцы прыйдзецца прыстойна з ім поноситься, можна выказаць здагадку: розніца ў часе распрацоўкі нікуды не можа знікнуць, яна сыходзіць падчас вывучэння фреймворка, выбару таго, які варта ўзяць, і на масу іншых часовых выдаткаў, далёкіх ад працэсу распрацоўкі.

Дасведчаны распрацоўшчык пагодзіцца, што нават за суткі немагчыма зрабіць прыстойны сайт. Чалавечы інтэлект працуе хутчэй любога кампутара, але яго свядомая частка - вельмі нават павольна і старанна ўсё узважвае перш, чым прыняць нават вельмі простае рашэнне. Колькасць і якасць выкарыстоўванага сучаснага інструментара абсалютна ні аб чым не кажа і зусім нічога не гарантуе.

Сучасны сайт - гэта далёка не набор старонак, якія дэманструюць адаптыўную вёрстку. Клопат абсалютна любога сайта не ў тым, каб паказаць, як разумны яго распрацоўшчык, і якія самыя лепшыя CSS-рамак ёсць у яго арсенале, а ў тым каб выконваць функцыянал, патрабаваны заказчыкам.

Адаптыўнасць ў па факце і па сутнасці

Задача патрабуе вырашэння - гэта непарушнае правіла. Распрацоўкі асноў адаптыўнасць і кроссбраузерности, дысертацыі па гумовай вёрстцы з аналітычнымі укладкамі па тым ці іншым «відах» гумы - занятакцікавае, але не больш таго. Адаптыўныя рамак CSS, HTML, JS - перспектыўна, але гледзячы ў якім кантэксце варта разглядаць гэтую перспектыву.

Ёсць разуменне патрабаванага функцыяналу. Ёсць пэўнасць, што рэсурс павінен працаваць на кампутары і на смартфоне. Але з гэтага зусім не вынікае, што задача адаптыўнай версткі важней задачы рэалізацыі функцыяналу.

Нельга патрабаваць ад коні і поні аднаго і таго ж: цягнуць тую ж лямку з тым жа поспехам. Няма сэнсу вазіць бульбу нават на кукурузніку (лятальны апарат, вельмі папулярны ў эпоху развітога сацыялізму), калі ад поля да сховішчы рукой падаць. Тут нават тая самая поні адна справіцца.

Тэрмін "адаптыўная" у родным значэнні гэтага слова зусім не азначае абавязковай патрэбы чаму-то што-то рабіць так, як ён гэта рабіў раней, у іншым месцы або пры іншых абставінах. Ёсць задача і яе функцыянал, ёсць розныя платформы і девайсы, на якіх гэты функцыянал павінен працаваць. Калі мэта ў эквівалентнасці працэсаў, дызайну і дыялогаў - гэта рэальная ўтопія, калі мэта ў вырашэнні пастаўленай задачы - гэта зусім іншая справа.

Гістарычны момант і перспектыва

Праграмісты развіваюцца вельмі хутка, прычым па экспаненце, - гэта спецыфіка прафесіі. Думка праграміста заўсёды хутчэй любога кампутара, таму аддзяліць інтэрфейс ад кода, было вырашана інтуітыўна яшчэ на світанку будаўніцтва інфармацыйнай цывілізацыі. Але аддзяліць мала, трэба правільна ведаць, дзе знаходзіцца патрэбная мяжу.

Гэтыя тры моманту (інтэрфейс, код, грань) толькі частка агульнай інфармацыйнай сутнасці. Ёсць яшчэ дадзеныя і праблема іх прадстаўлення. Гэта толькі на першы погляд можа здацца, што дадзеныя і CSS-рамак зусім не ўзаемазвязаны. Па сутнасці, прадстаўленне заўсёды вызначаецца не толькі кодам, але і тым, што ён апрацоўвае і як ён гэта робіць, перш за ўсё, па часе.

Лепшыя CSS рамак

Прымаючы рашэнне выкарыстоўваць CSS-рамак, выбіраючы той ці іншы, ацэньваючы часовыя затраты на асваенне і супастаўляючы яго функцыянал з тым, што патрабуецца для рашэння задачы, варта разумець - важны не сам фреймворк, а толькі факт, што праблема, пастаўленая ў мінулым, зноў набыла значэнне. Важна ўяўляць, у якім напрамку ідзе развіццё праблемы і яе вырашэння.

Аб саветах, дарадцам і ацэнцы планаў

У рэальнасці, з разуменнем пытання, каму можна верыць, а каму не, каму варта даваць парады, а каму не варта, праблем ніколі не ўзнікае. Але ў віртуальнай прасторы з гэтым ёсць сур'ёзныя цяжкасці.

У кожнага праграміста (тым больш калектыву такіх) назапашваецца вопыт. Гэты вопыт у той ці іншай меры і ёсць уласны фреймворк. Перш чым прымаць на веру чужой, хай нават вельмі папулярны і выдатны, трэба паставіць сябе ў пазіцыю даследчыка, але не паслядоўніка.

Адаптыўныя CSS рамак

Вопыт калег - гэта ніколі не фундаментальнае падстава для працы, тым больш у такой дынамічнай сферы, як информационнная, але добры стымул для развіцця ўласных ведаў і вопыту.

Нават калі не наканавана чаго-небудзь дасягнуць, нішто не перашкаджае вывучаць вопыт іншых. Пры любым развіцці падзей, уласны вопыт і вопыт калег па спецыяльнасці - гэта лепш, чым толькі ўласны вопыт, а планы ад гэтага адназначна будуць больш перспектыўнымі і рэальнымі.


Article in other languages:

AR: https://tostpost.com/ar/internet/18961-css.html

DE: https://tostpost.com/de/internet/35827-css-frameworks-f-r-responsive-design.html

En: https://tostpost.com/internet/30055-css-frameworks-for-responsive-design.html

ES: https://tostpost.com/es/internet/35661-css-marcos-de-dise-o-adaptable.html

HI: https://tostpost.com/hi/internet/20658-css-frameworks-for-responsive-design.html

JA: https://tostpost.com/ja/internet/18636-css.html

KK: https://tostpost.com/kk/internet/36463-css-freymvorki-sh-n-bey-md-k-dizayn.html

PL: https://tostpost.com/pl/dost-p-do-internetu/37695-css-frameworki-dla-responsive-design.html

PT: https://tostpost.com/pt/servi-os-de-internet/37473-css-freymvorki-de-design-adapt-vel.html

UK: https://tostpost.com/uk/nternet/36745-css-freymvorki-dlya-adaptivnogo-dizaynu.html

ZH: https://tostpost.com/zh/internet/11018-css.html






Alin Trodden - аўтар артыкула, рэдактар
"Прывітанне, Я Алін Тродден. Я пішу тэксты, чытаю кнігі і шукаю ўражанні. І я нядрэнна ўмею распавядаць вам пра гэта. Я заўсёды рады ўдзельнічаць у цікавых праектах."

Заўвага (0)

Гэтая артыкул не мае каментароў, будзьце першым!

Дадаць каментар

Навіны

Чаму не працуе відэа

Чаму не працуе відэа "У Кантакце"?

Для таго каб свабодна карыстацца ўсімі перавагамі сацыяльнай сеткі "ВКонтакте" - свабодна абменьвацца інфармацыяй і праглядаць файлы ўсіх фарматаў - часта ўзнікае неабходнасць ліквідаваць некаторыя няспраўнасці. Напрыклад, нярэдка...

Аптымізацыя тэкстаў для пошукавых сістэм

Аптымізацыя тэкстаў для пошукавых сістэм

Перш чым расказаць пра тое, што такое аптымізацыя тэксту, трэба разабраць паняцце аптымізацыя і вызначыць, для чаго яна патрэбна інтэрнэт-рэсурсаў, а далей па кроках ствараць унікальны і цікавы тэкст для карыстальнікаў і пошукавых...

Як змяніць пароль у

Як змяніць пароль у "Аднакласніках": падрабязныя рэкамендацыі

Усім вядомы сайт "Аднакласнікі". Гэтая сацыяльная сетка з'явілася на свет у 2006 годзе. І ўжо на наступны год ўвайшла ў першую дзесятку Прэміі Рунэту. "Аднакласнікі" і сёння – самая папулярная сацыяльная сетка.Ну, гэта і зра...

Канал

Канал "Хэпі боды" і яго кантэнт

У дадзенай артыкуле апавяданне пойдзе аб YouTube-канале Happy Body, які вядуць дзяўчаты-трэнеры з вялікім вопытам. Гэта спартыўны канал, пераважна для жаночай аўдыторыі, напоўнены разнастайным карысным кантэнтам, якія дапамагаюць ...

Як зрабіць аватарку для групы «ВКонтакте»? Тры самых распаўсюджаных спосабу

Як зрабіць аватарку для групы «ВКонтакте»? Тры самых распаўсюджаных спосабу

Мы прывыклі, што аватарка - гэта увасабленне карыстальніка ў сацыяльнай сетцы, яго «вобраз», да якога мы накшталт як звяртаемся, калі хочам каму-небудзь што-небудзь напісаць. Таму нескладана здагадацца, наколькі вяліку...

Як зрабіць электронную пошту на кампутары. Як атрымліваць электронную пошту на кампутар

Як зрабіць электронную пошту на кампутары. Як атрымліваць электронную пошту на кампутар

Без электроннай пошты немагчыма ўявіць жыццё сучаснага чалавека. Акрамя аператыўнай адпраўкі лістоў, віртуальны паштовы адрас выкарыстоўваецца для рэгістрацыі на розных сайтах, афармлення пакупак у інтэрнэт-крамах і пацверджання с...