

Ask HN: Do CSS expert write most of the things on their own? - mkagenius

I am trying to learn CSS and am thinking whether everyone writes most of the css own their own.<p>If not, what frameworks do they use? 
I know of one: bootstrap.<p>In other words, how would an expert go about building a responsive beautiful website like, https:&#x2F;&#x2F;www.lily.camera&#x2F;
======
eswat
If you’re just learning I think you’re better off without using a full
framework like Bootstrap or Foundation. This is the time where you should be
doing more of the leg work to understand how the different properties work,
how the cascade works, the different methods to aligning elements (what a grid
system would typically take care of for you), etc. Looks at sites like CSS Zen
Garden or CSS Tricks to help you along your journey.

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.

------
antigirl
Thats not a great website IMHO. Anyway you use frameworks for base styles, to
assist you in setting up the ground work.

For 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/](http://meyerweb.com/eric/tools/css/reset/)

and work out rest yourself.

------
michaelbuddy
I get paid to do css. If you write your own CSS for a while, get used to the
syntax and solving certain problems that popup. display:block and
position:relative for example are always things I try when something doesn't
behave. Then make sure you are able to code around bootstraps constraints and
defaults. bootstrap is very popular. I tend to do smaller sites where
performance / downloads isn't an issue even on mobile. For a site with a lot
more users, people can optimize all day and it will all be worth it. If you
can get very familiar with bootstrap out of the box you can start to rip out
the things you won't / never use.

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.

------
tannerj
Bootstrap/Foundation can be great when you don't know a lot and need something
that is acceptable now. However, from a gaining experience point of view,
those frameworks can get kind of complicated and trying to figure out how some
effect is being achieved can be very difficult. I've found there's a certain
level of skill you have to get to before you can actually use those frameworks
to learn new techniques. When you get to that point, they can be great
vehicles for learning how to do certain things.

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/](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/](http://sass-lang.com/) [1] [http://compass-
style.org/](http://compass-style.org/) [2]
[http://susy.oddbird.net/](http://susy.oddbird.net/) [3]
[http://lesscss.org/](http://lesscss.org/)

------
rrrx3
I don't know if I'd consider myself an "expert," but I'm certainly advanced.

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.

------
w342
I am not expert front-end coder, but I like to meddle with front-end.

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.

------
normloman
Not sure if I'm an expert, but I've been employed as a web designer. I don't
mess with bootstrap. It's a great tool for prototyping aplications, which is
what it was made for. But few websites are going to use everything in
bootstrap, and most will need additional styles. It's easier to just start
from scratch.

------
KevanM
I handcode all my CSS, but freely admit it is a bit of a mess and needs some
TLC or a rewrite.

I'd start off with the Skeleton
[http://getskeleton.com/](http://getskeleton.com/) and build up from there.

------
DanBC
> In other words, how would an expert go about building a responsive [...]
> website

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.

~~~
Mimu
I think it depends on the site. I would say that usually, you just need to put
percentage width on your elements so they fit the screen size all the time.

Add some media queries to change the % depending of the screen/window size,
and maybe hide/add some elements so it is more readable.

