Jun 03
A new icon for Markup Validator S.A.C.?
2009 at 06.33 pm posted by Veerle Pieters
Not sure about you other Mac users, but I only allow slick looking application icons in my Dock. Of course once the application launches it sits there. Call me fanatic, but every time I launch Markup Validator S.A.C. it itches to turn on hiding for the time I need it and then turn hiding off once the application is closed again…
The current icon
I hear you thinking 'this is over the top'. OK, I guess, but I'm just picky and easily annoyed by things like that. Then again I am a graphic designer after all, who also does icon and GUI design work. As a graphic designer you just notice these things.
Maybe a lot of you don't know the application. On the left you see the current icon. It's very flat and not something to get excited about. The application is great. It is a stand-alone version of the W3C Markup Validator and because it is a stand-alone (Mac) application you can use it on local files, even via drag and drop if you want. In other words, an indispensable tool in the armory of every professional web designer (using a Mac).
How it could look
I guess it's easy to say 'hey that's an ugly icon' and not come up with an alternative, right? If people say nothing more than 'I don't like it', I always have this reaction of saying 'well, what are your suggestions?'. I think it's good to give critique but always try to keep it valuable otherwise it's better to say nothing at all in my opinion. Anyhow, this is a subject that has been discussed already here. Not that I don't know what to do these days, but I was in an unstoppable mood and just couldn't help myself. So I came up with a few icon designs myself that I wanted to share them with you today.
![]()
Version 1
![]()
Version 2
![]()
Version 3
![]()
Version 4
![]()
Donation to the community
They might not be the best looking icons around, but I believe one of them might be worthwhile to replace the current icon. So I'm donating the icon to the community. In case you like one of them you can download the icon set for Mac (it's a Mac-only application).
UPDATE: Download the 512 X 512 px transparent PNG files.
Applying the icon
In case you wouldn't know how to apply a new icon: hold down the Control key or 2nd mouse button on the application icon, choose Show Package Contents, choose Contents, then choose Resources. Replace the Validator-SAC.icns with the new one.
Need a place to store your files?
My big files are stored at Xtreak, high speed delivery at the lowest prices.
48served
1
Didnt know about the app - nice tweet (and icon) thanks alot.
2
I totally agree with you that the Markup Validator S.A.C icon looks ugly. I’m sure it wasn’t done by a graphic designer.
I like version 2 of your icons because it doesn’t have too much glow. Version 1 will look better by removing some of the glow. Version 4 has a nice idea but because it’ll be used in a small size, some details like the web page going inside the slot will not be recognized.
Thanks for sharing.
3
Hey Veerle!
Great stuff! I’m particularly fond of version 2… Beautiful angle to capture :)
4
Love cubes! (especially the custom CS 4 cube icons) - Thanks for your work.
5
I do that very thing all the time… can’t have a boring icon messing up your dock mojo :)
6
Thank you Veerle… You never cease to amaze. Thanks for all your great contributions!
7
I thought the same about the glow, but once the app is running, it looks quite nice. So it’s the 1st one that I’m going to use finally.
Thanks a lot, Veerle!
8
I know it’s easy to say, but.. your version is even uglier than the original. Sorry for being so honest, I usually like most stuff you put online, but the excessively shiny golden theme is just tacky. The coins are specially ugly. The first cube is the least ugly, but lacks symbolism. And despite being also a mac user, I find the last cube too mac-centric.
Hope you don’t get offended by the criticism. I do value your attempt to create something for the community. I just think that you can do so much better :)
9
Wow! That’s slick W3C icon design, indeed! :-)
I like it very much! Congrats! There’s always something to be learned from you! ;)
10
I solve the problem of ugly icons by setting my preferences to hide my dock entirely. :)
In any case, that was a sad little icon. Although to be fair to the person who made it, they probably thought it was nice (all art is subjectional, after all).
Of the icons you created, I think I like the third one the best with the cube. The coin-like ones feel off-balance to me with the “HTML” text sitting so low on it. The first one, when viewed at smaller sizes, is doing that “kiss” thing that I try to avoid (where the edges of the H and the L look like they’re barely touching the stroked outline of the circle.)
Thanks, as always, for sharing your work! I’m a big fan. :)
11
very clean and slick, nice work!
12
Thanks Veerle - wasn’t aware of the desktop version!
13
Great stuff..
I like the last one mostly.
I do not know if the fading is correct / realistic, but I love the idea!
14
You had some harsh comments here. These icons can always be improved. I’m sure you didn’t spend a long time to make them.
Cheers!
15
Personally preferred version 4. Also didn’t know about the app, so I’ll try it out. Thanks for the great tips!
16
Why don’t you use HTML Tidy plugin for Firefox.
On the Mozilla addons site it says that it’s not available on Mac, but there’s a Mac version on the source site: http://users.skynet.be/mgueury/mozilla/
It is super useful for me, next to Firebug…
17
Does anyone know if there is a similar app for Windows? Thanks!
18
This is great of you to share with us, thank you!
I will use them :D
19
One thing you shouldn’t ever have to do is justify designer obsessive-compulsiveness. I think you’d be hard-pressed to find a good designer without a few custom icons in their Dock.
Also, I didn’t know about the app at all, thanks for the heads-up!
20
All of them look amazing. The last one is my favourite! Great work Veerle!
21
Oh pfft, the icons are so much better than anything I could dream of making! My favorite one has got to be the fourth one; anyway you could tell me how you made the rounded 3D box effect?
22
Great work. Not only is the original ugly, it doesn’t adhere to Apple’s Human Interface Design guidelines.
23
I really like the last one :)
24
Nice work.
Two things though:
1. The text on the coin looks like it’s unintentionally been scaled in a way that it now looks like it’s written in italics. You might want to adjust that.
2. Add a inner blue border to one of the sides (like it has been done to the top) to convey depth to text in the objects that are placed in perspective.
25
Even as ugly as it is, this is some great information. Thanks
26
Hmm…Not a huge fan but it’s not horrible by any measure. It’s just a little too much web 2.0. Time ot move past cuteness I think.
Design is communication not decoration. This seems too decorated.
No offense, I really like your work!
27
Icons are nice, but I don’t really understand why to use this application at all, when it’s just using the W3C Markup Validation web site. Why not just open the web instead?
28
@ those who like it: Thanks :)
@ those who don’t: You are missing some perspective here: first it is free so don’t expect it to resemble paid work and secondly I’ve created this in a minimum amount of time as paid work has of course priority. This is why I mentioned “They might not be the best looking icons around” ;)
Gyorgy said:
Because this app works offline as well and will keep on working even if the W3C isn’t online anymore. I have Tidy on Firefox but I prefer Safari as my main browser with Tidy.
Gustavs said:
See the answer to that above.
29
I applaud the effort to drag their design into our decade. My vote is for the second version, it’s very clean!
30
Could I humbly ask you to release the same icons, just in PNG format, with alpha transparency added? :-) Thus, they could be much more versatile… and I really like their design, very much! :)))
Thanks in advance!
31
Very nice icons, of course they’re not perfect as you said, but they’re thousands times better than the original one… xD
You should definitely email this app developers so they could use yours officially. I like the app, but it’s so… not mac-like ^^
XOXO
32
Nice post!Great stuff you have i like all the versions.The icons are so much better than anything I could dream of making!
Thanks,for sharing your work!
I’m a big fan.
33
Nice work Veerle.
I have noted that icon designers don’t just shrink their icons for the smaller sizes, as you did here, but they design simpler icons with less detail as the size goes down, and 16px icons tend to be very simple flat 2D versions of the larger ones.
As you asked for suggestions, I think a “mashup” of your designs in one would make a good set.
Version 4 for the 128px size, version 3 for 48 and 32px sizes and version 1 modified with a round square background (instead of the coin) for the 16px sizes.
Hope it was a valuable suggestion.
34
Love the icons! Thank you for creating these, and thank you even more for releasing them to the public. Version 4 looks great in my dock sitting next to Panic’s Transmit.
35
Veerle, I am so glad to know that I am not the only one who has a near obsessive-compulsive disorder with attractive dock and desktop icons. Thank you for bringing the Markup Validator to my attention and for the VASTLY improved icons for the program.
36
Great Veerle. I love the Cubes and the last one! Thanks
37
Michel said:
I’ve just updated my article with a link. Here you go :)
Vasili said:
I’m afraid I didn’t do anything special here really or used any magic trick, I just drew the corners using the pen tool sometimes in combination with the rounded rectangle tool.
38
They’re excellent! And the app itself looks quite useful too, thanks for the tip.
39
Thanks for the icon. My dock looks much better :)
By the way, funny thing, try and validate google.com
40
Oh how I miss my Mac. Love your site!
Regards,
Cheryl
41
Default icons are annoying. pretty much all of them could benefit from a remix…..thanks veerle
42
I really like version 4, its clean and great to look at. Whenever I get to validating my codes then maybe I could post these icons on my site haha
43
You are always on the forefront of everything. Keep up the good work!
44
@Veerle:
Thanks a lot, for the PNG updated version!!
You made my day! :)))
45
Really nice work, i really like the last one! nice…
46
Hi, I’m quite new to MAC’s after using PC’s for around 15 years but one of theing i really love are the names and icons for it’s applications. For me, and while they’re all a huge improvement, Nyour design number 4 rocks my boat. Nice work and thanks for the download :)
47
Loved the fourth one. Just plain beautiful. Thanks a lot!
Commenting is not available on this article.