HTML5 Boilerplate is out with the new version 4.0.0.
There were some significant changes since the last version that are listed up in the changelog (also see below). Most of them because of the excellent work by Nicolas Gallagher – thanks for leading HTML5 Boilerplate with such great effort.
What’s new?
This was done throughout the last seven months of development and resolving bugs:
Add documentation in a separate folder – everything that is directly concerned with the project was moved from the wiki
Switch from Public Domain to MIT license
Separate Normalize.css from the rest of the CSS
Improve console.log protection
Replace hot pink text selection color with a neutral color
Nicolas introduced a better image replacement technique
Code format and consistency changes (<3!)
Remove superfluous inline comments
CSS file and JS files & subdirectories were renamed
Sadly we could not integrate Grunt.js into the project with some simple tasks because we had to face certain problems when it comes to integrate the CSS file that is build by Grunt into the repository and other impediments.
Since some time I found myself defining a good starting point for a new project over and over again. While I use HTML5 Boilerplate in nearly all of my projects it’s not enough as an initial package. Since I’m using SASS (in its dialect SCSS) and have some other things I define over and over again I decided to set up a package that lets me start easily and includes a lot of tools that are necessary for my projects. This is an introduction to init, the starting point for projects that require a bit more than just HTML5 Boilerplate.
Nicolas lists up his principles of writing CSS-code. A very good summery of what should be everybody’s guidelines.
This goes deeper then what I wrote about my HTML and CSS Coding Guidelines and it tries to help people collaborating on styles.
“Which CSS preprocessor language should I choose?” is a hot topic lately. I’ve been asked in person several times and an online debate has been popping up every few days it seems. It’s nice that the conversation has largely turned from whether or not preprocessing is a good idea to which one language is best. Let’s do this thing.
Really short answer: SASS
Slightly longer answer: SASS is better on a whole bunch of different fronts, but if you are already happy in LESS, that’s cool, at least you are doing yourself a favor by preprocessing.
Chris Coyier finds an answer to what preprocessor is the better one by pointing out what the advantages of each preprocessor are. And as it turns out SASS is winning the race because it has more power and better features. So if you are asked why you use SASS, you might want to link people to this post.
After Harry Roberts published his HTML/CSS coding style I’ve decided to follow his call and write down how I like to code and what my guidelines for HTML and CSS coding are. This article is only a way to describe what I like to do – but it is by far not a recommendation or something. I have not really tried to “canalize” the coding style I do before but it is about time to do so and to write it down. Please let me know if you think that there are ways to do certain things better or in
Developed at Twitter to support our internal styleguide, RECESS is a simple, attractive code quality tool for CSS built on top of LESS.
Incorporate it into your development process as a linter, or integrate it directly into your build system as a compiler, RECESS will keep your source looking clean and super managable.
As I think reading the source is essential for developers to become good at what they do viewing this source in readable style is essential too. RECESS is a tool which helps you developing good-looking CSS with LESS. It is developed at Twitter and has now been open-sourced.
RECESS is a Node.js module and is maintained by @fat. You can find out more about it by viewing the source at GitHub.
BTW: I’ve decided to not minimize and concatenate my blog’s source anymore. So, feel free to dig deep!
Please read about the updated syntax of CSS variables in the first and second update of this post. Since a little bit more than a month (as of the time of writing) there is a Editor’s Draft for a CSS Variables Module by Google (Tab Atkins and Luke Macpherson) and Daniel Glazman. Just a few days ago the Working Draft was updated. The first draft was written in 2008 by Daniel Glazman but was not added to the official specification. The new WD extends this proposal by Glazman. Disclaimer: This article is part of a small series about the latest
Since the beginning of February there were some proposals for the CSS3 specification. These proposals are not yet part of the specification and will likely be changed until they get adopted by the CSSWG. One of these drafts is the CSS Hierarchies Module Level 3. So what’s the Hierarchies Module? And why “Level 3″? The Hierarchies Module is not exactly new. It exists since the very first steps of CSS and was first released in Dezember 1996 with CSS1. The CSS1 specification is still up, so check it out if you want to. When you write CSS you always use selectors to target
I think all of you know Lea Verou’s dabblet. dabblet is an interactive playground for quickly testing snippets of CSS and HTML code. It uses -prefix-free, so that you won’t have to add any prefixes in your CSS code. You can save your work in Github gists, embed it in other websites and share it with others. ~ About dabblet Some time ago I made this tiny Google Chrome App for jsFiddle which is in case just a bookmarklet with a bigger icon. I did this for dabblet, too but extended the app to something more: It displays all your dabblets
At /gebrüderheitz we use Git as a version control system as we think this is the best to work together on a level which is easy to learn and work with. Before we used Git we’ve used SVN but this is by far not as flexible as Git. There are enough posts gathering the difference between Git and SVN so I will not cover any of these. When working in a team it’s important to keep your different stages of development in sync and control somehow: There is a front-end development going on which is in deep connection with the
