Przegląd HTML i CSSSzkolenia z programowania

Przegląd HTML i CSS: błędy układu i poprawki responsywności

Realizacja od 1 dniaPoprawki w cenieKontrola jakości
Pakiety
Ochrona płatnościSzczegóły
  • Poprawki w ramach pakietu są bezpłatne.
  • Jeśli nie odpowiesz w ciągu 3 dni od dostarczenia pracy, zostanie ona zaakceptowana automatycznie.
Zamów · 32 €

Pieniądze są rezerwowane w chwili płatności i przekazywane dopiero po akceptacji pracy.

Przegląd HTML i CSS: błędy układu i poprawki responsywności

Przykładowy rezultat

Przykład dla pakietu Standard

Przegląd kodu: skrypt Python do importu zamówień dla małego sklepu internetowego

Co robi kod

  1. Wczytuje orders.csv z eksportu sklepu.
  2. Dla każdej pozycji zamówienia znajduje produkt po SKU w stock.xlsx i odejmuje ilość.
  3. Zapisuje zaktualizowane stany i loguje sumy do import_log.txt.

Struktura jest czytelna, a funkcje dobrze nazwane. Większość problemów dotyczy danych wejściowych, które wyglądają inaczej, niż zakłada skrypt.

Błędy i słabe punkty

#LiniaWagaProblem
148WysokaTen sam CSV można zaimportować dwa razy; brak sprawdzania już przetworzonych ID zamówień. To najbardziej prawdopodobna przyczyna ujemnych stanów.
272Wysokaint(row["qty"]) wywala się na pustych wartościach lub "2.0" przy zamówieniach ze zwrotem.
395ŚredniaWyszukiwanie SKU rozróżnia wielkość liter: "gt-101" i "GT-101" to dla skryptu różne produkty.
4130ŚredniaPlik otwierany jest bez encoding="utf-8", więc w Windowsie psują się nazwy z polskimi znakami.
5201NiskaGołe except: ukrywa prawdziwe błędy i sprawia, że log jest bezużyteczny.

Poprawione fragmenty

Problem 1: pomijanie już zaimportowanych zamówień

processed = load_processed_ids("processed_orders.txt")
for row in reader:
    if row["order_id"] in processed:
        continue
    # ... dotychczasowa logika ...
    processed.add(row["order_id"])
save_processed_ids("processed_orders.txt", processed)

Dlaczego: każde zamówienie jest uwzględniane raz, nawet jeśli uruchomisz skrypt ponownie na tym samym pliku.

Problem 2: bezpieczne odczytanie ilości

raw = (row.get("qty") or "").strip()
try:
    qty = int(float(raw))
except ValueError:
    log.warning("Zamówienie %s: błędna ilość %r, pominięto", row["order_id"], raw)
    continue

Dlaczego: pozycje zwrócone lub częściowe są pomijane z czytelną adnotacją, zamiast zatrzymywać cały import.

Problem 3: normalizacja SKU

sku = row["sku"].strip().upper()

To samo .strip().upper() zastosuj przy budowaniu słownika stanów.

Styl i czytelność

  • process() ma 90 linii; podziel ją na read_orders, apply_to_stock, write_report.
  • Zastąp "magiczne" numery kolumn (row[7]) nazwami nagłówków.

Przetestuj każdą poprawkę na kopii plików: przeczytaliśmy kod, ale go nie uruchamialiśmy.

Klient: właściciel sklepu z herbatą, który napisał 310-liniowy skrypt Python importujący zamówienia z eksportu CSV do arkusza stanów magazynowych Zgłoszony problem: "Czasem stany schodzą poniżej zera, a przy niektórych plikach skrypt się wysypuje."

Klient i wszystkie dane są wymyślone.

O usłudze

Błędy układu zwykle mają kilka przyczyn: stała szerokość, która wychodzi poza ekran na telefonach, źle skonfigurowany kontener flex lub grid, z-index, który nie działa przez kontekst nakładania, albo media queries, które sobie przeczą. Wklej HTML i CSS ze zrzutami ekranu, jak strona wygląda i jak powinna wyglądać, a wyjaśnimy, dlaczego układ się psuje, i podamy poprawiony CSS. Zaznaczamy też szybkie usprawnienia dostępności, takie jak teksty alternatywne, etykiety formularzy i kolejność nagłówków.

Co obejmuje usługa

  • Co otrzymujeszPisemne omówienie na stronie zamówienia: dlaczego układ się psuje, poprawione fragmenty HTML i CSS na komputer i telefon oraz uwagi o dostępności. W pakiecie Premium także plan uporządkowania arkusza stylów w klasy wielokrotnego użytku.
  • Poprawki układuFlexbox, grid i overflow
  • Reguły responsywneMedia queries, które się nie gryzą
  • Nakładanie i z-indexDlaczego elementy chowają się za innymi
  • Semantyczny HTMLNagłówki, landmarki, przyciski
  • Podstawy dostępnościTeksty alternatywne, etykiety i kontrast

Jak to działa

  1. 1
    BriefWklejasz kod i zrzuty ekranu
  2. 2
    LekturaZnajdujemy reguły, które psują układ
  3. 3
    PrzeglądOtrzymujesz poprawiony CSS i uwagi

Czego potrzebujemy od Ciebie

HTML i CSS wklejone jako tekst, zrzuty ekranu problemu na komputerze i telefonie, przeglądarki, w których występuje, i jak strona powinna wyglądać.

Zapytamy Cię:

  • Czy to czysty CSS czy framework?
  • Na jakich rozmiarach ekranu i w jakich przeglądarkach się psuje?
  • Jak powinna wyglądać sekcja?
  • Czy strona jest zbudowana w kreatorze, czy napisana ręcznie?

Porównaj pakiety

PakietyPodstawowyKod do 100 linii14 €StandardKod do 400 linii32 €PremiumDo 1000 linii z planem arkusza stylów62 €
Termin1 dzień2 dni3 dni
Poprawki123
Linie kodudo 100do 400do 1000
Poprawione fragmentyTakTakTak
Plan porządkowania arkusza stylówNieNieTak
Zamów PodstawowyZamów StandardZamów Premium

Ochrona płatności

Płacisz przy składaniu zamówienia, ale pieniądze są przekazywane tylko za zaakceptowaną pracę.

  • Stała cenaCena pakietu nie zmienia się po zapłacie.
  • Pieniądze są zarezerwowanePrzy płatności kwota jest tylko rezerwowana. Serwis otrzymuje ją dopiero po akceptacji pracy.
  • Sprawdzone przed dostarczeniemKażdy wynik przechodzi kontrolę jakości, zanim do Ciebie trafi, a przed akceptacją widzisz go na stronie zamówienia.
  • Bezpłatne poprawkiProś o poprawki w ramach briefu tyle razy, ile przewiduje pakiet.
  • Akceptacja po 3 dniachJeśli w ciągu 3 dni od dostarczenia pracy ani jej nie zaakceptujesz, ani nie poprosisz o poprawki, zostanie zaakceptowana automatycznie. Jeśli po dostarczeniu napiszesz na czacie zamówienia, zamówienie czeka; po naszej odpowiedzi możemy ponownie uruchomić odliczanie 3 dni i poinformujemy o tym na czacie.
  • Ponowne wykonanie lub pełny zwrot pieniędzyJeśli wynik nie odpowiada Twojemu briefowi, a poprawki tego nie naprawiły, lub praca trwa ponad dwa razy dłużej niż termin, napisz na czacie zamówienia: wykonamy pracę ponownie albo zwrócimy całą płatność.
Jak to działa →

Pytania i odpowiedzi

Czy sprawdzacie to w prawdziwych przeglądarkach?

Nie, czytamy kod i twoje zrzuty ekranu. Sprawdź poprawiony CSS w swoich przeglądarkach przed publikacją.

Czy możecie poprawić stronę zrobioną w Wix lub Tilda?

Tylko własny kod, który tam dodajesz. Układ samego kreatora ustawia się w jego edytorze, a nie w kodzie, który możesz przesłać.

Czy to pełny audyt dostępności?

Nie. Zaznaczamy wyraźne problemy w przesłanym kodzie; pełny audyt wymaga testów z czytnikami ekranu na działającej stronie.

Pakiety
Zamów · 32 €· 2 dni