patterns in the process
clearleft sophie andy cennydd james richard paul natalie jeremy
discovery content information architecture visual design templates
discovery @sophystar @andybudd
discovery
content @rellyab
ia @clagnut @cennydd @boxman
elfcartel.clearleft.com logged in A friend Notes Search Go ElfCartel super best friends web Home People Groups Dashboard · Settings · Bob Bobertson Log out Amidactio's profile Add to friends Me in a nutshell Friends Olenit iuscing consequis facinci dolut, ros irilla psustrud. Stincil Screen name lacus inciduipit mollis magniamet, dolortisl consenisim aliquisi friend status diamet ver illa quipsum illaor illam. Put veros dunt curae gait, Adactio veriusto accum patin. Conullandiam blamet pede, issectem super best friend dionsenit illam ridiculus acipisl lute, suscipit doloboreet b0xman coreraestrud. good friend Tellus tat lacinia, commodipis nulput veliquat volor venit enim, Clagnut fermentum eugiat nummy. Accumsandre si sustrud, tisi vulluptatum mere acquaintance ullaor eu, praesed euisl acilit sequat. Aliquip aute nostrud, lobor Oriental prince in a land dolor nim vulputat, non curae bla etuerostrud. Nonsenibh endreet of soup veros alisi dipiscipit, niscidu dolent sagittis. Aliquis nonulla acipsus. never met More about me Groups
code.new-bamboo.co.uk/polypage
user testing silverbackapp.com
visuals @nicepaul @jvbates
templates @adactio @natbat
decisions HTML XHTML liquid fixed IE6
<!--[if lt IE 7]> <link rel="stylesheet" href="/styles/ie.css" type="text/css" media="screen" /> <![endif]-->
dean edwards <!--[if lt IE 7]> <script src="http://ie7-js.googlecode.com/svn/version/ 2.0(beta3)/IE7.js" type="text/javascript"></script> <![endif]-->
[ ] a t ie6 p = 50 log ––––– + 1 t a ie6
HTML CSS JavaScript
HTML forms tables microformats
list of contacts <li> <a href=".."> <img src="avatar.gif" alt="" /> username </a> </li>
hCard <li class="vcard"> <a href=".." class="fn nickname url"> <img src="avatar.gif" alt="" class="photo" /> username </a> </li>
XFN <li class="vcard"> <a href=".." class="fn nickname url" rel="contact"> <img src="avatar.gif" alt="" class="photo" /> username </a> </li>
reset elements CSS classes IDs page-specific
site <body> <div id="main-content"> ... </div> #maincontent { width: 60%; }
site-section <body id="discussion"> <div id="main-content"> ... </div> #discussion #maincontent { width: 40%; }
site-section-page <body id="discussion" class="edit" > <div id="main-content"> ... </div> #discussion.edit #maincontent { width: 100%; } #discussion.index #maincontent { width: 80%; }
tips body { min-width: 760px; max-width: 96em; } input[type="radio"], input[type="checkbox"]{ width: 1em; height: 1em; } a:hover, a:focus { text-decoration: underline }
progressive disclosure form enhancements JavaScript
progressive disclosure
<a href="#login" class="toggle">log in </a> ... <div id="login"> ... </div> jQuery('a.toggle').click(function() { var id = jQuery(this).attr('href'); jQuery(id).slideToggle('fast'); });
form enhancements
<select name="sub-category"> <optgroup label="Community Discussion"> <option>Activities</option> <option>Auto</option> ... </optgroup> <optgroup label="Personals"> <option>Women seeking men</option> <option>Men seeking women</option> ... </optgroup> </select>
pattern storage svn sandbox wiki
discovery content information architecture visual design templates build
discovery content information architecture visual design templates build
@henry @funella theplant theplant @spikey theplant
Recommend
More recommend
![Design Patterns in Eiffel Dr. Till Bay design patterns? [Design Patterns] are](https://c.sambuz.com/1019917/design-patterns-in-eiffel-s.jpg)
