Google's unknown artist has huge following

Dennis Hwang has been drawing Google's logos since 2000.


(CNN) -- Dennis Hwang may be the most famous unknown artist in the world -- his work doesn't hang in galleries or museums, but it's been viewed hundreds of millions of times.

The 28-year-old webmaster designs the whimsical logos that decorate Google.com's otherwise Spartan Web site on special occasions.

"It's always a fun kind of challenge to incorporate the logo into the design. Over the years, just because I kind of push myself to use different types of design if I can," Hwang said. (Have a look at Hwangs's Google logosjavascript:CNN_openPopup('/interactive/tech/0607/gallery.google/frameset.exclude.html','770x576','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,width=770,height=576');)

He has been manipulating the six letters in the Google name into shamrocks, fireworks, hearts and goblins since shortly after he got an internship there in 2000. Company founders Larry Page and Sergey Brin found out that he was an art major in college.

"They said 'Hey Dennis, why don't you give this a shot,' and I've been doing it ever since," he said.

Now he's in charge of all Google's webmasters, and designing the logos is only about 20 percent of his job -- but that doesn't mean it's not a lot of work. Hwang said he had to do a string of all-nighters after he had what he called his "brilliant" idea to do individual designs for each of the 32 teams in this year's World Cup soccer tournament.

The logos link to Google search results about the topic, which can drive a lot of traffic to unsuspecting sites.

"Sometimes we unfortunately take some sites down, so we have to cycle through different search queries midday," he said. "But, yeah, it's kind of the fun aspect of it that users can do more research about a topic or find out more about it on their own if they're not as familiar about what we're recognizing."

John Malyon, president of the online art guide Artcyclopedia.com, said his site got a huge surge in traffic in April when Google featured Spanish surrealist painter Joan Miro. He said he got tens of thousands of extra clicks.

"It didn't cause any server problems or anything. It just took me a while to track down what was happening," Malyon said. "You sort of come in, you turn on your server and look at your stats and they're wildly inflated, so you then have to do some detective work."

Malyon said most of the traffic appeared to be "curiosity clicks" -- people who were more interested in the logo than in the artist's work. He said the surge probably didn't help his business much, but he appreciated the interest.

"I'm quite happy, and every webmaster in the world is happy to have as many people as possible see their babies, but it's not the most targeted traffic in the world," he said.

Hwang said users e-mail from all over the world to praise the designs or petition for new ones.

Hwang said they did a logo for the Persian New Year after a huge online campaign and that the National Library Day design was very popular.

"That one was a huge hit among librarians across the whole country," he said. They even sent me library-related cool toys and hats things like that. One was even a librarian action figure with 'shushing action' so that was really funny."

He said he meets a few times a year with a small group of Google staffers to decide which events to cover.

"We talk about interesting holidays that are coming up, or various international holidays or any current events or news events that we think are cool and geeky or 'Google-y' in some sense and then we just sort of give it a go," he said.

Hwang said his favorite was the birthday series honoring Michelangelo, Picasso, Van Gogh and other famous artists.

"Having been a student of art history for a long time those are a little bit more personal," Hwang said. "Of course, trying to mimic the style of a master is always difficult and humbling, so it does take a lot more time to do those, but it's also a lot more fun."

But, like any proud parent, he would not say which one was his favorite.

"If you had me picking just one, I don't think I could. They're just all kind of special in their own little way."

Wi-Fi Signal Status for You and the World!

Here at ThinkGeek we're pretty lazy when it comes to technology. We expect our gadgets to do all the busywork while we focus on the high level important tasks like reading blogs. That's why we hate to have to crack open our laptops just to see if there is any wi-fi internet access about... and keychain wi-fi detectors, we would have to actually remove them from our pockets to look at them. But now thanks to the ingenious ThinkGeek robot monkeys you can display the current wi-fi signal strength to yourself and everyone around you with this stylish Wi-Fi Detector Shirt. The glowing bars on the front of the shirt dynamically change as the surrounding wi-fi signal strength fluctuates. Finally you can get the attention you deserve as others bow to you as their reverential wi-fi god, while geeky chicks swoon at your presence. You can thank us later.

Product Features

* Glowing animated shirt dynamically displays the current wi-fi signal strength.
* Shows signal strength for 802.11b or 802.11g
* Black 100% Cotton T-Shirt
* Animated Decal is Removable (with hook and loop fasteners) for Easy Washing
* Battery Pack is Concealed in a Small Pocket Sewn Inside the Shirt
* Runs for hours off three AAA Batteries (not included)

Washing Instructions

1. Carefully peel animated decal from front of T-Shirt
2. Unplug ribbon connector behind decal and remove decal
3. Unplug battery pack and remove it
4. You can leave the ribbon cable inside the shirt
5. Machine wash gentle cycle on cold
6. Hang to dry
Please Note: If you plug the connector into the battery pack backwards the shirt will not animate properly. It will not damage the shirt. Simply reverse the connector.

New keyboard is silent, hooks into two different PCs

Do you ever get tired of hearing the sound of yourself typing? Honestly, it’s never really bothered me, but I’m sure that if you work near other people, they might get annoyed with it after some time. Next time you go shopping for a new keyboard, you might look for one that’s a bit quieter than the rest. Take this one from Thanko which is not only silent, but works on two PCs.

While it’s pretty obvious what it means for a keyboard to be silent, I don’t often hear of one that boasts the ability to work on two computers at the same time. I guess that it’s really not the same time, but a flip of a switch just above your arrow keys will allow you to operate on a second computer.

While this does seem like a fairly useful product, even at $51, I can’t help but wonder what you’ll do about a second mouse. I figure if you’re going to have a multiple computer setup there are really two ways to go about it. Either use a KVM switch, or a software solution like Synergy.

Source: Crave

Creating Tableless Sites - Why and Some Basics - By Nicole Hernandez

In a time of web developers who just like to say that 'Tables are Evil' and can't (or won't) explain why, this article will attempt to give you some solid reasons that people create tableless designs.

Included are six major benefits of creating tableless sites, and how to sell your desire to alter your website to a resistant manager.

Let's begin with the benefits of a tableless layout. These are only in the order that I feel they should go in, some things are more important to other people, so rank them as you will.

Forces You To Write Well-Formed Code

You cannot have a properly made tableless layout, and use improper and non-standard code. Well, let me correct that - you can (technically you can do it) but it defeats the whole purpose. When you are creating a tableless design, you should be using standards compliant code. I think that anything that makes you get into the habit of always writing clean code is a good thing.

Faster Loading Time

This is absolutely a benfit of a tableless layout, and for several reasons. First, on a fundamental level - tables load slowly. For the most part, unless you set the height and width of your table elements, all the text has to be loaded and rendered BEFORE the table sizes itself to the page. Of course, this is what so many people loved about tables isn't it? The fact that they were so easily sizeable. The downside is how much more time they take to load.

Okay, so the solution to that loading time is to set all the values explicitly, right? So now we see another downside. Code clutter that increases loading time. First of all, just by themselves, tables take alot of code. How many td open and close tags does your average table based layout have? Tons. Having to set all the values explicitly only adds to the page size and loading time. There are many experiments that have been done on this topic, I'll point you toward this one that StopDesign did on a remake of the Microsoft website from a tablebased site to a tableless layout. That remake showed a 62% file size reduction of the site, and using their average hits per month for the Microsoft site, calculated that Microsoft would be saving 924 GIGS in bandwidth per day, and 329 Terabytes of bandwidth per year. For any company that pays for bandwidth, these things are important.

Easier to Read Code

If you are using standard code, semantic document conventions, and a tableless layout, your code can be so clean that it looks practically like just regular text with a few extra symbols.

That is a great benefit because it not only makes it easier for you to update, but it makes it easier for a non-technical user to make small alterations to. Additionally, if you work as a web developer in a more freelance capacity, it is common for there to be a full-time web developer who has to maintain that site. Clean and simple to read code makes that a easy transition. We like it when people leave us easy to understand code, right? Let's return the favor.

Print Alternate Views

When you create a page using a table-layout, you are rather unfortunately locked into a certain layout. Developers who have created table-based websites, as most of us have at some point - particularly if you were in the the industry before the big tableless movement, know that you often have to create a separate printable version of your pages. This can be, needless to say, quite tiresome.

Ease of printing style control is a huge benefit with a tableless layout. You can easily create a single new printing style that applies to all your pages, instead of making them individually. That alone is a huge time saver, but there is more.

While you can control all elements with this approach, the biggest key is organization of information within the page itself. Using the example, let's assume that the display order we want all our pages to print using the following order: The page header first, the content next, the special news after that, then the link list, and then the footer. However! We still want it to display as it would normally when viewing (meaning the header at the top, the links on the left, content in the middle, news on the right, and footer at the bottom). With a table-based layout, you would have to create a new page to do that special printing organization because the print style will read your columns left to right. With a table-less layout, you are not bound by this. You can order the content in your page however you like, and still control the way it looks... all by using the CSS only!

Additionally, because we can put the content in whatever order we want in the HTML, and then move the content blocks around for website viewing using CSS - we can have ultimate control over presentation.

That is very important because the clean code, and ability to alter presentation, means that your site can be viewable by someone on a small mobile phone screen, a PDA, in all text format can be perfect for someone using a text-to-speech reader, or a braille device, and since the code is clean, it is both backward compatible (with older browsers seeing mostly just the text) and forward compatible with new technologies to come. The flexibilty and organization leads to being able to create a powerful website that takes advantage of some of the possibilities with XHTML, and adding in support in your pages for microformats, or taking advantage of using RSS / ATOM feeds from your site to develop a base of regular readers.

Search Engine Optimization

Due to the fact that you can organize your most important content at the top of your page, without affecting the layout, your page can be better optimized for search engines. For instance, say that I have a navigation bar on the left side of the page that lists tons of parts of the site that are actually great keywords. I could move that navigation bar code higher up in my actual HTML, without changing the layout, because I'm using the CSS to position the navigation where I want it.

Those search engines can also more clearly find common words throughout your document without having to filter through code. Search engines prioritize websites that have a higher content to code ratio, so putting all your style elements into your external CSS stylesheet makes your site highly content based to a search engine. Tableless layouts, as previously mentioned, decrease page size and loading time - another bonus to search engines.

Additionally, being able to take advantage of the RSS/ATOM feeds (see the section directly above) will aid you in some new technology for site indexing as used by all search engines called ROR. (ROR is an XML format summary of your website, like a sitemap, that search engines can access for additional information about your website.


Presentation Flexibility


Making changes to a CSS based Tableless layout is simple. You can alter the CSS file only, changing as many styles and graphics as you want. The affects cascade through all the pages on your website, and eliminate the need for manually updating many pages.

For one of the best known examples of how powerful presentation can be, you can visit the CSS Zen Garden and navigate through the 'Select a Design' links to see the differences. Each of the different designs uses exactly the same HTML file content. The only thing that changes is the CSS file for each one.

Selling Yourself On Standards

Sometimes knowing how to code for standards, and create flexible tableless layouts is not enough. There are some web designers who meet with difficulties from their management. Most often those difficulties are rooted in the management being unaware of the benefits of using tableless content and CSS driven layout.

If you want to design for standards, but you work for a company that is not very forward-thinking in allowing you the time to work on the changes -- try this: Make them think about their pocket-book. Point out the cost saving benefits.

For instance, try grabbing a single page of existing code. Clean it up to standards. Compare the page size to before (including image optimization), and count the difference in bytes saved. Multiply that across the number of site pages, and the number of days per month. Then explain to them the amount of bandwidth cost saved monthly if this was done across the whole site. If that isn't enough, show them how quickly you can make changes to a website once it is CSS driven, and push the idea that you will be able to change the site more rapidly when there are needed updates, and you will have more time to focus on adding in new functionality to the site - instead of spending your time doing maintenance.

Summary

Hopefully, this little article will serve as a way to get you started on understanding why to use a tableless layout, what the benefits are, and you can easily take a look at Layout Gala and download just 1, or all 40 of the tableless layout examples to get you started. However, the best step toward moving to a tableless design is to slowly move your website toward a standard compliant version first, before you get rid of the tables. To get to that point, study as much on CSS as you can, read through the articles here and elsewhere on the web, and moving from table layouts to tableless will be just a matter of time.

Nicole Hernandez is a web developer with a specialty in web standards and accessibility. She is the owner of Website Style and publishes technical articles on her blog called Beyond Caffeine.

CSS - 13 Online Generators

Just check out some large web 2.0 application directories at bottom, you may find that either small or portal sites are more willing to be web 2.0 style. It seems that web 2.0 is popular and successful at this moment and have become a trend on the web. Here is the list of online generator particularly for web 2.0 design.

CSS JUICE

Web 2.0 Badges - a set of free and very cool web badges.

Mycoolbutton - simple web 2.0 buttons maker.

Stripe Generator - the professional and popular web 2.0 stripe generator.

Ajax loading - web 2.0 loading gif generator.

Webscriptlab - Ajax loading gif generators.

AND MORE

My Works - Best View 1280x800

Flash Timer - Actionscript 2.0

The below code is for inserting Timer in Flash. Easy to implement
total = 1;
this.onEnterFrame = function() {
minutes = Math.floor(total/60);
seconds = total%60;
theText.backgroundColor = 0x000000;
theText.background = true;
theText.text = "0"+minutes+":"+seconds;
if (seconds<=9) {
theText.text = "0"+minutes+":"+"0"+seconds;
}
//trace("Duration="+thisSound.position);

};
counter = function () {
if (sButtonText == "PAUSE")
{
total++;
if (minutes == 2 & seconds == 24) /* Adjust the Timer /*{
clearInterval(setIt);
}
}
/*if (sButtonText == "STOP" && fin==0)
{
total++;
fin = 1;
}*/

};
setIt = setInterval(this, "counter", 1000);