It seems that every week there are dozens of new portfolio sites popping up - sometimes they look good, and sometimes they look bad. Storage space is often hard to find, some free hosts make it almost impossible to directly link to your images, and some peple are still manually editing and upload HTML.

Why not use the easy route? Blog it.

I'm going to show you how to quickly create a portfolio site that will look good, be simple to update, and display your art easily.


I'm writing this as an article for my own site, and it'll be shaped by any feedback here.

yus! good timing man I'm all ears

edit: I have a pretty advanced knowledge of html though, my most advanced technique is making frames.. yeah!

Sweet Rick. After reading the walkthrough you did with Mojokey's site I am going to switch mine over to CSS when I get some time.

Ok, I shall continue!

Firstly, we need a blog. There are dozens to choose from, but you'll want one that lets you integrate other sites into it using an API. I'll use Wordpress for this example, but you could equally use LiveJournal, Blogger, Moveable Type, Typepad or whatever.

So I went to http://www.wordpress.com and signed up for a blog. This took about 30 seconds, and they emailed my password to me, and http://rickstirling.wordpress.com/ was up and running. Using Wordpress is a breeze - just click 'Add new post' and type away.

So, in 2 minutes I had a site - but it looks like every other Wordpress site out there. My rsart site is Wordpress site, but I used my own hosting and installed their blogging software myself. I really went to work on rsart, editing all the stylesheets and layout to get something that worked for me, and you can do this on a wordpress hosted account just as easily. But since this article is all about speed, for now we are simply going to pick a template design.

If you go to the Presentation tab on the Wordpress dashboard you can edit the CSS, or you can simply pick from one of the 40 or so themes that are just sitting there (with nice big preview images). I went for Benevolence - it was the first one on the list that I liked. Of course, I could edit that theme as much as I wanted to.

Now we need an image host - and we might as well use Flickr as it has excellent ties with Wordpress. I already have a Flickr account, so I'll not set up a new one, but I assure that it is simplicity itself. When you sign up you get a coded id, like n001828-a, but you can change this to something much easier to remember. I choose rickstirling for mine, and you can view my images at http://www.flickr.com/photos/rickstirling/

Once you account is setup you can upload you images. Flickr has a web based uploader, but you can also upload by email or by using a variety of applications. I have a plugin for iPhoto that lets me upload directly to Flickr. Since I have a lot of images online, I'll not upload a new one and instead I'll use an existing image for my blog.

We need to configure Flickr to know where our blog is - fortunately this is easy. By going to http://www.flickr.com/blogs.gne you can add a blog to your Flickr profile. Choose the blog type (in this case it's Wordpress), Then you fill in the API address - flickr tells you what it is, in my case it will be http://rickstirling.wordpress.com/xmlrpc.php and then I give my blog login details. Press next and Flickr will try to verify this - 15 seconds later I'm good to go.

Now the final stage - getting an image onto your blog. This is the easiest part - simply upload your images to Flickr, navigate to the image that you want, and click the 'Blog This' button. This brings up a text editor, where you can give the image a different title and write a blog post about it. Press Post, and a few secodns later it's done. Flickr has posted a blog post onto your site with the image.

http://rickstirling.wordpress.com/

this might be a dumb question, but what if you have a host and all the pics you have are sitting in a directory online? do you just use standard html tags

Yup, just link them.

Wordpress has excellent image uploading built in too (though the offline editors do a better job).

If you download Ecto (or even Windows Live Writer), you can edit the blog offline and insert images. These will be uploaded to the Wordpress side and included into your post.

This was just a quick simple tutorial, once you get under the hood of Wordpress you'll see how powerful it is. My entire site www.rsart.co.uk is built in it. All the pages? I just created a new Page in WP, and set it's parent. SO I have a Page called About, which is all about me. I have a Page called links, and I use the WP link system to store, categorise and display all my links.

You are basically getting a fully functioning web portal - no more uploading HTML

I have a dumb question...
What if i want to use this as an animation blog?
what's the best route to go there? you tube?
Thanks Rick for doing this. It's really cool.

animatr - You Tube will probably work. I'll go do some research.

at the end of the day it's just a site, so you can add anything you want. I choose Wordpress and Flickr simply because they integrate so well and take so much pain out of it.


I'd be interested to see someone try the whole shebang from start to end. I'm betting that it takes under 10 minutes to have a portfolio site up and running.

Go on, give it a go.

If someone tries that, we can work on customisation.

Ha!

The latest Wordpress has got video embedding built in. You just go to Embed video and use [youtube=http: or [googlevideo=http: and add the link. Then its done.

This is for wordpress.com sites, not a custom WP install. This is because the WP.com site is upgraded all the time. I'd expect this feature to be in the next standalone install, but int he meantime you can use WP plugins to easily embed the video.

Nice!
That's pretty sweet!

I *heart* you Rick!

Seriously though, thanks man. This is great, just what I need and at the right time. [img]/images/graemlins/smile.gif[/img]

Woo, I tried it and it's indeed very fast. Started at 11.41pm, everything was up and running at midnight, nice.

But I created my own database and update system for my own website so why bother [img]/images/graemlins/laugh.gif[/img] Php and Mysql For Dummies gave me all I needed, I hacked a working system out of the examples in a week of evening efforts. But then again, It requires to know a bit about HTML and CSS.

Something to bear in mind is that Wordpress charges you if you want a pesonal custom CSS theme tho.

My point of view on the whole dynamic conent would be as follows :
Having blogfast updates is really nice and handy since it prevents you from manually editing content from your webpages. New art is added gradually which is great. However I think it is crucial to delete old works now and then, as bad old crap can pile up and play against you. Also, comments are fine for holidays blogs, but over-verbose portfolio don't look professional in my opinion.

Last but not least : Painfully handwritten folio sites have their benefits. If kept very simple it is still a great way to showcase works : Actually, a page filled with great images as a nicely put together skills overview does a great job.

Less clicks still wins!

Ok, this is now edited and online

http://www.rsart.co.uk/

And a permalink: http://www.rsart.co.uk/2006/08/26/se...ortfolio-site/


Pior - Don't like comments? Turn them off. If you mean the text comments you tag onto each image, well, turn that off. At the Flickr end you can customise the post it sends to your blog.

Oops yeah I guess past-midnight posts sometimes lack recoil :O What I meant was, the default behaviour of blogpowered sites is kind of overbloated with text in my opinion, and in some cases, making a very simple site from scratch with html basics at least prevents this.

Apologies if I sounded like an ass, haha [img]/images/graemlins/laugh.gif[/img] Then again, I tried all that Rick mentionned in the posts above and it is surprisingly easy and fast to setup! Yo!

someone sticky this! [img]/images/graemlins/smile.gif[/img]

sticky for a bit, archived later.

youll see one from me soon, thanks alot dude,

What about joomla?

http://www.joomla.org/

It's pretty easy to setup and tons of themes already out there and it has some nice image options..

I'm using that currently on my site.

Wow, after seeing this post, I thought that I'd add a blog to my site. The wife and I have a baby on the way, so I figured it would be a good way to keep the grandparents updated on stuff. In about 2 hours, I came up with this: http://ghouseproductions.com/blog/

Wordpress was available through the company that does my hosting, so I just went with that. Very simple to get going. It was so darn easy, I think that I might just add a few extra pages, and move my entire portfolio over. It is just so ridiculously easy to maintain, that I might actually keep my portfolio up to date just for the sheer hell of it.

Nah, that's a stretch, but I could! [img]/images/graemlins/tongue.gif[/img]

Our Wives are expecting at almost the same time, Ryno. We are also keeping the name we have chosen a secret which is driving my mother-in-law crazy.

Sorry for the off-topic post. I've been thinking of doing a baby blog as well, though.

If you are looking for cheap hosting as well, http://www.siteground.com/

I've never had a problem with them.
Site hosting is 4.95 a month and great tech help. They use a admin backend called fantastico that will install wordpress, forums, joomla, etc all with one punch of a button.

FREE Domain
40,000 MB Web Space
900 GB Traffic
99.9% Server Uptime
15 min Response Time
24/7 Top Customer Care
CPanel and Fantastico
Immediate Activation
FREE SiteBuilder
Unlimited MySQL DB
Unlimited Emails
Unlimited Subdomains
Unlimited FTP Accounts
FREE Blog Installation
E-commerce Pack

Thanks for taking the time to write it all up. I've gotta get rid of my flash site that I made for a flash class. One more thing to add to my list of stuff to take care of before graduation [img]/images/graemlins/smile.gif[/img]

Is it possible to add an option for clicking to larger pictures in the blog posts? I set up a basic site but would like to use smaller renders in the body of the blog that link up to larger images.

- Jesse

Yup - wordpress automatically creates a thumbnail and uses the thumbnail linked to the image by default. You can alter the size of the thumbnail in the WP editor, or in most off line editors such as Ecto or Windows Live Writer.