-
data publikacji: 17.11.2008
9 grzechów głównych młodego webdesignera
kategoria: Webdesign, Webmaster autor: sylwus
W ostatnim czasie można zauważyć wzrost liczby grafików komputerowych w Polsce. Wiąże się z tym chęć młodych ludzi do wykreowania także własnej osoby w tym fachu. W poniższym artykule ukażę najczęściej popełniane błędy przez nowicjuszy w dziedzinie webdesignu.
Rozmiar projektu
Wiele z Was zapewne nie wie od czego zacząć. Według magazynu .PSD standardowe wymiary layoutu wynosić powinny 1008x768 px. W tym przypadku design dostosowany jest idealnie do rozdzielczości 1024x768. Problem się rodzi podczas gdy czytelnik naszej strony posiada monitor o rozdzielczości 800x600 czy 1280x1024. W pierwszym przypadku nasza strona wydaje się być zbyt duża, natomiast w drugim – za mała. Wszystkim dogodzić jednak nie można.
Kolorystyka
Jeden z ważniejszych elementów składowych strony. Należy pamiętać, że barwy witryny mają przyciągać, a nie odpychać. Zatem nie mogą być zbyt jaskrawe, odstraszające i męczące (jak na obrazku poniżej).

Stocki
Ważnym elementem każdej strony są zdjęcia. To one także przyciągają uwagę. Sprawiają, że strona jest ‘żywa’. Wywołują także u obserwatorów pozytywne emocje i przyjazne nastawienie do odbioru treści strony. Wszystko to działa jeśli jest oczywiście odpowiednio dobrane.
Patterny, Textury
Krótko mówiąc tło strony. Podobnie jak w kolorystyce nie mogą być one zbyt krzykliwe i odwracać uwagi od treści witryny. Na ogół funkcjonują 4 typy backgroundu:
Kolor

Gradient

Pattern

Textura

5.Czcionki
W Internecie jest multum czcionek, które kuszą młodych webdesignerów. Jednak ‘ładna’ czcionka nie zawsze oznacza najlepszą.
Do ukazania przykładowego tekstu na stronie można użyć : Arial, Tahoma, Verdana, Georgia.
Nie powinny być one większe niż 20 px, ponieważ ulegają wówczas zjawisku tzw. „pixelowania”. Termin ten nie oznacza nic innego jak zauważalne gołym okiem pixele.
WAŻNE! Jeśli ustawimy naszą czcionkę np. na 12 px należy pamiętać, aby wygładzenie ustawione było na ‘None’ (w Adobe Photoshop). W innym przypadku czcionki nie odzwierciedlają późniejszej jej wizji na stronie.

Tyczy się to jednak tylko czcionek małych rozmiarów. Te powyżej 20 px powinny być już ustawione na ‘Sharp’, ‘Smooth’ czy ‘Crisp’.
Wniosek?
Mniejsze czcionki – ‘none’
Duże czcionki – ‘sharp’, ‘smooth’, ‘crisp’Marginesy
Nawet zamieszczając tekst przykładowy pamiętajmy o tym, żeby wyglądał on estetycznie. Jeżeli chcemy wstawić więcej tekstu po prostu zwiększmy tabelkę a nie zmniejszajmy pola marginesu. Wtedy strona wygląda jakby była na siłę ‘przepełniona’.

Ikony
Ikony na stronie to niby nic takiego. Kilka obrazków. Nie zdajemy sobie jednak sprawy jak bardzo sprawiają, że witryna wygląda bardziej profesjonalnie.

Estetyka
Tworząc design strony WWW używajmy rozumu. Nie może być na niej za dużo elementów, bo wtedy staje się ona ‘ciężka’ i męcząca. Trzeba znaleźć złoty środek, aby zrównoważyć byt elementów składowych strony.
Prawa autorskie
Wykorzystując ikony, patterny czy stocki na naszej stronie pamiętaj o prawach autorskich. Aby uniknąć jakichkolwiek nieprzyjemności z tej strony związanych warto korzystać z serwisów, które zajmują się gromadzeniem darmowych komponentów.
Każda strona powinna być podpisana przez autora. Do tego najczęściej na dole projektu należy stworzyć stopkę.2008, Sylwia Bartyzel
sylwus.none.pl
shush@interia.pl -
13 Responses to “9 grzechów głównych młodego webdesignera”
Leave a Reply
Komentarze
Kategorie
Top 10
bal intermobil: Jak stworzyć stronę za pomocą xhtml oraz css
alan27pbll: Query_posts, czyli jak ujarzmić loopa część 1.
alan27pbll: Query_posts, czyli jak ujarzmić loopa część 1.
Michał: Inspirujące strony www: wrzesień 2010
czi: Gravatar, czyli jak mieć globalnego avatara
learn italian online: Query_posts, czyli jak ujarzmić loopa część 1.
hotelpalermo: Jak poprawnie osadzić Flasha w kodzie (X)HTML strony?
Michał: jQuery Cycle
Windscreen: Inspirujące strony www: wrzesień 2010
EMAAR MGF GURGAON: Query_posts, czyli jak ujarzmić loopa część 1.
- CMSy Artykuły dotyczące różnego rodzaju systemów zarządzania treścią CMS.
- Flash Podstawowe informacje pomocne przy tworzeniu animacji w Adobe Flash.
- Fotografia Samouczki dotyczące nie tylko robienia zdjęć ale też ich cyfrowej obróbki.
- Grafika Ogólnie pojęta grafika komputerowa, od inspiracji, po tworzenie layoutów oraz mniejszych form graficznych.
- Inne tutoriale wordpressowe Wszystkie inne zagadnienia dotyczące WordPressa.
- Inspiracje Inspirujące materiały graficzne z dziedziny projektowania stron www, projektów DTP, digital painting, itp.
- Obróbka zdjęć Techniki retuszu fotografii cyfrowych.
- Rysunek Tworzenie rysowanych ilustracji w Adobe Photoshop.
- Skóry do Wordpressa Darmowe oraz płatne – najlepsze skóry do WordPressa.
- Skrypty client-side
- Skrypty server-side
- Tutoriale
- Webdesign Tutoriale z zakresu projektowania stron www i grafiki użytkowej na rzecz internetu.
- Wieczór z Open Source
- Wordpress Ulubieniec naszej publiczności CMS WordPress: nowości, tricki, wtyczki, skóry i wszystko to co może przydać się przy korzystaniu z tego systemu.
- Wtyczki do Wordpressa Recenzje oraz instrukcje najbardziej popularnych i najbardziej niezbędnych pluginów do WordPressa.
- XHTML/CSS Ciekawostki z dziedziny kodowania stron www: XHTML, CSS, jQuery.
- Portfolio graficzne oparte o Wordpress przy użyciu Custom Fields
- Tagi w trójwymiarze
- Menu "wychodzące" zza strony
- Sklep internetowy wyróżniający się z tłumu
- 9 grzechów głównych młodego webdesignera
- Animowane menu za pomocą funkcji jQuery - animate() cz.2
- Gravatar, czyli jak mieć globalnego avatara
- ExpressionEngine - pierwsze starcie
- Inspirujące szablony stron (DeviantArt) - październik 2008
- Inspirujące strony www - październik 2008
Najnowsze newsy
Wieczór z Open Source 2010
Jak co roku WSINF organizuje konferencję Wieczór z Open Source.
Chciałbym zaprosić was na tegoroczna konferencję Wieczór z Open Source 2010! Czytaj dalej
Grafart.org i WACOM zapraszają na konkursy!
Witam!
Myślę, że czas najwyższy nadmienić, że za niedługi czas zostanie zorganizowany pierwszy z trzech konkursów, w których główną nagrodą będą tablety firmy WACOM!
Za miejsca drugie oraz trzecie nagrodami będą kubki i koszulki firmy WACOM oraz magazyny graficzne PSD PHOTOSHOP oraz COMPUTERARTS.
Czytaj dalej
Zapraszamy na forum graficzne Graffika.pl
Każda osoba interesująca się grafiką komputerową ma czasami ochotę porozmawiać o swoich pracach, posłuchać rad, krytyki i pochwał innych osób. Idealnym miejscem na realizowanie takich potrzeb jest forum graficzne Graffika.pl.
Czytaj dalej
Polecane strony
- No bookmarks avaliable.
























Fajny artykuł, ale przeznaczony dla osób, które zaczynają dopiero w chodzić w świat projektowania. Ogólnie brakuje mi w nim linków dla tych osób ( chociaż każdy wie, że wujek google prawdę powie i przekaże im linki do pomocniczych materiałów). Szkoda, że nie dopisaliście nic o inspiracjach bo to bym się im przydało.
Ogólnie bardzo mi się podoba artykuł, i trzymajcie tak dalej.
Pozdrawiam Konrad “puchuk”
Inspiracje? ależ są już od kilku miesięcy prowadzimy zbiory, które przedstawiają strony warte uwagi ze wzgledu na estetykę jak i technike wykonania: http://vivee.info/category/inspiracje/
I chyba sam tytuł artykułu wskazuje na przeznaczenie dla “młodych” ludzi (w sensie doświadczenia w projektowaniu grafiki www)
Tak tak wiem, że prowadzicie dział inspiracje, i naprawdę strony, które tam przedstawiacie są świetne. A co do tego, że dla “młodych” to wiem ale chciałem coś dopisać od siebie żeby komentarz nie wydawał się zbyt pusty
Pozdrawiam
Od siebie powiem, że mnie tutek bardzo pozytywnie zaskoczył, bo o ile sam te raguły znam, o tyle widzę, że jest masa ludzi, którzy zaczynają zabawę z tworzeniem szablonów bez żadnych podstaw. I właśnie przez te braki jest tam popełniana masa błędów, których mozna uniknąć chociażby czytając tego arta. To jest naprawdę max. 15 minut a efekt może być bezcenny.
Ja także jestem początkującym webdesignerem, ale kilka zasad już znam
Ale ogólnie to Sylwii należy się wielki plus za napisanie artykułu.
Jedyna ‘bardzo nowsiejsza’ rzecz to marginesy
Przydatne, lecz tak naprawdę każdemu z nagłówków można poświęcić oddzielny artykuł.
Niestety dla osób, które już zaczęły projektować, raczej żadnych “nowości”, natomiast dla osób, które wpadły na pomysł zrobienia strony, bardzo przydatny wstęp.
Termin “czcionka” używany w kontekście internetu (choć współcześnie i druku także) jest nieporozumieniem, lub w najlepszym wypadku wielkim skrótem myślowym. Czcionka bowiem to ołowiany prostopadłościan z wyrytym kształtem znaku (glifu). Wyszły one z powszechnego użycia w tradycyjnym druku już kilkadziesiąt lat temu!
Poprawnym terminem jest “font”, czyli cyfrowa wersja czcionki, lub jeszcze lepiej “krój pisma”.
jakow, oczywiście masz rację, aczkolwiek musisz przyznać, że z czczionką jest jak z modemem isdn, niby błedny termin, ale wszyscy go z przyzwyczajenia używają. Ten termin się przyjął i już. Ogromna większość użyje terminu czcionka do nazwa literki na monitorze i wszyscy wiedzą o co chodzi. Większość z tych, którzy użyją słowa font zamiast czcionka zrobi to nie dlatego, że użyła poprawnego terminu tylko ot tak sobiego zangielszczyła (tak jak słowo content zamiast treść etc). Używanie, więc słowa “czcionka” można już uznać za zwyczajowe.
A swoją drogą co być powiedział na “czcionkę cyfrową”?
Niestety niektórych ludzkich przywyczajeń nie można już usunąc z użytku.
Innym tego przykładem jest pojecie “logo”, które najczęsciej jest rozumiane jako coś w kształ nagłówka strony, a w rzeczywistości jest to graficzny znak towarowy (inaczej symbol, mający ogromne znaczenie marketingowe).
Lub z innej dziedziny – “ekologia” to nie jest segregowanie odpadów, czy noszenie syntetycznych odpowiedników futer… to inaczej “relacje między organizmami a środowiskiem oraz innymi organizmami, które zamieszkują okreslone środowisko”. Gdybyśmy mieli wtłaczac w tej chwili ludziom do głów w jakim kontekscie mają używac tego pojecia, to chyba bysmy nie podołali ani finansowo ani psychicznie.
“czcionka cyfrowa” – przeciwieństwo “ołowianego fontu”
Najlepiej chyba używać wyrażenia “krój pisma”.
Wiem że używanie terminu “czcionka” się powszechnie przyjęło, i że wszyscy rozumieją że chodzi o “krój pisma”, ale zawsze mnie to drażni, nie mogę się przyzwyczaić po prostu… Uważam, że powinno się być precyzyjnym w swoich wypowiedziach – używać prawidłowych terminów.
Co do “logo” – należy rozróżnić pomiędzy “logo” i “logotyp”, nagłówek strony może być jednym bądź drugim.
I jeszcze “ekologia” – segregowanie odpadów, czy noszenie syntetycznych odpowiedników futer to działania “pro-ekologiczne” co najwyżej, nie “ekologia”.
Tak jak napisałem wyżej – jestem za używaniem precyzyjnego słownictwa.
Nagłówek miałam na myśli chociażby coś takiego: http://tutoriale.vivee.info/wp-content/themes/tuts/img/head1.jpg
Logo bądź logotyp można znajdowac się na nim w postaci dodatkowego elementu graficznego, ale nie jest nim (czyt. nagłówkiem lub headerem lub jak inni to określają “główką strony”).
Również jestesmy za prawidłowym slownictwem, ale jak już zostalo powiedziane – niekórych zachowan i przyzwyczajeń nie zabijemy w społeczeństwie.
Dzięki wielkie na pewno pomoże xD
My brother recommended I may like this website. He was once totally right. This post actually made my day. You can not imagine simply how a lot time I had spent for this information! Thank you!