<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>theCSSdiv</title>
	<atom:link href="http://www.thecssdiv.co.uk/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.thecssdiv.co.uk</link>
	<description>thinking, drinking and websites from Ross Bruniges</description>
	<lastBuildDate>Mon, 20 May 2013 13:09:17 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.5.1</generator>
<xhtml:meta xmlns:xhtml="http://www.w3.org/1999/xhtml" name="robots" content="noindex" />
		<item>
		<title>The bad week</title>
		<link>http://www.thecssdiv.co.uk/2013/05/the-bad-week/</link>
		<comments>http://www.thecssdiv.co.uk/2013/05/the-bad-week/#comments</comments>
		<pubDate>Mon, 20 May 2013 11:19:16 +0000</pubDate>
		<dc:creator>Ross Bruniges</dc:creator>
				<category><![CDATA[Personal]]></category>

		<guid isPermaLink="false">http://www.thecssdiv.co.uk/?p=305</guid>
		<description><![CDATA[So a few weeks ago if you follow me on Twitter you would have seen me bitching about having a bad week; to be fair I bitch on Twitter about bad days/weeks/months rather more than I would like but mainly because I&#8217;m either extremely frustrated or angry with my personal work performance. Alas this particular [...]]]></description>
				<content:encoded><![CDATA[<p>So a few weeks ago if you follow me on Twitter you would have seen me bitching about having a bad week; to be fair I bitch on Twitter about bad days/weeks/months rather more than I would like but mainly because I&#8217;m either extremely frustrated or angry with my personal work performance. Alas this particular bad week really had nothing to do with work.</p>
<h2>tl;dr</h2>
<ul>
<li>my mum is potentially very ill &#8211; waiting on dr&#8217;s full diagnosis,</li>
<li>I am a diabetic &#8211; this will mean less booze and delicious food</li>
</ul>
<p><span id="more-305"></span></p>
<p>I&#8217;ve got type 2 diabetes &#8211; meaning that it was largely preventable if I had taken a bit more care of myself and tried to live rather less excessively than I have been, but saying that it has been pointed out to me that I&#8217;ve at least done it the right way and ate all the good food opposed to crap but still, not the nicest thing to be told and for someone who likes to beat himself up over his poor choices rather a doozie.</p>
<p>I went to the doctor thinking that my lack of energy was down to me sleeping like shit because of stress/anxiety and while that might still be part of the case it was in fact being made much worse by diabetes.</p>
<h2>So what does this mean?</h2>
<p>The good news is that as it currently stands I don&#8217;t need any pills or injections and can keep things under control with a healthier life-style. Alas I&#8217;m now going to be diabetic for life but I&#8217;m pretty sure I can make this be just a fact rather than something that&#8217;s going to hinder me in any big way, indeed it&#8217;s not like I&#8217;ve felt at my best for a while now so I&#8217;m going to see if I can use this in a positive way.</p>
<h3>Fitness</h3>
<p>It&#8217;s fair to say that I&#8217;ve let this slide rather. I was and never will be a long distance runner but I&#8217;ve dunked basketballs, taken life-guarding grade swimming classes and been a surprisingly fast mover when I need to be.</p>
<p>I&#8217;ve joined a gym, have swum for the first time in probably over 10 years (to amusingly bad results) but I&#8217;ll get there, just need a bit of time for my legs to get used to things.</p>
<p>I like gadgets so I have a fitbit to keep track of things, and to provide me with a bit of a push in regard to doing stuff. It&#8217;s not great viewing right now but my profile is here &#8211; <a href="http://www.fitbit.com/user/25H864">http://www.fitbit.com/user/25H864</a>, feel free to friend me if you want.</p>
<h3>Food</h3>
<p>Along with doing bugger all exercise food is probably my Achilles heel, and indeed it&#8217;s one of very few ways I have to turn my brain off.</p>
<p>I still want to eat good food and I&#8217;m hoping I still can, just maybe a bit less of it. And those nights when I get home late and order take-away will not be happening again. If I get back to where I was before, where good meals out are a treat opposed to just something I do for the sake of it I&#8217;m hoping I should be good with this &#8211; the occasional burrito, home cooked goodness and less crap along with more activity should work out just fine.</p>
<h3>Beer</h3>
<p>Hmm yeah &#8211; I tracked the calories of the beers I was drinking at the last Pub Standards I was at, and it wasn&#8217;t a fun time; indeed I left before it even got dark because it wasn&#8217;t a pretty sight.</p>
<p>As someone who has made a bit of an alter-ego out of my enjoyment of beer this is going to be difficult but I&#8217;m going to have to drink less of the stuff, maybe drink other stuff instead and maybe go for water every now and then &#8211; which to be honest is a drink I enjoy anyways and already drink a fair bit of. Also teas feel like they&#8217;re having rather a renaissance &#8211; in place of wines flights they&#8217;ve started doing tea flights (one of which I&#8217;ve got a review waiting on Ross Eats) and while I&#8217;ve never really been patient enough for teas I might well give them a go.</p>
<p>So yeah &#8211; not the best of weeks but hopefully, at least for me, there are lots of things I can do to make things a lot better. I&#8217;ll keep you all posted.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.thecssdiv.co.uk/2013/05/the-bad-week/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Easy Open Source workflow</title>
		<link>http://www.thecssdiv.co.uk/2013/04/easy-open-source-workflow/</link>
		<comments>http://www.thecssdiv.co.uk/2013/04/easy-open-source-workflow/#comments</comments>
		<pubDate>Sun, 21 Apr 2013 09:03:39 +0000</pubDate>
		<dc:creator>Ross Bruniges</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[guide]]></category>
		<category><![CDATA[needs-screencast]]></category>
		<category><![CDATA[open source]]></category>
		<category><![CDATA[webmaker]]></category>
		<category><![CDATA[webmaker-bitesize]]></category>

		<guid isPermaLink="false">http://www.thecssdiv.co.uk/?p=292</guid>
		<description><![CDATA[So you&#8217;ve found an open source project to contribute to but you don&#8217;t really know where to start? It can all look pretty daunting but the good news is that it&#8217;s just a process of pretty easily repeatable steps; and the idea of this webmaker-bitesize article is to show you those and explain why they&#8217;re [...]]]></description>
				<content:encoded><![CDATA[<p>So you&#8217;ve found an open source project to contribute to but you don&#8217;t really know where to start? It can all look pretty daunting but the good news is that it&#8217;s just a process of pretty easily repeatable steps; and the idea of this <a href="http://www.thecssdiv.co.uk/tag/webmaker-bitesize/">webmaker-bitesize</a> article is to show you those and explain why they&#8217;re required.<span id="more-292"></span></p>
<h2>Assumptions</h2>
<ol>
<li>While the steps I&#8217;ll be outlining are easily reproducible across any version control system the code snippets I&#8217;ll be proving are assuming that we&#8217;re using git.</li>
<li>There are numerous git clients out there but I&#8217;m suggesting that using the CLI (command line interface) is the best way to go. I&#8217;ve not found any desktop client that makes things easy, or in some cases possible. Let me know in the comments if I&#8217;ve overlooked a good one</li>
<li>You&#8217;ve already got a repo checked out locally and set an upstream remote to keep in-sync</li>
</ol>
<h2>tl;dr</h2>
<p>I&#8217;ve written a lot of words with this article where I try and explain what&#8217;s going on. In essence the process is this:</p>
<ol>
<li><code>git checkout master</code></li>
<p><code>git pull upstream master</code></li>
<p><code>git checkout -b branch-name</code></li>
<li>Do work</li>
<li><code>git rebase -i HEAD~{number of local commits you made to fix things}</code></li>
<li><code>git pull --rebase upstream master</code></li>
<li>Send pull request</li>
<li>Go through code review</li>
<li>Party</li>
</ol>
<p>I&#8217;m also feeling that this could be a perfect time for a screen-cast&#8230;</p>
<h2>Getting started</h2>
<p>Before you start coding there are a few things you should do in order to make your code easy for the project team to accept.</p>
<h3>Fix a real issue</h3>
<p>Check the project bug tracker for a bug to fix and assign it to yourself (this will stop anyone else working on it and let people know that you are). If the thing that you want to fix isn&#8217;t found then file a bug yourself (follow my article on <a href="http://www.thecssdiv.co.uk/2013/03/writing-a-good-bug/">good bug writing</a>) and assign it to you.</p>
<h3>Fix one issue at a time</h3>
<p>One problem I&#8217;ve found people get frustrated about is when their pull request gets stuck in limbo because while 90% of it is good the remaining 10% is causing issues; the 90% is good to merge and solves a number of issues but can&#8217;t be because of the stuff holding it up. You can solve this with a bit of focus and in the same way that filing one issue per bug (and not a mega bug with about 5 different problems in them) makes them easier to resolve in your contributions it makes it easier to land in the project.</p>
<h3>Update your local code</h3>
<p>Depending on when you checked out the repo things might have changed a little. Out of habit whenever I start work on a new issue I run:</p>
<pre><code>
git checkout master
git pull upstream master
</code></pre>
<p>This makes sure that you&#8217;re on the master branch and have everything up to date &#8211; meaning that you should be working on the same code as everyone else in the project.</p>
<h3>Work in a branch</h3>
<pre>
<code>git checkout -b branch-name-of-choice</code>
</pre>
<p>Working in a branch means that you&#8217;re always able to update master without worrying about any local changes you might have made to it. This also means that if you need to work on a new bug before finishing an existing one you can just checkout master and create another.</p>
<h2>Do the work</h2>
<p>At this point you&#8217;re ready to work. There is nothing specific to open source projects here and you should work as you normally do. Make sure that you&#8217;re:</p>
<ul>
<li>commenting your code,</li>
<li>writing tests if they&#8217;re needed,</li>
<li>not breaking existing tests.</li>
</ul>
<p>The only thing to look out for is that you&#8217;re following the code writing style of the project &#8211; if variable names are all in camel-case don&#8217;t start naming them with hyphens or underscores, if end line colons are required then don&#8217;t go leaving yours out. Hopefully the project has a CONTRIBUTORS.md file containing this information or a style-guide document to follow.</p>
<h2>Once you&#8217;ve fixed the issue</h2>
<p>You&#8217;ve done the work and fixed the issue. While you could open the pull request now there are a couple of things you can do to make things easier for yourself.</p>
<h3>Send an atomic commit</h3>
<p>In your local branch you might have completed the work over a number of different commits. Locally this is fine but to get into master it&#8217;s good practice to have just one commit. You&#8217;re going to want to do an interactive rebase; this is also sometimes referred to as &#8216;scrunching up your commits&#8217;.</p>
<p>First up see how many commits you&#8217;ve done, for this example I&#8217;ll assume 3 (one for the initial work and another where you fix stuff you didn&#8217;t notice beforehand &#8211; something I do all the time!)</p>
<p>Now run:</p>
<pre><code>git rebase -i HEAD~3</code></pre>
<p>This will give you you&#8217;re list of commits and a few options. Generally what I do is pick the top commit and fix-up all the remaining ones. If you want to change the commit message use reword (instead of pick) and you can do once the rebase has finished.</p>
<div class="photo_frame" style="width: 100%;"><img src="http://content.thecssdiv.co.uk/uploads/2013/04/terminal2.jpg" alt="A terminal window showing the output from running the interactive rebase" width="582" height="367" class="alignnone size-full wp-image-295" />What an interactive rebase looks like</div>
<h3>Update your branch</h3>
<p>Depending on how long the work has taken there is a big chance that something might have been updated in the upstream repo.</p>
<pre><code>git pull --rebase upstream master</code></pre>
<p>Fix any conflicts and once this is complete just re-test your code to make sure it&#8217;s all still working as expected.</p>
<h3>Send in your pull request</h3>
<p>This is done via github. Make sure to reference the bug somehow in the summary or description so people can check that it does what it is supposed to.</p>
<h3>Fixing conflicts while rebasing</h3>
<p>Up to only recently this used to frustrate me no end. The key part is to not commit things once you&#8217;ve fixed the conflicts, just add them and use <code>git rebase --continue</code>. If you commit you&#8217;ll start working on a non-existing branch and leave a incomplete rebase &#8211; and that really is as confusing as it sounds!</p>
<h3>Code review</h3>
<p>Be attentive to any comments made and fix them up (remembering to re-run <code>git rebase -i HEAD~2</code> each time to ensure the atomic commit, you&#8217;ll also need to re-push your branch with the changes to git <code>git push -f origin branch-name</code>).</p>
<p>The code review process is one worthy of it&#8217;s own article but the main thing to remember is that all the comments will be done for reason, and it&#8217;s a conversation so if you&#8217;re unsure on anything please do ask questions!</p>
<h2>Code is merged</h2>
<p>Once you&#8217;ve passed review you&#8217;re code should be merged in &#8211; and you&#8217;re now an open source contributor! Follow these steps each time and it&#8217;ll soon become a habit and second nature.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.thecssdiv.co.uk/2013/04/easy-open-source-workflow/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Writing a good bug</title>
		<link>http://www.thecssdiv.co.uk/2013/03/writing-a-good-bug/</link>
		<comments>http://www.thecssdiv.co.uk/2013/03/writing-a-good-bug/#comments</comments>
		<pubDate>Sat, 09 Mar 2013 14:16:18 +0000</pubDate>
		<dc:creator>Ross Bruniges</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[guide]]></category>
		<category><![CDATA[mozilla]]></category>
		<category><![CDATA[OSS]]></category>
		<category><![CDATA[webmaker]]></category>
		<category><![CDATA[webmaker-bitesize]]></category>

		<guid isPermaLink="false">http://www.thecssdiv.co.uk/?p=281</guid>
		<description><![CDATA[It&#8217;s a bit of a cliche (as google image search show us) but one of the best ways to get contributing to an Open Source (OS) project is to file a bug. It can occasionally seem a pretty silly and frustrating thing but as well as allowing you to tell people that something is broken [...]]]></description>
				<content:encoded><![CDATA[<p>It&#8217;s a bit of a cliche (<a href="http://www.google.co.uk/search?client=safari&#038;rls=en&#038;q='file+a+bug'+meme&#038;oe=UTF-8&#038;redir_esc=&#038;um=1&#038;ie=UTF-8&#038;hl=en&#038;tbm=isch&#038;source=og&#038;sa=N&#038;tab=wi&#038;ei=DB87Ub7JM9SM7AaciYGACg&#038;biw=1056&#038;bih=521&#038;sei=Jx87UcjgG7SS7Aau6ICwBQ#um=1&#038;hl=en&#038;client=safari&#038;rls=en&#038;tbm=isch&#038;sa=1&#038;q=file+a+bug+meme&#038;oq=file+a+bug+meme&#038;gs_l=img.3...5537.6322.4.6608.5.5.0.0.0.0.39.165.5.5.0...0.0...1c.1.5.img.kYN5QYb6AwY&#038;bav=on.2,or.r_qf.&#038;bvm=bv.43287494,d.ZGU&#038;fp=c7350ee933e64c03&#038;biw=1056&#038;bih=521">as google image search show us</a>) but one of the best ways to get contributing to an Open Source (OS) project is to file a bug. It can occasionally seem a pretty silly and frustrating thing but as well as allowing you to tell people that something is broken or a new thing you would like the project to do it also introduces yourself to the existing community, project managers and developers. Filing a bug can seem a little daunting, especially if the developers are people you don&#8217;t know but if you follow some basic steps then you&#8217;ll be in a good place.<span id="more-281"></span></p>
<p>Bugs can come in a couple of flavours, and I&#8217;ve tried to split this guide into two sections to cover this &#8211; <a href="#code_errors">reporting errors</a> and <a href="#feature_requests">asking for new features or enhancements</a>. Depending on what you want to do the required information is a little different.</p>
<h2 id="code_errors">Reporting errors</h2>
<p>It&#8217;s really easy to file a bug saying &#8220;this is broken&#8221; but broken can mean a load of things and can also mean different things to different team members. No one likes having bugs in their projects so the goal here is to provide enough information for people to initially see what the problem is and then understand how it comes about so it can be quickly fixed.</p>
<p>One thing to also remember is that where it comes to errors a load of small bugs are much better than one bug containing multiple issues. If a developer manages to fix all the issues except one (which for whatever reason is too difficult to fix quickly) then the remaining fixes could get held up for ages &#8211; and that&#8217;s not good.</p>
<h3>Information to provide</h3>
<ol>
<li><strong>Briefly describe the problem</strong> &#8211; if you can do this in the bug title then great, if you need a little bit more space then include that first in the description,</li>
<li><strong>URL</strong> &#8211; provide a URL to the page the bug is happening on,</li>
<li><strong>steps to reproduce</strong> &#8211; what did you do to find this bug? Reproduce the error and provide a list of steps that the team can follow so they can see what you&#8217;re seeing. If you&#8217;re filling out a form include what you&#8217;re putting in each field &#8211; as there could be something in there that&#8217;s causing the error,</li>
<li><strong>screenshot</strong> &#8211; if this is a visual bug (things not looking correct or information not displaying as you&#8217;re expecting) then a quick screen-grab will tell a 1000 words,</li>
<li><strong>some technical information</strong> &#8211; not all computers are alike so before it&#8217;s tried on a developer machine and closed as &#8220;works-for-me&#8221; let us know:
<ul>
<li>the operating system (mac OSX, Windows&#8230;),</li>
<li>browser you&#8217;re using (firefox version 19.0.2, IE9&#8230;),</li>
<li>if you&#8217;re using anything other than a desktop or laptop computer what that is (nexus 7, iPhone 5, xbox 360).</li>
</ul>
</li>
</ol>
<p>Remember if extra information is needed then it will be asked for &#8211; but I think in 95% of cases this will be more than enough. Also remember that opening the bug is just the start of the journey and there might be some <a href="#bug-aftercare">additional aftercare</a> needed once work has done on it.</p>
<h2 id="feature_requests">Asking for new features or enhancements</h2>
<p>When you&#8217;re asking for new things to be added to a project you should be looking to provide enough information for the project team to know what exactly you want and (I think most importantly) why you want it.</p>
<h3>Things to tell us</h3>
<ol>
<li><strong>Briefly explain the new feature/enhancement you want</strong> &#8211; if you can do this in the title than great, but an additional paragraph in the description is fine,</li>
<li><strong>inspiration</strong> &#8211; is this a feature that you&#8217;ve seen implemented on another site? If so send us some links so we can see it in action. Is this an idea that you&#8217;ve thought up in your head? Get it out or your head and on some paper and attach your simple (or complex) wireframes to the ticket,</li>
<li><strong>why you want this feature</strong> &#8211; if this is something that you believe will open up the project to new users and markets than that&#8217;s good information for the people who prioritise the work schedule to know.</li>
</ol>
<p>Importantly with feature requests is the aftercare, if you&#8217;re wanting your feature to be developed and made a reality pay attention to my bug updates!</p>
<h2 id="bug-aftercare">A bug is for life&#8230;</h2>
<p>As I mentioned in my opening paragraph filing a bug is the first step into a community around the project, so stick in there until your bugs are closed. If you&#8217;re asked for additional information about something try and provide it as soon as you can, and if a code bug you filed has been reported fixed and pushed to dev take a look to ensure that it has been (and if not provide any new details on the current ticket).</p>
<p>For extra credit if you can fix the bugs you&#8217;re filling then feel free to assign them to yourself and get hacking, what better a way then to introduce yourself to the project <img src='http://www.thecssdiv.co.uk/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
]]></content:encoded>
			<wfw:commentRss>http://www.thecssdiv.co.uk/2013/03/writing-a-good-bug/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Responsive design &#8211; have we come full circle?</title>
		<link>http://www.thecssdiv.co.uk/2013/03/on-responsive-design/</link>
		<comments>http://www.thecssdiv.co.uk/2013/03/on-responsive-design/#comments</comments>
		<pubDate>Sun, 03 Mar 2013 22:09:59 +0000</pubDate>
		<dc:creator>Ross Bruniges</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[conference]]></category>
		<category><![CDATA[mozilla]]></category>
		<category><![CDATA[responsive]]></category>
		<category><![CDATA[tips]]></category>
		<category><![CDATA[webmaker]]></category>

		<guid isPermaLink="false">http://www.thecssdiv.co.uk/?p=272</guid>
		<description><![CDATA[Responsive Day Out, or #responsiveconf (or #beefcheeks) was a one day conference held down in Brighton and organised by Jeremy Keith. The talks were fast and furious (20 minutes each) and followed by a seated discussion on sofa&#8217;s with Jeremy fielding questions from the audience. It was cheap at cheerful (tickets being great value at [...]]]></description>
				<content:encoded><![CDATA[<p>Responsive Day Out, or <a href="https://twitter.com/search?q=%23responsiveconf">#responsiveconf</a> (or <a href="https://twitter.com/search?q=%23beefcheeks">#beefcheeks</a>) was a one day conference held down in Brighton and organised by Jeremy Keith. The talks were fast and furious (20 minutes each) and followed by a seated discussion on sofa&#8217;s with Jeremy fielding questions from the audience. It was cheap at cheerful (tickets being great value at £50) with a good after-party that didn&#8217;t turn into carnage allowed many extended discussions. The excitement around the subject was, as I&#8217;m very old and can remember this kind of stuff rather similar to the early @media&#8217;s revolving around web standards, and on a week were the <a href="http://www.webstandards.org/2013/03/01/our-work-here-is-done/">Web Standards Project</a> shut itself down I was left wondering; have our best practises actually changed?<span id="more-272"></span></p>
<p>While summarising rather the big things that I took away from @media&#8217;s past were:</p>
<ul>
<li>progressive enhancement &#8211; this is the true way to build sites,</li>
<li>content is king,</li>
<li>performance matters,</li>
<li>ensure that you&#8217;re site is useable via devices other than the mouse</li>
</ul>
<p>and after reading my notes from the 12 talks during the day, give or take a few of the reasons behind them being important issues this is what I&#8217;m guessing many people took away from Responsive Day Out, a conference happening a good 4/5 years since @media was at it&#8217;s peak epicness.</p>
<h2>Progressive enhancement</h2>
<p>From some top tips from Richard Rutter on avoiding text-gliches when loading in webFonts, to tips on making sure that your users &#8220;time to content&#8221; is as quick as possible, to advice on how to make sure that your work is viewable on as many devices as possible by starting off with HTML and then layering on your CSS/JS to was clear that any developer at the conference not doing progressive enhancement will hopefully start thinking about and practising it now.</p>
<p>One thing I liked was this code snippet:</p>
<p><code><br />
if('querySelector' in document<br />
     &#038;&#038; 'localStorage' in window<br />
     &#038;&#038; 'addEventListener' in window) {<br />
      CODE!!<br />
     }<br />
</code></p>
<p>from Tom Maslam &#8211; this is what the BBC responsive dev team use to define if a browser is &#8216;modern enough&#8217; to get the full mobile experience.</p>
<p>I&#8217;ve said a few times that I was never sure when progressive enhancement stopped being the top way to build sites but if it gets back into fashion again then that can&#8217;t be anything but a good thing.</p>
<h2>The focus on content, &#8220;content is king&#8221;</h2>
<p>Most of the design talks centred around ensuring that the content that you start with is suitable and consumable on small screen devices. Content out design (all content first then build a site around that) was touched on and a talk about responsive navigation patterns by first time speaker David Bushell started off with him saying that if you don&#8217;t know your content/IA then you may as well just pick any one of the options that he was about to present.</p>
<h2>Performance matters</h2>
<p>Following on nicely from both the content is king and progressive enhancement streams the thing touched on during pretty much all the development talks was performance, and the need that to ensure that low-bandwidth users don&#8217;t get pissed off and leave we have to strive to keep our pages as light weight as possible, or at least give the impression of it being so.</p>
<p>From JS loading strategies, to a couple of tips on caching and image optimisation (*cough cough* &#8211; <a href="http://www.thecssdiv.co.uk/2013/02/images-why-the-right-format-matters/">http://www.thecssdiv.co.uk/2013/02/images-why-the-right-format-matters/</a>) the performance cost of a fast loading site was hammered home. I also found it funny that people were talking about a &#8216;performance budget&#8217; for sites &#8211; meaning to keep things fast and under a specific page weight trade-offs would be made. I remember some developers I used to work with in my very first web-job talking about page weight being important during the dial-up days, and here we are again <img src='http://www.thecssdiv.co.uk/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<h2>Multi-device usage</h2>
<p>Wrapped up in a couple of talks were the need to design/develop your sites for usage with a wide range of input types. I didn&#8217;t twig things during the first time I saw Anna Debenham&#8217;s talk on console browsers the gist of that talk is that while we can&#8217;t guarantee the code support we also can&#8217;t the input device, meaning adding in support for keyboard events like :focus and not relying on :hover are potentially as important to responsive development as coding for touch and swipe events are.</p>
<p>I also liked the sound-bite &#8220;code for one universal event&#8221; (again from David Bushell), doing should also be helped with <a href="https://developer.mozilla.org/docs/CSS/pointer-events">pointer events</a> which got a mention in Bruce Lawson&#8217;s talk. While we were clearly talking about device and console users support the fact that multi-input support is being talked about again I am sure will help with pushing some of the old accessibility practises that seem recently forgotten to the fore again.</p>
<h2>Summary</h2>
<p>That responsive design is scary or that we&#8217;re winging it was repeated a number of times through-out the conference and while from a design perspective I can imagine that from a dev perspective it feels that as long as we continue to stick to our tried and trusted techniques we&#8217;ll at least start off on a very good path that&#8217;s easy to move around on while new best practises are being discovered. </p>
<p><a href="http://lanyrd.com/2013/responsiveconf/coverage/">Full coverage from Responsive Day Out</a> should be up soon on lanyrd, the sessions were recorded so hopefully they&#8217;ll be released soon &#8211; there is some good stuff in there.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.thecssdiv.co.uk/2013/03/on-responsive-design/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Images &#8211; why the right format matters</title>
		<link>http://www.thecssdiv.co.uk/2013/02/images-why-the-right-format-matters/</link>
		<comments>http://www.thecssdiv.co.uk/2013/02/images-why-the-right-format-matters/#comments</comments>
		<pubDate>Sun, 10 Feb 2013 22:34:07 +0000</pubDate>
		<dc:creator>Ross Bruniges</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[mozilla]]></category>
		<category><![CDATA[performance]]></category>
		<category><![CDATA[tooling]]></category>
		<category><![CDATA[webmaker]]></category>
		<category><![CDATA[webmaker-bitesize]]></category>

		<guid isPermaLink="false">http://www.thecssdiv.co.uk/?p=258</guid>
		<description><![CDATA[Websites in the past few years have started to suffer from bloatedness and over-indulgance. People have predicted that an average site may hit 2mb by the end of 2013 which is fairly hefty, especially for people on a slow network or those with a fixed amount of data they can use each month. There are [...]]]></description>
				<content:encoded><![CDATA[<p>Websites in the past few years have started to suffer from bloatedness and over-indulgance. People have predicted that <a href="http://www.webperformancetoday.com/2012/12/11/2013-predictions-page-growth-browser-wars-mobile-web-performance/">an average site may hit 2mb by the end of 2013</a> which is fairly hefty, especially for people on a slow network or those with a fixed amount of data they can use each month. There are lots of code refactoring processes that can be done to improve things but you don&#8217;t need to be a coder to make your site faster &#8211; just use the correct image for the subject matter it contains and you can make some amazing size savings.<span id="more-258"></span></p>
<p>The three image formats I&#8217;m going to cover are .gifs, .pngs and .jpegs &#8211; they all have a subject matter that suits them best. Using the correct one can save you a ton in page weight.</p>
<h2>jpegs</h2>
<p>Simply put &#8211; if you&#8217;re uploading a photo always use a jpeg. </p>
<p>JPEG stands for &#8220;Joint Photographic Experts Group&#8221; and is named after the committee that created the standard &#8211; pretty much meaning that it&#8217;s specifically MADE for photos and made by the EXPERTS in this field &#8211; listen to them!</p>
<div class="photo_frame" style="width:100%"><img src="http://content.thecssdiv.co.uk/uploads/2013/02/food-jpeg.jpg" alt="food-jpeg" width="620" height="465" class="alignnone size-full wp-image-262" />A jpeg of some delicious food &#8211; 45kb</div>
<p>If you&#8217;re creating a new file make sure to play around with the quality setting &#8211; if you start off with a high-res image you can reduce the quality (and filesize) with in many cases no obvious visual loss. Be aware that each time you re-save a jpeg it will automatically loose some visual quality so always try and work on hi-res or original files.</p>
<h2>pngs</h2>
<p>Use a PNG for graphics, logos and anything requiring a transparent background.</p>
<p>PNG stands for &#8220;Portable Network Graphic&#8221; and like jpegs the hint is in the name, GRAPHICS. Image software tools provide a number of settings on transparency type, matting and colour dpeth that can squeeze out as many bytes as possible and still provide a crisp image with a smooth edge.</p>
<div class="photo_frame" style="width:100%"><img src="http://content.thecssdiv.co.uk/uploads/2013/02/food-png.png" alt="food-png" width="620" height="465" class="alignnone size-full wp-image-261" />The same delicious food but now a png; and 445kb (10 times bigger)</div>
<p>They come in two flavours &#8211; 24 and 8 bit. If IE6 support is still important you need to use 8-bit, if not 24 bit will give a slightly larger filesize but a much better quality image.</p>
<h2>gifs</h2>
<p>It used to be that gifs were the image format of choice for transparency but with the introduction of PNGs the one main use for gifs online are to spread animated fun and laughter through sites like &#8211; <a href="http://memebase.cheezburger.com/senorgif">memebase.cheezburger.com/senorgif</a> and <a href=http://giphy.com/">giphy.com/</a>.</p>
<p>If you have a flat graphical logo and you really want to squeeze every last byte out of your page weight a gif might just do the job.</p>
<h2>other image formats</h2>
<p>There are other image formats, here are my feelings on using them on the web.</p>
<h3>bitmaps or tiffs</h3>
<p>Please do not use them in your websites.</p>
<h3>webp</h3>
<p>Something to look out for. This is a new image format and one that is said to provide images a good percentage smaller than both jpeg and png. The problem right now is lack of good out the box browser support but it&#8217;s worth having a look out for updates on <a href="https://developers.google.com/speed/webp/">developers.google.com/speed/webp/</a>.</p>
<p class="alert">
Bruce Lawson has provided a nice post around the benefits of webP, and also the downsides in implementing it right now if easy cross-browser support is required, have a read over on his blog &#8211; <a href="http://www.brucelawson.co.uk/2013/save-bandwidth-webp-with-fallback/">save-bandwidth-webp-with-fallback</a></p>
<h2>And finally</h2>
<p>Once you&#8217;ve got the right format in place you can save even more bytes through running your images through an image optimisation tool. The best one I&#8217;m aware of is <a href="http://imageoptim.com/">imageOptim</a>, it&#8217;s free and can always seem to squeeze some file size out of somewhere.</p>
<p>I hope this little article helps you with your 2013 webpage diet, I think we could all do with shedding some bytes somewhere!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.thecssdiv.co.uk/2013/02/images-why-the-right-format-matters/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		</item>
		<item>
		<title>to 2013 and beyond&#8230;</title>
		<link>http://www.thecssdiv.co.uk/2013/01/to-2013-and-beyond/</link>
		<comments>http://www.thecssdiv.co.uk/2013/01/to-2013-and-beyond/#comments</comments>
		<pubDate>Wed, 23 Jan 2013 13:24:11 +0000</pubDate>
		<dc:creator>Ross Bruniges</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[mozilla]]></category>
		<category><![CDATA[Rants]]></category>
		<category><![CDATA[review]]></category>
		<category><![CDATA[webmaker]]></category>
		<category><![CDATA[work]]></category>

		<guid isPermaLink="false">http://www.thecssdiv.co.uk/?p=241</guid>
		<description><![CDATA[If this blog is anything to go by all I ended up doing in 2012 was kill off a website, LOOK for a new member of the Mozilla Foundation WebDev team and rage tweet to near comedic levels. Thankfully that doesn&#8217;t paint the entire picture but it&#8217;s not like anyone really knows this as instead [...]]]></description>
				<content:encoded><![CDATA[<p>If this blog is anything to go by all I ended up doing in 2012 was kill off a website, LOOK for a new member of the Mozilla Foundation WebDev team and rage tweet to near comedic levels. Thankfully that doesn&#8217;t paint the entire picture but it&#8217;s not like anyone really knows this as instead I decide to talk about my beer consumption and how angry I am at various things; I want 2013 to be better. <span id="more-241"></span> If I have a couple of goals for this year (not calling it a resolution as I strongly believe they&#8217;re made to be broken) it&#8217;s to try and focus my communications on the more positive things I&#8217;m up to and trying to get back to doing the things that I&#8217;m passionate about in webdev &#8211; code quality, accessibility, structure and maintainability (a lot of things that unfortunately suffered last year due to my many horrendous deadlines).</p>
<p>To put this in perspective last year&#8217;s positive achievements include:</p>
<ul>
<li>launching and then supporting <strong>8</strong> new websites,</li>
<li>upgrading &#8216;Team Ross&#8217; into &#8216;Team WebDev&#8217; by bringing <a href="http://andrewhayward.net">Andrew Hayward</a> into the Mozilla Foundation,</li>
<li>helping in a number of events being run inside and outside of @MozLdn (our lovely office in Leicester Square).</li>
</ul>
<p>And you thought all I did was drink and swear.</p>
<div class="photo_frame" style="width:100%;"><img src="http://content.thecssdiv.co.uk/uploads/2013/01/mozfest.jpg" alt="" width="620" height="377" class="alignnone size-full wp-image-248" />MozFest &#8211; an amazing event (with a blimp) that I was largely silent about (original photo by <a href="http://www.flickr.com/photos/paul_clarke/8171657974/in/gallery-mozilladrumbeat-72157631972716459/">paul_clark</a>)</div>
<p>So how am I going to manage these things?</p>
<h2>Work load</h2>
<p>Last year I certainly did too much, it got to about November and I was gone, dead on my feet and running on fumes. 8 websites aren&#8217;t too much work if they&#8217;re equally dispersed through-out the year, but when you get to the point when you&#8217;re being asked to launch a number of these sites in the same week (some the same day) that&#8217;s something you can&#8217;t continue doing for long. One of the initial changes that has been made in 2013 was to remove &#8216;Team WebDev&#8217; and bring it into the greater Mozilla Foundation engineering team. This means that I&#8217;m no longer a team lead and I don&#8217;t manage anyone but hopefully should have the positive of meaning that I&#8217;ll no longer have to do the majority of my work on my own. We&#8217;ve got a fairly big team now in the Foundation and some very clever people are part of it so this sounds like nothing but progress.</p>
<div class="photo_frame" style="width:100%"><img src="http://content.thecssdiv.co.uk/uploads/2013/01/source.jpg" alt="source" width="620" height="377" class="alignnone size-full wp-image-250" />This is Erin Kissane talking to someone at MozFest, probably about a website I made with her and a bunch of other cool people called <a href="http://source.mozillaopennews.org">source.mozillaopennews</a>. I&#8217;m glad someone said something about it because I didn&#8217;t (original photo by <a href="http://www.flickr.com/photos/mozillaeu/8170105935/in/gallery-mozilladrumbeat-72157631972716459/">mozillaeu</a>)</div>
<h3>External contributions</h3>
<p>I look on with envy at the work that the Mozilla community get up to on Firefox, FirefoxOS and our larger website projects. I&#8217;m hoping this year that we manage to get webmaker tapping into that community too. We&#8217;re already moving our stuff around to make things easier to find and easier to work on (more details coming soon) and we&#8217;re hoping to learn from our own popcorn dev team to see how they managed it. This is probably what I&#8217;m most looking forward to as I&#8217;m also hoping that this kicks off a greater level of process around code-review, code-quality and standards.</p>
<h2>Out-reach</h2>
<p>As I found last year people aren&#8217;t going to be able to contribute and be interested in what I&#8217;m doing unless I talk about it. Obviously the blog is a big part of this &#8211; and already I&#8217;ve hit the 50% mark in equaling my post total from last year but I&#8217;m trying to also be picky with the conferences I go to. I&#8217;m still at my most comfortable when in a pub with a pint talking about our Mozilla projects so I&#8217;m aiming to go to things with a lot of interested, or potentially interested folk with the skills we&#8217;re looking for that can help us out, or can show us how to be better.</p>
<p>I&#8217;ve got a pretty good schedule of events lined up so far, so if you want to chat about what we&#8217;re up to please come and say hello.</p>
<div class="lanyrd-target-splat">
<p><a href="http://lanyrd.com/profile/rossbruniges/" class="lanyrd-splat" rel="me">See my conferences on Lanyrd</a></p>
</div>
<h2>And finally&#8230;</h2>
<p>Let this be my stick in the sand while 2013 is still really getting going. I hope at the end of the year I can say that I&#8217;ve met my years work goal of:</p>
<blockquote>
<p>&#8220;Trying to focus more on quality opposed to just getting shit done &#8211; quality of code, experience, accessibility and the ability for potential contributors to pick up and run/contribute to what we&#8217;re doing&#8221;</p>
</blockquote>
<p>If it looks like I&#8217;m not getting there please kick me.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.thecssdiv.co.uk/2013/01/to-2013-and-beyond/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Retiring drumbeat.org &#8211; our plans</title>
		<link>http://www.thecssdiv.co.uk/2012/02/retiring-the-drumbeat-website/</link>
		<comments>http://www.thecssdiv.co.uk/2012/02/retiring-the-drumbeat-website/#comments</comments>
		<pubDate>Fri, 17 Feb 2012 11:27:41 +0000</pubDate>
		<dc:creator>Ross Bruniges</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[drumbeat]]></category>
		<category><![CDATA[make.mozilla.org]]></category>
		<category><![CDATA[mozilla]]></category>

		<guid isPermaLink="false">http://www.thecssdiv.co.uk/?p=192</guid>
		<description><![CDATA[Drumbeat.org in it&#8217;s current state has been live for a year and has helped support the Drumbeat community that: has produced numerous projects that have since become core components to the Mozilla Foundations work efforts, helped us run international events in Barcalona and London, lead numerous community events worldwide. We wanted a platform where people [...]]]></description>
				<content:encoded><![CDATA[<p>Drumbeat.org in it&#8217;s current state has been live for a year and has helped support the Drumbeat community that:</p>
<ul>
<li>has produced numerous projects that have since become core components to the Mozilla Foundations work efforts,</li>
<li>helped us run international events in Barcalona and <a href="http://www.mozillafestival.org">London</a>,</li>
<li>lead numerous community events worldwide.</li>
</ul>
<p>We wanted a platform where people could let people could tell the world about their web projects, have the community help them out and have them made better. We received loads, with some of my favourites being:</p>
<ul>
<li><a href="http://mozillapopcorn.org/">popcorn.js</a></li>
<li><a href="https://drumbeat.org/en-US/journalism/">the Mozilla Journalism project</a></li>
<li><a href="http://hackasaurus.org/en-US/">Hackasaurus</a></li>
<li><a href="http://www.universalsubtitles.org/en/">Universal Subtitles</a></li>
<li><a href="http://www.newsocialweb.org/">The New Social Web Project</a></li>
<li><a href="http://www.booki.cc/">Social Book Publishing</a></li>
<li><a href="http://p2pu.org/en/">Peer to Peer University</a></li>
<li><a href="http://http://openbadges.org/">the Open Badges Initiative</a></li>
</ul>
<p>These are all amazing projects but you might have noticed one thing &#8211; they&#8217;ve all now outgrown what we provide at drumbeat.org.<span id="more-192"></span> They have their own websites and twitter streams with some having their code posted on github for community involvement.</p>
<p>Now we have these tools and sites we&#8217;re looking at moving our focus from being a community of web builders to a community of web makers who will use the tools that we have previously made. We think it&#8217;s time that we let it relax in a warm chair by the fire with its&#8217; coat and slippers and remember the good old days and gaze lovingly at what the things that it has created go on to become. Last year when we carried out a survey on <a href="http://openmatt.wordpress.com/2011/08/25/the-evolution-of-drumbeat-org/">how we could evolve drumbeat.org</a> and discovered the two main reasons we found on why people were signing up was to hear about what Mozilla are up to and to contribute to an existing drumbeat project. Thankfully our plans for drumbeat.org will allow people to continue doing that.</p>
<h2>So what does this mean for you?</h2>
<p>On March 1st we will be turning off new site registrations, new projects and existing project content updates; recently the number of new projects coming in has dwindled and project updates have contained large amounts of spam anyways.</p>
<p>drumbeat.org will remain live but will be used to direct people to our site for web makers (URL to be decided) and provide access to the now external websites of our major drumbeat projects. It will be used to tell the story of what it created and what Mozilla are doing with those creations.</p>
<h3>What about my project page?</h3>
<p>On March 1st your project page will be turned off and redirect users to the homepage (drumbeat.org). If you let us know we can set up redirects from your project page to your new web presence so to not loose any SEO-juice you&#8217;ve built up. Please contact us or leave a comment below and provide the drumbeat URL and where you would like us to point that to. Using Hackasaurus as an example that would be https://drumbeat.org/en-US/projects/hackasaurus/ and http://hackasaurus.org</p>
<h3>What can I do to keep my project alive?</h3>
<p>As mentioned above if you&#8217;ve already set up an external project website it will be fine. Up to March 1st you may also use our site messaging system to message your followers of your plans. If not then there are numerous online tools that are free and can be used to keep people informed.</p>
<h4>Project updates</h4>
<p>Set up a project blog! There are many free options out there, some we would recommend are <a href="https://www.tumblr.com/">tumblr</a>, <a href="http://www.blogger.com/">blogger</a> or <a href="http://wordpress.com/">wordpress</a>.</p>
<p>If you&#8217;re looking for more short-hand options then creating a twitter feed, status.net stream or a hash tag for people to message at should be able to be integrated into your chosen blog easily.</p>
<h4>Code updates</h4>
<p>If you want people to be able to download, use, alter and potentially improve your code and you haven&#8217;t already then we recommend getting into an online code repository. This also comes with the benefit of your code being stored in the cloud and therefore safe from laptop failures.</p>
<p>The most popular is probably <a href="http://github.com">github.com</a> but if you&#8217;re familiar with version control systems other than git there are <a href="http://code.google.com/hosting/">google code</a> (with gives you Subversion, Mercurial AND git) and <a href="https://bitbucket.org/">bitbucket</a> (which gives you git and Mercurial).</p>
<h2>So what does this mean for drumbeat?</h2>
<p>We feel that drumbeat has been a huge success, the projects that it has made, the community that it has created and the people that it has put as into contact with. In 2012 we&#8217;re so excited to see how this community can help us more forward and make the next generation of web makers. You can read more about our our future plans over at <a href="http://openmatt.wordpress.com/2012/02/16/byebyedrumbeat/">http://openmatt.wordpress.com/2012/02/16/byebyedrumbeat/</a></p>
<p>We will also be blogging more about where we will be taking the Mozilla Foundation online presence. We&#8217;ll be doing it in iterations and in the open so feedback is always welcome. Keep your eyes posted on <a href="http://planet.drumbeat.org">our RSS feeds</a> for further information.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.thecssdiv.co.uk/2012/02/retiring-the-drumbeat-website/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Come work with me for the Mozilla Foundation</title>
		<link>http://www.thecssdiv.co.uk/2012/02/come-work-with-me-at-mozilla/</link>
		<comments>http://www.thecssdiv.co.uk/2012/02/come-work-with-me-at-mozilla/#comments</comments>
		<pubDate>Wed, 08 Feb 2012 14:30:45 +0000</pubDate>
		<dc:creator>Ross Bruniges</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[drumbeat]]></category>
		<category><![CDATA[job]]></category>
		<category><![CDATA[mozilla]]></category>
		<category><![CDATA[teamross]]></category>
		<category><![CDATA[webmakers]]></category>

		<guid isPermaLink="false">http://www.thecssdiv.co.uk/?p=208</guid>
		<description><![CDATA[We&#8217;re looking to recruit this week (14th March 2012) &#8211; watch this space! At the moment I&#8217;m the only developer on my team at Mozilla, in fact I&#8217;m the only person in my team. I am &#8220;Team Ross&#8221;. Thankfully in March this will change, we&#8217;ve already hired a designer and we&#8217;re looking to add at [...]]]></description>
				<content:encoded><![CDATA[<div class="alert">
<p>We&#8217;re looking to recruit this week (14th March 2012) &#8211; watch this space!</p>
</div>
<p>At the moment I&#8217;m the only developer on my team at Mozilla, in fact I&#8217;m the only person in my team. I am &#8220;Team Ross&#8221;. Thankfully in March this will change, we&#8217;ve already hired a designer and we&#8217;re looking to add at least another developer to work on supporting the Mozilla Foundations work, events and communities.</p>
<p>If that&#8217;s already got you wanting to apply then please have a read of the job spec and get your application in &#8211; <a href="http://careers.mozilla.org/en-US/position/oIkXVfwE">http://careers.mozilla.org/en-US/position/oIkXVfwE</a>.<span id="more-208"></span> If you&#8217;re looking for more information please read on&#8230;</p>
<h2>What will I be working on?</h2>
<p>Short answer &#8211; lots!</p>
<p>Detailed answer &#8211; just this week we&#8217;ve launched a the new <a href="http://www.mozillaopennews.org/">Knight-Mozilla Open News partnership</a>. The site right now is pretty basic and there are tons of improvements that need to be made. We want to do something around our events platform, including getting an events platform; you can read more about that through the thoughts of <a href="http://engagingopenly.wordpress.com/2012/02/06/the-infrastructure-for-self-organizing/">Ben Simon on the infrastructure of self-organising</a> and <a href="http://michellethorne.cc/2012/02/feature-requests-for-webmakers/">Michelle Thorne on potential feature requests for web makers</a> (trying to crowd source what things we might initially need). Mozilla are running a partnership with the National Science Foundation, Geni, Ignite and the White House called <a href="http://www.mozillaignite.org">Mozilla Ignite</a> so there is work to be done on that site as we build out the feature set there. Then there is the <a href="http://www.mozillafestival.org">Mozilla Festival</a>&#8230; So yeah, we&#8217;ll make sure you don&#8217;t get bored.</p>
<div class="photo_frame" style="width: 100%;"><img class="alignnone size-full wp-image-219" src="http://www.thecssdiv.co.uk/wp-content/uploads/2012/02/392019020_5b8714d802_z.jpg" alt="" width="640" height="480" />&#8220;Team Ross&#8221; as it currently stands (or sits) &#8211; come make it a proper team!</div>
<p>Of course all of your work will happen in the open &#8211; your code will be on github, our dev servers will have public access as will our bug tracking systems and wikis. I&#8217;ve found this a really exciting part of the job so far and it&#8217;s certainly not as scarey as you think it might be &#8211; people when commenting on your code are helping you make it better and there is a global knowledge base to tap into.</p>
<h2>What technology will I be using?</h2>
<p>Mozilla are a web company so everything will be based around HTML5. Server side we&#8217;ve got projects running on Django (using <a href="https://github.com/mozilla/playdoh">Mozilla Playdoh</a>), nodejs and wordpress. We&#8217;re not tied to one technology and decide on a project by project basis what is the best fit in terms of what&#8217;s most useful for the client and can produce the best experience for our end users.</p>
<h2>Where can I work from?</h2>
<p>Mozilla have, or soon will have offices in 9 locations worldwide but also are very open to remote working. So where ever you are reading this from if you think you&#8217;re a good fit then please apply!. London will have it&#8217;s office opening in the next month or so, I&#8217;ve been in, it&#8217;s looking great and has a good location in Covent Garden; it will also come with it&#8217;s own bar!</p>
<h2>So where do I apply?</h2>
<p>As mentioned above you can apply (don&#8217;t forget to include a github/bitbucket/googlecode URL) at <a href="http://careers.mozilla.org/en-US/position/oIkXVfwE">http://careers.mozilla.org/en-US/position/oIkXVfwE</a></p>
<p>Any further questions then please ask in the comments.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.thecssdiv.co.uk/2012/02/come-work-with-me-at-mozilla/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Writing jQuery/javascript that doesn&#8217;t suck</title>
		<link>http://www.thecssdiv.co.uk/2011/07/london-jquery/</link>
		<comments>http://www.thecssdiv.co.uk/2011/07/london-jquery/#comments</comments>
		<pubDate>Sun, 03 Jul 2011 15:06:13 +0000</pubDate>
		<dc:creator>Ross Bruniges</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[accessibility]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[performance]]></category>

		<guid isPermaLink="false">http://www.thecssdiv.co.uk/?p=165</guid>
		<description><![CDATA[At the start of the year I was asked by the London Web Standards Group to do a talk at their January meet-up and after a bit of thinking I decided to talk about writing jQuery/javaScript that doesn&#8217;t suck; I&#8217;ve had to clean up plenty of badly written code in the past and I therefore [...]]]></description>
				<content:encoded><![CDATA[<p>At the start of the year I was asked by the London Web Standards Group to do a talk at their January meet-up and after a bit of thinking I decided to talk about writing <del datetime="2011-07-03T14:15:15+00:00">jQuery</del>/javaScript that doesn&#8217;t suck; I&#8217;ve had to clean up plenty of badly written code in the past and I therefore thought I had some decent things to say. It must have gone well as the London jQuery user group asked me to give it again in their July met-up (which is on the 4th July). I included reference to plenty of external sites in the talk and they can ALL be found in this post (and a few extra bonuses).<span id="more-165"></span></p>
<h2>The slides</h2>
<div style="width:425px" id="__ss_8494444"><strong style="display:block;margin:12px 0 4px"><a href="http://www.slideshare.net/rossbruniges/writing-jquery-that-doesnt-suck-london-jquery" title="Writing jQuery that doesn&#39;t suck - London jQuery">Writing jQuery that doesn&#39;t suck &#8211; London jQuery</a></strong><object id="__sse8494444" width="425" height="355"><param name="movie" value="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=london-jquery-110703094724-phpapp02&#038;stripped_title=writing-jquery-that-doesnt-suck-london-jquery&#038;userName=rossbruniges" /><param name="allowFullScreen" value="true"/><param name="allowScriptAccess" value="always"/><embed name="__sse8494444" src="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=london-jquery-110703094724-phpapp02&#038;stripped_title=writing-jquery-that-doesnt-suck-london-jquery&#038;userName=rossbruniges" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="355"></embed></object>
<div style="padding:5px 0 12px">View more <a href="http://www.slideshare.net/">presentations</a> from <a href="http://www.slideshare.net/rossbruniges">Ross  Bruniges</a>.</div>
</div>
<h2>The links</h2>
<h3>Organisation</h3>
<ul>
<li><a href="http://www.jslint.com/lint.html">JS Lint &#8211; the official site</a></li>
<li><a href="http://www.crockfordfacts.com">Crockford Facts</a></li>
<li><a href="http://addyosmani.com/blog/essentialjsdesignpatterns">Essential JavaScript and jQuery design patterns &#8211; FREE BOOK</a></li>
<li><a href="http://requirejs.org/">requireJS</a></li>
<li><a href="http://stackoverflow.com/questions/184618">A thread on amsuing thread on &#8216;best code comments&#8217;</a></li>
<li><a href="http://code.google.com/p/jsdoc-toolkit">JSDocToolkit &#8211; project page on Google code</a></li>
<li><a href="http://24ways.org/2010/documentation-driven-design-for-apis">Documentation-Driven Design for APIs by Frances Berriman on 24ways.org</a></li>
</ul>
<p>I like running jsLint as part of my build process, and it&#8217;s actually pretty easy. If you&#8217;re using the <a href="https://github.com/paulirish/html5-boilerplate">HTML5 boiler plate</a> it&#8217;s built into that and if you&#8217;re a git user you can install which runs it against your JS on each include and warns you of any problems &#8211; <a href="http://jish.github.com/pre-commit/">git pre-commit</a>.</p>
<h3>Performance</h3>
<ul>
<li><a href="http://www.slideshare.net/danwrong/java-script-fu-media-london">The Mysteries of JavaScript Fu by Dan Webb</a></li>
<li><a href="http://brandonaaron.net/blog/2010/03/4/event-delegation-with-jquery">Event delegation with jQuery by Brandon Aron</a></li>
<li><a href="http://dev.opera.com/articles/view/efficient-javascript/?page=all">Writing Efficient JavaScript by Mark &#8216;Tarquin&#8217; Wilton-Jones on dev.Opera</a></li>
</ul>
<h3>Don&#8217;t forget your accessibility</h3>
<ul>
<li><a href="http://juicystudio.com/article/making-ajax-work-with-screen-readers.php">Making AJAX work with screen-readers</a></li>
<li><a href="https://developer.mozilla.org/en/AJAX/WAI_ARIA_Live_Regions">WAI ARIA live regions on Mozilla Developer Center</a></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.thecssdiv.co.uk/2011/07/london-jquery/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Another weird IE6 (and 7 and 8) bug</title>
		<link>http://www.thecssdiv.co.uk/2009/08/another-weird-ie6-bug/</link>
		<comments>http://www.thecssdiv.co.uk/2009/08/another-weird-ie6-bug/#comments</comments>
		<pubDate>Mon, 24 Aug 2009 20:56:15 +0000</pubDate>
		<dc:creator>Ross Bruniges</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[browsers]]></category>
		<category><![CDATA[bug]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[fail]]></category>
		<category><![CDATA[ie]]></category>

		<guid isPermaLink="false">http://www.thecssdiv.co.uk/?p=223</guid>
		<description><![CDATA[This morning I saw an email going around the LBi mailing list from one of the application developers mentioning some weird behavior noticed in IE. In a nutshell a load of CSS modules had been concatenated into one file leading to quite a large number of selectors being used. He found that after a certain [...]]]></description>
				<content:encoded><![CDATA[<p>This morning I saw an email going around the <a href="http://www.lbi.com/en/London/">LBi</a> mailing list from one of the application developers mentioning some weird behavior noticed in IE.</p>
<p>In a nutshell a load of CSS modules had been concatenated into one file leading to quite a large number of selectors being used. He found that after a certain point (4096 selectors) IE would ignore everything after it. I had never heard of this before and from reading some comments I got on Twitter a few other folk hadn’t either…<span id="more-223"></span></p>
<p>My boss found this online which would hint to it being this being true &#8211; <a href=http://msdn.microsoft.com/en-us/library/aa358796%28VS.85%29.aspx">http://msdn.microsoft.com/en-us/library/aa358796%28VS.85%29.aspx</a> but this being a DOM method I wanted to make sure the same went for the CSS parser.</p>
<p>After a chat with <a href="http://www.kryogenix.org/">Stuart Langridge</a> (who provided me with a useful python script to make the file) I have a use case and confirm this bug does indeed exist in IE &#8211; even in IE8.</p>
<p>Scroll down to the bottom of this iFrame (make sure you’re using IE) and you’ll see the final 5 ‘OK’s are in the default of black and not red as they should be styled! If you’re not a fan of iFrames it’s also availiable as an external link &#8211; <a href="http://thecssdiv.co.uk/downloads/crazy_selector_test.html">IE 4096 selector usecase</a>.</p>
<p><iframe src="http://www.thecssdiv.co.uk/downloads/crazy_selector_test.html" width="400" height="400"></iframe></p>
<p>In additional news IE will also bork when presented with more than 32 @import statements (<a href="http://www.agum.com/web/2008/03/11/internet-explorer-issue-maximum-of-32-css-import/">http://www.agum.com/web/2008/03/11/internet-explorer-issue-maximum-of-32-css-import/</a>) so in many ways if you have a shed load of CSS you’re damned if you do and damned if you don’t!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.thecssdiv.co.uk/2009/08/another-weird-ie6-bug/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>
