Useful Tutorials to Code One Page Portfolio Website
27th Mar 2011 | Posted by Eko S. | 13 CommentsHave a great portfolio is crucial for web designer, graphic designer, photographer or any creative people to showcase their works and skills. And one page portfolio can do this effectively.
Let’s take a look here, useful tutorial articles that we have collected to help you create your own one page portfolio website.

Design Tips Articles
Before we start to create a one page portfolio, please read these articles first. Very useful design tips articles that can help you in designing a succesful one page portfolio site.
10 Expert Tips for Designing a One Page Portfolio
by Joshua Johnson
This article contains several tips and examples to help you create an amazing single page portfolio.
Single-Page Websites: Examples and Good Practices
by Cameron Chapman
While a lot of general web design best practices apply to single-page sites just as they apply to more complex sites, there are some special considerations, which we’ve included below.
9 Essential Tips For Creating A Single Page Portfolio Website
by Chris Creed
Below are some important tips that you’ll want to consider when designing single page sites – most of these also apply to all types of web design, but they are particularly relevant with one page sites.
Useful Tutorials
Coding a CSS3 & HTML5 One-Page Website Template
by Martin Angelov
Today we are making a HTML5 web template, using some of the new features brought by CSS3 and jQuery, with the scrollTo plug-in.
Design & Code Cool Single-Page Portfolio Part2
by Pedro Hilion
Today we’re going to be creating a single-page portfolio design that can be used to showcase your design work and allow people to get in touch with you.
How To Build Your Own Single Page Portfolio Website
by Chris Spooner
Let’s take a look at producing a single page portfolio concept in Photoshop, constructing the page in XHTML/CSS and adding some fancy functionality with jQuery.
Code a Backwards Compatible, One Page Portfolio with HTML5 and CSS3
by Tom Kenny
HTML5 is the future of web development but believe it or not you can start using it today. HTML5 is much more considerate to semantics and accessibility as we don’t have to throw meaningless div’s everywhere.
jQuery and CSS single page portfolio, a vertical parallax navigation experiment
by Tutorial Shock
On this tutorial we’re going to undress the structure of this website and then we’re going to create something inspired by Nike’s website using jQuery and CSS.
Create a Single Page Portfolio from Scratch – Part 2: HTML and CSS
by Michael Soriano
This part focuses on the HTML and CSS mark up to convert our .psd file to a living web page.
Code a Stylish Portfolio Site Design in HTML & CSS
by Chris Spooner
This week we’re going to code up the design into a complete working HTML and CSS website and add the finishing touches in the form of super duper jQuery effects.
Premium One Page WordPress Themes
ShapeShifter – One Page, Infinite Possibilities
by epicera
ShapeShifter is a single-page WordPress template that has been designed to be just about the simplest theme you could possibly use. This theme is lean, mean, and ready for you to install in minutes.
Auzora – One Page Portfolio and Business theme
by webinpixels
Auzora is One Page Portfolio WordPress Theme. Comes with massive admin features. Are you tired to see a lot of one page wordpress theme use scrollable effect when change the page? Then check the auzora live preview
Locus One Page – WordPress
by elemis
Features
3 Skins x 3 backgrounds
2 different slider options (3D, Nivo, Cycle)
Thorough Help Documentation (with videos)
jQuery Enchanced
Working contact form with jQuery Form Validation
Portfolio with categories
News carousel
ExcelsiorWP – One Page Portofolio Theme
by Brankic1979
Excelsior is a clean and professional one page template, perfect for all types of business, companies and personal web sites. This template is tested in all common browsers: Firefox, Chrome, Safari, Opera, IE7 and IE8.
Pixelstudio – An Elegant Scrolling One-page Theme
by Keliah
Pixelstudio is a simple and elegant one-page theme built on the 960 grid with some nice JQuery powered effects. It is compatible with WordPress 3.0.
The layout is scrolling vertically and is provided with 8 custom color variants + 3 background patterns. This theme also includes a shortcodes and working contact form.
Identity – One Page Blog/Portfolio Theme
by Dannci
Identity is new pretty WordPress theme for personal or business blog/portfolio. All in “one page”. Professional “One Page” WordPress 3 Theme with smooth scrolling.
Da Vinci Theme – WP One Page Portfolio 12 in 1
by lidplussdesign
Da Vinci Theme is an One Page Portfolio WordPress Theme, best suited for business and portfolio sites. This theme comes with 12 color variations.
Enjoy the real success with 6002-1 exam online training programs and latest 640-822.Also prepare for next level with quality of 220-701.
10 Comments to “Useful Tutorials to Code One Page Portfolio Website”
Add Comments (+)-
-
Hi, I’m Keliah, the designer of Pixelstudio for Themeforest.
GetSimple never contacted me to ask anything, they associated me to their project without any prior consent from me. Hopefully we get that sorted out soon.
-
-
This is super slick stuff. I’m I correct in assuming that it’s best to use Adobe Flash for this?
Thanks
-
Thanks for sharing the tutorial. It’s definitely important to build a portfolio site to put all your works together. This is a website I used to create a portfolio website without any programming knowledge. check out http://www.opresume.com.
-
very good one page portfolio showcase!
-
great website, great designs, thanks.
-
thanx for sharing this images.. as a designer it is helpful to me a lot.. good collections
-
Great collection, I was looking for this from last few month but I think now I can stop my searching.
Thanks a lot of.
Trackbacks/Pingbacks
- Useful Tutorials to Code One Page Portfolio Website | The best Tutorials
- Useful Tutorials to Code One Page Portfolio Website | WebDevKungfu
- Technologies required for building a portfolio website | Justin's DMT Blog
Pixelstudio is available as well as template for GetSimple CMS, and that version is for free, see here:
http://pixelstudio.getsimplethemes.com/