Today I am focusing on the body content of the site. This means designing, testing (desktop), testing (tablet), testing (mobile) and fixing any problems that crop up. Yeah, so you want to be a web designer?
I didn’t make too much progress today. I managed to style the H1 (or article title), article info block (author, publish date, short url, view count), the primary article image and paragraphs. Each of these were styled across the various sizes from desktop wide, desktop narrow, to tablet and mobile phone as you can see in the screen captures below (widest to narrowest window).
Safari browser window showing two columns.
Safari browser window at its widest, one column width.
Safari browser window at a middle width, one column.
Narrowest Safari browser window.
There’s still work to be done on the header, especially when the screen size is in between a mobile phone and a tablet - around 750 pixels. Well, at least I have some direction for my next session.