Cool Site for Web Designers and FEDs (and BEDs?)

Posted in Backend Development, Frontend Development, Design, Javascript, CSS Wizardry, AJAX/DHTML Wizardry by Andrea Zehnder on the November 10th, 2008

webdesignerwall.jpg

CSS Gradient Text

Posted in Frontend Development, Design, CSS Wizardry by Steven Schrab on the May 29th, 2008

Wanna put a gradient over text, but you don’t want to have to save a ton of graphical header files for that site? This technique may help. It involves using a PNG gradient over regular HTML text. It’ll only work on solid colored backgrounds where the “shine” effect is the same color, but not a bad looking technique if you can get away with using it.

Gradient Text

Firefox Disappearing Cursor

Posted in Frontend Development, Troubleshooting, Javascript, CSS Wizardry, AJAX/DHTML Wizardry by Aaron Konkol on the March 26th, 2008

Front-End Developers:

It took me a while to get this going, so I figured I would share it in case anybody else comes across the same issue. On http://mercuryracing.com/techcorners/ when you click on “Join our email list”, in the div overlay that comes up, the blinking cursor bar failed to appear in input text fields in Firefox.

The Firefox bug report is here: https://bugzilla.mozilla.org/show_bug.cgi?id=167801

It is fixed with the code below, thanks to comments #50 and #51 on bug report page:
#emailListPopupContainer {
position: fixed;
position:expression(”absolute”);
overflow-x: visible;
overflow-y: visible;

}

Cool JavaScript/CSS Menu Ideas

Posted in Javascript, CSS Wizardry by Steven Schrab on the February 22nd, 2008

Thirteen different menu examples. Kinda out there ideas, but you never know when you might want something like this. Fun to play with the demos.

13 Awesome Javascript CSS Menus

Epitonic.com - Creative ways to deal with variable screen width

Posted in Design, CSS Wizardry by Jeffrey Schrab on the August 15th, 2007

Try expanding your browser window width on Epitonic to see how they dealt with it.

Hey, what ever “floats” your boat - with CSS that is.

UC Berkeley Dept of Spanish and Portuguese

http://spanish-portuguese.berkeley.edu/

Ok, here’s another interesting site that displays content in new and unique ways… I’m not saying it’s great design mind you (but it IS good)…just interesting when you look at the overall thoughtful blend of technology and design. The designer/programmer manages to break webconventions without losing the intuitiveness of rummaging thru the site and finding necessary information (like the logo is kind of buried in the middle of the ‘visually-cluttered’ header). And it’s chuck full of cool stuff w/o looking or acting too geeky.

There are several things to discover here and I’ll list just a few:

1. many interesting custom illustrations that load randomly as a page refreshes

2. a blog between professors and students based on a customized version of word press

3. simple navigation

4. the layout changes depending on browser window size; small screens automatically view ALL the content in 2 columns, larger screens in 3 or 4.

5. javascript animates the interface (there’s a nice fade in and out of content) and rearranges content whenever “read more” links are activated

6. from what I’ve read, it’s written in XHTML, CSS and Javascript, according to web standards and usabillity guidelines…or as steven says, “it’s clean under the hood”.

7. it’s designed and developed by Miguel Ripoll who, interestingly enough, has studied the History of Art / Musicology and Comp Lit! Check out his site here: http://miguelripoll.com/

Ok, have at it!

Design in Real Time - A Slideshow

Posted in Frontend Development, Design, CSS Wizardry by Jeffrey Schrab on the November 27th, 2006

…or a really big animated GIF. MBoffin.com shows an animated GIF that shows the building of a site. While not being earth shaking, it is a good visual example of what front end developers go through to apply style to content.

Scrollable checklists

Posted in Frontend Development, Usability, CSS Wizardry by Jeffrey Schrab on the August 16th, 2006

In a blog entry, Nicholas Rougeux gives a very slick way of presenting lists of checkboxes via CSS. As a design case for creative or usability work, think this should be considered another tool for the GS Interactive toolbox.

checklist