Enter your email address and a message in the form to get in touch.
Alternately, you can contact me on twitter.
123 Street Avenue, City Town, 99999
(123) 555-6789
email@address.com
You can set your address, phone number, email and site description in the settings tab.
Link to read me page with more information.
This is a collection of the articles I've written over the past 8 years, I've edited and tidied them up for clarity. I also got rid of a lot of older, less relevant (read: stupid) articles. I'm going for clean, and quality.
Filtering by Tag: CSS,HTML,Markup
A quick note about the concept of retrofitting responsiveness onto existing websites - is it feasible? how well does it work? We're in the process of trying it out with Costhetics - one of our clients..
Read MoreOne of the things i'm doing at the moment (very slowly) is converting all my CSS to SCSS. I find the maintainability so much better - today i found a tool to convert existing CSS to SCSS. Not bad.
Read MoreSo, this week I've been teaching web design at Shillington College in Sydney. Today we had an interesting discussion about <section> vs <div> for marking up regions on a page in HTML5 - in our case: particularly the main content region (which previously we style as <div id="content">. The debate stemmed from the (somewhat obsessive) idea that <div>'s are evil.
Read MoreSo lets try and clarify what semantic markup is and what significance it has to the web designer.
Semantics is the study of meaning. Semantic markup is markup that has meaning, the idea is tha the tags you choose add to the overall meaning of the content you are marking up. The earliest (and simplest) example of this is the argument between strong and b tags. Semantically the strong tag has meaning, it implie strong emphasis, and thus conveys added meaning. Whereas the b tag just implies bold, a purely visual characteristic.
A second example is the markup for the nav of your page. Semanticly it makes more sense to mark the navigation elements up inside a unordered list, because nav is in fact a list of items on the site.
So..
<ul class="nav">
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Item 3</a></li>
</ul>
..is semantically more correct than using DIV tags or even just A tags in a paragraph, like this:
<p>
<a href="#">Item 1</a> |
<a href="#">Item 2</a> |
<a href="#">Item 3</a>
</p>
Semantically relevant code also allows screen readers and other machine based clients to better understand the meaning of the content in your markup. Hopefully that clears up the idea.
A really simple (and old/obvious) tutorial for building an accessible HTML menu using a CSS styled UL - common practice. Styling the nav of a site is something we do.. well, everytime we build a site. The nav of a site is one if the most important (and often most neglected) elements. So what can we do to make sure our nav is as accessible as possible?
Read MoreThe original blog post about monitter.com - outlining the process behind a weekend build.
Read MoreAfter reading a post over at Jonathon Snook's blog about CSS resets (which I also don’t use). I found myself thinking about whether I care if my designs are implemented pixel perfect in all browsers. The short answer is: no. Pixel perfection is a thing of the past - pure and simple. The mantra "content is king" isn't just a mantra anymore - pixel perfection was never relevant. But now it's absurd.
Read More