Opinion on First Site

noreds

My first site.
http://irishiphone.com
I have changed it a few times already but don't really know too much about design.
Only using iWeb to do it at the minute. Reading up on Dreamweaver but not ready to take the leap yet.
Any tips on how to make it look more professional would be great.

mneylon

Image borders - the w3c one should be set to 0

Why are you putting the w3c logo so high up on the page?

Check your spelling

Malice

I didn't like the reflected text on the logo, my brain was processing it as somethingsomething.cow . Customer is spelt wrong on the right of the home page. The images for Unlocking, Guides, Contact Us and FAQs have blue borders around them on IE7 and Firefox. I would change the page title text to something more descriptive than simply "Welcome" as if someone bookmarks the site they will have to change the name themselves so that they can remember what it refers to.

Lastly the display is messed up in a variety of ways on Opera, here's a screenshot, click on it for a larger image:

Strokesfan

I think it's really nicely done - very professional, if I'd an iphone I'd want you to unlock it! Same as someone else said, don't like the reflection effect but love the site. Best of luck.

noreds

Thanks for the really quick replies.
Things you dont notice when rushing to get something done.
I will correct all the issues mentioned today.

The issue with the blue box round the top images.
The 4 images are rollovers and this is the code for the first 1:

<script type="text/javascript">
function mouseOver()
{
document.rollover_one.src ="http://irishiphone.com/rollover-images/pink-iphone-rollover-2.png&quot;
}
function mouseOut()
{
document.rollover_one.src ="http://irishiphone.com/rollover-images/pink-iphone-rollover-1.png&quot;
}
</script>
<a href="http://irishiphone.com/Main/Personal_Unlocking.html"&gt;
<img alt="Personal-Unlocking-Pink" src="http://irishiphone.com/rollover-images/pink-iphone-rollover-1.png&quot; name="rollover_one" width="152" height="300" onmouseover="mouseOver()" onmouseout="mouseOut()" style=”border: none;”/></a>

Does anyone know where I went wrong with them
I dont really know why I put the W3C logo up so high
I have no sort of plan to what I'm doing.
Just learning as I go really. Like I said I don't know about design.

I have been looking into RapidWeaver. Does anyone know if it is any good.
Would it be easy to move from iWeb to RapidWeaver.
On the rapidweaver site they say that

RapidWeaver has been built with web standards in mind. All templates are XHTML and CSS based. All the code RapidWeaver generates is valid so you can be sure the sites it produces are XHTML strict.

So building a site with it should help solve some of the compatability issues I am having with different browsers.

I'm gonna read up and play round with RapidWeaver today and see if I can mock something up quick.


thanks for all the input so far guys. anymore comments or advise is always welcomed

noreds

I've just updated some of the site.

• I removed the reflection on the IrishiPhone.com banner at the top
• I have got rid of the rollover images and replaced them with regular images
• i changed the boxes from round to more square looking
• i moved the W3C logo to the bottom of all pages
• i also changed the large outline on all the boxes to a much thinner line and darkened the colour of it
• And of course changed my stupid spelling of customer. embarrassing to say the least

As for why it displays differently in Opera I am at a loss on that one. Anyone know why or can point me in the right direction.

I also went and bought RapidWeaver and have started messing round with it.
Already lost with it though. But hopefully it will be better to learn it in the long run. Dont like my site being incompatible with some browsers

Please let me know what you all think. No need to be nice about it. I just want it to look its best.

Also if anyone has used RapidWeaver or knows of some good tutorials for the rubberheaded average joe that would be great too

Cheers so far lads

daymobrew

Or are just plain lazy and would rather have someone else do all the worry and work.

I think that this line is a bit patronising.

http://irishiphone.com/Main/Personal_Unlocking_files/shapeimage_12.png - woah, that text is an image! That could be painful to maintain. "at time of print" - maybe change to "Currently 1.1.4".

http://irishiphone.com/Main/Personal_Unlocking_files/shapeimage_20.png - "Did you have a working unlock iPhone" - I think 'unlock' should be 'unlocked'.
I would also append '...' as the 2nd line is really a continuation of this sentence.

http://irishiphone.com/Main/Contact_Us_files/shapeimage_6.png - the text should probably be moved down a bit to be vertically centred.
http://irishiphone.com/Main/Personal_Unlocking_files/shapeimage_6.png - similar.

mneylon

daymobrew wrote: »

I think that this line is a bit patronising.

Describing potential clients as lazy probably isn't the best strategy

MOH

On your FAQ page, under how do I get my phone to you, you have:
There are 3 options"

then list only two. Not sure what that quote is doing there. Also, the text looks a bit cramped vertically.

There's a lot of pictures, I found it a bit slow loading.

noreds

Thanks for the feedback lads.
Yeh wasn't trying to be patronising. I was just trying to put some humour into it.
I am terrible at spelling too. (Think I am the lazy one)
Anyway trying to tidy up my mistakes

• Have changed the text and remove the lazy comment (daymobrew)
• Centered both .png files (daymobrew)
• Also changed the "At the time of print" to "Currently 1.1.4" (daymobrew)
• Added the 3rd option on the FAQ pages (MOH)
• Also appended the second line (daymobrew)

The image http://irishiphone.com/Main/Personal...peimage_12.png was not an image when I made it in iWeb. It was just a simple text box. Just browsed through a few more and it looks like iWeb must convert them to .png files instead of text boxes. Doesn't IE have some sort of problem with .png files ?

Yeh I agree there are a lot of images. And it doesn't help when iWeb magically creates .png files for my text.
Thats one of the reasons Im trying to get my head round RapidWeaver.
The little brain I have is still in iWeb mode when trying the new way to do things.

Thanks a lot guys you have really helped me and at least I know still a few decent people left out there to help others.
Fair Play !

Anyway lets know if you see anymore of my rubberhead spelling mistakes.
Or anything else that could help improve the look and feel of the site.
Hopefully I will have made the switch to RapidWeaver by the end of the week.

Any comments good or bad welcomed.

Cheers again

daymobrew

noreds wrote: »

Doesn't IE have some sort of problem with .png files ?

Only for partial transparency, it's grand for basic png files.

noreds

ok I'm in the middle of moving to RapidWeaver
This is the new look so far
http://irishiphone.com/alt/index.html
Don't know how to add gradients effects to the boxes or anything else fancy yet so bear with me.

And please let me know what you all think of it
How does it compare to the previous look of the site
and of course I'm sure there will be some more spelling mistakes knowing me
If you see any lets know please.

Anyway off to bed and will hopefully have the new look done by Friday fingers crossed

sticker

noreds wrote: »

ok I'm in the middle of moving to RapidWeaver
This is the new look so far
http://irishiphone.com/alt/index.html
Don't know how to add gradients effects to the boxes or anything else fancy yet so bear with me.

And please let me know what you all think of it
How does it compare to the previous look of the site
and of course I'm sure there will be some more spelling mistakes knowing me
If you see any lets know please.

Anyway off to bed and will hopefully have the new look done by Friday fingers crossed

She's looking odd in Firefox - see pic.
Saying that - I do like the design... nice job - just be aware of cross browser compatability.

daymobrew

Wow, it has a lot of stylesheets - 13!!
http://irishiphone.com/alt/rw_common/themes/lava/css/pageheadertext/WhiteTextShadow.css - is only 3 lines and empty!

I like the menu - it's like a mootools one I've seen elsewhere.

sticker

It's working fine in Firefox now alright...

I wouldn't be able to give you a code opinion as I'm pretty useless in that dept but aesthetically, it looks great...

Some areas of text left to be adjusted - like the sections 'centered'

But I like think the different colour schemed are kinda funky!

TechieEddy

The site looks prity good. Good idea aswell.
Browsershots is handy for checking your site with a wide range of browsers and operating systems.

noreds

cheers for all the good comments lads
yeh the menu is a RapidWeaver theme called Lava
I dont know whether I should make the menu and background the same color on all pages
Or go with what I have now which is different colors on each page.

Anyone have an opinion on this let me know

Also if anyone knows how to add a gradient effect in the image and text boxes in RapidWeaver please tell me
I think the boxes look a bit dull compared to the nice flashy nav bar I have at the top
would like to have something bit nicer looking to compliment the nav bar
Any advice on this would be great

I only have 2-3 pages left to change then I will take down the old look site and up with the new

TechieEddy thanks for the browsershots. i am in the middle of checking it out now
and cheers for the compliment
And cheers to the rest of you all for checking it and being so quick on the replies.

Will post back again soon as I have the full site ready to go

noreds

Ok just made the move from iWeb to RapidWeaver.
Have tried my best to place redirects in for anyone using old bookmarks or links.

irishiphone.com

If anyone could check it out and let me know what you think of it.
And of course if anyone spots any of my stupid spelling mistakes please let me know.

Cheers

MOH

On most screens, I can't really read the right end of the customer comments, the colour is too close to the background, just blends in.

On the Home page, there's a vertical black line before the Comments menu item, not sure if that's intentional.

News page:
- Why is there a completely different menu on the news page? Bit confusing.
- At the end of the Firmware 1.1.4/edge article, it might look better if all the steps to follow were aligned, whereas currently the first two are to the right of the picturea and the rest are under it. Also at the end of that article, spelling, "Please elave a comment"

Contact form:
The contact form looks a bit odd to me, as if the whole box was supposed to be filled in light green but isn't. But maybe that's just me. The submit button looks like the bottom of it's been sliced off. Found the way each field gets highlighted when you click near it a bit confusing, as some times it didn't highlight when I expected it to, you seem to have to click closer to some fields than others. Also, "originally" is misspelled in the grey pop-up box.

Personal Unlocking page:
under Unlocking Info on the right, "That's were unlocking" should read "that's where unlocking"


[edit] Forgot to say, site looks grand in general apart from my nitpicking points, and also I'm using IE6.

noreds

Ok I've tidied up some more

the customer comments ?
is it the actual comments or the dark grey box at the top above the comments that you cannot read

the vertical black bar on the home page is actually a defect in the theme I am using
I will be sending a message to the themes developer soon as I finish this message. until something is sorted with it I changed to a different slightly darker theme for them pages. all the other colors in the theme seem to be fine.

• Have changed the news page to the same theme.
• Have also got rid of the leave a comment as I dont know how to set it up for people to leave comments yet.
• Changed the background of the Contact form to match the form color.
  http://irishiphone.com/Contact_Us.html
• Have extended the form also so please tell me if the Submit button is still cut in half
• Spelt originally properly, cheers
• Changed "thats where unlocking...." too

As for the nitpicking, please do.
Its what will make the site perfect, or near as possible.
as for IE6, least I will know if I sort out any issues you have on it anyone else with other browsers will handle it fine.

i am looking for something else instead of the 2 grey boxes on the Main page.
I think they look very dull but dont really know what to replace them with.
i want something flashy and fancy. but thats just me.
Any opinion on what I could do with the boxes ?

Anyway cheers for actually taking the time to read my ranting and follow up and help out.
If there's any help I can give some day you will have it.

Lets know if the changes look better

Cheers:)

MOH

Only had a quick look, but contact form looks better now to me, button is fine.

On the comments - it's the last few letters of each comment that are hard to read. Not sure if you're seeing it the same way, but the end of the black text runs onto the grey background, can't give you a screenshot right now.

News page looks more consistent, although the text is now starting on a dark blue background which makes it slightly difficult to read.

noreds

I changed the news page to the black theme, same as the home page.

yeh i dont see anything wrong on the comments.
but im only using safari and firefox to check it.

screenshot would be great whenever you get a chance

cheers

MOH

Sorry I never got around to that screenshot, had trouble uploading it from work.

Just tried at home in IE7 and it looks fine. Did you change anything?

Axwell

Nice site noreds,not sure if you are in the middle of making changes but in IE6 there is a lot of errors with the layout. Id suggest you have a look at it on IE if you can as i see your only testing on firefox and safari i think you said.

Im viewing the site on IE6 with 1024x768 and the site is too wide for the screen and makes it look like its aligned to the right.

The white background is about an inch short on the left and right instead of being the same length and the header and footer.As a result it means half your comments box cant really be seen cos theres no white background against the text, it also causes the same effect with the different boxes you have going down the page.

All your images have the same alt tag which should be changed to describe properly what the image is for.

You have a validation symbol on your pages but the site doesnt validate properly on most of these pages, only small errors but still means a fail. Also there is a border on the symbol which would look better if it wasnt there.

Sorry for the long list but its a nice site and im sure you would rather these things pointed out so you can fix them. I like the way you have the different colours on each page so id keep that its a nice touch.

MOH

Axwell wrote: »

Im viewing the site on IE6 with 1024x768 and the site is too wide for the screen and makes it look like its aligned to the right.

The white background is about an inch short on the left and right instead of being the same length and the header and footer.As a result it means half your comments box cant really be seen cos theres no white background against the text, it also causes the same effect with the different boxes you have going down the page.

That's a better explanation of what I was trying to get across. Worked for me OK last night in IE7, but I'm probably on a higher resolution at home.

noreds

could possibly have been updating it as i constantly am changing something
my updates only usually take minutes.
i sometimes get errors myself and then a refresh shows the new look of the site.

i use a mac so only way i get to test IE is via browsershots.com and the last week i have been having a bit of trouble with that site.

the actual theme on theme site contains a lot of javascript and does have one or 2 bugs i have spotted so far. the theme developer has been looking into it and he is releasing an update soon so i am hoping it will solve any other problems people have been experiencing.

if anyone has any suggestions for more features i could bring to the iphone user let me know.
and of course any error please tell me and a screenshot with them would be great if you guys get the time to

cheers again