Those pages look terrific. I like your design aesthetic. 
 Kevin 


________________________________
From: Amedeo Mantica <[email protected]>
To: WebObjects Development <[email protected]>
Sent: Fri, May 20, 2011 1:14:00 AM
Subject: Re: What do you use for building the web interface?


Hello Kevin,

In early days I used GoLive ( when there was still table based design )
After switching to DIVs ( I dropped tables in 2005 ), at startup was painful, 
 but as everything, doing exercise, in the years, now I'm a nice HTML+CSS coder.

The tools I use are Eclipse for HTML / JS and CSSEdit for CSS, but I use mostly 
CSSEdit for autocompletition. I'm fater to type CSS lines than searching in the 
palette.

A few tips / rules / statement:

With table based design CSS was used mostly to format text, so you had a very 
few CSS files for a project, now You will have one CSS file per page.

My suggested implementation:

0) nothing in HTML should define layout, you will code better WO/JAVA having 
HTML page as clean as possible.

1) a PageWrapper (WOCompoment) that his linked to:

main.css ( define here all css regarding master layout ( page size, main menu, 
top, bottom )
global.css ( define here everything regarding text format and link colors )
tools.css ( I usethis on my framework to call button shapes )
ie6.css ( using ERXIEConditionalComment ) for any fix you need to IE6 ( 
personally I no longer support IE6 )
fonts.css ( for loading webfonts )
print.css ( for printing layout )
"every"NavigationMenu.css: graphical menus requires a simple but long CSS, i 
prefer to have in separate file.

2) for every Page (WOCompoment) you will have your CSS file/s defining the page 
layout, you will call it with an ERXStyleSheet or calling ERXResponseRewriter 
in 
the appentToResponse.

myComponentName.css
myComponentName-print.css

these could be empty eventually for some pages, but consider having it.

3) in you intend to have inline css: <div style="margin-top: 10px">test</div>, 
consider that will be rendered in printing layout too. I generally use Inline 
css only for display:none/block. Do not use display:none/block in css file if 
you need to hide/show with a JS effect, like scriptaculous, use inline instead.

4) DIVs by default have static positioning, with is very similar to relative 
position, but there is one thing: "Any div with absolute position will have 
origin to the first relative positioning parent". This is very important.

5) to have a text vertivally center aligned in a div put line-height of text as 
div height

6) Floating blocks ( these are painful ), as tip, If you have a parent div with 
floating blocks inside, and the parent needs to have a backgound (image or 
color), also the parent must be floating, otherwise will not render background.

7) BE PATIENT, learning CSS requires tme.


TOOLS:

Safari Webkit WebInspector
Safari, preferences, advanced -> Show Develop in menu bar.

then right click on a page element and look at "inspect element"
Is amazing what u can do with inspector, you can also do basic editing for 
preview

Take a look at:

http://www.confindustria.chieti.it
http://www.apell.it

These are my latest websites, from the Develop menu in safari choose "Disable 
styles", and you will see thet the page html have no layout inside.'
With the inspector go in the resources tab and see all css files
Steal CSS as you want :-)

try also to do in Develop menu: User Agent -> IE6, you will see a funny page :-)

RESOURCES:

http://www.w3schools.com/

Best regards
Amedeo



On 06/mag/2011, at 23.40, Kevin Spake wrote:

What do you use to build the web interface for your WO apps? Eclipse? 
DreamWeaver?  Is there any sort of agreed upon 'best practices' regarding 
building complex UIs?
>
>Kevin  
_______________________________________________
>Do not post admin requests to the list. They will be ignored.
>Webobjects-dev mailing list      ([email protected])
>Help/Unsubscribe/Update your Subscription:
>http://lists.apple.com/mailman/options/webobjects-dev/amedeomailing%40insigno.it

>
>This email sent to [email protected]
>

---------------------------------Amedeo Mantica

WOWODC 2011 : July 1-2-3, Montreal. wowodc.com 
 _______________________________________________
Do not post admin requests to the list. They will be ignored.
Webobjects-dev mailing list      ([email protected])
Help/Unsubscribe/Update your Subscription:
http://lists.apple.com/mailman/options/webobjects-dev/archive%40mail-archive.com

This email sent to [email protected]

Reply via email to