anonim_4396
| anonim_4396 a întrebat:

Bună, am o întrebare legată de HTML și CSS, dacă știți vă rog frumos să mă ajutați.
Nu prea înțeleg cum se face un website responsive deoarece pe internet sunt foarte multe resurse și nu știu care sunt cele mai bune, nu știu ce unități de măsură să folosesc (%, px, vw, vh, em, rem...) și când trebuie folosite sau îmi puteți recomanda cărți în română care mă pot ajuta? Mulțumesc pentru fiecare răspuns

Răspuns Câştigător
| PainTech a răspuns:

Depinde exact de ce vrei sa faci. Nu exista solutie minune care sa mearga in toate cazurile. Tu stii cum vrei sa arate site-ul pe diferite dispozitive, ar trebui sa iti dai seama si care ar fi varianta cea mai potrivita.

Incerci o metoda, daca nu merge incerci dupa altceva.

In majoritatea cazurilor as zice sa lasam height in functie de continut la containere (auto). Nu vrem ca textul sau continutul sa fie mai mare decat dimensiunea containerului. Eventual putem folosi si padding pentru a ne asigura ca continutul nu atinge marginea containerului.

11 răspunsuri:
| Dismally a răspuns:

Foloseste % iar pentru text "vw"

| PainTech a răspuns:

De obicei folosesc em pentru text si procente sau px pentru diferitele casete si imagini.

Tine cont ca unitatile de masura nu sunt cele mai importante lucruri pentru un site responsive. Metodele flexbox si grid sunt folosite foarte des pentru a face un site responsive destul de usor. Nu uita de media querry care poate fi o unealta foarte importanta pentru site-uri responsive daca e folosita corect (practic permite modificarea anumitor aspecte CSS in functie de diferite conditii - dimensiunea ferestrei, rezolutie, orientare)

Pentru dezvoltarea site-urilor responsive ai in general doua idei :
- Mai intai faci pentru PC apoi incepi sa faci modificarile necesare sa arate bine si pe dispozitive mai mici
- Mai intai faci pentru telefon si apoi treci pentru dispozitive mai mari

Nu incerca sa faci totul in acelasi timp, o sa fie destul de complicat.

Nu as putea sa iti recomand materiale in romana. In mare ce am invatat a fost de pe https://css-tricks.com/, https://www.w3schools.com/, documentatia https://developer.mozilla.org/en-US/docs/Web/CSS si diferite tutoriale pentru cazuri aparte.

| DeeaDeea94 a răspuns (pentru PainTech):

Mulțumesc foarte mult pentru timpul acordat, apreciez.

| DeeaDeea94 a răspuns (pentru PainTech):

Când setăm "height" a unui container, e bine să punem px? Sau în unele cazuri vh? Sau să lăsăm "height" în funcție de conținut?

| PainTech a răspuns (pentru DeeaDeea94):

Depinde exact de ce vrei sa faci. Nu exista solutie minune care sa mearga in toate cazurile. Tu stii cum vrei sa arate site-ul pe diferite dispozitive, ar trebui sa iti dai seama si care ar fi varianta cea mai potrivita.

Incerci o metoda, daca nu merge incerci dupa altceva.

In majoritatea cazurilor as zice sa lasam height in functie de continut la containere (auto). Nu vrem ca textul sau continutul sa fie mai mare decat dimensiunea containerului. Eventual putem folosi si padding pentru a ne asigura ca continutul nu atinge marginea containerului.

| Zuzu1991 a răspuns:

Mi se pare ca incerci sa codezi html manual, nu lucrez in domeniu (web coding) dar am impresia ca ideea asta e depasita de ani buni de chestii de gen Adobe dreamweaver care face treaba mult mai bine si mult mai repede decat sa faci munca de kinez de la 0

... poate ma insel

| DeeaDeea94 a răspuns (pentru Zuzu1991):

Adevărat, doar că vreau să înțeleg tot logic.

| Zuzu1991 a răspuns (pentru DeeaDeea94):

happy
eu nu stiu nici macar sa codez in html chiar daca stiu htmp, dar cand am de facut ceva in php care trebuie sa genereze html, ma duc intr-un tool vechi antic si de demult cum ar fi front page, il fac vizual, apoi il modific manual la ce am nevoie

te sfatuiesc sa faci la fel, altfel, ce mi se pare mie ca e de fapt intrebarea ta e ca vrei sa inventezi roata de la zero happy

| PainTech a răspuns (pentru Zuzu1991):

Ba chiar din contra. Daca te uiti la listari de joburi pentru web designer / front-end dev nu cred ca o sa gasesti Adobe Dreamweaver prea des. Chiar daca e folosit ca editor de cod, uneltele sale automate nu prea sunt utilizate. Cel mai folosit editor pentru astfel de lucruri e VS Code.

Si pentru a scapa de munca de chinez se folosesc frameworkuri precum React, Angular sau Vue in care poti crea cateva componente reutilizabile. Pe partea de CSS exista Bootstrap care poate simplifica din treaba.

Asta se foloseste pentru aplicatii web serioase care necesita putina munca custom.

Pentru un blog/site de prezentare/site de stiri/magazin online se folosesc solutii precum Wordpress in care nici nu e necesar sa te atingi de cod.

| DeeaDeea94 a răspuns (pentru Zuzu1991):

Mulțumesc mult pentru răspuns ????

| DeeaDeea94 a răspuns (pentru DeeaDeea94):

Mulțumesc mult pentru răspuns*

| Zuzu1991 a răspuns (pentru PainTech):

Interesant, multumesc