We’re in the process of updating the content on the Nanofolio micro-site: What is nanotechnology?, and as a first stage we’ve upgraded the existing templates to HTML5, and added an element of responsive design.
The old site had a ‘flexible design’, so the page could be as wide as the monitor allowed. When it was first built the lack of an upper limit on width was not an issue, as monitors were only just beginning to break the old vacuum tube influenced 800x600px barrier…
Our new styling limits the maximum page width to 1000px, this is the largest readable width for the site, beyond this and lines of text are really hard to read.
Additionally, the old site did not display well on very narrow displays, as fixed width elements, like images, broke the layout
The new design re-scales images and objects as the page is made narrower, so it does not break, right down to its new minimum width of 300px. Below 600px in width the display switches to display the menu at the top of the page, below the banner, and both the menu and the content below it fill the entire width of the screen, to make the text easy to read and ensure that images are large enough to be seen on a smart phone.
As yet we have not added much in the way of new content (at least visibly – the meta content has been updated to improve Search Engine performance, and broken links have been removed!). One element we have added, however, is a 3D interactive C60 (buckminsterfullerene) model into the references section. This is reproduced above.
If you are interested in nanotechnology, there are a lot of resources available, including images and research features, on the Nanofolio website: