Big Hello

[gffects]

A BIG HELLO! Guys.

 

This is my first time using the forum found it after watching a few of killersites.com free videos,

 

My name is Harry Abernethy (AKA Gffects[Graphic Effects]) and I am a student at Aberdeen College in Scotland

 

and I am a beginner Web Designer/Amature Programmer and would love to have honest feedback from you here at killersites.com.

 

I am almost through My higher National Certificate so my Xhtml and css skills are quite good even with the poor file managment lol

 

shortly will be moving on to my Higher National Diploma so it would be a great help if you guys can help me out because education pretty

much is crap and not fast enough progress.

 

I have a website still under construction and will be working on it as I can so my first feedback comments will be on that so check it out www.gffects.com everything there is homade sample images until I get working on a real portfolio to showcase oh and ignore the writting in the support page its all wrong.

 

So yeh thats me with an introduction about myself and looking forward to any replys and now i'm off to check you all out and give feedback where I can.

[benjaminmorgan]

Hey, Welcome to the forums! If you ever need any help just ask!

[grabenair]

Hello and welcome to the best forum that there is for getting help with your web designing/developing. We love to help as it helps us also.

 

I took a look at your site. Just a little advice, I would get rid of all the bold text it is kinda distracting. I would change the font color from blue to black. With the background it is hard to see for a color blind person. This is something I never thought of until I started asking my wife for feed back. She is a little color blind.

 

There you go your first piece of advice. Second is make sure to read the rules for you do not get into trouble.

 

Hope you have fun here with the rest of us.

[seoking4]

Thanks i have join this forum befor some days .It's better then other forum here we can get good helps from others.

Edited April 2, 2012 by Andrea
Links Deleted

[Andrea]

Welcome, Harry.

I agree with Grabenair that you need more contrast between your text and background. It doesn't necessarily have to be black, but definitely a darker blue. Especially the text on the transparent strip in your header image is hard to read - and that white on yellow at the bottom is to me impossible to read. Besides, the yellow itself seems to be a bit out of place considering the color theme you have in the rest of the page.

 

On your About page, it should say "We are young students of Aberdeen College that WHO will offer good quality of work."

 

Some of the words in your navigation menu don't link, only the icons do.

 

And to the code:

 

<ul>

<li class="current">

<li><a href="index.html"title="Home"><em class="home" ></em><strong>Home</strong></a></li>

<li><a href="tuts.html"><em class="tuts"></em><strong>Tutorials</strong></a></li>

<li><a href="portfolio.html"><em class="portfolio"></em><strong>Portfolio</strong></a></li>

<li><a href="contact.html"><em class="contact"></em><strong>Contact</strong></a></li>

<li><a href="support.html"><em class="support"></em><strong>Support</strong></a></li>

<li><a href="about.html"><em class="about"></em><strong>About</strong></a></li>

</ul>

 

You can't just have a li tag with a class and nothing else (referring to li class="current") and having those empty em tags makes no sense. For one, the em tag has a specific function, to emphasize text, so adding a class to it and changing what it does does not seem logical to me. And absolutely makes no sense at all to have it empty. Just add your class to the li tag - that's where it belongs in this context.

 

also, put a space between index.html" and title. (The space is also missing in your footer navigation)

 

This:

<div ="shadow">

is missing either the word class or id.

 

There are two footer sections - I don't kow if this wrong per se, but it certainly makes no sense.

 

You should always run your pages through a validor - in your case, it shows you have several other mistyped tags and other fixable issues: http://validator.w3....om%2Findex.html

[gffects]

Thanks Everyone for the great advice I will put it onto tow work today, not sure what you mean by bold text if it is on the about me age I was testing a strategy to gain attention to the text. I reused here here just to stand out

The yellow footer is just coloured for moving the container won't be kept.

The em class is what i used to contain the icons couldn't figure any other way todo so and yes it has not been through the w3c validators yet.

li calss as current is something I wish to work on I have been trying to study navbars individual to see how far I can push the site.

Oh and the site is in html bases and something you all missed is it's horrible on IE but I will use your advice and rebuild the whole thing with consistant w3c testing again thanks very much for your honest opinion

Heres a question though is it better to make things using the spiral model or the waterfall model so i can either make the whole thing then show and wait for feed back or should i make just the header then the nave bar and show them individual for feed back?

[Andrea]

Regarding the IE issue - look into IE support for HTML5 - that'll tell you why everything is a mess.

 

As to the bolding - you have so much bolded, it loses its purpose and just kind of looks annoying.

 

As to your last question - never heard either term, but it really doesn't matter.

 

Just add the class you know have on the em tag to the li tag - same effect, but proper method.

[gffects]

Ok I have been thinking about your advice and this is purley the design just now the coding I will do once i have the mock sorted out, I created this on firworks which I find the best method for creating a mock.

I took into consideration about boldness and colour the idea is to try make it professional but show crativity at the same time always tend to be at one end of the slope lol.

 

This is the new idea for the layout of the hompage.

if you have looked at my site the picture at the top is the slider.

once I have this page done the rest should be easy to make except for the form which is a pain

[gffects]

Ive noticed there as been no more help on my quest to make a great protfolio I read the rules and if I have pushed any boundries I do apologise all i'm trying to do is establish a good portfolio for when I leave university in the next few years.

 

Due to my redesign I took all of your information in consideration and have finally at long last about 18 hours works finshed still have the other pages to complete though this is what I ended up with. quite happy with it aswell

[Andrea]

It's always better if you can provide a link. There is only so much you can see on an image.

[gffects]

After reading the rules i notice it wasn't the best idea to add links but here it is website portfolio

[Andrea]

We're trying to keep the forum spam free - it's a battle, I tell you. But you are obviously asking for help, so that's ok - if you want to make things fool-proof, just add a space or to into your address like this: gff ects.com. We know to remove the space, and any shadow of doubt re Spam is removed.

 

I did try your link, but after well over 2 minutes, the page is not open yet. Take that back, I can see something now, but it's still running something, and it took way too long for anything to appear. When viewing in Firefox, you have a horizontal scroll bar and I'm viewing at 1280px, so your design is way too wide. Also, the bottom navigation is broken, About is under Home. The validater also took forever, but only showed 7 errors, all because you have a link tag between your ul and li tag, which is a mistake.

[gffects]

The first link i gave also took me ages but i correct that so should load fast now ill check it through the validator and correct the ul mistake bare with me 2 mins. ill rmeber that space thing i'm not trying to cause spam just trying to be abtter designer

[gffects]

ok fixed the error but i get a problem i want the hover of the logo not to glow but it's following the li a:hover attribute and to be honest looks bad no idea how to fix that but it passed the w3c new link to site g ff e cts. com

still takes ages to load thats not the case when you type it in manually might be able to reduce the image quailty to account for the page size no idea.

Edited April 3, 2012 by gffects

[gffects]

ok fixed the error but i get a problem i want the hover of the logo not to glow but it's following the li a:hover attribute and to be honest looks bad no idea how to fix that but it passed the w3c new link to site g ff e cts. com

still takes ages to load thats not the case when you type it in manually might be able to reduce the image quailty to account for the page size no idea.

 

Think it might be the server acting up shouldnt be having this problem with the loading of the page

[grabenair]

The site is looking good. It opened fast in Firefox and chrome for me, you must have fixed that problem.

 

I did not take a lot of time looking at your site I have a meeting in 15 min. But if the #wrapper is what is surrounding everything change the margin to { 20px auto;} the 20px will push it away from the top and the auto will set the margins left and right to center the site in the browser. The margin on the top is just a personal personal preference, I just think it looks better to get the content away from the top when the header does not go all the way across. Your header does go all the way across so instead of 20px just make it 0 The before was for future reference.

 

One more thing if you set the width to 1000px it is easier to do the math for your borders, margin, padding and what ever else you need to allow for.

Edited April 4, 2012 by grabenair

[Andrea]

You still have an issue with the display width. When I'm viewing at 1280, the content sticks directly to the right side, there is a substantial horizontal scroll bar, and your bottom navigation breaks tossing "About" under "Home". (Also, you probably meant 'PoRtfolio - what are you smoking??? )

 

Even when I view at 1900 width, there is a scroll bar. You should design your pages to fit at least the most common lowest resolution, which last time I checked, was 1280.

 

Also, the "About Page" in the "Who are we." (I'd remove the periods, those are not full sentences) pushed down further that the bottom links in the other two columns and looks off.

 

You need to move your IE stylesheet AFTER your regular stylesheet. The cascading effect goes from top to bottom - so a page would first read your IE stylesheet, and then the regular one would overwrite what the IE sheet says. You want it the ohter way around, else you're defeating the purpose of the conditional styles.

 

The code in your HTML starts with an empty container division- no point in that that I see.

 

Then you use just the <div> tag around your navigation list - that's also not needed.

 

Overall, you have way more division tags than needed - the cleaner and leaner the code is, the better.

 

The "Why us." column needs a bit of padding on the right, and the entire text in all three needs reviewed for proper punctuation.

 

That's all I have for now. Let me know if you have any questions.

[gffects]

ill fix these problems today i have not notice alot of them duie to my pc looking ok with my witdh then when i used my laptop i noticed the whole page moving to the righ I cannot see the borken footer nav but will follow your instructions fix it and in a few hour will gte back to show progress oh and my punctuality is horrible I need to send it to somone else to fix lol ill make a new topic so not to spam this one any more.

[grabenair]

Just a side note for you, this is a good place to check out screen resolution.

 

http://www.hobo-web.co.uk/best-screen-size/

[gffects]

Awsome nice find

 

Ok I have fixed the resoloution as far as i can see ment removing the logo from the top nav though.

although for some reason I can not find the reason for the horizontal scrolling only happens on firfox workes ok in IE and i'll rember to change my own resoloution during design from now on that way this problem won't happen again. Liv and learn.

[grabenair]

It works ok for me in Firefox.

 

Why are you changing your screen resolution? Personally I leave mine alone and never touch it. Although I could be wrong in doing this. I have been wrong before and I am sure that I will be again soon. If you design your site content no more then 1000px wide you should be fine. This should work on older monitors just fine and look ok on the newer ones also. At least the last few years anyway.

 

You also talked about working on your pc and your laptop and the different sizes of monitors . What I do is when on my pc with the large monitor I just shrink the browser window down to the size of a 15 inches, 38.1cm, this is because I am to lazy to get up and go over to my laptop.

[gffects]

Ok ecept for adding correwct spelling and what not both the hompage and the portfoliopages have passed the html markup validation should i do the same for the css validator or is that not as important.

I originally made everything to fit 1000 px but now it all at 944px just to fit in with the grpahics im ok with that.

Next page is the contact page proberbly the hardest one as well any tips on making a good one haven't gone into great detail with them at colege yet.