Free Single-Page Scrolling HTML5 Portfolio Template + PSDs

February 22, 2011 - 48 CommentsWritten by
Categories → CSS,HTML,Templates,Web Design Bookmark on Delicious Digg This Stumble This Google Buzz Submit to Reddit

We have another amazing freebie for you today — a completely free single-page HTML5 portfolio template and all of the accompanying PSDs.
It has been jointly designed by Hannah Milan & Joefrey Mahusay and is a beautifully crafted template perfect for any creative designer as a means of displaying their portfolio.
This template is also a great exercise in practical and semantic HTML5, it is well worth downloading, dissecting and experimenting with the code.

Free Single-Page HTML5 Portfolio Template

Single-Page HTML5 Portfolio Template
Click on the above image for a full image preview

Preview, Demo & Download

View Full-Size ScreenshotView The DemoDownload (HTML Template + PSDs)

License

This template has been licensed with a GPL General Public License, meaning you can freely use this theme for both personal and business use with no limitations.

Templates Features

Single-Page HTML5 Portfolio Template

This free single-Page HTML5 template would work perfectly for web designers, photographers and graphic designers as a means for displaying their portfolio. Have a look at just some of its features below:

• HTML5 website powered by Semantics and CSS3/Styling

• Ligtbox powered by the jQuery FancyBox Plugin

• Flawless scrolling between the templates elements

• The templates uses the HTML5 Boilerplate base template

• @fontface font replacement

Thanks to Hannah Milan & Joefrey Mahusay

SubmitQuicklyHTML5beauty.net

A big thank you to Hannah Milan and Joefrey Mahusay for designing this template for us. They are both the founders and creators of HTML5beauty.net (a gallery of beautiful sites that use HTML5), SubmitQuickly (a service for to help your site gain exposure and link building) and WebDesignerAid.

About the Author: (3 Articles)

Hannah is the founder and curator of MOObileFrames, a collection of wireframes, sketches and user interface drawings that focuses on mobile applications. You can follow her on Twitter or on her Tumblelog.

Comments and Reactions

  • http://smartuts.com smartuts

    Really Love this..I love single page and you just share the high quality one..and it’s for free

    thank you

  • http://www.marketingnerd.co.uk Matt

    That is genuinely stunning! Its better than most “premium” templates, lovely work.

  • Bruno

    Thanks Hannah, thanks Joefre!
    Your websites go straight in my bookmarks! :)

  • Luciano

    Fantastic! Beautifull! Usefull! Thanks for share.

  • Bad Bunny

    Nice but no work so well in Chrome… had to refresh just to get all the images to load. Deck slider is wonky…

    No problems in IE or FF…

  • http://www.jireck.com Jireck

    Enorme !!!

    Bravo !!

    Great i like it

  • http://www.webdesigneraid.com Hannah Milan

    We would like to thank you everyone for a positive feedback from the community and big thank you goes to Speckyboy! :)

    More high-quality freebies to come!

    Thanks again!

  • http://www.sergioalberto.com Sergio Alberto

    Contenido muy bueno. Gracias por compartir

  • http://www.instinctdesigntuts.co.uk Robert Nash

    A fantastic freebie that is worthy of premium content. Thanks very much, a real inspiration.

  • Dejos De Brujo

    In Serbian: “To majstore, svaka čast!”
    In English: “Thanks mate, that’s lovely jovely!”

  • Pingback: Free Single-Page Scrolling HTML5 Portfolio Template + PSDs | Design Dealz

  • Pingback: Free Single-Page Scrolling HTML5 Portfolio Template + PSDs | WebDevKungfu

  • http://www.daftgrafix.dk/ Jarl Lyng

    Wow, I love it! Thanx!

  • Piotr

    The ‘Slider’ doesn’t work in safari (the oryginal one also didn’t work)

  • http://none Mike

    Thanks, and works fine in Chrome!

  • Pingback: Weekly HTML5 News and Inspirations – Tutorials, Tools, Resources and Freebies (V.1) | Web Designer Aid

  • http://creativenuts.com Creative Nuts

    very nice well designed clean layout.

  • http://dosomeawesome.com Karri

    Great file. Although not for me, at least not straight out of the box.

    That’s why I created from this myself a lightweight directory, where I keep some of my bookmarks. It’s like visual speed dial for internet.

    Here’s a screenshot: http://grab.by/9bNx

    Thanks and keep up the awesomeness!

  • Pingback: Plantilla de una sola pagina gratuita en HTML5 | Diego Mattei Blog

  • Pingback: www.AlrocMedia.com » Blog Archive » Plantilla de una sola pagina gratuita en HTML5

  • Jamie

    this is beautiful. I plan on using it for my portfolio. thank you!

  • Pingback: Tutoriales, recursos y técnicas HTML5 | davidcostales blog

  • Pingback: Esta semana compartí:  | EV Correu 2.0

  • http://www.thecityisburning.com Peter Butler

    Hey this is really cool, thanks for sharing. I recently made my own single page HTML5 scrolling portfolio website.

    Please take a look :D

    http://www.thecityisburning.com

    thanks!

  • MD

    I’m trying to work through this template to make my own site but I am really new to website design. Is there a way to change the contact form’s submit button so I can have messages directed to my email address? This is the code for the form:

    Your Message

    Thank you in advance to anyone who can help me.

    • Tim

      You have to setup a mail application server side to intercept the form submission and send it to your mail. I used this template and substituted a Google Docs form instead, because I’m using Mobile Me which won’t let me use server side apps.

      • Jeremy Bates

        hey tim, could u tell me exactly how you did that? thanks

  • Pingback: Free Single-Page Scrolling HTML5 Portfolio Template + PSDs | Web Design Resources

  • Pingback: Single-Page Scrolling HTML5 Template | Website Templates Depot

  • Neinou

    thanks so much for sharing :)

  • http://www.sigaspot.com/ SiGa

    Many thanks from me, too – great work, really!

  • http://www.sigaspot.com/ SiGa

    I really love this one, the design and the effects – allover. Thank you very much for sharing! It would be even better when it would work in Opera, too – and I don´t really understand why it doesn´t, yet…. Any idea?

  • Pingback: 5 Undeniably Awesome Things HTML5 Can Teach You Now! | Web Designer Aid

  • http://twitter.com/ribinpk Ribin

    thanx

  • http://twitter.com/ribinpk Ribin

    thanks, one thing I want mention that scrolling smoothness is comparatively less

  • Anonymous

    thanks so much for this! 

  • Kokologs

    that’s great template. 
    yesterday i wanted to create vertical scrolling website but i doesn’t know how to code that. Now it’s simple

  • Pingback: links for 2011-07-13 | axelintu : links

  • Pingback: Plantilla de una sola pagina gratuita en HTML5 | Ricardo SanMiguel

  • http://www.facebook.com/prasad1287 Jayaprasad Mohanan

    Thanks for this amazing free example. Like most of the people here I also wanted to create a beautiful single page scrolling website, doesn’t knowing anything about HTML5.. :) Thanks a lot! 

  • Cel Rod

    Thanks for this! Great work! But may I ask, what if I want the menu to be on top instead of at the left side? And I want it to not move too just like the sidebar. Will it be possible? Thanks in advance!

  • Tuckoli

    I am a newbie and need some serious advice before I use this template. Can I use a program like Dreamweaver with this template? I have no idea how to relate the index file to all of the elements in the template file….?

  • Olga Van Saane

    Hi,

    I’ve downloaded the theme and alas, it is broken: in the zipped package the stylesheet is missing, so it’s useless. Any comments or suggestions? 

  • guest

    How do I make the message delivered to my email account?

    • jemacba

      did u ever get an answer to this? im trying to work that out too

    • RDM

      You need to make a php file for this purpose.
      Try to google some html form examples.
      It will be helpful for you to understand.
      RDM

  • Suneth2

    Thanks bro…

  • Needs Help

    I’m using Windows 7 IE9. I’m having problems replacing the pictuers with my own. The picture don’t load. ex: images/work_img.jpg. Even if I name it by the same name the new images won’t load.