Sieciowe aplikacje – pożyteczne dodatki

Sieciowe aplikacje to rozwiązania, które twórcy stron WWW powinni rozważyć jako elementy dobrze przygotowanego serwisu.

Aplikacja sieciowa to w dużym skrócie strona WWW oferująca funkcjonalność podobnie jak oprogramowanie. Zazwyczaj aplikacje sieciowe są zbudowane z wykorzystaniem języka PHP lub ASP, współpracują z bazami danych (najczęściej MySQL) i są wyposażone w systemy logowania. Przykłady dobrze opracowanych sieciowych aplikacji można znaleźć na Basecamp (http://www.basecamphq.com), Blinsale (http://www.blinksale.com) i Bloglines (http://www.bloglines.com).

Z punktu widzenia funkcjonalności serwisu, aplikacje sieciowe należą do kategorii niezbędnych użytków. Jednak ich wprowadzanie powinno się odbywać według kilku prostych i sprawdzonych reguł.

Nie należy utrudniać internaucie tego, co ma zamiar zrobić. Nigdy nie należy go zmuszać, by się zalogował, o ile nie jest to absolutnie konieczne. Zawsze należy umieszczać dane kontaktowe w widocznym miejscu. Nikt nie poświęci pięciu minut, by odszukać adres e-mailowy lub numer telefonu.

Starajmy się stosować prostą grafikę. Pomoże w tym tekst w HTML-u i CSS, zamiast elementów graficznych. Dodatkową korzyścią takiego rozwiązania jest pewność, że strona będzie się wyświetlać na różnych urządzeniach, takich jak telefony komórkowe, urządzenia PDA, nie wspominając o tym, że będzie łatwiej dostępna.

Nie należy także polegać na rozwiązaniach specyficznych dla pojedynczej przeglądarki. Może to spowodować błędne wyświetlanie w innych przeglądarkach. Dobrze jest tak zbudować stronę, by wyświetlała się poprawnie w Firefoksie, Operze, Internet Explorerze i Safari.

Uniknąć błędów

Aplikacje sieciowe są podatne na błędy pojawiające się podczas korzystania z nich. Wynika to z tego, że zachowują się raczej jak oprogramowanie niż strona WWW. Jeśli chcemy ustrzec się tego rodzaju wad, musimy przestrzegać kilku ważnych reguł.

Zdobyć zaufanie internautów można oferując im na przykład darmowe wersje, zachęcające potencjalnych użytkowników do ich użycia. Będą oni w stanie ocenić dane narzędzie – jego jakość i przydatność. Innym sposobem zdobywania zaufania jest opracowanie takiego interfejsu, z którego użytkownik będzie w stanie skorzystać.

Dobrym sposobem osiągnięcia tego jest ułożenie w logiczną i spójną całość wszelkich komunikatów o błędach, udanych operacjach, przycisków i nawigacji. Jeśli użytkownik korzysta z jakiejś usługi, najlepszym sposobem na doprowadzenie go do irytacji jest uniemożliwienie lub utrudnienie mu zrezygnowania w dowolnym momencie. Jeśli wymaga to na przykład zatelefonowania lub wypełnienia formularza, z pewnością opowie o tym znajomym ostrzegając, by omijali to miejsce z daleka.

Jednak najważniejsza rada brzmi: umiarkowanie. Przeładowanie strony nadmierną liczbą elementów może wywołać odwrotny skutek do zamierzonego. Pamiętajmy, że jeśli można coś zrobić, wcale nie oznacza, że trzeba to zrobić.

Jak zintegrować mikroformaty ze stroną WWW?

Mikroformaty to znaczące atrybuty klasy włożone w znaczniki XHTML. Jeśli jeszcze z nich nie korzystasz, to z pewnością wkrótce zaczniesz. Nie wymagają bowiem nowego oprogramowania i są obsługiwane przez wszystkie przeglądarki.

Mikroformaty pozwolą osiągnąć wiele celów, takich jak zaznaczanie spotkań w firmowym intranecie, by wszyscy mogli je dodać do swojego kalendarza (za pomocą iCal), zbierać informacje z internetu, dodawać kontakty do książki adresowej lub aplikacji CRM.

Dodając mikroformaty do znaczników kodu XHTML, wprowadzamy cenne metadane, które możemy pobrać, wyświetlić i wykorzystać na wiele różnych sposobów.

Obecnie dostępnych jest kilka mikroformatów, m.in.:

• ludzie i organizacje: hCard – http://microformats.org/wiki/hcard/
• kalendarze i wydarzenia: hCalendar – http://microformats.org/wiki/hcalendar/
• głosowanie: VoteLinks – http://microformats.org/wiki/voting/
• sieci społeczne: XFN – http://www.gmpg.org/xfn/
• licencje: relLicense – http://microformats.org/wiki/rellicense/
• tagi, słowa kluczowe i kategorie: relTag – http://microformats.org/wiki/reltag/
• lists i outlines: XOXO – http://microformats.org/wiki/xoxo/

Jak stosować mikroformaty? Oto ich przykład typowego ich użycia, z wykorzystaniem mikroformatu XFN (http://www.gmpg.org/xfn/):

John Smith

W powyższym przykładzie widać, że proste dodanie atrybutu rel=\”acquaintance\” powoduje zaliczenie Johna Smitha do grona znajomych, a adres jego strony to www.smithsystems.com.
Jak widać, nie zmieniono zasadniczo kodu strony, dodano jedynie proste atrybuty.

Co, jeśli John Smith, oprócz tego, że jest znajomym, mieszka obok nas? Za pomocą mikroformatów możemy oznaczyć także to. Oto kod:

John Smith

Siła mikroformatów tkwi w możliwości prostego dołączania informacji w najbardziej korzystny sposób. Jeśli dodamy znacznik mikroformatów do kodu XHTML, ktoś może zbudować narzędzie, które odczyta dane i wykorzysta je.

Stosowanie mikroformatów można zacząć od modyfikacji blogu. Zastosowanie hCard przy komentarzach w blogu umożliwia pobranie wszystkich imion i URL-i komentatorów i dostarczenie ich w wygodnej postaci vcard – wszystko za sprawą kliknięcia jednego przycisku. Poniżej przykład mówiący o tym jakiego użyć kodu, by uzyskać taki efekt.

John Smith 
Smith Systems

Wygodny w użyciu kreator hCard można znaleźć na stronie http://tantek.com/microformats/hcard-creator.html, natomiast kreator XFN pod adresem http://www.gmpg.org/xfn/creator/.

Przygotowujemy raporty w programie Dreamweaver MX 2004

{tlo_1}

Krok 1

Dreamweaver MX 2004 umożliwia wygenerowanie raportów strony WWW, począwszy od sprawdzania do nieaktywnych odnośników. Zaczynamy od otwarcia strony, dla której chcemy przygotować raport. Następnie otwieramy okno Results, wybierając Windows | Results.

{/tlo}

{tlo_0}

Krok 2

Zaczniemy od raportu sprawdzenia poprawności. Klikamy Validation na zakładce raportu. Teraz klikamy zieloną strzałkę, przytrzymujemy i z menu wybieramy Settings. Upewniamy się, że zaznaczona jest jedynie pole przy XHTML 1.0 Strict. Klikamy OK.

{/tlo}

{tlo_1}

Krok 3

Ponownie klikamy zieloną strzałkę, przytrzymujemy i wybieramy Validate Current Document. Ostrzeżenia oznaczone zostaną żółtym wykrzyknikiem, błędy zaznaczone na czerwono. Aby lepiej przyjrzeć się raportowi klikamy Browse Report.

{/tlo}

{tlo_0}

Krok 4

Browse Report powoduje utworzenie strony HTML, która jest wyświetlana w przeglądarce. Dzięki temu łatwiej jest przeczytać o błędach i poprawić je. Radzimy zawsze sprawdzać stronę pod kątem XHTML 1.0 Strict. To dodatkowa praca, ale dzięki niej można nauczyć się dobrego HTML-a.

{/tlo}

{tlo_0}

Krok 5

Następnym krokiem jest sprawdzenie nieaktywnych linków. To zawsze duży problem dla stron WWW, warto więc je sprawdzić i poprawić ewentualne błędy. Klikamy zakładkę Link Checker w oknie Results.

Wybieramy Broken Links z rozwijalnego menu. Następnie klikamy i przytrzymujemy zieloną strzałkę, a następnie wybieramy Check Links for Entire Site.

{/tlo}

{tlo_1}

Krok 6

W raporcie wyszukujemy nieaktywne linki, klikamy prawym klawiszem myszy i wybieramy Open File. Dreamweaver otworzy wybrany plik i zaznaczy nieaktywny link.

Oprócz tego można skontrolować stronę czy będzie sprawiać problemy w przeglądarkach. Wystarczy wybrać zakładkę Target Browser Check i kliknąć zieloną strzałkę.

{/tlo}

Backpack – efektywne narzędzie współpracy

{tlo_1}

Krok 1

Współpraca przy wspólnie tworzonej stronie, dla siebie czy dla klienta, wymaga komunikowania się ze sobą i przechowywania danych.

Backpack (http://www.backpackit.com), nowa sieciowa aplikacja 37Signals idealnie nadaje się do tego celu. Do tego jest bezpłatna. By z niej korzystać, trzeba się zalogować.

{/tlo}

{tlo_0}

Krok 2

Utworzymy stronę z listą zadań i tekstem. Klikamy przycisk Make a new page. Wpisujemy tytuł strony. Teraz czas na listę zadań do wykonania. Klikamy przycisk List.

{/tlo}

{tlo_1}

Krok 3

Dodaliśmy trzy zadania: Decide on colour scheme, Create site map oraz Decide on server implementation. Lista może obejmować dowolne zadanie związane z projektem. Gdy to zrobiliśmy, klikamy oznaczony na czerwono link Close.

Możemy teraz zmieniać kolejność na liście zadań i decydować o priorytecie ustalonych zadań.

{/tlo}

{tlo_0}

Krok 4

Teraz wstawimy tekst. Powinien on dotyczyć celu, jaki przyświeca biorącym udział w projekcie. Klikamy przycisk Body i wprowadzamy tekst. Zatwierdzamy przyciskiem Save.

{/tlo}

{tlo_1}

Krok 5

Nadszedł czas, by udostępnić przygotowaną stronę innym członkom zespołu projektowego. Klikamy przycisk Sharing i wpisujemy adres (lub adresy) poczty elektronicznej. Zatwierdzamy Share.

{/tlo}

{tlo_0}

Krok 6

Nasz współpracownik otrzyma e-mail zapraszający do obejrzenia strony i współpracy. Będzie w stanie dodawać i edytować zawartość strony. Jeśli skorzystamy z wersji płatnej serwisu, będziemy w stanie także dodawać zdjęcia.

{/tlo}