Responsywna strona - Jak napisać

Question

Witam, mam juz za soba podstawy css, i chcialnym skupic sie teraz na responsywności stron i internetowych, ale jeszcze nic w tym kierunku nie zaczołem, bo nwm jakiej technologii sie nauczuć na początek. Dokladniej chodzi mi o to czy uczyć sie bootstrapa, a może Fundation, ale najwieksze broblemy mam ze zozruznieniem jakke sa roznice między jednosktkami relatywnymi, @media a wlaśnie bootstrapem (lub inna biblioteką), lub flexboxem. Czy flexbox to jakaś konkurencja bootsrapa, tak jak Fundation, czy może te technologie w jakis sposób współpracują ze sobą, bo nie mam jeszcze żadnej wiedzy na ich tamat a na pierwszy rzut oka wydaje mi sie że wszystkie w jakiś sposób pomogają tworzyć respansywaną stronę. I dlatego proszę o wytlumaczenie różnicy między tymi technologiami, a moze trzeba znac je wszystkie, bo tak jak wspomniałem współpracują ze sobą. Z góry przepraszam za błędy.

Answer 1

Witaj :)

Dwa naprawdę dobre Tutoriale :) Obejrzyj na spokojnie przepracuj wszystko Ci się rozjaśni...

Gość jest naprawdę Ogarnięty ....

https://www.youtube.com/watch?v=jV8B24rSN5o&list=WL&index=11&t=25s

https://www.youtube.com/watch?v=JJSoEo8JSnc

Comments

Ja tam na Pana Mirka Nie Powiem ani jednego złego słowa

@niezalogowany, nie musisz, część merytoryczna tych kursów już dawno została oceniona:

https://forum.pasja-informatyki.pl/122259/co-jest-nie-tak-z-najnowszym-odcinkiem-kursu-miroslawa-zelenta?show=122259#q122259

https://www.webkrytyk.pl/2015/02/28/wideokursy-1-kurs-js-i-css-miroslawa-zelenta/

Przed bezkrytycznym przyjęciem kursów MZ warto też zapoznać się z ich code review: https://forum.pasja-informatyki.pl/125757/code-reviews-moich-odcinkow-na-yt-dlaczego-istnieja

Żeby nie było, że tylko krytykuję te kursy - ich odbiorcą docelowym są głównie uczniowie techników (albo Ci, którzy z programowaniem do tej pory nie mieli styczności), a nie ludzie którzy uczą się pod kątem zdobycia pierwszej pracy w zawodzie programisty (a tematów w tym kontekście na forum jest sporo). Dlatego, jeśli dopiero zaczyna się przygodę z programowaniem, to na sam początek te kursy są faktycznie spoko - oferują w miarę bezbolesne wejście w temat. Niemniej, zakres materiału poruszany w tych kursach, w porównaniu z wiedzą potrzebną do podjęcia pracy, jest po prostu bardzo mały - i o tym trzeba pamiętać, jeśli planuje się swoją przyszłość wiązać z branżą IT.

---

polecam ten filmik

https://www.youtube.com/watch?v=7kVeCqQCxlk

koleś świetnie prezentuje

---

Dzięki, tylko jescze nie znam odpowoedzi na pytanie od czego powinienem zaczać, flexbox, grid, @media czy może bootstrap

---

flexbox -> grid ->  media, aczkolwiek według mnie wszystko razem najlepiej, są to rzeczy, które współpracują ze sobą, więc powinny być robione razem. A bootstrap nie jest potrzebny jak masz grida.

---

Dzięki o to chodziło.

Answer 2

Bootstrap to framework. A właściwie zestaw gotowych klas CSS, które pozwalają zbudować układ strony, również responsywny. Flexbox to sposób rozmieszczenia układu.

Strona responsywna to taka, która dostosowuje się do różnej wielkości ekranów. Jeśli znasz CSS to nie musisz się uczyć nowych technologii. Znacznik media to znacznik, który mówi przeglądarce kiedy ma wczytywać określony arkusz stylów. Na przykład styl1.css kiedy ekran jest większy niż 1024x768 pikseli, a styl2.css kiedy ekran jest mniejszy niż 1024x768. Media właśnie się stosuje do zwiększenia responsywności strony. W jednym arkuszu możesz coś wyświetlać i powiększać, a w drugim ukrywać i zmniejszać. Na przykład odstępy czy zbędne elementy strony.

Polecam trochę poczytać o tym w Internecie.

Comments

Using media queries: [ 1 ] [ 2 ]

---

@mdatelier, Łał,​ czyli jak dobrze zrozumialem bootstrap jest gotowym rozwoazaniem dla osób, które nie dokonca znają css lub osób, którym zalezu na czasie i chcą zrobic to szybko.

Nadal nwm od ktorej z tych wszytskich rzczy zaczać, ale wudaje mi się, że skoro podstawy css juz znam to nie musze uczyć sie na razie bootsrapa, i zacznę od @media queries, a potem flexbox to chyba dobra opcja na początek? Dzieki za odp. 

---

@VBService, dzięki

---

@KosaTV, Bootstrap nie zawsze jest dobrym rozwiązaniem. Pozwala szybko przygotować stronę, ale z kolei obniża jej wydajność.

Najlepszym rozwiązaniem jest własny CSS.

---

Wiem, tylko zastanawiam sie czego na poczatek sie nauczyc bo mam mętlik w głowie narpiew flex box, grid, wlasny css(@media) czy ten wlasnie bootstrap, bo moim zdaniem wlasny css jest dla mnie latwiej zrozumieć z uwagi na to ze znam budowe css.

Answer 3

Ja nie używam bootstrap'a i spokojnie radzę sobie ze wszystkim. Za pomocą samefo flexbox'a i grida można ogarnąć naprawdę sporo. Jak do tego jeszcze dołożyć @media to to jest naprawdę soczysty arsenał.

Comments

Dobrze wiedzieć, bo wydaje mi sie że programista nie musi znać wszystkich technologii jakie są dostepne, a bootstrap jakoś do mnie nie przemawia więc chyba go sobie odpuszczę. Dzięki za odpowiedź.