While I was coding the Notepad theme, I’ve learned some new CSS3 features and now I would like to share it with you. View the demo to see a Mac-like multi-level dropdown menu that I’ve created using border-radius, box-shadow, and text-shadow. It renders perfect on Firefox, Safari and Chrome. The dropdown also works on non-CSS3 compitable browsers such as IE7+, but the rounded corners and shadow will not be rendered…

I will be hosting a workshop with Refresh Events on advance WordPress theme coding. The event will take place in Toronto, March 25th 2010 at Rich Media Institute, 156 Augusta Ave. This workshop is for designers with CSS skills who want to learn how to convert a HTML template into a WordPress theme (no PHP skills required). You will learn how to advance themes using conditional tags, page templates, custom fields, and more…

Today I would like to talk about blogs that have a unique design for each post. They break the traditional blog layout by designing a different theme for each post based on the topic. Designing a different layout for each topic requires a lot of time and creativity. So, we should appreciate these blogazines who spend their extra time to make your reading more pleasurable. If you would like to join this unique post trend, below are some excellent examples and WordPress tips on how to implement it…

I’m back into the WordPress theme design. Check out my latest release — the Notepad theme. Inspired by the iPhone’s Notes app, Notepad is a modern theme with a subtle touch of the sketchy and texturized background. The theme is widget compatible with threaded & paged comments, social media buttons, and multi-level dropdown menus. It has been tested on WordPress 2.9 with Firefox, Chrome, Safari, and IE7+…

The CSS3 trend is getting more and more popular. In fact CSS3 new features open a lot of new possibilities. Check out my previous post on "CSS3 Animation Demos" to see the things that you can do with it. However, don’t get too excited so soon because it is not fully supported by all browsers yet. But this doesn’t mean you shouldn’t use it at all. So, when should you use CSS3 new features? Well, continue on this post to see some excellent examples…

In case you’ve missed it, I recently released a free vector set of Social Media Icons at IconDock. It includes 50 icons of the most popular social media networks. The icons are available at 32px and 16px in EPS, PNG, and GIF format. Feel free to use it in your blogs or client’s projects. If you like it, don’t forget to spread the love by blogging or tweeting about it…

…

Guest Post by Chuck Longanecker

In January of each year, we flip over the hourglass and, once again, we have everything in front of us. The new year gives us a clean slate, a chance for change and encouragement to evolve the way we do things. In the past, we’ve yielded to client and user requests to pack our website designs full of unrelated features and countless pages of duplicate information…

Exciting contest: InMotion Hosting is giving away 3 Power accounts (one-year) to WDW’s readers. To enter this contest, simply post a comment in this post before Feb 12, 2010. I’ve moved my hosting to them for about 2 weeks and very pleased with their services, particularly their 24/7 tech support. If you are looking for web hosting, check them out. They have a wide range of hosting packages from $5…

As we are stepping in a new decade, I can foresee that web design in 2010 is going to be fun and filled with experimental works. With the new CSS3 and HTML5, designers and developers are trying to utilize the new features to create impressive designs. Sketchy and large background styles are fading out. Serif fonts and texturized background will be popular. Thanks to CSS3, we are going to see a lot of rounded corners, RGBA transparency, and drop shadows…

Hello Adobe lovers, I have some cute giveaways for you. MySuiteStuff is sponsoring three stuffed pillows to Web Designer Wall’s readers. These 12 x 12" stuffed Adobe CS4 icons are hand made with fleece. You can use them as a pillow, cushion, or decoration on your desk. To enter the contest, simply post a comment in this post with your choice of pillow. The contest ends Jan 29, 2010…

After 3 years of using the Pheonix theme on N.Design Studio, I finally redesigned it with a Koi theme. The new look has improved a lot in terms of design and WordPress implementation. Every section has a unique layout which gives you a refreshing feeling.
This post will summarize everything about the new design as well as show you the process images. Also, I will talk about how other sites inspired me…

I just wanted to update you the new coupon code on Design Jobs on the Wall. Enter coupon code "promo" on your first job post to get a 75% discount. Some of the potential employers who have posted on the wall include: Fi, The Brick, CTV, Fanshawe College, Hallmark Channel, Peace Corps, eHarmony, TechSmith Corporation, cPanel Inc., Washington Post Digital, Lime Wire LLC, MTV Networks, and more…

Some characters (e.g. the less than and greater than signs) are reserved for HTML markup. In order to display these characters as text, you must enter the HTML entities in the source code. For example, to display the less than sign (<), you need to enter &lt; (entity name) or < (entity number). Among the entity list, there are quite a lot of symbol entities that we can use in layout design…

As the new year is approaching, I have a Mac app giveaway that can perhaps make your freelance management less stressful. It is an app called Billings that allows you to track working time, invoice clients, manage projects, and keep track of your earnings, etc. Simply enter a comment in this post before Jan 3, 2010 for your chance to win one of the three license keys. If you are would like to buy the app, enter coupon code "webwall" to save 15% (valid until Jan 16, 2010)…

Since 2007, every year I do a round up of best of CSS from Best Web Gallery (check out 07 and 08 collection). Well, it is the time of the year again — Best of CSS Design 2009. This year I’ve selected another 50 nicely designed web sites. Among the list, I notice a lot of them are minimalistic design with beautiful serif fonts. The grungy and sketchy styles are still strong…

If you been following my twitter @nickla, you should probably know that I’ve been busy working on the redesign of N.Design Studio. After two months of designing and coding, I have finally launched the new design. Now it is running on WordPress 2.8 which supports a threaded commenting system. I will write a design process about the new site. For the time being, please check out the site and let me know your thoughts…

I recently spotted an iPhone ad which inspired me to write this tutorial. It is a gift ribbon, consisting of various app icons, wrapped around an iPhone. This effect can be easily achieved with Photoshop Warp transform tool. Christmas is around the corner and I hope you may find this tutorial useful for upcoming projects. If you are not familar with the Warp tool, I sugest you read my Photo Strip tutorial first…

If you are the guy who uses <div> tag for everything, this post is for you. It focuses on how you can write clean HTML code by using semantic markups and minimize the use of <div> tag. Have you ever edited someone’s templates, don’t those messy tags drive you crazy? Not only writing clean templates can benefit yourself, but your team as well. It will save you time when you have to debug and edit (particularly the large projects)…

This post is about 5 useful CSS properties that you should be very familiar with, but will most likely rarely use. I’m not talking about the new fancy CSS3 properties. I’m referring to the old CSS2 properties such as: clip, min-height, white-space, cursor, and display that are widely supported by all browsers. So, don’t miss this post because you might be surprised how useful they are…

Surprisingly enough, based on the findings from my recent survey there are quite a bit of Fireworks users. Personally, I never used Fireworks. Photoshop is alway my first choice for designing—from image editing to designing mock-ups. But, did you know that Fireworks is way better than Photoshop in term of image compression? I’m not a software engineer, I can’t explain why Fireworks can compress better…

To complete with thousands of iPhone apps in the App Store, having a good app icon is not enough. A nicely designed website for the app is very important. A beautiful website helps to drive traffic in and also makes your app stand out from the crowd. This post showcases a gallery of appealing iPhone app sites and common design trends that I see. (more…)

…

The Future of Web Design (FOWD) is returning to New York City on 16th & 17th of November! If you haven’t heard of FOWD, it’s a conference which brings together the web industry’s leading designers and delivers two days of workshops and talks from the likes of Dan Cederholm, Jason Santa Maria, Molly Holzschlag, Joshua Davis, Vimeo and lots more. I have one conference pass to giveaway…

Finally, I’ve joined Twitter (follow me @nickla). At the moment, I don’t really have any tweets yet. The main reason why I’ve started Twitter because I’m redesigning N.Design Studio and I want to be able to post updates and in-progress images for readers. Also, if you have a moment, please let me know what kind of tweets best interest you. (more…)

…

It has been a while since the last time I’ve done any illustration work. Recently I’ve created a new awesome piece that I would like to share with you. It is a koi fish illustration inspired by my tattoo. Read this post to find out more about my tattoo and see how I created the koi fish illustration based on my tattoo. (more…)

…

In the past, we’ve been told not to use serif fonts due to its readability on low resolution monitors and poor rendering in WindowsXP. Now, with display technology advancing and IE7+ supporting ClearType by default, I think it is about time to change that rule. Take a look at the example sites that I’ve collected, you will probably agree with me that serif typeface will be the next web font trend…

Are you tired of your typical columned and boxed layout? It is time to learn how to break out of the box and do something creative. In this post, I’ve collected some of the best examples that are designed out of the box. I’ve also provided some quick CSS tips with demo files on how to break out of the box by creatively using background images and the CSS position property…

This Adobe Illustrator tutorial will show you how to create an abstract art that can be used for wallpaper, website header or background images. It is fun and easy. You will learn how to use the Warp and Twirl tool to create abstract vector art in minutes. Users with basic skills should be able to handle this tutorial. To continue on this tutorial, you need Adobe Illustrator CS or above…

Do you like commerical photography? If you do, this post is for you. I’ve collected 30 awesome Flash-based photography sites. Not only do they have stunning photos, but their Flash design is also amazing. Most of them are designed in full screen mode. So, get your coffee or tea ready and enjoy these beautiful high resolution photos.
(more…)

…

Don’t you find it frustrating to browse Flash sites because you can’t use the browser’s back/forward button or send your friend to a certain section? The solution to this problem would be SWFaddress — a small Javascript library that lets you create virtual URLs for Flash and Ajax. SWFaddress has been around since 2006, and surprisingly not all Flash sites are utilizing this tool…