Jump to content



Photo

your thoughts on preprocessoring for CSS?


  • Please log in to reply
11 replies to this topic

#1 ACTIONpack

ACTIONpack

    Graphic Designer

  • Tech Issues Solved: 1
  • Joined: 10-August 03
  • Location: Lawrenceville, GA
  • OS: Windows 8.1 Pro
  • Phone: Nokia Lumia 925 (T-Mobile)

Posted 02 July 2013 - 02:42

I'm pretty good on CSS3 which is an easy thing to learn. Seeing a lot of LESS and SCSS out there. Well never work on them before when I outsource coding for jQuery work done the cas was done in SCSS and fi d it hard to go there and messy. Your thoughts on it.


#2 wrack

wrack

    Wireless Robotic Android Calibrated for Killing

  • Joined: 09-December 06
  • Location: Melbourne, Australia

Posted 02 July 2013 - 02:55

Pardon me but is a Preprocessing of CSS?



#3 Torolol

Torolol

  • Joined: 24-November 12

Posted 02 July 2013 - 03:01

from users standpoint i hates when javascripts modifying the style, as its remind me of those annoying ads.



#4 ZakO

ZakO

    Neowinian

  • Tech Issues Solved: 2
  • Joined: 21-September 07
  • Location: Finland

Posted 02 July 2013 - 03:49

I love SCSS, it helps keep your CSS organised, especially when it comes to responsive design with various breakpoints. Selector nesting, media query nesting, mixins, variables, sprite generation, colour mixers, inline calculations, etc. all assist you in writing (generating) CSS quicker and since it's just a superset of CSS you can pick and choose which features you use. All SCSS implementations are open source too, so if you want to fix/add features you can.

I've used SCSS in pretty much all of my projects for the last 18 months and haven't hit any big negative points.
 

from users standpoint i hates when javascripts modifying the style, as its remind me of those annoying ads.


CSS preprocessors (stylus, sass, scss, less) 'compile' the language into standard CSS before being used on the page, they don't use javascript to modify the style. Well, unless you were to use a javascript implementation, but I don't know why anyone would do that on a live site.

#5 +Seahorsepip

Seahorsepip

    http://seapip.com

  • Tech Issues Solved: 20
  • Joined: 23-January 11
  • Location: Netherlands
  • OS: Windows 8.1 Pro
  • Phone: Nexus 5

Posted 02 July 2013 - 11:17

Yeah I love using preprocessors, they give coloring possibilities like darken and lighten and grayscale and variables and the best of all, nesting :D

 

sass and scss are both preprocessed and then uploaded on your site so there's no way to know it has been written in those preprocessing codes but less isn't preprocessed before it's uploaded it's being preprocessed by a js file while the webpage is being loaded, I myself like less more since I can use other js code to change the less variables on the go :p



#6 Sandor

Sandor

    Neowinian Senior

  • Joined: 28-November 03
  • Location: Canada
  • OS: Win 8.1
  • Phone: WP8

Posted 03 July 2013 - 15:07

Your thoughts on it.

 

Gimmicky really. Just another step in the process that doesn't need to be there.



#7 +Seahorsepip

Seahorsepip

    http://seapip.com

  • Tech Issues Solved: 20
  • Joined: 23-January 11
  • Location: Netherlands
  • OS: Windows 8.1 Pro
  • Phone: Nexus 5

Posted 05 July 2013 - 12:28

Gimmicky really. Just another step in the process that doesn't need to be there.

Hmm less really makes it less work instead of more in my opinion, especially when I have clients that wants a lot of stuff chnaged every now and then it's handy since I just have to edit my variables .



#8 Sandor

Sandor

    Neowinian Senior

  • Joined: 28-November 03
  • Location: Canada
  • OS: Win 8.1
  • Phone: WP8

Posted 06 July 2013 - 05:11

Hmm less really makes it less work instead of more in my opinion, especially when I have clients that wants a lot of stuff chnaged every now and then it's handy since I just have to edit my variables .

Care to document an example?



#9 +Seahorsepip

Seahorsepip

    http://seapip.com

  • Tech Issues Solved: 20
  • Joined: 23-January 11
  • Location: Netherlands
  • OS: Windows 8.1 Pro
  • Phone: Nexus 5

Posted 06 July 2013 - 10:54

As example your client has a website he wants in certain colors and some darker and lighter tones of it but he's not sure about the color yet and the amount of variations.

@color: green;

.one {
    background: @color;
}
.two {
    background: darken(@color, 10%); //A bit darker
}
.three {
    background: darken(@color, 25%); //A bit more darker
}
.four {
    background: lighten(@color, 10%); //A bit lighter
}
.five {
    background: desaturate(lighten(@color, 10%), 10%); //A bit more desaturated and lighter
}
.six {
    background: fadeout(@color, 50%); //50% transparant rgba value, in this example: rgba(0,255,0,.5);
}

Above we just have made a few color variations which normally take more time in PS or gimp or some other colors pallete program.


And there is a lot more, like calculations and nested coding which makes code a lot more clear to read and easier to write, and you can even nest mediaqueries :D



#10 MikeChipshop

MikeChipshop

    Miniman

  • Tech Issues Solved: 3
  • Joined: 02-October 06
  • Location: Scotland
  • OS: Win 8, Win 7, Vista, OSX, iOS, Android, WP8 and various Linux distro's
  • Phone: HTC 8X / Nexus 5

Posted 06 July 2013 - 11:01

Undoubtedly helpful in a large scale environment with a lot of developers or on an extremely large scale site but for your average site i find it's just not worth it.

I'm a bit of a purist also, i can see the point in LESS/SCSS but i like my CSS to be free from clutter and as it was intended, occasionally i don't have the choice and a preprocessor is used but generally i'll try to do it without.

#11 Ambroos

Ambroos

    Neowinian Senior

  • Tech Issues Solved: 7
  • Joined: 16-January 06
  • Location: Belgium
  • OS: Windows 7 + 8.1
  • Phone: Sony Xperia Z2

Posted 06 July 2013 - 11:01

I use Less for everything and I love it! It's takes a bit of getting used to but really speeds things up once you get the hang of it.



#12 goodbytes

goodbytes

    Just below average Joe

  • Tech Issues Solved: 1
  • Joined: 07-May 04
  • Location: England

Posted 06 July 2013 - 19:24

LESS!! It's all about the colour scope and nesting. definitely speeds up development and can result in cleaner css.