Preprocesory CSS - Wstęp

Każdy frontend'owiec na pewnym etapie swojej przygody z css, napotka pojęcie preprocesor. Ułatwiają one bardzo pracę nad styowaniem strony, a na pewno ją przyspieszają, co z kolei ma duży wpływ na wydajność. Oczywiście, aby zacząć korzystać z preprocesorów należy swobodie władać czystym css. Przedstawienie W tym wpisie postaram się jedtnie przedstawić zarys ... [Czytaj dalej]

Responsywne wideo w tle strony

Jakiś czas temu pisałem o tym jak zrobić screenshot'a w html5, natomiast dzisiaj skupię się na efekcie, który jest coraz bardziej popularny w internecie. Mianowicie zaprezentuję, jak uzyskać responsywne tło w postaci wideo. Sprawa przy responsywnej grafice jest o tyle prostrza, że wystarczy użyć backround-image oraz background-size (cover/contain). A przy ... [Czytaj dalej]
Kategoria: HTML5 | Data dodania:

Modułowość styli CSS

CSS jest prostym językiem i można w nim pisać kod, który jest łatwo dołączany do projektu. Początkujący webdeweloper nie zawsze jest świadomy, jakie szkody może wyrządzić nieumiejętne dokładanie kodu css. Wtedy zaczyna się niestety szukanie "na szybko" przyczyny złego stylowania poszczególnych elementów. Pułapki podczas kodowania w CSS Jakiś czas temu pisałem o ... [Czytaj dalej]

Gulp.js - narzędzie do automatyzacji #2

Nadszedł czas na drugą część z cyklu minifikacja i automatyzacja w zakresie front-endu. Jakiś czas temu przedstawiłem teorię i konfigurację Gulp.js. Dzisiaj skupię się na nieco szerszej analizie i przedstawieniu przykładu, jak (wg. mnie) zautomatyzować proces tworzenia witryny. Jako przykładowy schemat działania wykorzystam skrypt z Grunt'a. Przygotujmy Gulp'a czyli zainstalujmy go globalnie: npm ... [Czytaj dalej]

Gulp.js - narzędzie do automatyzacji #1

Jakiś czas temu pisałem na temat, jakim jest minifikacja js i css, na przykładzie narzędzia Grunt. Dzisiaj wstępnie omówię drugie narzędzie służące do automatyzacji procesu tworzenia stron www, czyli Gulp.js. Skupię się na porównaniu go do wspomnianego Grunt'a, zaletach i wadach oraz kilku prostych przykładach. Zaczynamy. Czym jest Gulp.js? Gulp.js jest narzędziem do ... [Czytaj dalej]

Animate.css, czyli proste animacje w czystym css

Witam. Coraz więcej serwisów internetowych zawiera w sobie efektowne animacje, przejścia, przekształcenia elementów. Kiedyś za te efekty odpowiadały grafiki, np. gif'y, jednak obecnie nie jest już to efektywne rozwiązanie, dlatego wykorzystuje się dobrodziejstwa CSS. Zatem, z czego korzystać? Jak stworzyć lekką, a zarazem efektowną stronę? Animate.css, jako zbiór przydatnych animacji Oto narzędzie, ... [Czytaj dalej]

Reguła !important w CSS - kiedy i jak używać?

Using !important in your CSS usually means you're narcissistic & selfish or lazy. Respect the devs to come...  Słowami Stephanie Rewis rozpoczynam te wpis, chcąc zwrócić uwagę na istotę "problemu". Autor powyższego wpisu, sfrustrowany kodami css, zwraca uwagę na nadużywanie pewnych reguł, które niekiedy powodują bałagan w kodzie. Typowy przykład (nie naśladować!) Piszę ... [Czytaj dalej]

Minifikacja plików JS i CSS - Grunt

Wiele osób, mając własną witrynę, zastanawia się czasem, jak by tu ją przyspieszyć. Coraz popularniejsze są narzędzia Google, tj. usługa PageSpeed Insights, która pozwala na przetestowanie danej witryny pod względem optymalizacyjnym, a co za tym idzie pod względem szybkości działania. Postaram się po krótce przedstawić narzędzie, które pozwoli zautomatyzować minifikację ... [Czytaj dalej]

Oddzielne style css dla IE

Każdy początkujący i zaawansowany webmaster miał do czynienia z projektowaniem stron, na pewno odczuł na własnej skórze, ile czasu trzeba poświęcić na zapewnienie prawidłowego wyświetlania szablonu w starszych wersjach Internet Explorer (w szczególności przestarzały IE6). Co prawda coraz mniej internautów korzysta z tych starych wersji, ale zawsze jednak ktoś się ... [Czytaj dalej]

Powiadomienie cookies

Strona lukaszbacik.pl zapisuje pliki cookies na komputerach odwiedzających ją internautów. Czytaj więcej.