Webdesign és információ építészet a gyakorlatban THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others, using like colors for similar Web addresses.
a
-
y discoveredthat variouscomplexsystemshave ..'~tJ;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. mportant impli~ationsfor a hostof s,from drugdevelopmentto Internet security
a
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
2 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
• Felhasználó központú tervezés szükséges • Activity Centered Design • Követelmények meghatározása • a site célja • a felhasználói közösség • a site stílusa • scenáriók • Információ építészet -> site map • Look & feel
using like colors for similar Web addresses.
-
A tervezési folyamat
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
a
Tervezési elvek
3 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others, using like colors for similar Web addresses.
• Figyelmi szempontoknak megfelel!
-
tervezés
• Ne dekorálj, kommunikálj! • Az egyszer"ség célravezet! • Semmi ne legyen cél nélkül • Ellenállni az eredetiség kihívásának
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
a
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
Figyelmi szempontok
4 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
• Figyelem vezetése a vizuális elemek
using like colors for similar Web addresses.
segítségével
-
• Oldal szint" terv • Fontossági kategóriák • Els!dlegesen fontos elemek • max. 3-4 db • Másodlagosan fontos elemek
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
a
5 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
Figyelmi szempontok (folyt.)
using like colors for similar Web addresses.
1. Oldalcím 2. Site cím, logó 3. Oldal tartalmi összefoglalás
-
4. Navigáció 5. Oldal tartalom 6. Egyéb tartalom 7. Lábléc navigáció
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
a
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
6 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
• Sensemaking • Természetes szemmozgás, fókuszálás • Tipográfia ismeretek alkalmazása • Releváns, koherens hatást nyújtó grafikai design elemek • stílus • tagolás • érzelmi elemek
using like colors for similar Web addresses.
-
Ne dekorálj, kommunikálj
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
a
Egyszer!ség
7 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others, using like colors for similar Web addresses.
-
• Egyszer" design -> technológiailag egyszer" oldal • gyorsabb letölt!dés, gyorsabb renderelés • jobb áttekinthet!ség, egyszer"bb navigáció • gyorsabb tervezés, gyorsabb megvalósítás, gyorsabb újratervezés • kisebb tárhely igény, könnyebb
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
a
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
karbantarthatóság
MAY 2003
8 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
Mindennek legyen célja
• Felhasználók támogatása céljaik elérésére • Site céljainak támogatása a felhasználó frusztrálása nélkül • A megfelel! folyamat • cél meghatározása és rögzítése • tervezést abbahagyni, ha a cél nem látszik világosan • tervezési eredmények megindoklása a céllal összefüggésben • a terv validálása
using like colors for similar Web addresses.
-
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
a
Az eredetiség kísértése
9 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
• Az eredetiség a kreativitásban is speciális adottság; ritka • Alapvet! gond: az igazán eredeti megoldások csak ritkán jól használhatók • Esztétikai stílus kialakítása • evolúciós életciklus • gyors, véletlenszer" genetikus mutációk • epidemiológia • Funkcionális tervezés • lassabb életciklus • konvenciók
using like colors for similar Web addresses.
-
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
a
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
10
Grafikai tervezés
Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
• Átláthatóság • vizuális elemek elrendezése, viszonya egymáshoz • relációk, tartalmazások, elhatárolások • tervezési eszközök • kontraszt • szinek • textúrák
using like colors for similar Web addresses.
-
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
a
11 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
Grafikai tervezés (folyt.)
• Szinek használata • konzisztens színséma használata • szinek száma • világos (fehér) háttér a f! tartalomhoz, szövegekhez • intenzív szinek kiemeléshez
using like colors for similar Web addresses.
-
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
a
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
12 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
Grafikai tervezés (folyt.)
• Kontraszt • visual popout • olvasási kényelem • kiemelés, elfedés
using like colors for similar Web addresses.
-
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
a
13 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
Grafikai tervezés (folyt.)
using like colors for similar Web addresses.
-
• Képek használata • Site azonosítás/logó • Tartalom • Navigáció • Ikonok használata körültekintést
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
a
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
igényel
MAY 2003
14 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
Grafikai tervezés (folyt.)
• Oldal layout/tartalom elrendezés • Csoportosítás • Tartalmazás • Illesztés
using like colors for similar Web addresses.
-
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
a
15
Site szerkezet
Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
• Információ építészeti modellek • All-in-one • Flat • Index • Hierarchia • Többszörös hierarchia
using like colors for similar Web addresses.
-
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
a
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
16 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
• Navigációs modellek • Tartalomjegyzék • Vízszintes navigációs sáv • “kenyérmorzsa” csík • Fülek • Menü oszlopok • Kinyitható/összecsukható fák
using like colors for similar Web addresses.
-
Site szerkezet (folyt.)
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
a
17 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
Akadálymentesítés
• Okok • fogyatékkal él!k támogatása • jobb általános használat • törvényi el!írás • Megoldások • képek, animáció: alt, longdesc attribútum • image map: kliens oldali, area alt • multimédia: feliratozás • értelmes link szövegek
using like colors for similar Web addresses.
-
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
a
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
18 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others,
• Nemzetközi változat vs. lokalizált változatok • Web sajátságok • könnyebb lokalizálás • id!formátumok és id!zónák • URL-ek • nyelvválasztó nyitóoldal • zászlók ~ nyelvek • ikonok kultúrafügg! értelmezése
using like colors for similar Web addresses.
-
Nemzetközi használat
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
a
Tartalom kivitelezés
19 Webtechnológia 1
THE INTERNET,mapped on the opposite page, is a scale-free network in that some siteS (starbursts and detail above) have a seemingly unlimited number of connections to other sites. This map, made on February 6, 2003, traces the shortest routes from a test Web sinHo about 100,000 others, using like colors for similar Web addresses.
-
• Validált HTML • struktúrált tartalom • Megjelenítés, layout: CSS-tel • Szeparált HTML, CSS, JavaScript
scoveredthat variouscomplexsystemshave J;i~e~tu"eg~Ye'l"rne(;lb9.$ha red organili ng principies. tant impli~ationsfor a hostof m drugdevelopmentto Internet security
dokumentumok
BYALBERT-U\SZLO BARABASI ANDERICBONABEAU
MAY 2003
