Glob z kartkami - logo

webfaces.pl

projektowanie stron internetowych

Dlaczego my

Ikona pdfPobierz treść artykułu w formacie .pdf Ikona odfPobierz treść artykułu w formacie .odf

Nasze strony to coś więcej, niż tylko elegancki wygląd. Posiadamy wiedzę zdobytą podczas studiów informatycznych oraz kilkunastoleniego doświadczenia w programowaniu. Strony tworzone przez webfaces.pl są realizowane z naciskiem na optymalizację techniczną. Tutaj dowiesz się, dlaczego to jest ważne.

Szybkie wczytywanie strony

Wiemy, że wolne wczytywanie strony w łagodnym przypadku tylko irytuje odwiedzających, w najgorszym skutkuje całkowitym zaniechaniem odwiedzin. Na każdym z etapów tworzenia strony przygotowujemy ją z myślą jej szybkiego wczytywania.

Najczęściej wykorzystywane przez nas techniki:

Optymalizacja kodu

wykorzystanie odpowiednich struktur HTML w połączeniu z CSS
pozwala na znaczne (wielokrotne!) zmniejszenie objętości strony, co przyspiesza jej wczytywanie
ekspercka znajomość CSS-a
bardzo dobra znajomość CSS umożliwia nam wykorzystanie go w sposób optymalny, np. poprzez ograniczenie liczby reguł i klas do minimum
umieszczenie kodu CSS, JavaScript w osobnych plikach
technika ta pozwala na szybkie wczytywanie plików w czasie chodzenia po witrynie, poprzez współpracę z pamięcią podręczną.
kompresja kodu
(na życzenie klienta) wykorzystujemy narzędzia kompresji kodu, zmiejszające rozmiary plików

Optymalizacja grafiki

grafiki przygotowujemy w optymalnych formatach
jpg, png, gif... Rozszerzenie ma znaczenie. Wiemy, w jaki sposób przeformatować obrazek, aby łączył w sobie jakoś z małą objętością.
wykorzystanie techniki wtapiania grafiki w tło
połączenie obrazka z kolorystycznie dopasowanym tłem pozwala na symulację dużego obszaru wizualnego z zaledwie kilkudziesięciobajtowym plikiem graficznym.
wykorzystanie właściwości repeat-x, repeat-y do symulacji dużych obszarów tła
dzięki zastosowaniu tej wiedzy strona może sprawiać wrażenie na bogato wypełnioną grafiką, a jednocześnie będzie wczytywana szybko.
odpowiedni rozmiar obrazków
dbamy o niewielki rozmiar grafik, nie skalujemy obrazków za pomocą HTML-a.

Optymalizacja witryn opartych o CMS

piszemy własne motywy, od podstaw
pozwala to na uzyskanie pełnej konroli nad generowanym kodem
dbamy o minimalną liczbę odwołań do bazy
w ten sposób skracamy wykonywanie operacji najbardziej czasochłonnych
stosujemy cache'owanie po stronie serwera
dzięki temu strony wyświetlane są tak szybko, jak pisane bezpośrednio w HTML-u/CSS-ie

Strona przyjazna wyszukiwarkom (Google i innym)

Nasze strony piszemy tak, aby ułatwiać wyszukiwarkom (Google i innym) znalezienie i zindeksowanie witryny.

  • tworzymy strony o przejrzystej hierarchii i z odnośnikami tekstowymi
  • w treści strony uwzględniamy słowa kluczowe - słowa wpisywane w wyszukiwarkach przez potencjalnych odwiedzających
  • do wyświetlania ważnych nazw, elementów zawartości i odnośników używamy zwykle tekstu, a nie grafiki
  • pamiętamy o odpowiednim wykorzystaniu atrybutu alt dla treści obrazkowych
  • szczególną uwagę kładziemy na odpowiednie wypełnienie elementu title, znaczników meta oraz odpowiednie wykorzystanie nagłówków (h1, h2, ...)
  • używamy odpowiednich nazw plików (dla html, obrazów, ...)
  • dla większych witryn tworzymy mapę strony
  • dbamy o poprawność kodu HTML, CSS
  • naszym klientom wyjaśniamy, czym jest PageRank i co sami mogą zrobić w zakresie lepszego pozycjonowania (rozpowszechnianie linków do strony, umieszczenie strony w katalogach sieciowych itd.)

Poprawne wyświetlanie w różnych przeglądarkach

Ta sama strona może być różnie wyświetlana, w zależności od użytej przeglądarki:

  • Firefox
  • Internet Explorer
  • Chrome
  • Safari
  • Opera

Dokonujemy wszelkich starań, aby minimalizować te rozbieżności:

testujemy witrynę w tak wielu przeglądarkach (i ich wersjach) jak to możliwe
testowanie przeprowadzamy na bieżąco, podczas kolejnych etapów pracy nad stroną.
używamy prawidłowego i przejrzystego języka (X)HTML i CSS
wykorzystujemy narzędzia W3C Markup oraz W3C CSS Validation Service do sprawdzania poprawności naszych kodów. Strona napisana bez błędów składniowych, to najlepszy sposób na zapewnienie prawidłowego wyglądu witryny we wszystkich przeglądarkach.
posiadamy własną bazę najczęstszych błędów przeglądarek
jesteśmy świadomi, że bezbłędnie napisana strona nie gwarantuje jej poprawnego wyświetlania. Starsze (choć nie tylko) wersje przeglądarek posiadają błędy, które to uniemożliwiają. Znamy najczęstsze z nich, dzięki czemu szybko poprawiamy niezgodności w wyświetlaniu witryny.

Zgodność ze standardami sieciowymi

Projektując stronę, zawsze mamy na uwadze standardy sieciowe zdefiniowane przez W3C. Dzięki temu:

  • wszystkie podstrony posiadają spójny wygląd (zdefiniowany w oddzielnych arkuszach stylu)
  • poprawia się czytelność stron, które stają się łatwiejsze do utrzymania w przyszłości
  • poprawia się pozycja stron w rankingach silników wyszukiwawczych (wyszukiwarkach) - łatwiej indeksuje się strony zawierające czystą treść (semantyczna struktura HTML), niż strony HTML zawierające dodatkowo definicje stylów
  • poprzez oddzielenie struktury semantycznej HTML od prezentacji, stronę można łatwo dostosować do różnych urządzeń takich jak: telefony komórkowe, tablety internetowe, smartfony, czytniki ekranu

Zapewnienie dostępności

Dostęp do informacji i technologii komunikacyjnych jest jednym z praw człowieka. Dlatego staramy się, aby tworzone przez nas strony były dostępne dla osób z różnymi możliwościami. Chcemy przez to ułatwić życie w społeczeństwie osobm starszym, ludziom niedowidzącym lub niewidzącym, mieszańcom terenów wiejskich bądź krajów rozwijających się. Kilka przykładów to:

  • zastępczy tekst dla grafiki (alternative text)
  • wszystkie funkcje strony dostępne przez klawiaturę
  • transkrypcja w przypadku zasobów audio

Użyteczność i funkcjonalność

Aby strona była użyteczna i funkcjonalna, wystarczy trzymać się kliku prostych zasad. Dzięki nim użytkownicy strony będą zadowoleni. Będą wiedzieć, że uzyskali to, czego oczekiwali. Znajdą szybko pożądane informacje. Polecą stronę innym. A w przyszłości chętnie na tę stronę powrócą.

  • w układzie strony zachowujemy hierarchię ważności - treści ważne są u góry, mniej ważne - na dole; ważne są w pewien sposób wyróżnione
  • dużo uwagi poświęcamy przejrzystemu projektowi nawigacji
  • uwzględniamy przyzwyczajenia użytkowników np. dotyczące położenia logo (górny, lewy narożnik ekranu), oznaczeń odnośników (wyróżnione innym kolorem bądź podkreśleniem), ogólnego układu strony (nagłówek, pasek boczny, stopka)
  • stosujemy czytelne czcionki, unikamy grafik z napisami na rzecz napisów (umożliwia to skopiowanie), stosujemy poprawną interpunkcję
  • na każdej podstronie użytkownik widzi, w którym miejscu się znajduje i wie, jak przejść do strony głównej
  • treść zawsze otwiera się w tym samym oknie
  • nie blokujemy przycisku "wstecz" w przeglądarce
  • unikamy Flasha; zawsze testujemy, czy strona spełnia swoje funkcje przy wyłączonej obsłudze JavaScript
  • testujemy strony w przeglądarkach tekstowych (links/lynx)
  • na życzenie klienta uwzględniamy w projekcie możliwość istnienia wielu wersji językowych strony