A List Apart: Articles: CSS Positioning 101
This is a nice primer on positioning. It really is 101, but it’s always good to have a refresher every once in awhile.
CSS3 for Web Designers
One of my favorite designers and writers released a new book yesterday through A Book Apart. I don’t own it yet, but it is definitely on my list.
HOW TO: Successfully Launch a Web Design Startup with Social Media and No Budget
I have been following OBOX and those guys for quite awhile. They are not unlike you and I, yet they have built a successful business. This article talks through a few tips for marketing yourself and your project.
The big takeaways I got from this article is that first to generate a following, you must blog everyday. Build hype in your products or projects by just showing enough to create interest. Another element is to be active on Twitter, Facebook and interact with people through blog comments on other sites. Anyway, a nice read, take a look.
Failure by Design
Failure can not only be a learning process, but will create unexpected and unplanned results. These results can end up solving a problem you didn’t know you had. Nicely written article, don’t miss this one.
Recently, I have started experimenting with CSS gradients. It is flexible, fast, requires fewer server requests, and on and on. The bad is that it’s not supported by everyone yet, think of it as progressive enhancement, so it’s not really that bad.
The problem I had when trying to use CSS gradients is that the syntax is confusing and the examples on webkit.org were not clear and were fairly complicated. What I wanted was a simple starting point to, well, start from.
I’ll post the example then I’ll explain it in more detail so you know what’s what.
.item {
background-image: -webkit-gradient(
linear,
left top,
left bottom,
color-stop(0, #ccc),
color-stop(1, #333)
);
}
So first we define the gradient using -webkit-gradient().
The second line defines whether the gradient is linear or radial.
The third line defines where the gradient starts, the forth where it stops, you can use left, right, top, bottom, percentages etc (any way you would position a background image. The above example is a vertical gradient, lighter on the top and darker on the bottom. If you want a left to right gradient you would change it to:
... left top, right top, ...
Color-stop defines the colors and the position of the colors, the first being the starting position and color, the second being the ending position and color. Note that the position can be percentages or a number 0-1, 0 being the starting point, and 1 being the ending point. In the above example we have a starting position defined as 0 and the ending position defined as 1, but we could make them .5 which would be the center. Note: You can define as many color-stops as you want, each with a different color but I wanted this example to be as simple as possible.
The below is an example of what the gradient would look like in a webkit browser (Safari or Chrome):

So, Firefox 3.6 will support, -moz-linear-gradient and -moz-radial-gradient which works just like the -webkit versions except you do not have to define the “linear” or “radial” in the CSS (since you do this with the name). Firefox 3.6 is still in development but you can download and check out other changes here.
Tough luck, it won’t work. Luckily, gradients are not necessary to a good browsing experience (as good of browsing experience you can get in IE). This folks is what’s known as progressive enhancement. Enhance modern browsers while still providing decent, usable sites for those using outdated browsers.
Earlier this week LWT launched a new site for Webb & Eley, a multi-disciplinary law firm.
The logo was designed by Karla Merritt, self-proclaimed “creative evangelist,” photography by Chris Reding and the design and development of the site was handled by Ben Shoults, that’s me folks. Of course that was just the creative side of it, Mary Catherine Phillips is the Account Executive for Webb & Eley, she really helped the project move along at a steady pace.
Check out the site for yourself : www.webbeley.com
So, I’ve been pretty busy. I have been working on several side projects and freelance things the last week or few. I thought I would stop long enough to give an update, show off a teaser of some of my work and to celebrate.
First, let’s celebrate: My 960.gs Photoshop actions have been downloaded 100 times as of today. As someone who’s never offered up anything like this before, this excites me a good deal more than it should.
Second, I am still working on a set of Browser User Interface actions, but this process is more complex since I am having to use a script to install the image files, relink to them and load the action into Photoshop.
Thirdly, Here is a small sample of what I have been working on in my spare time. Let me know what you think.
This a quick post to showcase some sites that I ran across in the last few days that I though were worth mentioning.
A post from Mark Pilgrim showing readers that it’s time to start using HTML5 form features now, they degrade nicely but allow modern browsers to rock the cat box.
A Form of Madness
A great post on creating some awesome user interface elements. Focuses on design down to the pixel level.
Crafting Subtle & Realistic User Interfaces
So nothing is actually launching, I think it’s more of a creep. Anyway, here it is, the site design. There are no features to speak of. It will be fleshed out soon, but I just wanted to get someone else’s theme off here. I am using Typekit for the headline font, which is Chunk.
Read more…
So I have finally begun my design for this site. It will not just be a blog but a place to call home to all of my various web activities (all of them legal).
Though, I did not attend An Event Apart Boston this year, I was lucky enough to find Andy Clarke’s “Walls Come Tumbling Down” presentation and was able to enjoy the presentation from the comfort of my computer. Read more…
Some people would probably tell you to only create goals that you will be able to reach. However, I think everyone should set goals that seem impossible, so blown out of proportion that you question your sanity. That is what I have done. I have set myself a goal to be reached in 365 days. To have a standard set of expectations for myself won’t push me. I need the fear of failure to drive myself. Read more…
Ok, so you are a designer (or not, how am I supposed to know?), or I will assume you are for the sake of this post. You went to school for design, you live design, love design, everything in your life revolves around or is somehow tied to design. Bottom line is that you care about design. Read more…