Script.aculo.us

script.aculo.us provides you with easy-to-use, cross-browser user interface JavaScript libraries to make your web sites and web applications fly.

Combination Effects Demo.

The above is one link to a page of effects. Very useful site.

Search Form experiments with css

Francky - Search Form experiments with css

Results

Tested in FF2, IE6, Opera9 under WinXP:
valid html | valid css | IE-proof 1 hacky | font-scaling / zooming allowed | disabling (background) images allowed | disabling css allowed…

… but some work for accessibility still remaining;
see for instance TheManInBlue

The Extra Column

I have always wondered how to get an extra column into wp. I normally just call the sidebar and footer from index.php as usual and then if I want a three column layout, put the two columns in the sidebar. e.g.

[/div][!-- end of id content--]
[/div][!--end of id wrapper--]
[!--index.php end--]

[!--include sidebar--]
[?php get_sidebar(); ?]
In the sidebar.php I have two divs, one called leftcol and float this left and the second say rightcol and float it right. (It is a little bit more complicated than that but for ease this is how I will leave it).

Now we finish the index.php by telling it to call the footer:
[!--include footer--]
[?php get_footer(); ?]

However, if I add this line after the call to the sidebar:
[!--include extra.php--]
[?php include (TEMPLATEPATH . '/extra.php'); ?]
Then I can add an extra column without resorting to having in sidebar.php.

Why is this important? Well maybe the opening page is a three column layout which upon opening a post goes to a two column structure. Using the above will help that process.

By the way I have changed the <> brackets for [] just so it doesn’t break the site.

Making a Wordpress Theme your own

Does anyone know of any good sites or tutorials on this subject. I don’t want to use a template or anyone else’s theme or CSS style. Any thoughts?

Take a look at:
Urban Giraffe
How to design your own wp theme
Blank wp Theme
Four blank wp themes

And for completeness:
How to write a wp plugin

Nothing about templating in there but if you get that far give me a shout and help then.

Rounded Corners

I know there is a far better list at the css-d site (rounded corners) but I wanted to list some of the techniques I had found. So here goes:
Look at the source code
Nifty Corners: rounded corners without images (Uses CSS and JS).
In this article, we’ll show how customised borders and corners can be applied to fully fluid and flexible layouts with dynamic content, using sound and semantically logical mark-up.
“Bullet-Proof” Rounded Corners
Liquid rounded corners
Liquid corners playgarden

In order to make the actual corners you can try this:
To create rounded graphics in Photoshop first make a square or rectangle with the rectangular marquee tool. Before you fill it with a colour go to select>modify>smooth. Type in a number - usually between 4 and 12 is good. This essentially rounds the corners for you. Next, (or first) click on the colour palette square in the tools. Make a color you like. Fill your rounded marquee element with that colour.
CSS Rounded Box Generator (Beta)

And there we go. Onto less boxy and more rounded designs. So why is my site so boxy at the moment?

Fonts

Font selection for the Web should be based on a generic font family to ensure an appropriate type style is rendered in any circumstances. Specific named fonts can then be declared in order of preference and tailored for specific platforms, but which to choose? This article compares the most common fonts for Windows, Mac and Unix family systems.

Font Sizes

default: 100%(relative) =1em(relative– but causes a resizing bug in IE if used on the body) =16px(absolute– but IE can’t scale pixel font- sizes)

Your first two questions

Who’s your target audience?

And what’s your purpose?

The BBC’s Fifteen Web Principles

  1. Build web products that meet audience needs: anticipate needs not yet fully articulated by audiences, then meet them with products that set new standards. (nicked from Google)
  2. The very best websites do one thing really, really well: do less, but execute perfectly. (again, nicked from Google, with a tip of the hat to Jason Fried)
  3. Do not attempt to do everything yourselves: link to other high-quality sites instead. Your users will thank you. Use other people’s content and tools to enhance your site, and vice versa.
  4. Fall forward, fast: make many small bets, iterate wildly, back successes, kill failures, fast.
  5. Treat the entire web as a creative canvas: don’t restrict your creativity to your own site.
  6. The web is a conversation. Join in: Adopt a relaxed, conversational tone. Admit your mistakes.
  7. Any website is only as good as its worst page: Ensure best practice editorial processes are adopted and adhered to.
  8. Make sure all your content can be linked to, forever.
  9. Remember your granny won’t ever use “Second Life”: She may come online soon, with very different needs from early-adopters.
  10. Maximise routes to content: Develop as many aggregations of content about people, places, topics, channels, networks & time as possible. Optimise your site to rank high in Google.
  11. Consistent design and navigation needn’t mean one-size-fits-all: Users should always know they’re on one of your websites, even if they all look very different. Most importantly of all, they know they won’t ever get lost.
  12. Accessibility is not an optional extra: Sites designed that way from the ground up work better for all users
  13. Let people paste your content on the walls of their virtual homes: Encourage users to take nuggets of content away with them, with links back to your site.
  14. Link to discussions on the web, don’t host them: Only host web-based discussions where there is a clear rationale.
  15. Personalisation should be unobtrusive, elegant and transparent: After all, it’s your users’ data. Best respect it.