Jarred Badillo – www.jarredbadillo.com is an America website designer and is currently in his first year of employment after leaving University last year. He is working freelance at the moment and is in a similar position to what I will be within the in the next several months, trying to find work to build up a portfolio.
On first viewing of Jarred’s portfolio website, the layout looks clean and simple to understand. There’s a wide narrow header, with three columns underneath, containing the navigation, a blurb and some featured work. Under that is a set of extra navigation, imaged links to his social networks and bookmarks and a nice clean footer. There is ample space between everything, so it’s easy to distinguish among different page features and nothing seems squished together.
The website has a white background and uses mainly grey text with black text been used in the header for his name and the titles of work he has completed. This colour combination is simple and gives a good colour contrast for easy readability, but he could maybe have used a slightly larger font size to make it even easier to read.
The header on the website is very simple and works quite well, to the left is the designers branding identity and what he does (website designer). The centre of the header says “/Index” and at first it seems to be there for design purposes, but when browsing the website it changes to the title of the page you are on, so acts as the page name. To the right of the header is a link to the sitemap, it’s aligned to the top right hand corner of the header and could seem out of place but I think it’s their so it’s viewable when you first visit the website and is not included in the main navigation.
One part of the header I’m not sure about is the width, as it’s wider than the content underneath, so the alignment between the header and the main page seem a bit odd. After looking for a while I can see some cases of alignment, such as the page name aligns with the page content and the designers name is right aligned with the blurb. Also the link for the sitemap hangs over the content more than on the other side of the header with the designer name.
The navigation for the website is quite obvious, with the large grey box round the top link for the home page, which also highlights the page you’re on. The text for the navigation is also grey and then turns white when the box appears on hover. Each link has a different coloured box, but the text remains white. The coloured boxes use flat, quite dull colours, which work well with the white and grey colour theme. The colour for the boxes is also transferred to the links on that page.
Next to the links is another column which contains a short blurb about the designer, the text size is quite small but still easily readable. The column is quite narrow so the blurb has short line lengths and it could do with been slightly wider as the line lengths are probably too short.
Next to the blurb is the column containing some of the websites featured work, the column is the main element of the page and is a lot wider than the other columns. The work in the column is in a list, with the company title and date of completion above a rectangle shape image of the end product. Underneath the image is the description of what was undertaken for the project and a grey patterned line, which separates the different projects. The main problem with the featured work is that none of the designs are linked to the full description, which I would have thought would be a must.
The bottom of each page contains spare navigation, social networking links and the footer, with the copyright notice in. I’m not sure if the spare navigation is needed as the website is only small and the pages are not very long in length, plus the home page is the only page that uses the scroll bar. The social networking links are a nice touch as they use the logos from the companies and are in grey scale, so blend into the website well. When you hover over a social networking logo, it shows in full colour.
There is quite a lot of white space on all pages under the navigation and blurb, but this is to be expected because the main page content is over to the right and stays in line within its column. The white space does not seem to overly substantial as the website uses quite large white spaces to separate different features.
The portfolio page of the website which contains examples of his work is split into three categories; web, print and logo. This arranges the page well and splits up the different types of work he has done. For each of the sections there is a large image scroll, which scrolls through his work showing a few different images. There’s a description section on the image scroll, but there’s not very much information on each project he’s undertaken. The image scroll may look nice to start off with but it’s not very user friendly, as you are not able to stop the scrolling and the short description for the project covers up most of the larger image. On the image scroll there are links to the full websites, but none of the links work and there are no URL’s listed so you can’t view the websites in action.
The other links on the website are to his blog, which he has integrated into the website, an about page, which tells you a bit more about him and shows his CV and a contact page that contains a contact form and his email and home addresses.
Overall the website has a nice look and feel, it’s easy to navigate and it would be simple to extend and add new work to. The main downside is that it’s quite bland and could do with a bit more colour to liven things up a bit. It could also show his work in a more improved way than the image scroll and have more of a description about the work. The images on the home page could do with been links to make it easier to find that work and they could also do with a description to explain the project and what he did on them.