Hi, I have been a web developer for 6 years. I am starting from scratch with no teacher whatsoever, so I grasped the rope by myself. Gathering resources from the internet and use it. Now, I just want to return the favor for someone like me 6 years ago, who want to find a better way on developing websites. I am sure all of us have our way in developing websites. I just want to share mine, it is your decision to use it or not. But I can assure you, my way is much faster than using conventional way of developing websites. 1. Use LESS instead of CSS. LESS is giving you an edge over the CSS. LESS support nesting, function, variable which will speed things up in developing web page. Especially useful for complicated webpages. 2. LivePage extension for Chrome Combined with LESS, this extension even push your efficiency to the next level. All you need is just to change the LESS / CSS or Change the HTML Content, and the change is reflected immediately in the browser (Well there is a delay about 0.5 - 1 seonds, I can live with that). Hitting F5 and refreshing the browser is just an old and slow way to see a results. 3. PerfectPixel extension for Chrome If you want to give it more. You have to try PerfectPixel. As you can see by its name, it is suited for someone who does his job and finds perfection for it. You just need to insert an image and that image will be put on your browser as an overlay. You can tuned your HTML to be "Pixel Perfect" and Match The Design. Okay, That's the best 3 tools that I used to develop my Clients websites. And they did a good job and speed things up by 3 times. A job that took me 3 hour without using those tools, now I just need 1 hour. If you have your favorite tools for developing websites, please share them here. I would love to try them to compare them with me. If by any chance someone interesting in my skills using these tools feel free to drop me a PM. I would love to do it and I will show you how Speed and High Quality can be achieved at the same time. Feel free to ask questions. Regards.
I prefer an alternative to LESS, SASS + Compass. While you can't use javascript to process the SASS and Compass syntax, it does offer a better range addon's and features.
I forgot to put additional tools to use on LESS. I definitely not using javascript to compile LESS on the go. I prefer WINLESS, which will compile LESS to CSS whenever I made change to the LESS. I heard of SASS but never used it, do you think it is much better than LESS ? I might give it a try.
1) Less is MORE -- more code bloat, and a sleazy shortcut for people who can't be bothered to learn to use inheritance properly. I've rarely if ever seen a site using LESS that wasn't a steaming pile of non-semantic trash; Like most CSS frameworks, javascript assisted asshattery and extra server processing for nothing, I cannot fathom how anyone is dumb enough to see merit in it. 2) "Livepage" -- something that's been built into Opera for over a decade and a half... Not that I use it because it's a waste of bandwidth, often screws up mid edits since things usually span multiple files, and I prefer to actually have control over it. Much less if I'm doing something I'm going to be hitting alt-tab F5 at LEAST five times since I actually *SHOCK* test in MULTIPLE browsers. #1 mistake people make is coding large sections or even an entire page BEFORE testing their changes in anything other than their magical flavor of the month. 3) "PerfectPixel" is usually used by people who think images to layout, aka presentation over function; a broken halfwit idiotic method of site building that should never have caught on in the first place -- pissing out some PSD and then trying to turn it into a web layout is putting the cart before the horse -- much less that the crappy fixed width and px metric fonts usually required to make things match is the antithesis of accessible design! PARTICULARLY in the age of responsive layout. Tool is basically useless if you are using dynamic fonts (%/em), dynamic widths (fluid, semi-fluid), responsive layout (since even your column count can vary) and building a website PROPERLY with semantic markup of the content, bent to your will for your layoutS with CSS, only bringing in the Photoshop jockey at the end of the process if at all since, well... that's where they belong. Because again people visit websites for the content, NOT the goofy graphics you hang on that content. But of course, the ignorant fools who typically write checks for vague promises are always won over by flash over substance -- and it always ends up biting them in the ass. Improving efficiency? I think not... the first destroys efficiency, the second is kinda pointless, and the third is only useful to people who to be frank, HAVE NO BUSINESS MAKING WEBSITES IN THE FIRST PLACE!