Another One of Those Portfolio Websites

anonymousjcreative.com had to be a station for my work and my thoughts on design and development. So it wasn’t just a showcase place, but  it had to represent what I could do, design-wise and most importantly, technically, right now.

The Aim Of anonymousjcreative

• Show case my latest works
• Blog about stuff that intrigues me
• Have several options for people to connect with me using social media, and me with them
• Have a very SEO based website with long-term SEO goals
• Open up opportunities to work on commercial projects and build a portfolio to work with design and development agencies

The Menu

The menu was where it all started for this design. Inspired by touch-screen phones, I wanted the menu to be expandable, showing several options pertaining to my work. Then with a click, the page’s content wouldn’t just appear, but it would scroll down to the appropriate section. JQuery was the tool of choice. I’ll be modifying it and publishing it soon enough.

The Blurb

The blurb is my little spiel as to who I am and what I do.  And yes, it is on every page, and so I’m sure you will say it goes against SEO duplication rules. But I didn’t quite see it that way. Google aptly recognises unique and individual pages and will remove duplicate pages anyway, without penalising the rest of the website.

Plus by having a description of who you are and what you do on each page means that no matter how people find this website, they will always have quick and immediate access to basic info about me, which is great for SEO! Plus it’s descriptive. We’ll see how the SERPs deal with anonymousjcreative.com in the future.

For the technical side of things, JQuery was used again. It was a rather simple, mouseover/mouseout job. There’ll be an article on that too at some point as well.

Creating The Columns

As for that plugin, it’s called WP Easy Columns and you can get it here: wordpress.org/extend/plugins/easy-columns. All that’s needed is styling and a bit of CSS if you want to customise how the columns look, but you can create all kinds of different widths, thirds, halves, whatever.

The Grid Gallery

What would a portfolio website be without a gallery? At the top of each blog post is the potential to make a 2 column grid of vertically and horizontally centered images. On the CSS side, it required span tags.

Centering the images required JQuery, and I adapted a plugin I found but it only centered the images vertically and without scaling them either. But it was a great starting point. I’ll be publishing that plugin soon.

I didn’t have to use WP’s shortcode to create the gallery. I didn’t want the hassle of having to remember a shortcode but I recognise its usefulness in customising ech post.

Google Rankings

As of writing this, Monday 13th February 2012 (and I can’t believe it’s February already, where does the time go), we’re talking 5 days after writing this website’s second blog post. It already ranks on page 1, for albeit, a very uncompetive keyword phrase that I’m sure, no-one will search for except for, maybe me, as it was a gripe of mine. But I’m psyched it got ranked so quickly. Plus, I’ve had this website up for about 2 years now, “under-construction”, so that may have helped too with Google’s trust issues. And I did a google fetch for my home page and any attached pages using Google’s webmaster’s tools.

Oh, and the post that ranked so quickly was: JQuery’s Nth-Child With Variable Issue. Seriously, it would have completely screwed over my menu design.

There are some beautiful themes out there, and so I really have to ask myself, why create a new one when I can use what the wordpress world is offering. Here are my customisation projects.

ELEMENTS OF SEO into E&E

Elements of SEO is the handywork of an American web designer, Drew Stauffer of Alibi Productions. Here’s the theme: elementsofseo.com.

TO:

F8 Lite Into The Rotherhithe Gardener

I love these guys work. The F8 Lite theme is from the Graph Paper Press website:

http://graphpaperpress.com/themes/f8-lite/

I loved how they had an image on the top of the page and so there was plenty of scope for creativity, but I didn’t like how they had such a long piece of text. There’d be no point in reading long lines of text, and I’d know, if I was after information, I’d give up. So I created a side-bar with custom content and obviously, the background isn’t white but green (it is a gardening website BTW).

TO

WPShower’s Suburbia Theme Into CBMN Blog

WPShower are kings of Grid! And considering how minimalistic their themes looked, I knew I could make it work for a soul music blog. I really didn’t have to do much at all. I just added text links back to the home page at the bottom of the blog post pages. Plus the background color was changed to a very deep brownish red.

http://wpshower.com/

To

There are few plugins in development. Currently I’m working on a html5 video skin which I’ve created a tutorial for. I also created a center image plugin which I have do a bit more testing on before I can finalise that. Plus I’ve got a stock full screen background plugin to release too. Lots to do, and so little time.

Full Screen Websites

Full screen websites right now and that inspired me to create overcomingshyness.me. I used customised a premium theme, using its fullscreen background and video capabilities to create this:

The full theme is from fullscreentemplate.com They’re awesome.

Here are my inspiration:

GOTOCHINA by ringvemedia.com was the first full screen website I ever saw. I still love it, and it’s still my favourite.

JAMES BLAKE from jamesblakemusic.com. There’s also a cool web agency in London who are headed by a guy called James Blake, but this is from the dub-step specialist. I love his use of video as a background in his website.

There are many more, but I love this stuff. I’m going to share my love for horizontal websites and art directed posts soon enough.

Here I’ll be listing some of my projects.

Project 1

Aim: To increase the number of enquiries my client gets via  a website

Tool: Google Analytics Goal Conversions

I did a “time-split A/B test”, and the difference between the Jan/Feb month and the Dec/Jan month is an increase in 5 client enquiries. That’s a 600% increase on the previous month.

The difference between the two time periods was the addition of more proof of what my client is able to do. By loading the homepage full of proof of her ability, it has increased the confidence people have, enough for them to make that step and inquire about her services.

Lesson: Always prove that you can deliver by showing what you can do. Eg. videos, audios, statistics, whatever you can to show you have the ability and you’re great at what you do.