Перейти до основного вмісту

CSS фреймворк. Що це, і кому воно потрібно?

Що таке фреймворк і навіщо воно потрібно?

На сьогодні існує велика кількість фреймворків для всього-всього-всього. Це стосується веб-програмування серверної частини, javascript-фреймворків клієнтської частини, а також в багатьох інших сферах. В загальному, можемо розуміти фреймворк як деяку кодовую базу, що вирішує набір стандартних задач, і яка задає архітектуру та стиль створення додатку. Ну, зі всім цим зрозуміло. Наприклад, javascript-фреймворки дозволяють не паритись з крос-браузерністю і вирішувати задачі на порядок швидше.

Що ж із CSS?

Крос-браузерність в CSS - це також наболіла проблема. Але, наскільки мені відомо, кожен досвідчений CSS майстер має свій набір правил верстки, що допомагає йому практично безпомилково писати крос-браузерний код, тим більше для сучасних браузерів, де аналіз CSS-стилів не так вже й сильно відрізняється, як було, наприклад, 2-3 роки тому. Розглянемо CSS фреймворк на прикладі blueprint CSS. Є й багато інших фреймворків, які вирішують схожі задачі, але я зупинився на цьому.

Що нам дає CSS фреймворк?

Зразу зазначу, що сам його почав недавно використовувати, і, хоча CSS верстка - не моя повсякденна робота (в даному випадку, це дуже важливо), деколи доводиться з цим ділом стикатись. CSS фрейморк - це набір CSS-стилів для крос-браузерної колонкової верстки, де ви можете робити такі операції як "задати ширину колонки", "зміщуватти колонку на деяку кількість пікселів зліва", робити "перехід на нову колонку", і т.д. Тобто все для того, щоб створювати і розміщувати контейнери для "функціонуючих елементів керування" клієнтської частини веб-додатку, що часто є найбільш трудомісткою задачею верстки.

Мої враження

Маючи деякий досвід верстки без фреймворка, з використанням останнього все виходить дійсно швидше. Якщо оцінювати себе, то можу сказати, що створив досить неординарну верстку сторінки (в т.ч. для IE6).

Плюси:
  • швидкість верстки і створення базового html-коду
  • легкість внесення змін в верстку
  • вся верстка div-контейнерами
  • html-код виходить чистий і короткий (це дуже важлиов як з точки зору розробки, підтримки, так і SEO)
  • Накладання стилів працює "ієрархічно", тобто ніяких проблем з вбудовуванням контейнерів в контейнери
Мінусы:
  • У зв'язку з тим, що застосовуються класи з "несемантичними" іменами, більше того, до одного і того ж контейнера може застосовуватись від одного до трьох класів з фреймворку, код виглядає трошки "дивно" (але завжди можна доддати якийсь клас-маркер, щоб не забути, для чого створювався той чи інший контейнер)
  • 15 кб базового CSS (в деяких випадках це може бути багато)

Кому це потрібно?

Зі всього сказаного зроблю невеличке резюме. Я б рекомендував використовувати CSS-фреймворки наступним категоріям:
  1. Недосвідчені верстальщики, які тільки починають свій важкий бойовий шлях. Такий підхід дозволяє швидко вирішувати задачі верстки і не зривати строки по проекту.
  2. Програмісти, які роблять свій проект/стартап, але поки не мають засобів для того, щоб найняти досвідченого верстальщика.
Всім вдалої верстки.

Коментарі

  1. мне еще понравился YUI3, даже больше чем BluePrint/BlueTrip

    ВідповістиВидалити
  2. YUI3 хрош, если его использовать цельно, то есть вместе с js-фреймворком, который входит в YUI3. К тому же там разметка (YUI3 CSS grid) находится в бете. CSS base, fonts, reset прикольные, но не решают проблему позиционирования и разметки.
    А в общем то, что есть решает те же задачи немножко другим образом. Радует то, что ко всему этому Yahoo! выпустили свой фреймворк под BSD-лицензией. За это им большущий +.

    ВідповістиВидалити

Дописати коментар

Популярні дописи з цього блогу

Регулярні вирази в Python: вивчення та оптимізація

Writing a regular expression is more than a skill -- it's an art. Jeffrey Friedl Що це таке? Рано чи піздно майже кожному програмісту в своєму житті доводиться стикатись з регулярними виразами. Термін "Регулярні вирази" є перекладом з англійської словосполучення "Regular expressions" і не є зовсім точним, а для тих, хто перший раз почув цей термін, мабуть, навіть спантеличуючим (я, наприклад, коли вперше почув, ніяк не міг собі второпати по назві, хоча б приблизно, що це, і для чого використовується). Літературний і більш осмислений переклад звучав би, мабуть, як "шаблонні вирази". Але назва вже прижилась, а скажете "шаблонні вирази" - вас просто не зрозуміють :). Звідси: Регулярний вираз -  це рядок, що задає шаблон пошуку під-рядків в рядку. Регулярні вирази використовуються для аналізу текстів на предмет відповідності текстової інформації деякому шаблону. Наприклад , шаблон, що задає слово, яке містить букву "к". Де застосовують

Python: як програмно перемкнути розкладку клавіатури в Windows

Дослідивши дане питання, я побачив, що Python не має засобів "з коробки" для вирішення цієї задачі. Відвоідно, задача повинна вирішуватись для каждої ОС своїм шляхом. Дане рішення було знайдено мною для ОС Windows XP +. Панацея - Win API Для того, щоб виконати завдання необхідно встановити додатково бібліотеку pywin32 , яка надає доступ до функцій Windows API з Python. З цієї бібліотеки нам знадобиться модуль win32api . >>> import win32api Дослідивши його вміст, можна побачити, що для роботы з розкладкою клавіатури є декілька функцій і одне системне повідомлення Windows - WM_INPUTLANGCHANGE : GetKeyboardLayout GetKeyboardLayoutList LoadKeyboardLayout В даному випадку для нас важлива саме остання функція - LoadKeyboardLayout . Дана функція завантажує нову розкладку (якщо вона ще не завантажена) і виконує після цього ще якісь дії; приймає в якості аргументів два: рядок з ідентифікатором розкладки. дію. Більш детально про їхні можливі значення можна почитати в MSDN . О

Переходимо на Python 3. Де ж ти, reduce?

Це мій другий пост про освоєння Python 3. Почався він з того, що захотілось мені використати всім відому вбудовану функцію reduce, а я замість робочого коду отримав NameError . Виявляється в Python 3 вона вже не вбудована, а знаходится в модулі functools , в який, починаючи з версії Python 2.5, засунули декілька корисних речей для роботи з об'єктами-функціями. Тобто тепер функцію reduce потрібно імпортувати. from functools import reduce Варто зазначити, що специфікація функції не змінилась, працює вона точно так, як і в другому пітоні. Постало питання: "Навіщо?". (Більш детально про reduce читаємо в документації ). З чого все почалось? А почалось все з Гвідо ван Россума, який сказав наступне, коли тільки Python 3k починали розробляти. Ось довільний переклад: Близько 12 років тому в Python з'явились lambda, reduce(), filter() і map(); з'явились вони через (здається) Lisp-хакера, якому не вистачало їх в Python, і який надав працюючі патчі. Але, незважаючи ні на щ