Web Design Inspiration
When you're looking for ideas for how to build your next website, it can help to look at other websites that are doing inspiring things. These links will show you examples of how you can build websites that look good and use professional code.
Bluenote
Fun icons and interesting scrolling effects on this clean, blue web page.
Minimal Monkey
A blog with a basic, clean design that becomes more interesting and dynamic as you interact with it.
Dragonvale Wizards’ Challenge
Many web applications are games, and this HTML5 site is an example of a trivia game based on the iOS game Dragonvale.
Say It With Bacon
You don't always have to take your content absolutely seriously. This site from Oscar Mayer uses HTML5, video, and fun scripting to design a site that looks like a jewelry commercial, but is really an ode to bacon.
Trip.HR
A Croatian travel agency has created a beautiful and simple page that has one element that makes it look like an app as well as a web page.
CTL
This is a gorgeous HTML5 website. It's simple and clean, with a lot of little features that make it wonderful.
IVIS INFO
A redesign of a site submitted in 2011. The site has not changed significantly, but the code is much cleaner and the site more effective as a result.
Atari Arcade
HTML5 apps can compete with native apps. Here is a great example of a website that uses JavaScript inside HTML5 to build ports of some classic (old) video games. These are games I played when I was a kid, but they show what can be done on HTML5 pages in modern browsers.
We Love Icons
Don't be afraid of a mobile design - embrace it! This is a fun icon website that displays the content in a narrow window almost like a smart phone, even on a huge desktop web browser window. It sounds like it might be annoying but it works.
The Academy of Motion Picture Arts and Sciences
This is the site of the Oscars, and you'd expect it to have a lot of pictures of stars and be very elegant.
SKJ Ancient Bead Art
While this site is HTML5 by the doctype, that's about all the HTML5 it is. But I didn't pick this design because of the HTML, but because of the design. Find out what I like about this inspirational site.
VoiceWorld
This is a conference website for people in the voice acting community. It uses a very clean, almost minimalist design. There are some interesting scripts such as for the countdown in the upper right and the slider promoting various features of the conference.
Design Junction Portfolio
Here is a web designer's site portfolio. I don't usually use designer sites as inspiration for many reasons, but this one stood out for me, both because of the quality of the projects and also how nicely the portfolio worked.
Red Rokk Interactive
There are many designs that inspire us. Here is a fun interactive website that even has a simple game at the top.
Magic Fabric
This is a bright Polish website for a contest that Trefl held. Even without speaking Polish, it's obvious that this fabric is for kids and the site reflects the uses well.
Netlash Coming Soon Page
Teaser websites are becoming popular to announce products before they are ready to be unleashed. And this single-page teaser site uses both interesting HTML5 and animation features as well as the sections to create multiple (virtual) pages.
NASA Mars Science Laboratory
There are many designs that inspire us. Sometimes inspiration comes from the look of the site and sometimes it comes from the content.
U.K. Energy Consumption Guide
This is a powerful info graphic because it is also a website. Instead of being s simple static graphic it is interactive and provides the information in a dynamic fun fashion.
Brighton & Hove Food and Drink Festival
Here is a bright fun website about a food festival. It has a lot of information, a lot of dynamic elements, a lot of fun. It's all HTML5 and CSS3. And it was built by a WYSIWYG editor - Adobe Muse.
HTC
This is an HTML5 site that uses Flash to create dynamic menus. But what’s really nice about it is that devices that don’t use Flash can still see the site and it’s very similar to the Flash site.
Art of Stars
This is a website that shows some of what you can build with HTML5, JavaScript, canvas and more. It's also one of the first sites I've seen with GeoLocation that really makes sense.
Download Me Button
CSS3 lets you do a lot of nifty things, and this download button is created and animated with only CSS3. Be sure to visit the site itself to see how it interacts, the GIF animation does not do it justice.
HTML5 & CSS3 Readiness
This site inspires me both for its beauty and for its utility. If you're still on the fence about HTML5, this site should change your mind.
MailChimp
MailChimp is a newsletter service to send out newsletters to subscribers. The design is smooth and clean and gets the information across easily.
Johan Reinhold - Heart in a Jar
This is the website of a Swedish pop singer and it's got a fun and quirky style to it. Be sure to visit the site to see the full extent of the interaction that is used.
The Google Puzzle
A ridiculously fun puzzle with lots of parts. I played for several minutes before realizing that I wasn't working anymore, I was playing! This site is best viewed in Chrome, but it's all done with HTML5 and JavaScript interactivity.
Landscapists
This Russian language site is a beautiful example of a photo gallery website. I love the fox photos by Dmitri Deshevykh, but the other photos are gorgeous too. This is a very inspiring layout.
PrimeMovers Pilates Solutions Contact Us Form
Here is an example of a brochure website nicely built in HTML5. I like the contact form particularly as it's an excellent example of how to use HTML5 form elements, labels and column layout to create a nice form that's easy to use and fill out.
Pumpkin Carving Halloween Card
Here's a spooky card you can use to create a Halloween e-card.
Serenity HTML5 and CSS3 Template
This is not just a beautifully inspiring design, it's also a gorgeous free HTML5 and CSS3 template you can download and use on your site. It is a single column layout created to showcase your images in an image slider.
Rough Guides
This is a great example of a website that is really an application. While I was playing with it, it felt much more like a Flash website than HTML.
One Million Trees
A very attractive site with gorgeous forest photos that inspire you to join in the planting.
HTML Query
The HTML Query portfolio site was submitted to the HTML5 Designs gallery and is a nice example of how to use HTML5 and JavaScript fallback options like Modernizr to create a nice looking site that handles older browsers gracefully.
Dan Forys Journal
This is a great example of how you can use HTML5 with other websites and applications to create an interesting web application all your own.
Slavery Footprint
An interesting interactive web application that also has a very serious premise. Very inspiring.
This Shell
A simple yet fun HTML5 puzzle. It uses video, drag and drop, and transformations with CSS3 to create a fun puzzle with a prize at the end.
Wee Society
For my first inspirational design of 2013, I decided to choose a site that made me smile. This is a site of art prints and apps for children. The site is whimsical and fun but also very clear and crisp.
Snow Fall: The Avalanche at Tunnel Creek
One of the most amazing websites I've ever seen, Snow Fall is something that you must go visit rather than just view the picture. This site will be inspiring web designers and developers for a long time to come.
Albu Mihai
An HTML5 photo gallery of fashion photos.
Munch 5-a-Day
The design of this page does not look particularly spectacular when viewed as a static image. In fact, it s pretty hard to see being mostly grey images on black background with some white text. But when you go to the site you see the planets revolving around their primaries, the size and temperature of their suns becomes more apparent, and you...
Dragonvale Wizards’ Challenge
Many web applications are games, and this HTML5 site is an example of a trivia game based on the iOS game Dragonvale.
Les Ours Coca Cola
An interesting side-scrolling website that looks like Flash, but is really HTML5.
Klingele
A well designed HTML5 site to sell chocolate. The rotating banner uses jQuery and HTML5 sectioning elements.
Zenoobi
A cute website that sells children’s clothes and furniture. It uses fun animation to showcase many of their products and site categories without taking up a lot of space.
Kepler’s Tally of Planets
The design of this page does not look particularly spectacular when viewed as a static image. In fact, it s pretty hard to see being mostly grey images on black background with some white text. But when you go to the site you see the planets revolving around their primaries, the size and temperature of their suns becomes more apparent, and you...