A Webdesign alapjai, webdesign, grafika, webdesignban használt betűtípusok

HU | ENG | GER

Az alkotói válság áthidalása az önmotiválás segítségével

2010-09-02 10:06:00

  Designerként kreatívnak kell lenned, hogy sikeres legyél a munkádban. Új ötleteket és kreatív problémamegoldásokat találsz ki nap mint nap. De ez nem jelenti azt, hogy ez...
Tovább olvasom 


Interfészek PHP-ban

Egy tökéletes honlap szerkesztéshez megfelelő programozó is szükséges. Követekező cikkünkkel ismételten a programozóknak kedvezünk. Bemutatjuk az... Interfészek PHP-ban 

A HTML rövid története

A World Wide Web nyelve a HyperText Markup Language (HTML). A HTML - t Sir Tim Berners Lee alkotta meg. 1991 – ben írt egy dokumentumot “HTML címkék”... A HTML rövid története 

Absztrakt osztályok phpben

Egy tökéletes honlap szerkesztéshez megfelelő programozó is szükséges. Követekző cikkünkkel ismételten a programozóknak kedvezünk. Bemutatjuk az... Absztrakt osztályok phpben 

5 elképesztő Twitter-követő vizualizáló eszköz

Foglalkoztunk már korábban is Twitter eszközökkel, de azok leginkább a Twitter fiókunk analizálását, nyomkövetését segítették. A következő... 5 elképesztő Twitter-követő vizualizáló eszköz 

Captcha és digitalizálás egyben

A ReCaptcha a Carnegie Mellon Egyetem által kifejlesztett captcha technológia ami weblapok védelme mellett, könyvek újságok digitalizálását végzi.   Captcha és digitalizálás egyben 

A 11 legnagyobb SEO hiba (és hogyan kerüljük el...

Tudom-tudom, gyakorta találkozhatunk ezzel a témával, de ezek olyan hibák, amelyeket az emberek minden áldott nap elkövetnek újra és újra. Érdemes... A 11 legnagyobb SEO hiba (és hogyan kerüljük el őket) 

A hatékony online marketinghez vezető 10...

Ha Te egy kis- és közepes méretű vállalkozás (KKV) marketingeseként dolgozol, aki az offline marketing mellett a SEO-ért... Online marketing és közösségi média marketing tanácsok KKV-knek 

Google video

Az alábbiakban a 3 legjobb google video gyakorlatot fogom leirni, amelyek a leggyakrabban előforduló hibákat mutatják be video tartalom indexelés és... Google video 

A sikeres Facebook marketing 8 kulcspontja

A Facebook immáron átlépte az 500 milliós felhasználószámot, így már egyszerűen nem lehet figyelmen kívül hagyni ezt a közösségi média... A sikeres Facebook marketing 8 kulcspontja 

Unix timestamp

Mi is az a unix timestmap? Unix timestamp 

Miként kerülheted el a közösségi média 22-es...

Az egyik legfrusztrálóbb pillanatok egyike egy marketing menedzser életében az, amikor a cég részvényesei számára meg kell válaszolni azt a kérdést,... Miként kerülheted el a közösségi média 22-es csapdáját 

A hatékony cikk marketing kulcsa

A cikk marketingezésről mostanában nem lehet sokat olvasni. . Sokan lenézik a cikk marketingezést. Úgy gondolják, ez egy idejétmúlt technológia, amely... A cikk marketing kulcsa 

Űrlapkészítés - Google Docs

Dinamikus weboldalakon, gyakran találkozhatunk űrlapokkal. Ezek szerepe rendszerint a felhasználóktól érkező adatok rögzítése é tárolása.... Űrlapkészítés - Google Docs 

Keresőoptimalizálás (SEO) története

Következő cikk egy kiváló és rövid leírást ad az internet kereskedelmi részéről. Google és a keresőoptimalizálás története.    Kereső optimalizálás (SEO) története 

E-mail marketing kampány elindítása előtt

Menjünk, vissza egy igazi old school, tradicionális formájához a vevők szerzésének:az e-mail marketingig. Sokan úgy vélekednek, hogy ennek már lejárt... E-mail marketing kampány elindítása előtt 

Fekete vagy fehér – melyik háttérszínt használjuk

Rengeteg weboldal designja alapul a fekete vagy fehér háttérszín használatára, abból az egyszerű okból kifolyólag, hogy működik. A fekete és a... Fekete vagy fehér – melyik háttérszínt használjuk 

Mi is az az Intranet?

  Az intranet kifejezéssel rengeteg helyen találkozhatunk, többek között itt az Abfox oldalán is. De miről is van szó, kinek vagy mire jó ez? Mi is az az Intranet? 

Weboldalak sebessége is hatással van már a...

 A Google bevezetett egy új tényezőt, amely befolyásolja a kereséskor elért eredményt: ez a weboldal sebessége. Weboldal sebesség 

Google Dance

Az elmúlt időszakban több lelkes ügyfelünk, akik szorgalmasan bővítik oldalukat és napi szinten, nyomon követik a találati listában elfoglalt... Google Dance 

Áttervezés vs. átalakítás

  Közel 5 éve már, hogy az „áttervezni vs. átalakítani” vita elkezdődött. Sok dizájner még mindig úgy áll egy honlap... Áttervezés vs. átalakítás 

5 egyszerű lépés egy nyerő közösségi média...

  Tehát felépítetted a közösségi média birodalmadat a Twitter, a Facebook és a Linkedin alkalmazásával és a blogokat is használod. De, hogyan... 5 egyszerű lépés egy nyerő közösségi média tervhez 

Ember vs Googlebot – a keresők relevancia...

A google számtalan lehetőséget nyújt az internetes felhasználóknak. Egy google accountal széles körben férhetünk hozzá olyan trendi és közkedvelt... Ember vs Googlebot – a keresők relevancia meghatározásában 

Útmutató a Facebook közösségi pluginekhez...

Mióta a Facebook közösségi pluginok könnyen megvalósíthatóak, addig azok praktikus használatát megérteni kissé zavaros, főleg azokban az esetekben... Útmutató a Facebook közösségi pluginekhez kisvállalkozások számára 

Földrajz az internet marketingben és...

Amikor interneten keresel tetőfedőt, kerékpárszervizt vagy szemészt, az egyik első szempont, ami szerint a weboldalakat megvizsgálod, hogy „közel... Földrajz az internet marketingben és keresőoptimalizálásban 

Video SEO: Promóció a közösségi megosztók...

Video promóció, Syndication és a Like tényező Video gyártás egyik nagy változása mostani évek során a video promociók számában és a... Video SEO: Promóció a közösségi megosztók idejében 

10 lépés a saját internetes marketing terv...

Ha egy kisebb szolgáltató cég tulajdonosa vagy, a megfelelő internetes marketing terv egyszerre növelheti a vállalatod hírnevét és a márkád... 10 lépés a saját internetes marketing terv létrehozásához 

Chrome kiegészítők webfejlesztőknek

A Chrome Developer Tools a Chrome böngésző egy saját beépített fejlesztői felülete, amely javascript hibakeresésre, html és css szerkesztésére való. Chrome kiegészítők webfejlesztőknek 

Bevezetés a SMARTY sablonkezelőbe

A SMARTY az egyik legnépszerűbb és legszélesebb körben használt sablonrendszer .Monté Ohrt és Andrej Zmijevszki dolgozták ki mint gyors és rugalmas... Bevezetés a SMARTY sablonkezelőbe 

A Webdesign alapjai

14 tipp, hogy megfelelő legyen a honlapunkon a webdesign. A Webdesign alapjai 

A 20 Legjobb Twitter figyelő és analizáló eszköz

A közösségi média sokkal több a kapcsolattartásnál és a szórakozásnál: jó módszer arra, hogy hirdesd magadat, a vállalkozásodat és a... A 20 Legjobb Twitter figyelő és analizáló eszköz 

11 Tipp a Link használatához

Az előző cikkben bemutattuk, hogy miért fontos a linkek használata. Most azt is megmutatjuk, hogy hogyan kell ezeket megfelelően alkalmazni. 11 Tipp a Link használatához  

Linkelés áttekintése

Talán már hallottad, hogy a weblapodra mutató külső linkek kulcsszerepet játszanak abban, hogy magas helyezést érj el a keresőmotorokban. Ez egy... Linkelés áttekintése 

A Vitorlázás.hu Magyarország leglátogatottabb...

 Egy évvel ezelőtt még büszkék voltunk arra is, hogy a Vitorlázás.hu beindításának 3. hónapjában a korábbi legnagyobb vitorlás portál, a... honlapkészítés vitorlázás témakörben 

Site Wide Text Link Ads

Óvakodjunk a SWTLA-tól A SWTLA (azaz az összes oldalunkon megjelenő linkek, pl. footer) komoly károkat okozhat az internetes megjelenésünkben. A régi... Site Wide Text Link Ads 

Google Wave

Mi is a Google Wave? A Google Wave egy új online eszköz, amellyel real-time, azaz valós idejű kommunikációt és kollaborációt lehet folytatni. Egy... Google Wave 

Footer Link Optimalizálás és Felhasználói...

Oldalról oldalra látogatva sok olyan weboldallal találkozunk, amelyek footer linkeket használnak a belső SEO és a szöveg horgonyzás ... Footer Link Optimalizálás 

Felhasználói vélemények a Real Time Web-ről

Sok vita kering azokról az üzletágakról, amelyek a real-time web kapcsán bukkantak fel. DE! a felhasználók számára ezek könnyen megtévesztőek, ... Real Time Web-ről 

Igény van a jó designra

Az igény a jó webdesignra egyre jobban nő egy friss Webcopyplus online szavazás szerint. A szavazók 25%-a nyilatkozta, hogy a "gyenge vizuális ... Hatékony webdesign 

"Long Tail" vagy "Short Tail" kulcsszavak?

A kulcsszavakat két főcsoportra oszthatjuk: short tail (rövid) vagy long tail (hosszú) kulcsszavak azaz széles kulcsszavak és keskeny kulcsszavak. A "long... Long Tail vagy Short Tail kulcsszavak 

Google Analytics - Hét új funkció

Tavaly is sok új Google Analytics funkciót vezettek be, ezek sora idén újabb héttel bővült. Ezek a funkciók kifejezetten a vállalati felhasználók... Google Analytics funkciók 

Keresőoptimalizálás és választások 2010

A globalizáció velejárói, az információs társadalom és az új generáció legfőbb információforrása az internet, ennek következménye, hogy ez a... Keresőoptimalizálás és választások 2010 

Feed

A feed olyan formátum, amely lehetővé teszi, hogy a tartalom megjelenhessen a weben, többnyire... Tovább  

A Webdesign alapjai


cimkék: Webdesign


Szerző:

Forrás: webdesign.about.com

Dátum: 2010-05-29



14 tipp, hogy megfelelő legyen a honlapunkon a webdesign.


Kérje ajánlatunkat


A Webdesign alapjai


Grafika

 
1. Gondolkodj kicsiben, a méret ne haladja meg a 10–12 kB-ot oldalanként. Való igaz, a szélessávú internet felhasználóinak száma folyamatosan növekszik. De a lassú oldalak nagyon idegesítőek, még akkor is, ha már 1 Mbit/s feletti sebességgel rendelkezik a felhasználó. Az oldalak lassúságának fő okát pedig éppen a hatalmas képek jelentik. A képeidet pedig könnyedén optimalizálhatod.


2. Mindig használj olyan grafikát, ami megfelelő a tartalomhoz. Csak azért, mert van egy nagyon jól sikerült képed a kutyádról, még nem kell rárakni a Web Designról szóló weboldaladra (bocs Bodri…). Az egyedüli kivételt a „design” képek használata jelenti. Ezek olyan fotók vagy grafikák, amelyek nem a tartalomhoz tartoznak, hanem az oldal design-ját segítenek kialakítani.


3. Ne használj olyan képeket, amelyek villognak, vibrálnak, mozognak, forognak vagy bármit is csinálnak az oldaladon. Vagy ha mindenképp használni szeretnéd őket, akkor is csak elvétve tedd. Tanulmányok sora mutatta ki, hogy a villogó grafikák megzavarják és idegesítik az embereket. Konkrétan volt olyan fókuszcsoport, ahol a csoport tagjai fizikailag eltakarták a villogó képeket, hogy el tudják olvasni a weboldal többi részét.


Elrendezés

 
4. Maradj a szabványos elrendezéseknél. Vannak olyan honlapok, amik 6–8 keretet alkalmaznak egy oldalon. De olyan is van, ahol jobbra kell görgetned, hogy el tudj mindent olvasni rajta (lefelé viszont egyáltalán nem kell görgetni). Ezek az elrendezések aranyosak, és talán jó szórakozás is őket létrehozni, de az olvasóidat meg fogják őrjíteni. A weboldalakon és újságokban található három oszlopos elrendezés népszerűségének fő oka, hogy működik. Bár lehet, hogy te már unalmasnak tartod, de mégis több olvasót tartasz meg, ha a számukra könnyedén átlátható egyszerű elrendezéshez tartod magad.


5. A „whitespace” nem csak a CSS miatt fontos (a whitespace attribútummal állíthatjuk be a szóközök, tabulátorok kezelését), de az elrendezésedben is nagy szerepet játszik. Ismerned kell az oldalaidon található whitespace-eket, és azt is tudnod kell, hogy ezek hogyan befolyásolják a tartalmaid megjelenését. Az internetes elrendezésben a whitespace éppen olyan fontos, mint a nyomtatott újságok elrendezésében.


6. Használd a grafikáidat az elrendezésed elemeiként. A grafikák így sokszor többek lehetnek egyszerű grafikáknál. Extrém módja ennek, amikor egy képet szorosan körbeölelsz szöveggel. Igazából az oldaladon található minden kép elrendezési elem, és kezeld is őket ennek megfelelően.


Fontok, betűtípusok

 
7. Talpas betűk a címsorokhoz és talpatlan betűk a szöveghez. Ha elvégeztél már bármilyen nyomtatott designról szóló képzést, ez feltehetőleg éppen az ellenkezője annak, amit ott tanultál. De az internet az nem nyomtatott anyag. A talpatlan fontokat sokkal egyszerűbb monitorokon olvasni, mivel a képernyők felbontása nem olyan magas, mint a nyomtatott papíré. Ha talpas fontot használsz a sima szövegekben, a talpak összefolyhatnak, amitől nehéz lesz elolvasni őket. A nyomtatóbarát változatodban viszont éppen ellenkezőleg kell használnod a fontokat: talpatlan a címsoroknak és talpas a szövegnek.


8. Korlátozd a felhasznált fontok számát. Az egyik leginkább amatőr hiba olyan weboldalt készíteni, amelyen újra és újra megváltozik a felhasznált font. A 2–3 szabványos font típusra korlátozott oldalak sokkal könnyebben olvashatóak és sokkal profibban néznek ki.


9. Használj szabványos font típusokat. Igen, választhatod a „Rockwood LT Standard” fontot az oldaladra, de elég alacsony annak az esélye, hogy az olvasód is rendelkezik ezzel a fonttal, így hiába a csodás betűtípus, ha az olvasód monitorján nem jelenik meg. A megszokott fontok, mint a Verdana, Geneva, Arial és Helvetica lehet, hogy unalmasak már egy kicsit, de az oldalaid jobban mutatnak majd, és a design is több böngészőben fog helyesen kinézni.


Hirdetés

 
10. Ne légy mohó. Ha meg tudod határozni, hogy hány hirdetés legyen az oldaladon, ne feledd, hogy az olvasóid nem hirdetések olvasása miatt jönnek, hanem a tartalmak miatt. Ha a hirdetések túlsúlyba kerülnek a tartalmakhoz képest, sok olyan olvasó lesz, akik viszonylag gyorsan hagyják majd el a weblapod. Persze fontos, hogy pénzt keress a weboldaladdal, de így már pénzvesztésnek számít, ha a túl sok hirdetés inkább elkergeti az embereket a honlapodról.


11. Ugyanúgy kezeld a hirdetéseket, mint a többi képet. Legyenek kicsik, ne villogjanak/vibráljanak és kapcsolódjanak a tartalomhoz. Csak mert ki tudsz tenni egy hirdetést az oldaladra, még nem jelenti azt, hogy ki is kell tenned. Egy releváns hirdetés esetén egyébként is nagyobb az esély, hogy az olvasóid rá fognak kattintani – és végül is ez hozza a bevételt.


Gondolj az olvasóidra

 
12. Teszteld le az oldalaidat több böngészőben is. A csak legmodernebb böngészőkben működő oldalak készítése elég nagy ostobaság. Hacsak nem egy vállalati intranet vagy kihelyezett számítógépkioszk számára készíted a weboldalad (amelyeknél a böngésző verziója előre meg van határozva), sok olyan felhasználód lesz, akik nem tudják megnézni az oldalaidat.


13. Ugyanez érvényes az operációs rendszerekre is. Nem feltételezheted, hogy csak azért, mert az oldalad működik a Windows operációs rendszerben futó Firefoxról, az már menni fog egy Macintosh alatt futóról is.


14. Írj olyan tartalmat, amit az olvasóid igényelnek. Hacsak nem pusztán saját szórakozásodból írod az oldalad (akkor viszont miért akarod feltenni az internetre?), próbálj olyan témákat választani és olyan tartalmakat létrehozni, amiket az olvasóid el akarnak majd olvasni.

Értékelje a cikket 1-től, 5-ig:

2.9