Dobó Mátyás blogja 2003 óta webes trendekről Rólam

Hatékony form dizájn

Bárki, aki valaha épített webes formokat, az tudja, az egyik legnagyobb istencsapása - vagy kihívása -, ami valaha történhetett a sitebuilderekkel.

Ha bildert keresel, nagyjából két dologból meg lehet mondani,hogy tud-e. A. képes doctype nélküli oldalt összerakni, b. Képes szépen bildelni formokat. Ha ez a két dolog megy, az emberünk nagyjából bármit képes lehet megoldani.

A formok tervezése az egyik nagy elhanyagolt terület a webes dizájnban, pedig minden használat kiinduló pontja és a minden vásárlás végpontja ez.

Az egyik nagy isten - Luke Wroblewski - most webes formok dizájnjáról ad ki könyvet és a megelőző marketing porhintés keretében közre adott néhány érdekes eredményt. Az egyik, hogy egy két mezős beküldő átalakításával is jó néhány 100000 dollárt sikerült éves szinten megspórolni egy cégnek, ami figyelemfelkeltő és mutatja, már egy kis kapu is várfallá alakulhat rossz tervezés eredményeként.

A másik pedig a form submit-gombok elhelyezéséről készítettek egy apró usability vizsgálatot és arra az eredményre jutottak, hogy az ok/mégsem gombok balra igazítva azonos színnel működnek a leghatékonyabban. A mostanában oly sikeres gomb-link kombináció mintha nem lenne hatással az eredményekre és az elsődleges akció gomb élesebb színnel történő megjelenése sem.

Néhány link a témában:

• Form best practises
• Az ominózus cikk

Tetszett a bejegyzés? Kövess Facebook-on, vagy Twitter-en.

Nincs kapcsolódó bejegyzés

• Venice projekt
• AC heti: 300 trailer, 24 prequel, tornádó Londonban, víz a Marson, Photoshop CS3
• Ne szólj hozzá a blogomhoz, inkább nyomj a share gombra
• Vándorlás szolgáltatások között. Melyik a kedvenc mikroblog szolgáltatód?
• Hírbehozóval értékelünk

A gombvariációkra megnéznék pár magyarázó példát, mert érdekes, de nem szeretném félreérteni…

Beleraktam a posztba.

Talán csak a hörghurut miatti nemalvás teszi, de a “képes doctype nélküli oldalt összerakni” pontosan mit is jelent? XHTML-oldal validálásához nem alapvető, hogy doctype deklaráció legyen az első sorban?

eszerint mégsem off

jelenleg úgy néz ki, hogy aki DOCTYPE nélkül képes oldalt összerakni, az sokkal inkább azért teszi ezt, mert nem tudja, mire való

nem tud az IE5, IE5.5 és IE6 nem szabványos dobozmodelljéről, ami egyedül az IE6-ban orvosolható azzal, ha az bilder szabványos DOCTYPE-ot használ

táblás layout-on szocializálódott bilder-eknél láttam, hogy amikor szétesett az oldal IE-ben, egy layout dobozhoz hozzáadott padding v. border miatt, törölték a DOCTYPE, és boldogok voltak, hogy milyen ügyesen/gyorsan/hatékonyan abszolválták a feladatot.

tudsz hegesztőszeműveg nélkül hegeszteni?
ejtőernyő nélkül ugrani?

Mekk Elek-e vagy?

teatom: vannak helyek, ahol sajnos nem olvassák be a doctype-ot, és bár igaz, ahol szemüveg nélkül kell hegeszteni.

Nem az a kérdés, hogy ha minden eszköz adott és szabad vagy, tudsz-e fasza oldalt építeni - mert az azért már nem annyira különleges -, hanem képes vagy-e olyan cuccot is gyártani, ahol komolyan le van kezelve az extrém fallback - mint jelen esetben is - .

Egyébként meg meg lehet oldani divekkel is doctype nélkül.

Az agyam helyén most tényleg takony van, de úgy érzem, a hangsúly ebben az esetben a “képes” szón van…

a validáláshoz elengedhetetlen, de van ahol nem ez a lényeg… :)

sajnálom, ha kissé indulatosnak tűnt a véleményem!

tényleg nagyon sok rossz példát láttam/látok magam körül

a szájtbildhez mindenki ért (minden titkárnő - two in one - egyben a céges grafikus), hiszen csak egy kattintás: a Wordből is lehet html-t menteni.

programozók, akiknek mellényzsebükben a CSS, de fogalmuk sincs az inline és block element közti különbségről

tudom, hogy meg lehet oldani DOCTYPE nélkül, legfeljebb ronda lesz a kód és nagyobb

és OK, ha nem tudatlanságból, hanem az extrém feltételek miatt csinálja valaki

azt hittem, hogy a hekkelés apoteózisát olvasom, azért volt a hevesség!

Off:
Jézusom, Bilder? Milyen szó ez?

A jó “bildert” onnan lehet felismerni, hogy nagyon-nagyon furcsán néz rád az A) variáció kapcsán. :) Legalább olyan furcsán, mint teamtom. :D

Jó “bilder” lennék ezek szerint? ;) De jó… Amúgy most már értem. Egyedül a konkrét alkalmazási terület elképzelésével van gondom. Hova kellhet doctype nélküli html?

Bence: igen, ezt én is meg akartam kérdezni Doranskytól

Doransky: mi az az alkalmazási terület, ahol a DOCTYPE hátrányt jelent illetve nem kívánatos?
réges-régi vagy egzotikus böngésző? valami mobileszköz?

András: köszönöm megnyugtató szavaidat!

kipaddingollak, geci.

matyas, uristenbaz!

fogalom nelkul!

Mátyás sem tökéletes, bakot lő néha.

tornado ez bazmeg jellemző rád, máig kapálom a romjaira hulló dolgaidat, de eljössz beszólni.

Doctype nélkül megy egy-két dolog a t-online berkein belül pl. Ritka, de ha meg kell oldani, akkor a többségnek keresztbe áll a szeme. És itt válik el a téma egymástól, egyébként meg a tjp-nek van igaza, paddingolva belsö kitámasztókkal lehet megoldani.

hopphopp AM I HIRED NOW AM I HIRED NOW?!

Anyonymous, a név és fogalom nélküli bepofázó, sérült faszokra ugye te is azt mondod, hogy fogalom nélküli sérült fasz?

Te fogalom nélküli sérült fasz :)

visszaveszem az it!

azt birom, hogy magyarországon állandóan megy a FLAME, mindenki tudja a frankót, mondja az okosat, közben pedíg a béka segge alatt vagyunk.

2007-ben így néz ki egy nagy hazai blogszolgáltató címlapja (Firefox/2.0). erre még novosibirskben sem írnák rá, hogy 2.0.

kicsit kevesebb megmondást és több szakmaiságot!

ninja: azert a paraert felteszem a kezem :)
a gond ott az hogy a firefox valamiert meghulyul ha egy elemet eloszor clear:both-olnak majd adnak neki egy floatot.

sehol mashol nincs ebbol para csak fox alatt.

torn: azért ezt a példát hoztam, mert a másik tabon pont nyitva volt a blogter. lehetne mutatni még száz hasonlót.

azt látom magyarországon, hogy akik a leginkább fújják a nagy webkettes lufit, és mondják mindíg, mindenhol az okosat, azok a leügyetlenebbek.
ezek az arcok permanensen pocskondiázzák egymást a blogjaikban. nem ritkán nagy szolgáltatók képviseletében káanyáznak.

persze van egy pár igazán jó kóder az országban, de ők valahogy sokkal szerényebbek.

display: inline nem segít? vagy a clear: both-nak egy !important?
akkor ne kapjon clear: both-ot, hanem toljunk alá egy üres div-et (vagy hr-t, br-t, akármit.) és azt clear: both-oljuk.

na tessék, én is megmondtam az okosat.

komolyan ninja, ha le birnad irni, hogy mindig, lehetnel a haverom.

mindig

ninja: en vegigszoptam mindent amit lehtetett ezzel a firefox paraval, az viszont a legagyfelbaszobb benne, hogy lokalban tokeletesen megy, sosem esik szet, feltoltve szerverre viszont minden x. reloadkor elbaszodik.

ugy bugot javitani, hogy nem tudod mindig elohozni, nehez :)

dehat a zsolti mar egy eve nem a blogter kutyaja*, a dolog meg igymaradt. nahat!

* nepkoltes

blogter cimlap tényleg a firefox bugtol parás, én is bekaptam és szoptam vele, de azért az ciki, hogy hónapok óta így lóg a levegőben ez a layout…

én alapban úgy indítok egy oldal elemzést, hogy a nyitó oldal összképe után a második dolog, amit megnézek az a kontakt form, már az sokat elárul, hogy hol találom meg a rá vezető linket, a form kialakítása, működése pedig sokat nyom az oldal megítélésében, merek belőle következtetéseket levonni az egész oldalra