So, what would a CSS Developer's job role consist of exactly? Anyone here have this as their job title? I just figured a CSS Dev. would fall under a web designers role and not a entire role on its own. Just wanted some real-world input before I follow up...

9/17/2007 9:25:55 PM

That seems like a pretty narrow job role to fill. That's sort of like being a headlight installer for a mechanic shop.

9/17/2007 9:28:54 PM

Thats what I was insinuating in my above post.

9/17/2007 9:30:08 PM

definitely pretty narrow...i can't imagine there's much about CSS that i don't already know, and that's just a small part of web design in general

*shrug*

9/17/2007 9:33:45 PM

My guess is you would be translating the UI layouts from a UI/UX person into functional CSS. It's a hell of a lot of work and a pretty integral part of the design and development process for larger web apps.

Basically it goes UI/UX -> CSS Dev -> Software Engineer -> Programmers. The CSS dev handles all of the translation and building of a design into functional html/css, to ensure that once it hits the developers they won't have to be concerned about the display. All of their classes, modules and standards are laid out for them so they can just focus on logic.

It could be very different from this, but I'd imagine thats the job role.

9/18/2007 1:45:27 AM

^thought i'd wait for the Noen response to get a real good answer, thanks again for the help.

UPDATE: as usual Noen was right...its interfacing with the UI designer, strictly CSS stuff and then passing it on to the back-end people and the front end people.

[Edited on September 18, 2007 at 12:31 PM. Reason : fda]

9/18/2007 12:16:08 PM

it can actually be a really interesting role, as the CSS guy tends end up with a tremendous amount of decision making ability, and usually ends up getting a lot of creative duty too.

no problem man, who's it for?

9/18/2007 12:57:04 PM

what Noen said.

CSS is only limited if it's not a commercial site, once you are working on a commercial site you have to know all the in/out's and compatibility issues, format issues, create seperate css for different media, etc... actually quite a bit of work and design decision responsibility on the best way to implement a design

9/18/2007 2:19:16 PM

Didn't want to make a new topic so this is some what related.

As a CSS developer, is it better to use 'pixels' when declaring font sizes or relative terms since the former doesn't resize properly if a user has his font settings to 'large' or 'x-large' to make it easier to see?

I'm just going through some parts of a site and taking notes on what they've done and what could be changed to make it more cross-browser compatible and more user friendly for a variety of users.

9/19/2007 2:01:51 PM

im a recent convert to using EM's for everything.

Unless it's an art site, where exact dimensioning is meaningful, using EM's is much more browser tolerant and accessible. It's definitely going to take a long time to get used to, but until the powers that be sort out the DPI/PPI issues between software and hardware, it's a necessary evil.

9/19/2007 2:10:16 PM

so would that be something worth mentioning in my interview? i noticed their site uses all px declarations for font sizes.

oh something else I've never really done because I've never had to deal with a site of this complexity or magnitude, but converting your CSS files to single line to save on bandwidth and file size vs keeping it multi-line. Is it a good practice to keep your local files multi-line then convert it to single-line server-side?

*makes it a pain in the back-side to view source on it though

[Edited on September 19, 2007 at 2:23 PM. Reason : fda]

9/19/2007 2:12:39 PM

Quote :

"It's definitely going to take a long time to get used to, but until the powers that be sort out the DPI/PPI issues between software and hardware, it's a necessary evil."

sadly, this is true...here's a decent description of why EM is better, though the page itself is really ugly, i found it quite useful:

http://www.astahost.com/info.php/sizes-webdesign-em-vs-px_t8926.html

^ my co-worker insists on doing it single-line...drives me batshit crazy because i have to hunt twice as long to find what i'm looking for...how much extra bandwidth could single-line vs multi-line save, anyway?

does anyone else do their CSS alphabetically? as in:

body {
   background-color: black;
   color: white;
   margin: 5px;
   padding: 1px;
   text-align: center;
}

[Edited on September 19, 2007 at 3:14 PM. Reason : .]

9/19/2007 3:13:59 PM

honestly you gain more by combining styles than you do going to single line format.

for example, using the highest level possible formatting for that item, instead of having many instances for the same thing... an example would be a background color, specifying it in the table instead of the data cell hence it only is specified once instead of multiple times (this should be obvious tho)

i use relative as much as possible, absolute should only be used for design specific items, like logos, slogans, etc... that are not supposed to be resized, or items required to be a specific size for formating

here's a CSS run from Adobe.com (from going multiple to single)
Input: 85.329KB, Output: 64.476KB, Compression Ratio: 24.4% (-20853 Bytes)

[Edited on September 19, 2007 at 3:29 PM. Reason : /]

9/19/2007 3:19:06 PM

Quote :

"how much extra bandwidth could single-line vs multi-line save, anyway?"

From what I gather, sites that i've worked on or been exposed to really won't make a difference on single-line vs multi-line but a site with extensive CSS + millions of hits a day would probably cut down a lot on bandwidth as a whole vs just one single user

9/19/2007 4:19:13 PM

well, i suppose if you could average it out to 20% savings on bandwidth, it would be significant

9/19/2007 4:29:26 PM

well take into account the overall site traffic (multiple pages, images, html, php, flash, videos, etc) it's probably closer to 2% on a large commercial site.

[Edited on September 19, 2007 at 4:46 PM. Reason : .]

9/19/2007 4:46:23 PM

This is why you separate development from production.

In development, you keep nice, well formatted css.

In production, you push a white-space-extracted file out.

you can also use gzipped css files to reduce load MUCH more, but Safari doesnt support it, so most people stick with plaintext. Keep in mind too that if you cascade your styles well, its a minimal load, and they will stay cached for a long time.

9/19/2007 4:56:51 PM

No, no, no, no, NO! You make no changes from going to development to production. ANY Changes require you to retest; no matter how insignificant. Assuming you are 100% perfect and don't accidentally delete any white-space that doesn't matter, you might still introduce a bug.

The smaller part of the job of programming is writing a program so that the computer can read it; the larger part is writing it so that other humans can read it. -- Steve McConnell's Code Complete, that book that Lasher is always giving out.

If you have that burning need for premature optimization, have three environments. One for development, one for testing, and one for production. Promote from development to testing and strip out the white-space. Then test. Then promote from testing to production.

DO NOT TEST, MODIFY, PROMOTE TO PRODUCTION, AND ASSUME EVERYTHING WILL BE FINE

9/22/2007 12:01:01 AM

CSS files are generally cached by default. It's generally a non-issue.

9/22/2007 1:16:37 AM

^^uhh, that's just fear for fear's sake. There is no "problem" with doing an automated, proper whitespace strip of css to promote it to production. Hell, its a single regex.

I mean, I can understand that maybe you don't understand the API, but really, that's ridiculous.

Quote :

"The smaller part of the job of programming is writing a program so that the computer can read it; the larger part is writing it so that other humans can read it. "

You are mistaking the application. That book is talking about writing good code in a collaborative environment. I am talking about USER PRESENTATION. No user cares what the CODE looks like. Hence why you keep the development tree well formatted, and push an optimized version to production. Seriously, read what you quoted.

^yes they are, but you still want to make the user feel as fast as possible, even on page load 1. And if you can do something simple like this to make their experience that tiny amount better, you should do it.

[Edited on September 22, 2007 at 2:38 AM. Reason : .]

9/22/2007 2:35:04 AM

If you've got a 1MB CSS file, you've probably got other things to take care of before stripping whitespace in a CSS file becomes an issue.

9/22/2007 8:49:28 AM

No, but the difference between 60k and 40k, when you are serving 10's of millions of page requests daily is substantial and completely justified.

I just wish safari would recognize gzipped includes for js and css. damn them.

9/22/2007 9:30:23 AM

Can you not gzip on the HTTP level?

PS, it's a slippery slope. "it's just a simple regex, it couldn't break anything" is still a change. I noted the white-space bug in IE because even something as simple as stripping whitespace can affect the PRESENTATION of your page. Something like: <input type="checkbox" /> Yes displays differently than <input type="checkbox" />Yes

[Edited on September 22, 2007 at 12:25 PM. Reason : ps]

9/22/2007 12:22:06 PM

^that's what  .; is for

[Edited on September 22, 2007 at 12:27 PM. Reason : .]

9/22/2007 12:27:30 PM

i hate css

9/22/2007 3:38:33 PM

^^^html != css

9/22/2007 3:52:41 PM

^^CSS is awesome!

9/22/2007 4:09:49 PM

HATE IT

9/22/2007 4:17:40 PM