The more products Apple releases, the more widespread Retina displays become. So far we have Retina capable iPhones, iPods, iPads and MacBooks of various sizes, which together make up a pretty substantial audience. Let’s take a look at how you can create special retina graphics for your website so your design looks crisp, sharp and clear on those powerful screens.
Posts from 2012
Along with large background photos in general, blurred background images are becoming increasingly popular in web design. The addition of the blur not only creates a cool effect, it also puts focus on the main content, avoiding any legibility problems than can occur when text is overlaid over a detailed image. This post rounds up a collection of great looking website designs all sporting a blurry background.
I’m currently working through a redesign of my SpoonGraphics blog and wanted to create something fancy for its 404 page. I decided to have a go at coding up a full screen retro TV screen filled with animated static noise, upon which I could display the usual 404 text and relevant links. Follow the step by step design process of the final 404 page and learn how a bunch of clever little CSS tricks helped transform the idea into reality.
The grid based content block layout has become popular for many types of website, especially portfolios and inspiration ‘pinning’ sites. These sites have a series of tiling blocks that fill the page, often in a kind of modular format where they rearrange themselves depending on the viewport size. This post rounds up a collection of 25 cool website designs that all feature a modular style content block layout.
I’ve done plenty of retro photo effect tutorials in the past, but they’ve all been done using Photoshop. After playing around with some cool new CSS3 features I managed to create a pretty decent looking retro style image effect using just CSS. With the help of CSS gradients and filters, let’s take a look at how a cool vintage photo effect can be created directly in the browser.
As full screen backgrounds are becoming increasingly popular we’re starting to see more and more landscape photos being used in website designs. Sometimes the landscape photo is directly related to the subject of the site, but others use the awe inspiring shots to draw in the user and create a relaxing atmosphere. This post showcases 20 top quality web design that all feature a beautiful landscape photo.