Ask HN: Do CSS expert write most of the things on their own?
I am trying to learn CSS and am thinking whether everyone writes most of the css own their own.
If not, what frameworks do they use? I know of one: bootstrap.
In other words, how would an expert go about building a responsive beautiful website like, https://www.lily.camera/
11 comments
[ 3.0 ms ] story [ 44.5 ms ] threadFor example, reset and grid styles. Bootstrap is quite bloated but you can mix and match and use whatever you like.
If you are learning then just use reset style sheet http://meyerweb.com/eric/tools/css/reset/
and work out rest yourself.
Bootstrap and Foundation are huge and terrible for load times. Moreover, most websites built with Foundation and Bootstrap look the same.
I usually choose grid systems like simplegrid or skeleton and build up from there.
Now, as for whether those with more experience write their own or not, it’s usually a compromise between what that expert thinks is ideal, what the team he's working with believes is ideal and what's actually necessary for the project.
To me the ideal is doing almost everything from scratch, minus resets like Normalize or grids like Foundation’s – and just the grid – because they are done very well already. However past that I know I’ll run into roadblocks immediately trying to fit the look & feel into those frameworks and still be leftover with a bunch of cruft I don’t need. I can also write my selectors in a more maintainable fashion which will lead to less debugging headaches and scalabilities issues down the road.
I'd really like to know what I need to take a regular WWW 1.0 website (html 4.01 strict) and make it at least vaguely responsive to mobile screens.
Add some media queries to change the % depending of the screen/window size, and maybe hide/add some elements so it is more readable.
Using frameworks is the way to start, as it's one of the quickest ways to understand how things can be set up. What I found, however, is that very quickly you will outgrow frameworks. They tend to become more of a constraint than they help when you're working on more advanced things. When you reach that point, you'll probably start to piece together your own favorite snippets into something that works for you - grids, resets, etc.
So pretty much what eswat mentioned above. Just go into it with the impression that everything in a framework is a suggestion, and learn as much as you can, with the idea that you'll be doing it your own way soon enough. Later, you can get into things like BEM, or OOCSS, or SMACSS.
I'm currently using foundation with SASS[0], Compass[1], and Susy[2]. I only take certain parts from Foundation as I need them. Foundation is built on top of SASS so it's easy to pull out parts of the framework. I can say that using a css preprocessor (SASS/LESS[3]) has really made a big difference in the speed I develop and the maintainability of my css. To directly answer your question:
>>In other words, how would an expert go about building a responsive beautiful website like, https://www.lily.camera/
They probably use a preprocessor like SASS or LESS and either build it from scratch or take parts from different frameworks that they need and mix and match. Looking at their html source, they're not using a framework directly, but they could still be using one with their css preprocessor which is compiling down to their production css. Also, there's a good bit of javascript going on in that site as well. Hope this helps.
[0] http://sass-lang.com/ [1] http://compass-style.org/ [2] http://susy.oddbird.net/ [3] http://lesscss.org/
one way I deviate from a lot of the popular frontend trends is I don't really like using preprocessors (LESS SASS) for projects. I totally get the benefits but the drawbacks of confusion within a collaborative environment offset the benefits. My experience, teams of coders have various skills and build processes and have to pick up slack across many projects, I don't want to enforce another level of abstraction unless I'm certain it will pay off for everybody and be easy to get going. So far, I see enough drawbacks that regular CSS is better when you're out for the week sick, or bringing on some outside help for overflow work.
But if you've got a small team and every one agrees on it and can and will back each other up with that same process, have at it. I've never met those people though.
I'd start off with the Skeleton http://getskeleton.com/ and build up from there.