Blog webdeveloperski Patryk yarpo Jar

Progressive enhancement – tworzenie stron dla kazdego odbiorcy

Autor wiadomości Listopad 16, 2014

Kazdy z nas lubi tworzyc cos bardzo nowoczesnego i przyjaznego programiscie. Pewnie nikt z nas (procz 3 osob ciagle odwiedzajacych te strone za pomoca IE 6) nie znosi tworzyc czegos dla starych i wrednych srodowisk.

Niestety, czasem nie wszystko zalezy od nas. Musimy pojsc na kompromisy i zapewnic takze starym, zgrzybialym srodowiskom podstawowe wsparcie. Istnieje kilka sposob na tworzenie takich stron. W ponizszej prezentacji glownie chcialbym sie skupic nad progressive enhancement (progresywne ulepszanie) oraz wspomniec o kilku innych, np. graceful degradation.

Obsługa skrótów klawiszowych z poziomu JavaScript

Autor wiadomości Czerwiec 29, 2012

W wielu aplikacjach internetowych (np. GMail) można wykorzystywać znane skróty klawiszowe. W jaki sposób twórcy tych stron zdołali podpiąć się pod wciśnięcie ctrl + S w celu zapisania wersji roboczej listu? Dlaczego nie wyświetla się systemowy dialog zapisu witryny? Na te pytania odpowiem w tym wpisie.

Książka: “The Smashing Book #2. Edycja polska”

Autor wiadomości Maj 23, 2012

The Smashing Book #2. Edycja polskaThe Smashing Book #2. Edycja polska

Popularnego bloga www.smashingmagazine.com prawdopodobnie większości nie trzeba przedstawiać. Dla tych, którzy jeszcze go nie znają jest to jeden z najbardziej poważanych blogów dla web developerów i web designerów.

Autorom piszącym na blogu widocznie nie wystarczyła już tamta forma i zabrali się za stworzenie książki. Dziesięciu autorów stworzyło książkę (z 10 rozdziałami), która w sposób bardzo przekrojowy mówi o całym procesie projektowania, tworzenia (w tym lekko zahaczając o programowanie), promocji i utrzymania strony. Choć nie tylko o stronach jest tu mowa. Właściwie niektóre tematy zaskoczyły mnie całkowicie, choćby rozdział o typografii (w dużym skrócie czcionki)
pokazał mi jak rozległy to temat i jak niewiele w tej kwestii wiem.

Ciekawym jest to, że każdy rozdział jest napisany przez kogoś innego. Trudno oczekiwać, że jedna osoba miałaby tak rozległą wiedzę popartą doświadczeniem i jeszcze umiałaby to opisać w zjadliwy sposób.

Formularze w dojo

Autor wiadomości Czerwiec 17, 2011

Dojo toolkit posiada bibliotekę komponentów (widgetów) o nazwie dijit. W tym wpisie postaram się pokazać, jak wykorzystać tę bibliotekę do łatwego stworzenia formularza z ciekawymi opcjami walidacyjnymi.

Na początek powinieneś

Automatyczna walidacja formularzy

Autor wiadomości Czerwiec 5, 2011

W poprzednim wpisie o walidacji formularzy pokazałem, jak sprawdzać dane za pomocą wyrażeń regularnych. Tym razem zaprezentuję prosty obiekt, który wykona całą pracę za nas. Jedyne co trzeba zrobić to określić w odpowiednim obiekcie, jakie pola w formularzu powinny być walidowane oraz wg jakich zasad.

Na początek

Walidacja formularzy wyrażeniami regularnymi

Autor wiadomości Czerwiec 4, 2011

Wyrażenia regularne są to wzorce, które opisują łańcuch symboli [wikipedia].

Za pomocą wzorców regularnych możemy sprawdzić, czy danych ciąg znaków "pasuje" do naszego wzorca, np. mając listę ludzi:

  1. Jan Kowalski
  2. Zdzisław Nowak
  3. 123312 23232^%^%$
  4. Janko Muzykant

Od razu widzimy, że pozycja 3 nie pasuje. Dlaczego? Przecież porównując "Jan Kowalski" == "Zdzisław Nowak" także otrzymamy `false'. Otóż, wszystkie pozostałe pozycje na liście spełniają pewne kryteria jakie sobie założyliśmy:

<wzorzec>{numer}{kropka}{spacja}{imię}{spacja}{nazwisko}{enter}</wzorzec>

JavaScript posiada wbudowane mechanizmy obsługi wyrażeń regularnych (ang. regular expressions, w skrócie regex/regexp).

W tym wpisie pokażę, jak za pomocą wyrażeń regularnych walidować dane przekazywane przez użytkownika w formularzu.

Walidacja formularzy – obsługa zdarzeń

Autor wiadomości Czerwiec 4, 2011

Walidacja danych podanych przez użytkownika w formularzu to nic innego jak sprawdzenie, czy wszystkie wymagane pola zostały wypełnione, a następnie sprawdzenie czy ich wartość ma odpowiednią postać, np. numery telefonów, kod pocztowy, adres e-mail.

Wydaje się to dosyć proste. Jednak kiedy to wywołać?

Potencjalne rozwiązania

Walidacja danych w formularzach

Autor wiadomości Czerwiec 3, 2011

Prawie na każdej stronie internetowej występują formularze. Są bardzo ważnym i potrzebnym elementem strony - pozwalają na pobieranie danych od internauty. Formularze są wszędzie - system komentarzy, fora internetowe, webmaile, twitter itp. Zamierzam w  tym i kilku następnych wpisach pokazać jak można (bo to, że trzeba jest bezdyskusyjne) walidować dane pobierane przez formularze.

Po co walidować?

Praktycznie na każdej stronie dzisiaj wymagana jest pobieranie w jakiś sposób danych od użytkownika. Automatyzacja pobierania danych z wykorzystaniem formularzy dostępnych na stronie daje z jednej strony święty spokój administratorom serwisów, z drugiej jednak pozwalają na różnego rodzaju ataki. Dodatkowym powodem, dla którego warto walidować dane jest pomoc użytkownikowi - skoro podaje swój e-mail, to być może jednak chciałby, aby podesłać mu jakąś informację. Jeśli poda zły adres, [np. zapomni zapisać "@domena.pl"] mail nie dojdzie.

Zatem walidacja jest dobra dla wszystkich :).

Zmniejszenie liczby requestów dla plików JS

Autor wiadomości Kwiecień 15, 2011

Niedawno pokazałem, jak z wykorzystaniem JSMina sprawić, aby pobierane pliki JS były mniejsze. W tym wpisie pokażę, co zrobić, aby ograniczyć liczbę requestów HTTP przy ładowaniu plików JS.

Powolne ładowanie strony

Aby strona ładowała się szybciej, można zrobić dwie rzeczy:

  1. Zmniejszyć jej rozmiar - im mniej KB do pobrania, tym szybciej się to stanie.
  2. Zmniejszyć liczbę odwołań do serwera. Jedno odwołanie żądające 100KB będzie działać szybciej niż 10 żądań po pliki 10KB każdy.

W przypadku JS punkt pierwszy można rozwiązać albo pisząc krótsze skrypty (lub rezygnując z nich), albo zmniejszając rozmiar kodu wynikowego.

Komentarze warunkowe w IE

Autor wiadomości Listopad 21, 2010

Internet Explorer nie jest moja ulubiona przeglądarką, i to niezależnie od tego, o której wersji mówimy. Głównie dlatego, że jest bardzo "swoista". Sami autorzy tego programu wiedzą o tym (czasem chyba nawet się tym szczycą) i pozwalają developerom na specjalne hacki.

IE lubi coś robić inaczej. Jednak - co dobre - większość z jego dziwactw jest stała. tzn. za każdym razem działa w ten sam - błędny - sposób. Dzięki temu można stwierdzić: "Ej, zaraz! Jakbym tylko mógł zrobić osobny kod dla IE!". Odpowiedź: "Możesz!".

Kod widziany tylko dla IE