This website is now responsive! I am happy with what I’ve managed to do, it was fairly simple but good to learn the techniques and increase my knowledge of CSS3 media queries. Responsive web design is something I’m really interested in at the moment, like fitting pieces of a puzzle together, and very satisfying when you get it right!
You can see how my website changes with different screen widths at Responsive.is (a very useful web tool) here: responsive.is/allatsee.com. Toggle between devices using the top bar on that page.
The percentage widths of the left and right columns change as the browser size decreases, and at a certain point the whole layout switches to one column only. Before this weekend I’d been setting my CSS breakpoints to specific sizes to match iPad/iPhone etc., but I read an interesting article about just looking at when the design looks right and wrong and setting those dimensions as your breakpoints. It definitely makes sense to me, especially as the range of dimensions of different devices from Apply, Samsung et al. gets wider.


