Tuesday News Round Up

As I was digging through my RSS feeds today I found a bunch of useful information that I thought I would pass on.

Starting off there is a great article on the implementation of sIFR3. It takes you from a discussion on how to implement it to the what if questions regarding the lack of Flash plugins or javascript. The post includes all of the info including links to file downloads to get you going.

Second is an article on choosing colours that match your brand. It provides resouces for finding out which words are associated with certain colour types and a number of links to additional resources for learning to choose colours appropriately.

Third is an article on acceptable cross browser differences. While we strive to have a website look the same in all browsers at time we do need to just accept a difference. This is a list of the differences that the author believes are acceptable. All of the things listed are totatlly acceptable differences in rendering of websites.

Finally is a great article form Blog Design Blog on how to disassemble a free wordpress theme. As the author states, most wordpress articles are written for people to design a new wordpress theme from scratch not how to dig into an existing one and modify it as needed. If you have found a good design and just need to tweak it keep and eye out for this series of articles.

Enjoy the reading.

Changing the default ‘required’ in cformsII to an image

I recently had a client request a red asterisk instead of the default (required) that comes with cformsII the wordpress plugin. As it was actually my first time using cformsII in any fashion I started with a quick search to see if there was a documented work around to make this happen. While I did find a way to change the default text to a * which I could then have applied a colour to I wondered further if I could do it with an image. I realize that an image was not required for my circumstance but since I was digging into the CSS a bit I figured I should find out if this was possible just incase it ever came up in the future.

If you’re going to do this start by copying the CSS from cformsII into the stylesheet for your site. I learned through a few trials that this is way easier especially if you’re using a code editor with a built in FTP client for editing remote files. Once you have picked through the CSS and styled the code how you like it we’re off to the races.

The (required) text is surrounded by a span and class as seen below:

Code Snippet
<span class="reqtxt">(required)</span>

In the stock CSS you will find that there are a few lines of CSS to display the look of the required text. I deleted all of them and combined the styles to simply:

Code Snippet
span.reqtxt, span.emailreqtxt {text-indent:-5000px; display:
inline-block; background: url(http://filepath/asterisk.gif)
 no-repeat; width:15px; height:15px;}

This is partly things I learned from the CSS Sprites technique (text-indent) and partly trial and error. I had actually tried the same code while I was trying to edit CSS from withing cformsII and it didn’t work inside there. I am not sure why but I assume that I made a typing error the first time. You have to set the display value to inline block or the images will collapse and not be seen. Also don’t forget to define the width and height of the images.

I also tried to set the font-size to 0px but found that in IE it rendered small lines that was the text. After I realized that I tried text-indent again and it worked. I did find that a negative text indent number was required as with a positive one the (valid email required) text did not indent.

This method will allow you to display any image in place of the (required) text on the page. If your client decides to add more (required) fields at a later date it will also continue to work with the new fields. The only thing I was unable to get client proof was the legend. I hand coded the legend at the bottom of the form. This means that if my client adds a new form it will not automatically show the legend at the bottom. I feel this is only a minor draw back as the symbol is widely used for the same meaning and the implementation of a legend at the bottom of the form is marginal in time taken.

You can see the technique in use here.If anyone else has better options for implementing an image replacement for the (required) field I would love to hear about it in the comments.

News around the Blogoshpere

I thought today I would bring you up to speed with some of the neat things I found in my feedreader today.

Smashing Magazine is offering 67 free photoshop brushes today. They are free to use for any project but not to distribute.

Over at Niki’s DesignO’Blog there are some very cool tech coasters that you should check out.

If you have been following the NETTUTS tutorials on learning PHP like I have you’ll like to know that the second Learning PHP from Scratch tutorial is now out.

Finally Abduzeedo just put out the sites of the week post. There are a number of beautiful designs here that I have added to my inspiration folder.

Hope that give you enough reading for the weekend. I may not be posting this weekend as my internet connection is down and I have to get that fixed, so have a good one.

5 Blogs Beginning Web Designers Should Read

Boagworld
Boagworld was one of the first blogs I started to follow when getting into web design. Paul Boag and Marcu Lillington host this podcast for all of those people who are working with websites on a daily basis. Most of the blogging content is directly related to the audio podcast they also offer. I personally listen to the podcast and then read any articles that I feel need some more attention. Always a fun time listening to them baner.
A list Apart
While A List Apart doesn’t have as frequent a posting schedule as some other blogs all of the information provided is invaluable. From more theoretical discussions on the effectivness of zebra striping for tables technical topics on CSS Sprites2 there is always something to be gained from reading an article on A List Apart.
CSS-Tricks
Run by Chris Coyier, CSS-Tricks is an awesome resource for all those starting to tackle CSS. I know that CSS can feel overwhelming at times so the tools found here are very helpful for those starting to tackle it. CSS-Tricks contains not only a blog but also forums and screencasts. The forums are a great place to get help with code and the screencasts can even remind veterans of some of the simple shortcuts they forgot. For a great intoduction to WordPress check out the screencasts on Designing for WordPress.
NETTUTS
Another one of the envato family of sites run by Sian and Collis Taed this site bring you great coding tutorials each day. Topics range all over the web language spectrum so while you may not be really interested in the new Ruby developments you can always take a look back through the content and find something to learn or relearn.
i love typography
To many web designers today ignore typography on the web. At the very least it is often an after thought. With some of the new browser developments waiting in the wings though the days of ignoring beautiful typograpy are coming to an end. I Love Typography is a blog entirely about fonts and beautiful typography. An absolute must for those designer who need to beef up their knowledge of typography in general. Without a good knowledge it is much harder to judge what is worth doing for the web.

Freelancers Make yourself Accessible

A number of my readers are freelancers. We are always trying to find ways to get more work in the door with the least amount of effort. Often for freelancers that means using email.

I would often much rather talk to a client via email than over the phone. It’s quick and I can fit it into my schedule when I have the time. Emails don’t have to interrupt you when you are in the middle of some ‘flow’ for a design.

Is email always the best for your clients though? I don’t really think so. I am sure we have all had a long email conversation over a few days that still really didn’t resolve a problem. Did just keeping the conversation to email really save you any time. Better yet did it make your customer happy?

Could that same conversation have been had in 10 or 15 minutes and then been done. Yes it make have taken you more time but would you have been able to finish the project faster therefore get money into your pocket faster. If the answer was yes then why didn’t you just pick up the phone?

I think that freelancers today rely too much on email and online forms of communication that are ineffective for our clients. That’s not to say that there aren’t some good ways to use online communication more effectively.

Right now, really as I write this post, I am using google chat in ‘guest’ mode with another freelancer for some development work. I don’t have this set up he does. I didn’t even know you could do this but is it effective? Hell yes. I am able to send links and respond in near real time to his questions while I do other things. This is way more effective for us than emailing back and forth a number of times. Think there is usually a dely in replying to emails (or we’d never get any work done) but if you blocked out time each day and told clients that you are online for chat if they need anything then you may server your clients better.

Upgrade to CS4?

So many of us have heard that Adobe has announced Sept. 23rd as the product launch date for CS4. I personally have been using DW CS4 since the private beta came out a few months ago and while I love it I still wonder if it is worth the expense of the upgrade to CS4.

Do we really need to spend the cash each time the Creative Suite is updated by Adobe? I’m not totally convinced that we do. Some releases of the software have been amazing (I think CS2 – CS3 was a huge jump) but some are not that great.

Now the suite we buy at work is used by both myself (web guy) and our print designer so the improvements are gauged by the two of us. The reality for me is that there are some cool improvements in DW CS4 but I think that I could be completely happy with Coda 1.5 as a coding tool.  Coda is only $99 USD so it’s a whole lot cheaper than CS4.

Ultimately I think that we have to be intelligent with our funds both for our workplace and as freelancers. I will evaluate all of the Creative Suite and see if the improvements are worth the upgrade cost. What are you going to do?

Moving a WordPress Blog

Over the next few weeks I will be moving this hosted blog to a self hosted site as part of my continued effort to improve my search engine optimization and marketing. I thought that it would be fun to take you along. So….

After doing some research (this is my first wordpress implementation) I decided to download and install a free naked theme…Which really means I went over to Ellliot Jay Stocks site and downloaded the ‘starker’ theme.

Now that I have started off on a clean slate I will be adding some styling over the next few weeks (hopefully sooner). In my research I also noticed that Chris Coyier over at CSS-Tricks did a series of screencasts on designing for wordpress so I will be watching those as I head down this road.

If anyone has any suggestions please feel free to leave a comment.

Cool Web Developments

Surfing through my RSS feeds today I came upon a number of very cool web developments that I thought I would bring to your attention.

IE 8 InPrivate browsing. Pulled from ArsTechnica. Looks like IE 8 may mean that analytics programs we use to track our site traffice will no longer work. One of the features of InPrivate will be blocking of objects embedded in your sites (like google analytics). If a user has this turned on  us web designer may never know for sure that IE 6 is dead or what screen resolutions best suited for a particular clients website. While there are benefits to this technology from a user’s privacy point of view it could be tough for people designing websites.

Our second chunk of news I first saw at Lifehacker but now also appears on ArsTechnica. Ubiquity is a prototype Firefox extension that adds a command line interface to your browser. To send a link to someone now you have to right click and then roll down to ‘send link.’ Ubitquity works something like Quicksilver or Launchy in that invoking it with a key command would allow you to start typing “email this to wife” and suggestions for the action would come up. A neat way to interact quickly with web pages but if your not already a Quicksilver or Launchy user it may be hard to get people on board. I don’t see my wife using this. If you’re interested head to the download and watch the tutorial video.

We’re almost done…. Many of us web professionals are devote followers of the Twitter (at least I am). I sometimes wonder how much information is gleaned about me from my posts. Not from the people that I follow or the ones I don’t block from following me but from the public timeline. I know that I can make my tweets private but that means I have to approve everyone and that is a waste of my time. Enter Status a project from Chris Coyier over at CSS-tricks. While not exactly like twitter there are some similarities. Many companies use twitter for tracking quickly where each other are. While twitter works for this it does expose people to the scrutiny of the wider public. Status is designed around private groups. You can start one or be invited into one. The purpose is to simply list where you are and what you are doing. This really has applications for distributed companies or companies dealing with some remote employees. I personally don’t have a great application for it right now but it has been bookmarked.

Finally how about some advice to budding web designers and developers. Basically it is a round up of advice for those that are starting out in the web industry. A good read for anyone who has been in for a long time or those just starting.

Enjoy the reading.

Today’s News

While reading  through my feeds today I noticed a post from Sitepoint regarding the use of IE 6. While most of us web designer’s wish IE a quick and painful death we always wonder if we really can stop supporting it. Many notable sites have stopped (37signals) but for the rest of us can we really stop supporting IE 6 when we build sites for our clients?

Die IE 6
Die IE 6

I don’t think that we can, I know that I can’t yet. The reality is that many of my user’s still use it. I could take an elitist stance and tell them to move forward with the times but I think web users are too fickle. If you head to a site and it doesn’t work they’ll just move onto another site. Your competitors are only a click away.

I have always thought that I would drop support for IE 6 when Microsoft did. They have made a practice of only supporting the 2 most recent versions of a browser. In theory that means when IE 8 comes out (in a few months) I could drop IE 6. Really though if lots of people are using it still can I stop.

As a freelance designer it can even be a selling feature. “I still support IE 6 which many of your users are using. No extra cost.” At the very least it is an interesting selling feature.

Ultimately until IE 6 drops below about 5% usage on a client’s site I will still support it.

The second bit of news comes from a fellow designers site. Niki Brown was given a free gift for her readers. If you are interested in getting some business cards printed head over to her blog and participate in the competition. I know I will.