Typeset a Wikipedia article of your choice two ways – one focusing on creating an easy reading experience, and one that is more expressive. While you’ll have two HTML files, you should use the same HTML for both options – the CSS will be what drives the changes.

After a lecture on modernist design, I was inspired to do my wiki activity on Igor Stravinsky – a composer who worked in and heavily influenced this artistic movement.

Art in the mid 20th century was very box-y, so I carried that into my design with justified text and a box-y two column layout. Also, sans-serif fonts were very popular in design at this point, so I went with Roboto for version one and the body text of version two. The headers in version two used a font inspired by and named after Stravinsky, which was a natural choice given he was the subject of the site.

I kept the heirarchy and structure of version one more conventional, with images that fit on the page, clear indentations for subsections, left aligned text, and underlined links. I had a lot more fun with version two, although it is maybe a little more difficult to interact with. The floating signature covers some of the images, which are often too tall for the site, the user has to hover to find links, and the right aligned headers are sometimes harder to read, but these choices elevated the site, which felt in line with the content about a devisive and somewhat difficult to access composer.

I am really pleased with how this project, and particularly version two, ended up. The font I found for version two is inspired by and named Stravinsky, so it was the natural choice for the site. I was fortunate that it was decorative enough to be interesting, but legible enough to be used throughout the site. All the design choices felt very conciously purposeful on this site. DSGN 234 has challenged me to be more thoughtful in my design and I was happy to feel more aware of that with this wiki design.

Version one was muuch more conventional than version two, but it was a nice exercise for me in getting used to using divs more readily in my code. I really don't know how I coded so much without using divs before this project. I learned a lot from this project in terms of both technical skills and artistic process.

If I were to change anything, it would be the block quote in version two. The line height needs to be a bit bigger to make it more legible.