Porady i triki do stron i grafiki

Read more about the article Responsywna nawigacja z zakładkami – tabs navigation, w HTML, CSS i JavaScript
webmaster

Responsywna nawigacja z zakładkami – tabs navigation, w HTML, CSS i JavaScript

Dziś z akcentem Wielkanocnym, bo towarzyszyć będzie zajączek z jajami 😀 Utworzymy bardzo przydatny element na stronę, czyli nawigację z zakładkami, tzw. tabs Navigation. Przydaje się wtedy, kiedy mamy dużo treści na stronie, a nie chcemy robić zbyt długiej strony, więc pakujemy wszystko w jedno miejsce i robimy zakładki, po których będziemy przeskakiwać jak zając, z jednej treści, do drugiej.

(więcej…)

1 Komentarz
4 kwietnia 2023
Read more about the article Dlaczego responsywność jest kluczowa dla Twojej strony internetowej?
webmaster

Dlaczego responsywność jest kluczowa dla Twojej strony internetowej?

W dzisiejszym cyfrowym świecie, posiadanie atrakcyjnej i funkcjonalnej strony internetowej to absolutna konieczność. W związku z tym, coraz więcej firm i projektantów zwraca uwagę na responsywność jako kluczowy element strategii projektowania stron. Jeśli zastanawiasz się, dlaczego responsywność jest tak istotna dla Twojej strony internetowej, ten artykuł pomoże Ci zrozumieć jej znaczenie oraz przyczyni się do podjęcia właściwej decyzji w kontekście projektowania. 1. Zwiększony ruch ze smartfonów i tabletów Jeden z głównych…

2 komentarze
23 marca 2023
Read more about the article Responsywna tabela RWD w html + css
webmaster

Responsywna tabela RWD w html + css

Wpisów na blogu o tabelach mam ze 2, ten będzie trzeci, ale jeszcze bardziej podrasowany, z elastyczną tabelą i ciekawie wyglądającą, zwłaszcza w wersji mobilnej. Tabela jest ładnie skalowana, a na telefonie poukładana w kolumny z danymi, jedna pod drugą.

(więcej…)

0 Komentarzy
15 marca 2023
Read more about the article Wyskakująca chmurka z tekstem po najechaniu na obiekt, czyli tooltip (html + css)
webmaster

Wyskakująca chmurka z tekstem po najechaniu na obiekt, czyli tooltip (html + css)

To będzie szybki, prosty i ciekawy skrypt, jakim jest tooltip, tzw wyskakujące okienko z treścią. Pokazuje się ono po najechaniu na obiekt, np. na napis czy na przycisk - button. Można też dodać do obrazka czy jakiegokolwiek innego obiektu na stronie. Nie stosujemy tutaj JavaScript. Będzie tylko trochę kodu html i css. Lubię takie proste efekty, które zajmują mało kodu, przez co strona jest lżejsza i szybsza, a dodatkowo efektowna. Nie…

0 Komentarzy
7 marca 2023
Read more about the article Slider z opiniami w html, css i JavaScript
webmaster

Slider z opiniami w html, css i JavaScript

Utworzyłam prosty i lekki skrypt slidera tekstowego, który może służyć jako slider opinii, recenzji, referencji. Przydatna i dość często spotykana funkcja na stronach, na których umieszczane są opinie klientów na temat usług firmy czy opinii o produkcie. Takie opinie dodaje się ręcznie, bo jest to prosty skrypt na stronę html. Za pomocą styli css odpowiednio nadany jest wygląd, a za pomocą javascript taki slider umożliwia przesuwanie opinii w bok za pomocą…

0 Komentarzy
1 marca 2023
Read more about the article Konwertujemy obrazki na format webp, czyli przyspieszania strony ciąg dalszy
webmaster

Konwertujemy obrazki na format webp, czyli przyspieszania strony ciąg dalszy

W poprzednim wpisie dodałam poradnik o ładowaniu obrazków metodą lazy load, dzięki której strony zostaną przyspieszone i uzyskają lepszy wynik w google page speed test. Dziś kolejna część o konwertowaniu grafik do formatu webp oraz umieszczaniu ich na stronę html. Na blogu był już o tym poradnik, ale ten sposób jest aktualniejszy, prostszy i szybszy do wykonania.

(więcej…)

0 Komentarzy
9 lutego 2023
Read more about the article Lazy load na stronie html, czyli opóźnione ładowanie obrazków
webmaster

Lazy load na stronie html, czyli opóźnione ładowanie obrazków

Zabrałam się do optymalizacji i przyspieszania strony, która w google page speed test nie do końca miała zadowalające wyniki. W wersji mobilnej wynik około 70/100, a na komputerze 90 kilka na 100. Po optymalizacji udało mi się uzyskać najwyższą notę na komputerze - 100/100 punktów, a w wersji mobilnej około 90. Jedną z wielu rzeczy do poprawy były obrazki na stronie. Były za ciężkie, za wolno się wgrywały i speed test…

0 Komentarzy
5 lutego 2023