The 10 commandaments, broken down edition ( I )

It’s been a while but here goes nothing.

In my recent wanderings all over the net i came across Nicu’s blog, and there i re-found an old article, written in BusinessWeek, called the The 10 Commandments of Web Design. It’s no news for some people but i thing that Nicu said in a comment on his blog caught my eye, “Ar fi bine de explicat aceste “porunci” in articole relevente pentru fiecare.” or in english “It would be nice to have each of these “commandments” explained in relevant articles.”. So i asked for permission to steal the idea , received it and here i am.

So let’s move on with the show.

1. Thou shalt not abuse Flash.

“Adobe’s popular Web animation technology powers everything from the much-vaunted Nike Plus Web site for running diehards to many humdrum banner advertisements. But the technology can easily be abused—excessive, extemporaneous animations confuse usability and bog down users’ Web browsers. “

This is a little vague, so let’s break it down and treat everything in detail.

We all know what Adobe’s Flash does and can do, but in inexperienced hands it can lead to processor overloads, browser freezing, everyone of them from my experience. Why overdo it with using flash, as someone once said “Simple is best”, flash isn’t that simple, if you make a huge monster of a web-site you’ll run in a couple of problems:

1. When the client wants something different, it’s a real pain in the ass to make the certain modification, and you know clients they always want them.

Ok i get it when you have to make a commercial for a company, a huge site that has to grab the potential buyer and hold him glued until something interesting makes him buy the product advertised there, imagine how making modifications on such a mammoth.

2. Flash isn’t quite that search engine friendly, so it’s a nightmare to get SEO for a full flash website, that says enough about it.

3. Loading time, ok due to modern, faster connections, loading time is lower but still a drag when surfing for information on a full flash site.

4. If it’s badly done, it doesn’t dump anything from the RAM memory and it keeps hogging the processor, i had a carousel that froze a Q6600 and 4Gb of RAM in 10 minutes, the only thing left to do was to reboot.

I’m not saying Flash doesn’t have it’s uses, but the bottom line is keep it moderate and simple, don’t over-do it, especially if you’re just beginning, or mid level.

well at least i’m back, we’ll be restarting to update the blog on a regular basis, thanks one more time for your patience, next episode will be about the 2nd and probably 3rd commandments.

To tree or not to tree, that is the question for today

As it’s implied from the title the topic for today is Tree Works, please visit the site first to get a general feel, and be sure to read up what’s written there, i’ll share with you my opinion afterward.

Ok so assuming you did as previously asked, we’ll proceed. My purpose is not to judge a portfolio based on it’s appearance, for that is highly subjective, and i might like it or not, but who cares, i’m not an art critic, i’m just a cynic that likes his chosen domain and wants to keep it “clean”. The only thing i don’t get in this design is the choice for a pale orange for the article title in the left part, there just a small amount of contrast there and that doesn’t help with readability.

Let’s move on, shall we. We go to capabilities and the big title pops out in view “We create value on the Internet.”. My question is how can you do that if your presentation site, which is supposed to be your calling card is invalid. Errors found while checking this document as HTML 4.01 Transitional! Result: 8 Errors, 3 warning(s)

Yeah you might say they’re not many and they can be overlooked, not really, according to their own website “We’re the modern breed, and we have all the weapons and hi-tech gizmos we need to win battles for you.”, nice a modern breed with hi-tech thingies that doesn’t know after 6 years of experience how to create valid code, hmm that takes the cake.

Moving on, we take a closer look at the code:

<div id=”location” style=”background:url(/content_files/header_images/
h_programare_1.jpg) no-repeat center top;”>

My question is, why do you have an id on the div element if you’re still putting css properties inline?

OK next question of mine: How can you define style proprieties inside the body tag, don’t you know you’re supposed to define them in the head tag? The answer is simple seems not, sorry about guys.

I know usually webdesign firms bump their portfolio until they forget about it and it remains there as it was 3-4 years ago, so you can judge a web agency based on it’s work right, ok let’s go there and see if the portfolio it’s a fluke, i’ll spoil it for you, it’s not.

Let’s take a closer look at a big custom website for a romanian network, which was rumored to have a huge price tag (from what i heard 20k Eur), Pro Tv, and just so i’ll make myself clear i have no problems with the television i chose it just because it popped in my eye, i just have a problem with the people that did the website.

First of all you notice a floating cursor thingie, try moving that to the lower edge of the screen or the right one, see it makes the website infinite, if you’re bored you can do that for hours, they just slapped that thing on without thinking of the consequences, do it fast i don’t care how, it could’ve been made so it would’ve changed to the left of the cursor when the floating div would’ve reached the edge of the screen, but no let’s keep it infinite.

Continuing, it seems the fluke with the invalid website wasn’t a fluke after all, same as the presentation website, a website made for a customer has: Errors found while checking this document as XHTML 1.0 Transitional! Result: 50 Errors, 20 warning(s), again not a lot especially for such a big website, but seeing it’s not generate from a alien program and it’s xhtml/css, there could’ve been none. Seeing there aren’t hard to fix errors, such as “Line 113, Column 19: Attribute “id” exists, but can not be used for this element.” if they would’ve done some reading before they would’ve known that the embed element is deprecated in XHTML 1.0 as shown here. And about 20 more errors come from the use of the embed element instead of the nifty object code.

Next are some badly closed tags, some forgotten alt’s and of course the not replacing ascii chars with their respective html sisters syndrome.

Didn’t look much at the css but a thing caught my eye form the start width:1284px; on the wrapper, directly put inline although it has an id, weird, if you want to make a website fit in an 1280px screen you don’t increase it by 4px you subtract from it, you know why don’t you? (the first one that gets it right gets a cookie)

Well hope you made an idea, and have an answer to the question in the title by now, thanks for your patience, see you kids next time.

P.S. In your portfolio when you write the technologies don’t forget to mention css. Thanks!

P.S.S. When trying to contact them to let them know about the article i found out that their online contact form has a problem with my yahoo e-mail, it knows something

Disclaimer or something like that (WIP)

In light of some recent events i feel the need to clarify the state of the blog.

So without adding more to it, it is.

The contents of this blog are only my opinion, you might agree or might disagree, in any of the cases feel free to post your opinion, and try to keep it as civil as possible, it’s not my fault some of your work caught my eye and made me write about you, i will always give anyone a chance to voice out their grievances, so please do so.

It isn’t my intention to harm the ones that are featured on this blog. This is my opinion and advice, not counsel. What I write on my blog is not to be taken as fact nor absolute.

Thank you for your time.

Some basic guidelines on how not to suck while making a layout

Or in other words what noobs and stupid people that never learn, do wrong

I had the misfortune to work with some bad designers, that couldn’t grasp the concepts of webdesign and what needs to be done. So here they are, the problems i found when working with some of them.

• Use guide lines, i mean really use them, i saw guides put in layouts and elements randomly being arranged around the guide line, bad, soooo so bad that words cannot describe it, ffs it takes around 10 minutes extra per layout to arrange the elements to the guide lines YOU set, it wasn’t me that set them, it was YOU, then why ignore them?
• When designing multiple pages for the same layout, try to make them the same width, it’s not that hard.
• Remember all links in a website have 4 states try to include at least 2 of them in it, the normal and the over states, coders usually understand that the visited states is the same as the normal and the active state is as the over one.
• Try to use shapes, we need to create elements sometimes that you didn’t know of when designing the initial layout, and it’s really annoying and time consuming to get up and create something out of a shape raster, doable but stupid, why work extra when YOU (the designer) could’ve left the shape as it was and didn’t rasterise it, and if you use shapes remember pixels are indivisible, try to get the shapes edges right at the edge of the pixel.
• Use groups FFS, yeah yeah i know you don’t work like that, but if a plumber comes to your house and installs the kitchen sink in a place and the tap somewhere else and one faucet under the bathtub and the other right behind the can, how would you feel? if you can’t organize your shit how do you expect me to find something in the crap you call a layout? (don’t get me wrong it might look beautiful but hey it will take twice as much to find stuff in there and slice the shit up)
• Set your design program in pixels and use natural numbers, i’m sorry CSS doesn’t know .5 pixels yet.
• Separate your typography don’t just barf all your content then tab and enter align it in the page, that’s why design programs work with layers, separate it so that coders know which one is a paragraph and which one is a heading, easier to get the job done.
• Mental note! CSS3 hasn’t come out yet so please don’t use opacity on content items that aren’t backgrounds, like texts, use solid color instead of 63% opacity
• Remember some form elements can’t be styled only with some javascripting so be sure the client has agreed to that before you create styles for those and then wonder why the site doesn’t look the same as the layout, i’m reffering to input type select and file mainly
• If you’re using things in the site try to think if they’re going to be used again in some other part and make them fit wherever
• And last but not least, it’s your job to manipulate all the images that i need in the website, so i don’t have to waste time when coding, doing that. Please make sure you do so

And the ones that take the cake today are? You’ll never guess it, it is the Touch Media that inspired this article, their designer had all of the above in one layout, please congratulate him.

And on a side note they were supposed to be the topic of the next blog, but i was amazed that after a month since i e-mailed them about the state of their website, all the problems with the 80 something invalid things were fixed. But i must say that i laughed my ass off when their mail responder (probably boss or PM dunno so i’ll call him mail responder) had the audacity to compare his site with Yahoo! “Ia pune tu mana si incearca sa validezi www.yahoo.com? Poti…..Nu se poate valida orice? Stii de ce? Pune mana si informeaza-te inainte sa lansezi comentarii tampite.”, now for our english friends “Just try to validate www.yahoo.com? Can you… You can’t validate everything? You know why? Go read up before you make stupid comments.”. and yeah you can validate anything, depends how much effort you put in it, but for a 6 page site for a webdesign agency that takes pride in “webstandards” and posts such thing on it’s knowhow’s it’s innexcusable. So mister AA you go read up some more.

I feel better now, had to say it, hope that someone has learned something from the trash talk today, if not i got it out of my system and that’s a good thing, for me, cause you’re still morons if you’re doing exactly what i said above and haven’t learned anything.

Have a great day!

Tehauthor’s loosing battle

The reason behind all of this

The idea:

It came a while back when working at a webdesign agency somewhere around i was in charge with bug-fixes, problem solving and modifying existing projects developed inhouse by the webdesign agency.

While doing all of that i was confronted with bad code, that wasn’t such a big problem at first, so i tried the normal approach, go tell the person that coded the layout the problems i ran into, the fixes and the what not’s about them, no problem until here. Well wrong i came out as an arrogant guy that was all knowing. Wrong again, i was only trying to explain to others what they were doing wrong, seeing they had no time to get up to speed with common problems that came with the field, but all i got was partially ignored, it would’ve been more constructive if i would’ve talked with a brick wall, thus resulting in more frustration, next step was quitting. Ok did that but then what? Find a new job they say, hmm easy, but my problem is that i have standards, i see an job announcement, look up info about the firm, probably find their website, and only after apply for the position, so in my searches about 80 something percent had crappy sites (to be read, non-valid, non-crossbrowser, badly designed and so on), the question was what could i learn at such a firm that doesn’t even know how to make it’s website, the calling card for the agency, cross-browser for example. Answer: little to nothing, and the pay would’ve been accordingly. So more and more frustration arose. And one day while looking at some webdesign agencies portfolios the idea “pooped” to mind, why should i stand and eat this shit up? So this blog was born, at least in theory.

What will i accomplish?

Probably nothing, but if a person tries to find a webdesign company and stumbles on this little blog, and reads a bit, and then decides not to go for one of the agencies that will be featured, i’ll be glad. It will be one person that i saved from getting robbed by greedy webdesigners that just go to work, and don’t even try to do a good job. (Excuses can come: “i have deadlines”, “my boss is always on my back hurrying me up”, well we all have those and some of learned to do it proper in the first place and there’s little to no need to fix bugs or solve problems if you prevented them in the first place. It’s quite easy, think before you design.)

Why english?

Why choose english if i’m “slandering” romanian web agencies? Romanian market is the one i work in and i’m accustomed too, but every country has the same problems, and i’m hoping that maybe someone finds this and gets an idea about the what not’s. A guy can hope.

Personal attack?

Somewhat, because it’s personal when people are so incompetent and can’t get up to speed with the domain they chose, then why choose it if you don’t even care about it. It gets personal when the web gets cluttered by more and more crappy websites, and people don’t seem to notice and care. Well i do! Consider this my release valve, or consider this an compendium of how not to. Probably more will consider this as an attack to them and they’ll trash talk a lot, frankly i don’t care, negative feedback is feedback none the less.

Hello world

Temporary accomodations until i get around to making the real thing.

Hope you enjoy this as much as i do writing it.