<autoreklama>
Rewolucyjne Witryny Internetowe tani CMS szablony dla stron www retusz zdjec
</autoreklama>

Wpisy otagowane ‘testery’

Sposób na testowanie mobilnych www

czwartek, 23 Lipiec 2015

browserstackTechnologie i techniki tworzenia mobilnych stron, mimo że są i działają, charakteryzują się jeszcze niedojrzałością i siermiężnością. No bo jak napisać złożoną stronę która będzie wyświetlała w 100% (i ani o 1% mniej) szerokości absolutnie na każdym urządzeniu mobilnym? Rzeź, przynajmniej na razie. Przeliczanie rozdzielczości natywnych, symulowanych, faktycznych i bóg wie jakich jeszcze, na niemal każdym urządzeniu działa inaczej. A do tego ta przeglądarka obsługuje viewport, a tamta nie, a jeszcze ina – częściowo i nie zawsze. Temat jest do ogarnięcia, ale pochłania mnóstwo czasu i pracy.

Najgorzej jest z testowaniem na różnych urządzeniach. Byłoby dobrze mieć pod ręką wszystkie typowe fizyczne sprzęty, ale to ze względów głównie finansowych – niemożliwe. Z pomocą przychodzą nam więc aplikacje/emulatory i symulatory. Nie dość dokładne -prawie wszystkie. Prawie – bo jest wyjątek. BrowserStack oferuje testowanie działania i wygladu stron na wielu popularnych sprzętach z iOSem i Androidem. Usługa jest płatna, ale (na ten moment) można za darmo testować działanie (na dokładnym, natywnym emulatorze) przez kilkadziesiąt minut oraz wykonać kilkadziesiąt screenshotów.

Każdy mobilny webdeveloper powinien znać to narzędzie. ;) A może są jakieś inne, podobne, o których nie wiem?

Pokaz animacji CSS

środa, 17 Październik 2012

Wiem że zaczynam być nudny w tym temacie, ale to trzeba zobaczyć, aby wyobrazić sobie możliwości. Google opracował prostą prezentację ukazującą wszystkie podstawowe możliwości animacji i ruchu realizowanego za pomocą HTML5, CSS3 (no i JS, SVG, WebGL). I (prawie) wszystko staje się możliwe… tylko czekać na jakiś profesjonalny edytor takich animacji…

Milionowy wynik wyszukiwania hasła

poniedziałek, 7 Maj 2012

Pchełka – MillionShort to wyszukiwarka, w której można automatycznie usunąć milion, 100.000, 10.000, 1000 lub 100 pierwszych wyników wyszukiwania i rozpocząć przeglądanie wyników od następnych po tej liczbie. Po sprawdzeniu kilku fraz dla moich stron muszę przyznać, że takie przeglądanie ujawnia czasem bardzo ciekawe strony…

Sprawdzacz headerów

poniedziałek, 19 Marzec 2012

Kolejna pchełka: web-sniffer.net do narzędzie do sprawdzania i testowania informacji nagłówkowych wysyłanych przez podstronę przed jej wyświetleniem. Serwis umożliwia również podgląd interpretacji takich headerów przez różne silniki/przeglądarki (i boty), i w zależności od używanej wersji protokołu HTTP i typu żądania (get, post, …).

Taki web-sniffer może się komuś przydać… :)

ColorHexa – kolorystyczny kombajn

sobota, 25 Luty 2012

<a href=”http://www check this link right here now.colorhexa.com/”>Narzędzi kolorystycznych w Sieci jest wiele, i na tym blogu ten temat był już poruszany wielokrotnie (jeśli nie wierzysz – przeklikaj się przez powiązane tagi). jednak to narzędzie – ColorHexa – zasługuje na wzmiankę głównie ze względu na swoją przejrzystość i użyteczność. Niby jest to kombajn – można mieszać kolory, palety, generować gradienty i kombinować na wiele innych sposobów. A jednak, mimo mnogości funkcji – aplikacja przedstawia się i działa bardzo funkcjonalnie. Wszystko co potrzebne – jest na swoim miejscu, dostępne wtedy gdy powinno być dostępne. Po prostu witryna napisana w sposób przemyślany i przetestowany. Korzystanie z takich rozwiązań przyspiesza tworzenie twoich projektów, a więc pozwala Ci więcej zarabiać. decydowanie warto porzucić kilka innych narzędzi, dla ColorHexy.

Na testowanie stron – Browserling

środa, 28 Grudzień 2011

<a title=”Browserling” href=”http://browserling atorvastatin online.com/” rel=”http://browserling.com/” target=”_blank”>Browserling to ostateczne i idealne rozwiązanie problemów z testowaniem stron pod różnymi przeglądarkami.

„Przeglądarniątko” działa genialnie prosto i skutecznie – za każdym zapytaniem odpalają cały system operacyjny i w nim wybraną przez nas przeglądarkę, a w niej – pobrany adres strony. Całość jest „używalna” w 100% – czyli nie dostajesz screenshotu, ale otrzymujesz w pełni funkcjonalną stronę odpaloną w wybranym browserze, którą możesz przetestować także pod kątem interakcji i realnej użyteczności.

Strony testować można za pomocą przeglądarek IE, Firefox, Chrome, Opera i Safari, we wszystkich pełnych wersjach + najnowsze wersje prototypowe (nightly, itp.).

Łatwe, proste, przyjemne, szybkie – i o to chodzi. Jest tylko jedno „ale” – narzędzie nie jest do końca darmowe. Za free można używać do woli, ale sesja testowania jednej strony w jednej przeglądarce może trwać max 5 minut, a po opłaceniu $20 miesięcznie – czas testowania jest nieograniczony. Myślę jednak że wersja darmowa powinna wystarczyć wszystkim.

[aha: za cynk dziękuję mcbarlo i pośrednio grxmrx’owi]

Rewelacyjny generator gradientów CSS

sobota, 11 Czerwiec 2011

Jak wiadomo, tworzenie zaawansowanych gradientów „z palca” nie jest łatwe. Dlatego szukałem dobrego generatora. I w końcu znalazłem czego szukałem.

Webnarzędzie do generowania różnorakich gradientów kolorystycznych dla elementów CSS3, ze wszystkimi przydatnymi opcjami i bajerami. Intuicyjne, łatwe w obsłudze, szybkie i skuteczne. Oparte na rozwiązaniach GUI znanych z programów graficznych. Generujące w czasie rzeczywistym kod CSS kompatybilny ze wszystkimi nowoczesnymi przeglądarkami. Umiejące także importować gradient z kodu CSS, a nawet z obrazka. No i posiadające zbiór predefiniowanych  gradientów – rewelacja. Są tam także gradienty z efektem szkła, odbić, gładkie delikatne przejścia kolorystyczne (trudne do uzyskania i „wyczucia”) itp. cuda. Można także zapisać swoje gradienty.

Zdecydowanie przyda się każdemu tworzącemu nowoczesne strony WWW.

Ale o czym mowa? O narzędziu Ultimate CSS Gradient Generator. Polecam.

Google Web Fonts z polskimi znakami

sobota, 2 Kwiecień 2011

Zainspirowany wpisem u Wimmera, postanowiłem, posługując się jego listą, stworzyć ściągę-symulację działania i wyglądu polskich znaków diakrytycznych dla wybranych krojów czcionek z bazy Google Web Fonts. Może komuś się przyda.

http://uranik.pl/GoogleWebFontsPL.html

25 narzędzi dla użyteczności stron www

czwartek, 4 Listopad 2010

Na blogu Hongicat.com jakiś czas temu znalazłem listę 25 narzędzi poprawiających użyteczność stron internetowych. Przynajmniej połowa z nich jest zdecydowanie warta uwagi. Prawdopodobnie niektóre narzędzia omówię w przyszłości na stronach bloga…

W poszukiwaniu ładnych krojów czcionek

środa, 21 Kwiecień 2010

 

Nie od dziś wiadomo, że wybranie dla strony www ładnego, nietypowego stylu czcionek jest trudne. Oczywiście mówimy o tradycyjnym wyświetlaniu liter, nie biorąc pod uwagę takich wynalazków, jak ten. Być może dla niektórych jest to proste – dla mnie nie.

Nie lubię używać oklepanych, typowych i banalnych krojów. Jakkolwiek rozumiem użycie czytelnych ariala, verdany czy tahomy w akapitach, tak znalezienie odpowiedniego, ozdobnego kroju i stylu dla nagłówków i śródtytułów stanowi dla mnie zawsze wyzwanie.

Ostatnio zauważyłem (wiem – powinienem to wiedzieć), że niektóre kroje liter w stylu italic, wyglądają totalnie inaczej, niż styl prosty.

Na przykład Georgia:

Georgia prosta wygląda tak,

i wydawałoby się, że pochylona Georgia powinna wyglądać tak (symulacja przez przekrzywienie prostego kroju w Photoshopie):

tymczasem:

Georgia Italic wygląda tak

Jest różnica, prawda?

Takich przykładów jest więcej, tylko trzeba je odnaleźć. Postanowiłem zatem napisać prosty automat do wyszukiwania nietypowych ustawień dla czcionek.

Pod adresem http://www.uranik.pl/fonttest/ umieściłem prosty skrypt pokazujący kombinacje trzech z pięciu znaczących parametrów stylu dla wybranego kroju liter:

pochylenia, pogrubienia, kapitalików (small-caps), druku rozstrzelonego oraz zagęszczonego.

Kroje liter wybrać można z listwy rozwijanej u góry lub u dołu. Wybrałem najbardziej uniwersalne kroje, nazywane czasem mianem „websafe fonts”. Przy ich wyborze posiłkowałem się tą stroną. Oczywiście mogę tę listę rozszerzyć/zwęzić (proszę o ewentualne uwagi). Całość opisałem uniwersalnym językiem CSS, zrozumiałym dla każdego.

Mam nadzieję, że to małe narzędzie przyda się Wam tak, jak i mi.

UserFly – król podglądaczy

środa, 1 Kwiecień 2009

userfly.com Już kilkanaście razy podchodziłem do tematu śledzenia zachowań użytkowników na stronie – za każdym razem kończyło się to fiaskiem instalacji, zbyt zasobochłonnym skryptem lub niezadawalającą prezentacją wyników.
Wczoraj przetestowałem skrypt UserFly, służący do tego celu, i jestem zachwycony. Dlaczego?

  • UserFly rejestruje całą interakcję użytkownika z witryną (przewijanie, klikanie, wypełnianie formularzy itp.
  • UserFly przedstawia tą interakcję w formie „naturalnych” filmików do oglądnięcia
  • UserFly jest bardzo prosty w instalacji – w sekcji head należy wkleić tylko jedną linijkę (i to wszystko)

Ma tylko jedną wadę: nie jest za darmo – za nagranie powyżej 10 filmików trzeba zapłacić – jednak, jeśli komuś zależy na zbadaniu userów swojej strony – zdecydowanie polecam to narzędzie.

A o UserFly dowiedziałem się stąd.

Pingdom tools

wtorek, 3 Lipiec 2007
Pingdom ToolsPingdom Tools to narzędzie analizujące podaną witrynę pod kątem czasów wczytywania się jej elementów. Można też mierzyć ping i traceroute, a wyniki obliczeń sortować i filtrować na różne sposoby. Słowem – narzędzie może być bardzo przydatne do optymalizacji strony.

Screenshoty całych stron

środa, 4 Październik 2006

Rzecz przydatna, gdy nie mamy dostępu do danej przeglądarki, a chcemy zobaczyć, jak nasza produkcja w tejże przeglądarce wygląda.
Automacik browsershots.org w założeniach robi screeny z wszystkch ważniejszych wersji IE, FF, z Konquerora, Opery, Safari i Dillo. Jednak jak donosi Grxmrx (który notabene jest pomysłodawcą niniejszego posta), automat zwraca screeny tylko z kilku z wymienionych pozycji. Poza tym istnieje iCapture robiący shoty w Safari oraz IECapture, robiący shoty w IE7.
Prawdopodobnie takich automatów jest więcej, jak na jakiś natrafię, nie omieszkam tego wpisu uzupełnić :)

TryIt Editor

wtorek, 19 Wrzesień 2006

Alianka dziś znalazła rzecz prostą i fajną, o której dotychczas pojęcia nie miałem (chociaż aplikacja ta już trochę istnieje)… TryIt Editor to przydatne narzędzie do testowania wyglądu stron i obsługi js (i nie tylko).