Web Development Philosophy

Design and Dev need to stop fighting with each other. Consistent design = clean code = fast site. CSS doesn’t suck, you’re just doing it wrong. Something beautiful can become a mess if you have multiple people working on the same code. The learning curve for CSS is incredibly steep. Every domain must accommodate beginner, intermediate and advanced.

CSS code reuse is almost non-existent. File size just keeps growing. As the site evolves, we continually modify the CSS.

Understanding The Cascade

Browsers have internal default styles. They are all different. Use reset.css is a good way to get around this. Browsers ignore bits they don’t understand. The order of multiple classes applied to one element varies. Order of the property value pairs. Last declaration will always win. Order of the rulesets. Order of stylesheets when called, the last one will prevail. ID’s win over classes. Inline styles win over stylesheets. !Important overrides something inline, which makes it really hard to figure out what will win in different cases. In CSS, avoid ID’s, inline and !important. IDs are fantastic as JavaScript hooks…but as a method for styling, it completely sucks. Allow cascade order to determine the winner. Avoid the aggregation of rules, browsers will interpret differently.

What Is Object Oriented CSS?

We tend to focus all of our efforts in between the brackets. We need to begin to focus on our selectors. Terminology can be confusing. Reusing elements makes them. Components are like legos. Mix and match to create diverse and interesting pages. Avoid duplication, wasting resources on components that can’t add value.  Avoid location-dependent styles. How can you avoid writing more CSS? There was an old lady who swallowed a fly applies directly to this situation. Define your headings, H1 through H6 and also define each as a class. The tag name can represent the code semantics while allowing visual flexibility. If you need more headings, you want to avoid making them location-dependent.

Applying Programming Best Practices to CSS

Main problems, avoid duplication, unpredictability and CSS kadzoo. Use hacks sparingly, you should feel a little bit sick to your stomach when using hacks. Don’t let hacks change your specificity. Use underscore and *. If you are hacking anything other than Internet Explorer, you’re doing it wrong.

Avoid styling ID’s. ID’s impact specificity and can’t be reused. Avoid styling elements (ul’s, etc), unless setting defaults. Avoid !important, except of leaf nodes. Style classes rather than elements. Instead of div.error, use .error. If you build the legos correctly, others can build anything they want with it. Combine elements with classes for specific cases.

Give rules the same strength, use cascade order to overwrite previous rules. Make your CSS predictable. It’s really hard to say write good CSS. People don’t always have the time to think about these things up front.

Layer Selectors. Duplication is worse than stale rules. Check for code bloat by grep’ing for specific things in all of your stylesheets. CSS objects are much more granular than JavaScript or other programming-oriented items. Extend classes to avoid repeating code.  Avoid specifying location, apply classes to the object you wish to change. Avoid overly specific classes, they’re all semantic, but limiting.

Maybe CSS isn’t Perfect

CSS Wish List

• Make CSS a better declarative language.
• It should be easier to author.
• Reduce the amount of code.
• Make the language more robust.
• Add variables.

Ignore your instinct.

Customer is unsure, has questions, is indecisive. Are they ready? Or a chronically indecisive person? Will they second guess you? Will they keep moving to goal posts so you will never score?

Instinct tells you, this will result in a colossal failure, but your feelings about the person, product, service are good.

When you’re in client services, it’s going to be your fault. You may be afraid to stay at a bad job, because of economic insecurities, confrontation, your reputation. Understand when to turn away. Your feelings may say, it’s only one more redesign, on more set of wireframes, etc. You’ll end up being miserable.

You shouldn’t take the job because you fall in love with the product, the romance of the story and everything else doesn’t feel right.

Trust your gut.

You don’t want to be stuck in the situation where you can’t pay your rent. You also don’t want to be stuck in the wrong job for five years.

Don’t jump in, before you know what’s involved. The web is where all of publishing is going. Many customers will not understand the complexity of what they’re asking for. What research will be required before you begin? From customers point of view, it’s a template. From a user experience and web perspective, it’s a month of research just to come up with requirements. Twelve templates can turn into 70-80 wireframes.

You must become a master of saying no. No with conditions, some negotiations may need to take place.  No Billy, don’t put your hand into the fire. The fire is for warmth.  Who has kids? Bring those skills to bear, but make it sound respectful.

When you’re interviewing for your next job, or your next potential client. It’s really important to get one person who is in charge, or one person with whom everything can be funneled. One person who can do much of the selling for you. This can enable you to do a good job.

Roles and responsibilities.

Don’t let panic be your strategy. Don’t spend a year waking up at 3am clutching your chest wondering what about …? Always leave lots of filler, plan for contingencies. If you’re absolutely sure it’s going to take you thirty hours, budget for sixty. The client is paying you, and from the clients point of view, you’re supposed to deliver a service. Your boss, client may or will not understand the complexities involved with whatever might delay you. Have a plan for when it doesn’t work. Be flexible and willing to change things on your own time and at your own expense.

When you have a problem with a client, tell them right away. Don’t avoid the client. Confront issues immediately. Talk to the client or boss immediately, but put it in his or her language. Tell it like it is. Use psychology. What does the client want to hear at the time. If you can’t deliver the new functionality in time for the launch, your boss doesn’t want to hear it’s because of a database issue or you haven’t slept, etc. Those may all be true, but you must find a way to phrase it so they understand and it’s a benefit to them. Contact them early and have a plan and discuss in a way that it sounds like it’s about them and their needs.

No way out. Have an escape clauses that allow you or the client to escape, with dignity. Have a series of milestones, if at any point either are not happy, walk away with dignity. I really like you and I want to work this out, but if it doesn’t work, know when to walk away. It’s not you, it’s me. When someone doesn’t respect you, your expertise, you lose your dignity. If you’re becoming antagonistic, it’s not cool, it’s not fun. Break up with him/her and make it seem like it’s their idea.

I like your ideas, but I don’t know that I’m qualified. I feel like I’ve bit off more than I can chew. Keep your dignity, your integrity. The painful decisions make the culture. Don’t fire a client, raise your rates. Sometimes it works. You will earn the money.

Ten things.

1. Know before you go.
2. Keep expectations on track and in sync.
3. Constantly course-correct.
4. Tell the truth.
5. Phrase it from the client’s point of view, not your own.
6. Report bad news before the client notices it.
7. Have a recovery plan.
8. Apologize-but never denigrate yourself or your team.
9. Have an exit strategy.
10. Know when to quit.