In case you haven’t seen the new Yahoo Mail, check it out here. Although much better than the previous versions of Yahoo Mail, this version seems to ride very much off a copy of GMails design. Particularly in the layout of key elements of the page. They have kept the tabs though, which is one particularity of the site that I do detest, simply because it makes it more difficult to track where you are.
Pure CSS buttons that actually look good – is it a myth? These days, I don’t believe they are. Sometimes I’m too lazy to get onto photoshop and play around with designs until I work something good out, or I don’t feel that it’s worth it to hire a professional designer. If there’s one thing I do know though, it’s how to code a design in css. Here are some buttons that I designed purely in CSS, and I’ll give you the CSS for these buttons completely free 
.
Table style – it’s a difficult thing to do right sometimes without a plugin, or either by spending a lot of time playing with css styles and refreshing the browser to see your new changes. You know I’m telling the truth What we really need, I realized after searching many times for good looking table css examples, is a site that gives us some css examples and alternative stylesheets to help us design good-looking tables. I’ve compiled a few here that I’ve spent my own time designing, and I hope that people can use these to build upon and to design really nice tables. Maybe someone will take these and build a little design site that has css examples for things like tables, forms, headers, etc. There really is a need for this kind of thing…at least my need!
This is for tables that hold data, which is really the purpose of tables, so it includes table headers, etc. Let’s start with something basic that we can build upon.
Continue reading
I have taken 18 amazingly beautiful interior designs, and I have analyzed each of them for their specific color schemes. Observe these magnificent below, and allow them to inspire you towards creative and unique web designs.
Continue reading
I thought I’d share some beautiful designs that I’ve found, and list them by the design teams that created them. Enjoy, and don’t forget to share.
Cufon is a well-known technology for designers who wish to replace the font of their websites with more image-like text, or else use a font that doesn’t exist on regular browsers. This is achieved through javascript techniques. I wanted to know the latest opinions about Cufon, and so I went to some experts and well-known figures in the web design community to hear their views. I thought that I would share a few with you here at PyThoughts.
Joshua Johnson from Design Shack says:
I think Cufon was at one time an important development but the limitations are simply too restricting to ignore at this point. Cufon requires JavaScript and doesn’t support text selection. Meanwhile, @font-face font replacement is easily accomplished using only CSS and creates perfectly selectable text. @font-face is simply a better method and I haven’t seen a single convincing argument yet for using Cufon instead. Even the Cufon website, while endorsing Typekit, says that selectable text through @font-face is “the easiest way to embrace standards.”
Josh is a freelance graphic designer and avid Mac evangelist. He lives in Phoenix, AZ where he recently graduated from Arizona State University with a degree in global business/marketing. You can follow him on Twitter here.
Adam McCombs from McCombs Creative says:
Even though cufon is relatively new I think it’s an antiquated technique. Personally I don’t care for how it treats the markup, wrapping each transformed word inside a div with double markup. Cufon also makes it impossible to select or copy and paste text. I think a much better solution is to use @font-face or a font delivery service like Typekit (http://typekit.com/). While fonts display differently in most browsers, @font-face doesn’t do any evil things to your markup. If you want to get really fancy, Letting.js (http://letteringjs.com/) allows you down to the letter control.
Adam runs the design firm Mc Combs creative, and is co-author of the book The Definitive Guide to Magento. You can connect with Adam on Twitter here.
Erik Ford from We Are Pixel8 says:
Prior to the modern browsers’ support of @font-face, Cufon and its predecessor, sIFR, were viable, if not somewhat clunky, options for rich web typography. But, because of its dependence on javascripting and the lack of selectable text support, we have chosen to leave this particular tool in the tool box. We love the fact that @font-face is a CSS declaration and does not require obtrusive javascript trickery. And though there aren’t as many typefaces available for the @font-face declaration right now, I doubt this will be the case by the end of 2011. We are starting to see providers, such as MyFonts, Font Bureau, Font Shop and Font Spring , offer licenses for web versions of fonts in their respective libraries. From a designer’s point of view, this is liberating. But, most importantly, from a developer’s point of view, this allows to continue to write code with today’s best practices and standards in mind.
Erik is the lead designer and developer at We Are Pixel8. Besides being a transplanted Native New Yorker and all around design addict, he is also a proud father, an ex-music biz exec and rabid NY “Football” Giants fan.
So, as we can see, Cufon doesn’t have such a good standing with professional web designers today – however, still many of the designs we see today are implementing this technology. There may be more views on the topic, so please share your thoughts and reactions in the comments.
If you still insist on using Cufon after this, Pythoughts offers some free Cufon fonts for download.
Here is a list of free header images for you to download and use on your blog or website. If you like any of these, just click on the image and it should expand to its full size (they are all .jpg), and you can download them and use them for your own designs. Simply add the image to your website using the css tags, like this:
body{
background-image: url ('insert the url of your image here');
}