Just starting out portfolio site

**Yallow** · May 18, 2012 14:57

Hello all, I am just starting out with my conquest to become a front-end developer and I have just completed a portfolio site where I will put my works (when I have some). I was just wondering if some of you experienced designers could give me some feedback on what I did right and what I need to work on.

Website: boxed514.com

Thanks in advance.

**websiker** · May 18, 2012 21:22

So whats Boxed 514?

and your website a bit plane =s, make it more cleaner if you want to present your portfolio. and On your home page you need at least have your recent projects to show and let people know what is your website is about on your home page. Include images of your projects and link to them with different screenshot or straight to the website.

Thanks

**mrcap** · May 19, 2012 01:16

I liked that simplicity of your site. In my opinion logo could look more professional, now it looks a little bit like it was designed by a child. It's not bad to have a link to your facebook-page, but I think it would be better if there would be some content in it. There should at least be link to your site and a information about what is boxed514. If someone now likes your facebook-page, his friends will see that he liked it, but when they check out what is boxed514, they don't figure it out. They would find it out if they use google, but people are lazy and they probably wont bother.

You said you are experienced on lot of things. Maybe you could do couple of examples on your portfolio. I mean that you just design couple of pages so people would see what you could do. I don't mean that you would design a site or two, but you already have domain, so maybe you could do some example site's/page's under it?

**deathshadow60** · May 19, 2012 07:42

Double border between sections feels like a rendering error instead of intentional design, WAY too much white-space making me have to scroll around excessively just to find content, inaccessible fixed width for no good reason, lack of padding and text blowing out of the footer makes that also look like a rendering error/broken.

Under the hood it's HTML 5 for nothing (NOT a fan of 5), HTML 3.2 in your HTML 5 (like there's a difference), endless META's that NOTHING actually uses, browser sniffing and the shiv nonsense for 5, if you need ID and classes on BODY there's probably something wrong with how the site is built, anchor/name doing ID's job like it's still 1997, HGROUP with only one heading means you shouldn't have a HGROUP (NOT that HGROUP ever serves a legitimate purpose on ANY page apart from ignorance on how to use numbered headings -- but I say the same thing about HEADER.)... Lists around non-list, and to be frank, list or article, PICK ONE! (part of why I hate 5, nothing like wasting time wrapping tags around things that already have meanings), no media types on your stylesheet, using HR (doubles at that) when there's no topic change or a heading tag is already doing it for you... ASIDE around an elements that don't seem to be a literary asides... (home page is bad -- About page is whiskey tango foxtrot territory since what's in the 'aside' is the ONLY CONTENT?!?)

Even your keyWORDS meta -- where you make it so large it's guaranteed to be ignored, repeat the same WORDS over and over... etc, etc...

Now don't get me wrong, if you're just starting out you've done a decent job, especially having been led down the garden path by the HTML 5 rubbish -- but this could/should be way, way, WAY cleaner.

If I was writing that same page, my markup would be a LOT simpler:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html
	xmlns="http://www.w3.org/1999/xhtml"
	lang="en"
	xml:lang="en"
><head>

<meta
	http-equiv="Content-Type"
	content="text/html; charset=utf-8"
/>

<meta
	http-equiv="Content-Language"
	content="en"
/>

<meta
	name="viewport"
	content="width=device-width; initial-scale=1.0;"
/>

<meta
	name="description"
	content="My personal portfolio website where customers can contact me about web design"
/>

<meta
	name="keywords"
	content="web,site,design,developer,development,portfolio,html,css,javascript"
/>

	
<link
	type="text/css"
	rel="stylesheet"
	href="/theme/screen.css"
	media="screen,projection,tv"
/>

<title>
	BOXED 514
</title>

</head><body>

<div id="top" class="widthWrapper">

	<h1>
		<a href="index.html">BOXED 514</a>
	</h1>
	
	<ul id="mainMenu">
		<li><a href="index.html" class="active">Home</a></li>
		<li><a href="portfolio.html">Portfolio</a></li>
		<li><a href="http://tylerstechandmore.blogspot.com/">Blog</a></li>
		<li><a href="about.html">About</a></li>
		<li><a href="Contact.html">Contact Me</a></li>
	</ul>
	
	<hr />
	
	<div id="content">
	
		<h2>What I do</h2>
		<p>
			I love creating and thinking outside the box. What better way to do that than creating websites? I can make you anything from a static website to an interactive, fun-filled website. So let's get started, shall we?
		</p>
		
		<h3>Web Design</h3>
		<p>
			Need a website made? I can do that! I have experience working with HTML, CSS, Javascript, PHP, and MySQL In the near future I will be offering the creation of Wordpress pages. So let me know what I can do for you.
		</p>
		
		<h3>Blogging</h3>
		<p>
			I love to blog and if you have time you should check out my blog and maybe even follow it. I blog about everything from tech, to sports, to anything that really crosses my mind. I usually get up one post a week or atleast every other week. New things coming soon!
		</p>
		
		<div id="pricing">
			<h2>Pricing</h2>
			<p>
				Due to the fact that I have little to show for my portfolio right now, I will not charge full market price. But I do guarantee that you will get a job well done.
			</p>
			<ul class="prices">
				<li>1 page: $45</li>
				<li>2-3 page: $75</li>
				<li>4 page: $150</li>
				<li>5+ page: Contact Me</li>
			</ul>
		<!-- #pricing --></div>
		
		<div id="social">
			<h2>Social Me</h2>
			<ul>
				<li class="facebook">
					<a href="https://www.facebook.com/Boxed514?skip_nax_wizard=true">
						<span></span> facebook
					</a>
				</li>
				<li class="twitter">
					<a href="https://twitter.com/#!/tybouma">
						<span></span> twitter
					</a>
				</li>
				<li class="delicious">
					<a href="http://delicious.com/unclickable1">
						<span></span> delicious
					</a>
				</li>
			</ul>
		<!-- #social --></div>
		
	<!-- #content --></div>
	
	<hr />
	
	<div id="footer">
		<div>&copy Copyright <b>BOXED 514</b> 2012</div>
		<a href="#top" class="backToTop">Back to Top</a>
		<ul>
			<li><a href="index.html">Home</a></li>
			<li><a href="about.html">About</a></li>
			<li><a href="portfolio.html">Portfolio</a></li>
			<li><a href="http://tylerstechandmore.blogspot.com/">Blog</a></li>
			<li><a href="Contact.html">Contact Me</a></li>
		</ul>
	<!-- #footer --></div>
	
<!-- #top.widthWrapper --></div>
	
</body></html>

No stinking HTML 5 nonsense and provides all the hooks you need to style it... with semantic use of headings (I kind of assumed those latter two I put in H3 are subsections of "what I do"), removing pointless redundancies like the lists around non-list elements (or at least redundant to the heading tags!), the pointless HTML 5 tags that don't do anything worthwhile, cleaned up the meta's to the ones that actually do something, added a couple to do more, got a proper setup for linking the stylesheet, etc, etc... ending up just about 3/4ths the total code and WAY easier to maintain... and look ma, no javascripted shim nonsense either.

All those extra HTML 5 tags you were using, and how you used several other tags amounted to little more than pointless bloat -- though that's HTML 5 in a nutshell; pointless bloat and encourages sloppy coding.

**tom8** · May 19, 2012 08:33

I too like the simplicity of the site. However, I cannot give you the technical aspect such as those of deathshow60 but you could validate your code using the service of w3.org and fix all the reported errors.

Although it is unlikely your clients will take note of your code structure but the designs will certainly get their attention so it would be good to present some sample designs.

Since you mentioned that WP will be an option in the future you should showcase this right now with your Blog page using WP instead of redirecting to an external site.

**sfifabian** · May 20, 2012 22:44

Maybe you can do a simple website like this but more attractive. Maybe add some colors and improve the logo

You could also add some more information

**Yallow** · May 21, 2012 06:59

Thanks for all your suggestions, I'm working on improving it right now and hope to have the new and improved version out ASAP.

**irishman** · May 21, 2012 07:05

Your website should excite people and make them want to use you to design theirs, which I dont think it does. It also should not have spelling/grammar mistakes (pages , and guarantee)

**visualkreations** · May 27, 2012 06:36

I believe when you go to a website for the first time you should be able to tell what the site is a about but a glance and not need to read any content. I couldn't tell at all what your site was about until i started reading through. I suggest using good imagery and place is strategically throughout your site that describes your services.

**Ten Hand Spans** · Jun 5, 2012 14:43

Hello Yallow,

I love your banner, it looks very professional. I like the clean and easy to read page, though it does seem a little light on content. A gallery/video of your most recent projects would look great and i bet you'd find a jump in orders if visitors could easily check out your work.
If you go down this road it might be a better idea to locate your pricing structure on another page - present your work on your landing page to create desire for your service. I say this because people will have a rough idea of how much web design etc costs - if you can show that you provide a quality service Then hit them with the fact that you're charging significantly less than industry standard, you'll get more custom than saying your cheap from the outset.

Hope this helps!

**loko** · Jun 5, 2012 23:44

Hi

Page is not an attractive, portfolio of empty. Maybe better you use free portfolio templates? They are attractive than your page.

**kvnwpts** · Jun 13, 2012 15:06

I like it but what I would like to see is two colums instead of just having one going from the left to the right.
I also think that the bullets should be indented a little. Overall it looks okay.

Maybe a picture or two to drag attention to something because what I see when I go into the website is just text.

**shopitpress** · Jun 14, 2012 11:59

Site definitely needs a better logo, and the typography needs some improvements as well, doesn't look very good. I like the scroll concept, but still looks too plain, needs more images and cool graphics.

**callvipin** · Jun 15, 2012 01:53

Hi

It seems like a very different style of design. I am not visited this kind of style before. I think for smaller web sites it is ok,expecially for self portfolio web sites You may change the box with the meaning full images

For web with more content ajax based design should be there since otherwise it is very slow for loading. Also you may also try to resize the personal photoes
to some smaller size only...

also please make the fonts more readable refer facebook fonts so smaller yet very much readable and noticable...

Vipin

**Affiliate Noob** · Jun 15, 2012 22:08

I like the fact that you kept it very simple... but as everyone else keeps saying, it does appear too plain.

User Tag List

Thread: Just starting out portfolio site

Thread Tools

Display

Just starting out portfolio site

Bookmarks

Bookmarks

Posting Permissions