Toying with the idea of a single page site instead of click-through pages, and would love feedback. Its a different process for me with web stuff but I’m really liking some of the stuff you can find now online.
Tattered Tootsies Web Concept III - Home page. Logo and design copyright Misterbabbel Design. Image is stock and FPO.
revisions to portfolio : new formatting
reworking the Misterbabbel Design site… Now that things are finally settling into summer and the freelance projects are finding their way into my inbox I figured it’d be best to revisit what’s currently been occupying the airwaves…
Revisiting the Misterbabbel design portfolio and website… Now that there’s time I think I am going to work on the restructuring of the content and info that’s presented. As the previous post stated, I am working on refining my body of work and portfolio worthy pieces and as such I think it’s time to review, redesign and resubmit my work for the viewing masses. In the meantime this image gives an idea of the reductive approach I want to take in the the presentation of content on my site.
You can view the current site here: www.misterbabbel.com
Image retouching for a good friend’s website. I didn’t shoot the image. Her hubby’s image quality is a bit on the crap side of things, but I have to admit that the finished image is lovely.
Now that I’ve had a day or two to sit with the retouched image, I could have made it a bit less on the obviously retouched side, but as a person who caters to peoples outward appearances (nail tech), she needed to look her best and the image will be not nearly as large as this once integrated into the site design.
I am working on the website design for her business, but she’s currently working through MSN’s do-it-yourself website builder, which to be quite honest, is terribly limiting. We are doing the best as we can with what they give you (NO ACCESS TO CODE!! BLAST!) and I’ll post screen caps of the site once we get it live and rolling. Not a bad distraction for winter break.
Much like other projects, this too is an in process notice of the interim portfolio website for Misterbabbel Design. In keeping with the aesthetic already being employed on much of the Misterbabbel print collateral (those images to come), this utilizes a pretty minimal approach and presentation of content.
As part of the web course I am getting close to wrapping up we are responsible for a portfolio site that utilizes a cohesive and consistent design aesthetic, CSS controlled, a minimum of five functional pages, a downloadable resume/cv and needs to be live. So far this is what I’ve got. It’ll be updated of course over the next two weeks (due date’s looming) and at the culmination of this semester I’ll get more images up.
Ok, so after much deliberation and fighting with the form I was having issues with for the contact page (which for the time being is going to act as a comment or feedback style page), this site is finally working! My search field is active, the form on Contact is active and I’ve hit the necessary bullet-points for the project!
Lessons learned with this site:
*Animated Gifs
*Embedding video content (granted it’s youtube, but just the same…)
*Lightbox Gallery
*Z-index for Image sets
*Navbar with rollovers
*Page indication
Some of this is probably redundant on my part between this and the last post, but I will say that of the resources out there that have proved most helpful with questions that I’ve had are the following this time around:
So to wrap up this entry, I would say that aesthetically this site is getting there. Not quite there yet, but stil… Functionally? It’s not too shabby. The completion of this site and the evolution of the ad+vice website have presented so many learning opportunities and I’m glad of it.
Still under construction…
I guess you could call this a snapshot of the site in progress. The concept behind the project is to provide a site/place where someone could go to post their work or projects in progress to receive feedback from a broader audience than they may have access to at the time while working on projects. It’s become a bit of a hairy project in that it just keeps growing no matter where I think I am cutting the project back…
In endeavoring to get this cobbled together, I have learned the importance of a strong skeleton support structure for the content placed in each page. I am sorting out HTML and CSS forms between this site and the Fourlilly site, but I’m really beginning to enjoy the ins and outs of web design and development. As I mentioned, the project just keeps growing which is nice, but I am unfortunately supplying pretty much any and all of the content. Granted I do understand the opportunity there, but for the sake of timeliness, it’s a bit of a challenge.
WEB DESIGN vs. THE AMATEUR CODER…
Web design is a tricky thing I’m discovering. Tricky and a bit confusing, to be quite honest, but nonetheless it’s oddly exciting.
The in’s and out’s of sorting out how the div tags will related to each other and establishing your “rules” for the pages and the overall sites functionality, needless to say I’m on board for it. I’ve spent most of the past weekend recoding the layout and content for this site, and to be honest, for my first stab at a (mostly…) functioning website, the content and overall presentation needs some work. But, the discoveries made along the way are priceless.
Things I have learned from this process:
Confessions aside, I wanted to take a moment to offer up some great resources that I’ve come across along my “travels” with this and another web project that I’ve been working on.
Adobe Dreamweaver Web Widgets
Great source for freeware and opensource widget files that you can add to your page content to make the experience more engaging for your user/viewer. I’ve been working with the calendars that they offer here as well as the lightbox galleries. There’s a nice selection of freebies here if you’re working on little to no budget for extras.
W3C
I stumbled across this gem while seeking tips for adding content such as an animated favicon to the site content. Initially the site was a bit intimidating as there is a LOT of content that you can get involved with. However, upon a bit more investigation of the site, there is a great deal of information to be had with an awesome amount of supporting definitions and data as well. Not for the faint of heart though…
Youtube
We all know this one, sometimes I think for all the wrong reasons, but in this case the abundance of tutorials is something to keep in your mental rolodex when seeking out answers to your design/web design questions. For the visually inclined person, such as myself and perhaps yourself, seeing something being done connects the dots better than trying to follow the breadcrumb trails that you often find yourself chasing through the larger search engines.
Back to the grind, but nonetheless happy coding and have a good one!
Top
