csste.st

How do you test CSS? Being a declarative language, when you say you want a heading to be blue, it is simple as writing h1 { color: blue }. But, even if changes that you make to your stylesheets may seem innocuous, they may lead to unintended, far-reaching consequences. This site has built up a collection of resources on best practices for testing CSS; from image diffing, to syntax linting. Definitely a great starting point for any front end developer.

permalink

prose.io

Prose is a web based graphical user interface for writing posts in Markdown; it is perfect for those who want to start writing a static blog, but want the rich editing functionality of a WYSIWYG editor. It gives you a clean, minimal environment for writing and previewing your articles, plus it is integrated with GitHub so that you can commit your writing directly to your blog's repository. In all, a very useful tool, go take a look!

permalink

perf-tooling.today

A fantastic resource for front end developers; includes a searchable list of tools that you can use for performance optimisation, plus books, presentations, and articles on the subject. Definitely worth taking a look at.

permalink

More powerful Markdown with custom renderers

Markdown is great if you just want to put your thoughts down somewhere; its plain text, no-nonsense approach means that it is much easier to focus on actually writing an article, rather than messing around with different HTML elements & classes. However, what if we're using a framework such as Bootstrap, which has great blockquote styling, but only if we structure our HTML a certain way?

Continue reading...

Automating coding style

Coding style is important. So important, that people can be outright religous about what some may feel is insignificant. Tabs, or spaces? 2 space indent, or 4? Do we keep the last line of a file, and what should happen to trailing spaces should they remain in our pristine source code? Of course, there are many opinions on the subject, but the one thing that has stuck with me is that any such style rules should be discussed with those who are coding the product, and then set in stone and enforced by software.

Continue reading...

Better ampersands & how to achieve them with unicode range

Recently, I discovered this article on unicode-range—it was definitely worth a read. While Firefox still doesn't support this technique (it's coming in version 36), one of the things that I found really interesting about it was that it is possible to do this sort of thing in text. It feels really wrong doing this:

Continue reading...

Taming the Beast: Optimising Bootstrap 3

One of the great things about Bootstrap is that it offers a strong foundation on which to build a website or web application. The documentation is extensive, it offers many components for common use cases, and it lends itself to rapid development. However, when deploying to production, it can seem less appealing. CSS files produced by Bootstrap tend to be over 100KB, and that's before you start adding your own custom rules. Especially when developing a small website, it is unlikely that you'll need all of the elements that it has to offer.

Continue reading...