Blog

Pierwsza strona w HTML i CSS, część 1: edytor

Do napisania kodu, który uruchomimy w przeglądarce, nie potrzeba wiele: tak naprawdę wystarczyłby pospolity Notatnik. Żeby jednak wytwarzać kod efektywnie oraz przyjemnie, można skorzystać z jednego z wielu dobrych i darmowych edytorów kodu. W tej serii będę posługiwała się Visual Studio Code, a w tym wpisie pokażę jak rozpocząć z nim pracę. Programiści mają do…
Dowiedz się więcej

Wstęp do serii „Pierwsza strona w HTML i CSS”

Od słów do czynów! W poprzedniej serii wpisów skupiłam się na teorii HTML i CSS, popartej garścią wybranych przykładów. Nadszedł zatem najwyższy czas, aby zdobytą wiedzę wykorzystać w praktyce i stworzyć swoją pierwszą stronę WWW. Celem publikowanych postów będzie stworzenie bardzo prostej strony internetowej, której kod zostanie wrzucony na GitHuba, a sama strona będzie opublikowana…
Dowiedz się więcej

O pracy z zastanym taskiem – refleksje

W życiu programistów zdarza się czasami tak, że naszym zadaniem jest implementacja ciekawej funkcjonalności, nad którą prace zaczęły się już jakiś czas wcześniej. Na tym etapie nic nie zapowiada katastrofy, ja jednak na swoim przykładzie mogę śmiało powiedzieć, że takie zadania potrafią znacząco przyspieszyć tempo pojawiania się siwych włosów na głowie. Dzisiaj dzielę się kilkoma…
Dowiedz się więcej

O tym co to jest dostępność stron i aplikacji oraz dlaczego to takie ważne

Dostępność WWW (web accessibility, a11y) to dziedzina, która zajmuje się zagadnieniem tworzenia stron i aplikacji internetowych dostępnych dla jak najszerszego grona odbiorców, ze szczególnym uwzględnieniem osób narażonych na wykluczenie cyfrowe (niepełnosprawnych, starszych, gorzej wykształconych, pozbawionych dostępu do szerokopasmowego internetu) 1. Jest dość szeroka dyscyplina, która – jak się okaże poniżej – obejmuje znacznie więcej wytycznych…
Dowiedz się więcej

O responsywności i wsparciu przeglądarek

Czasy, kiedy do korzystania z internetu używało się prawie wyłącznie komputera stacjonarnego lub laptopa odeszły bezpowrotnie. Ilość urządzeń, które pozwalają na przeglądanie stron i aplikacji internetowych rośnie z każdym dniem. Na każdym z tych urządzeń z reguły można uruchomić więcej niż jedną przeglądarkę internetową. Jak sobie zatem poradzić z obsługą tylu możliwości bez pisania tysięcy…
Dowiedz się więcej

O CSS od Sassa do Lessa

Preprocesory CSS to narzędzia, które znacznie ułatwiają wytwarzanie kodu arkuszy stylów. Ich działanie polega na umożliwieniu użytkownikowi korzystania z udogodnień na etapie pisania kodu, który po kompilacji staje się klasyczną, pełnoprawną zawartością pliku *.css. Jedne z bardziej popularnych preprocesorów to Sass oraz Less. W tym wpisie głównie skupię się na Sassie, ponieważ z tego rozwiązania…
Dowiedz się więcej

O frameworkach CSS na przykładzie Bootstrapa

Korzystanie z frameworków CSS jest codziennością w bardzo wielu projektach komercyjnych. W mojej opinii nie ma w tym nic złego, szczególnie jeżeli pracujemy nad rozbudowaną biznesowo aplikacją, która służy np. do zarządzania danymi. Kiedy priorytetem zamawiającego jest przejrzystość i funkcjonalność, a oryginalność i wyjątkowy design nie są szczególnie wartościowe, użycie frameworka może znacząco skrócić czas…
Dowiedz się więcej

O Flexboxie

Flexbox to obecnie jedno z coraz bardziej powszechnych narzędzi w arsenale front-end developerów. Jego pojawienie się w 2017 roku znacznie uprościło rozmieszczanie i wyrównywanie elementów strony w pożądany sposób. Koncept elastycznych kontenerów usprawnia nadawanie stylów odpowiedzialnych za położenie elementów HTML wyświetlanych na różnych rodzajach urządzeń i rozmiarach ekranów. Poniżej zamieszczam subiektywne zestawienie najczęściej używanych właściwości…
Dowiedz się więcej

O tym co to jest model pudełkowy i jak wyśrodkować element

Są takie zagadnienia CSS, z którymi większość z front-end developerów prędzej czy później będzie musiała sobie poradzić. Mowa tu o np. wyśrodkowywaniu elementów na stronie. Do tego zadania doskonale nadaje się moduł Flexbox czy frameworki typu Bootstrap, jednak w dzisiejszym wpisie pochylam się nad rozwiązaniami, które nie wymagają ich użycia. Na początku jednak chciałbym zwrócić…
Dowiedz się więcej

O selektorach, pseudo-selektorach i pseudo-klasach

Jak wspominałam we wpisie pt. „O tym co to jest CSS” (link tutaj), na reguły w arkuszach stylów składają się deklaracje, czyli właściwości i nadawane im wartości, nawiasy klamrowe oraz selektory. Te ostatnie odpowiadają na pytanie, którym elementom nadać style ustalone w deklaracjach. W jaki sposób zatem w CSS wskazywać wybrane elementy? Poniżej omawiam kilka…
Dowiedz się więcej