Website Design ??

S

shaun adams

If I had a website done by one of our graphic designers would it be possible to change it into a working website.

If so what would be the best format to do it in.
 

fisicx

Moderator
Sep 12, 2006
46,713
8
15,384
Aldershot
www.aerin.co.uk
Probably not. The way to design and bild a site is to begin with content and set up a wireframe to test the navigation, usability, accessibilty and so on. The actual layout can be easily sorted afterwards.
By all means mock up a few schemes but how will you know which ort of nav system you need until you have the content sorted
 
Upvote 0

fisicx

Moderator
Sep 12, 2006
46,713
8
15,384
Aldershot
www.aerin.co.uk
Just because you can convert an image to an HTML page doesn't mean it's a good way to go. Much more effective is to consider the content, navigation, calls to action and so on before getting embroiled in discussions about what font to use, colours, positioning, backgrounds and so on. You don't buy the furnishing before you know what shape the room is going to be so why adopt this approach for a website.
 
Upvote 0

tony84

Free Member
Apr 14, 2008
6,580
1
1,395
Manchester
Any design can be transferred into a working website.

It makes it easier if the design in .psd (photoshop) than if it was a jpg/gif etc.

It will need to be converted into html initially and then if you want any advanced code in (search, contact form etc) it will need to converted to a php page.

But in answer to your question, yes it can be and it can be fairly simple.
 
Upvote 0

Tin

Business Member
Nov 14, 2005
2,931
1,427
Herefordshire
www.tinsoldierdesign.co.uk
Yes, you can do this. Most of the designers I've worked with, work this way and it's often the best way to do things as design considerations can be tweaked/changed at any point during the design phase both quickly and easily. Once you've got the finalised design, it's a simple job of slicing and dicing the graphic up into a fully coded working site.

You'll have no problem getting your design converted to code and there's plenty of people out there that will do this at reasonable cost for you. Just make absolutely sure that you're fully satisfied with your design before you go to the coder as it's likely to have a cost implication if you want to make changes to a coded layout.

Hope that helps and good luck.

Ray
 
Upvote 0

wood1e2

Free Member
May 2, 2007
2,315
174
Leicester
He's not asking about how to design a website, he's asking if a graphic design can be converted to a working website.

Best format, PSD or PNG.

Maybe this is just me, but when someone posts a question like the one posted here....I read between the lines.

That is to say... "What is the OP really asking?"

If I was to answer the OP with a simple answer, that could be:

Yes, slice using a slicing tool or photoshop,
If using photoshop you can save as .HTML
If not then you can get someone to code your slices into a HTML file.

There you go that's your website completed!!

But was the OP really asking that, fisicx offers a view of how it should be completed. Giving the OP a better website and more possibibility to convert sales and with other work possibly rank higher.

You can have a website, but whats the point if it is not working for you!!!

Why is it in IT that a larger percentage of professionals just offer the service that people ask....and ask the question what they are actually trying to achieve?

It may not be rocket science, you may be able to buy a templated solution or off the shelf....but that is only the start of it!!

I even heard many years ago when a designer was asked to design a website. The client was very happy when he was sent the .zip file of his website. He asked the designer when he would be able to see the website online?

The designer stated that the client never asked for hosting, domain name registration...so that's why people cannot see your website!!!

The client didn't know what these were, just presumed that when speaking to a professional all bases would be covered.

With 'off the shelf' out the box websites and solutions, professionals have to offer more, than just doing what the client asks.....

Sorry for the rant, feel better now.
 
Upvote 0
If you are going down this road it will be much easier if your graphic designer has some idea of the constraints of HTML. Layouts designed by a graphic designer cannot always be successfully translated into a working web design.
 
Upvote 0

dataferret

Free Member
Sep 28, 2006
335
57
All of the points people have made about designing the website are clearly well intentioned but missing the point. The OP asked if a graphic design could be converted into a website. There as no mention about how to design the website so I am assuming the OP does not want to know this and would ask further questions if required.

So to answer the original question of can a graphic design be turned into a website:

a) Yes - you can use services such as those found at www.psd2html.com. They will take any design created by your graphic designer and convert it into a html, css or dynamic website. There are others out there too so search around.

b) Yes - you can ask your graphic designer to code the website for you and slice it, optimise it or manipulate it as you see fit.

c) The choice of format is best decided by what you intend the website to be. For example, if it is a single page site with basic information then a simple html page will be enough. But if it is a content heavy site with lots of images and sections then a dynamic site is probably best. More information is needed before adequate advice can be given.

If you have any other questions please ask here.
 
Last edited:
  • Like
Reactions: cmcp
Upvote 0
All of the points people have made about designing the website are clearly well intentioned but missing the point.

Just as well you are here to keep everyone right then. ;)

Actually you are correct. More information is required but it is wrong to suggest that "any" design can be converted to HTML. I once had a graphics company ask me to do a website based on their design and their layout could not be recreated because it was based on text wrapping around curves. This is one example of what cannot be done.
 
  • Like
Reactions: awebapart.com
Upvote 0
If I had a website done by one of our graphic designers would it be possible to change it into a working website.
Graphic designers who just do graphic designs do not 'do' websites. At best they do graphic designs of a website. A static picture of a website. A working website is very different from a static picture of a website. Try buying something from the following picture of Amazon's website:

amazon00001.jpg


There can be a hell of a lot to do to turn a picture of a website into a fully working website, especially an ecommerce site (and I'm guessing it is an ecommerce site the OP is talking about since this thread is in the ecommerce forum).

To make things easier:

1. Get a graphic designer who understands the constraints and framework, and designs specifically for the web medium - not all graphic designers understand this, some might focus on the print medium

2. Choose the right ecommerce system which best meets your requirements first, choose a supplier who can implement a solution based on this system which meets your requirements, then ask your supplier to work with a graphic designer, or provide their own graphic designer, to ensure that the graphic designer designs within the framework and constraints of the ecommerce system solution

3. Bear in mind that any picture of functionality is very different to implementing fully working functionality. A picture of a design your own t-shirt system within an ecommerce site is very different from implementing a design your own t-shirt system.

4. Ideally get a graphic designer/web designer who can output in a format closer to the final format you need, i.e. in the web format HTML/XHTML/CSS. If you cannot get this, then get a graphic designer who can produce full quality fully layered photoshop psd or illustrator files, but then also budget for someone else to translate this into a web format.

5. Alternatively, don't get a graphic designer to design the whole website, especially if the ecommerce solution already provides a major proportion of the website design. Just get the graphic designer to focus on the stuff you do not have, like the logos, banner graphics, other graphic images illustrations etc.
 
Last edited:
Upvote 0
full quality fully layered photoshop psd
Just to clarify what I mean by this. A PSD in itself doesn't have to be layered, it could be one flat layer, so just asking for a PSD is not ideal.

Ideally, with PSDs, you need something you can slice and dice, not just horizontally (x axis) and vertically (y axis) but also along the z axis for overlapping elements. A simple example might be text on a background image, you want to be able to take out just the background image, because the text might need to be web text, not an image of text, or subject to change and database driven (content managed). You may also want to separate in this way to optimise the website, optimising not just for the web medium but also for accessibility or SEO purposes. The design should also consider what content elements are subject to change, what content elements could have content smaller or bigger than that displayed in the current graphic design, and as such the design should be able to accommodate this (shrink or stretch appropriately).

So that is why I say "fully layered photoshop psd", preferably from someone who understands the web medium and understands what happens in the next stage in the workflow of converting the psd to a web format.

I say "full quality", because again this helps with the conversion process. You do not want reduced quality jpg compressed images in a layer if they ideally need to be converted to gifs to web optimise them. I've seen this happen in PSDs from graphic designers too, and again this is a symptom of not understanding the web medium.

So if you go for psd, ideally get a full quality fully layered psd designed with the web medium and solution framework in mind.
 
  • Like
Reactions: los_design
Upvote 0

fisicx

Moderator
Sep 12, 2006
46,713
8
15,384
Aldershot
www.aerin.co.uk
Converting an image (however it is created) into HTML/CSS does not result in a working website. All you get for your money is a single page. A working website includes the content and navigation, a range of services or products, maybe a payment portal, contact forms and all manner of other features.

Take a look at this thread here: http://www.ukbusinessforums.co.uk/forums/showthread.php?t=134947. If this is the site Shaun wants then converting an image isn't the way do it.
 
Upvote 0

RBcreations

Free Member
Feb 23, 2010
9
0
I can do that for you , whoever says they cant is talking rubbish. Its the way it should be done. Design department designs and then its up to the skill of the webdesigner to make it happen, taking cross platform issues into consideration and presenting the problems encountered to the designer for an agreeable solution. Give me a bell and i'll have a chat about it.
 
Upvote 0

fisicx

Moderator
Sep 12, 2006
46,713
8
15,384
Aldershot
www.aerin.co.uk
I can do that for you , whoever says they cant is talking rubbish. Its the way it should be done.
O Rly? So programming, UX, accessibility, user testing, site structures and architecture, information flows, readability, captology and so on all hang on the whim of the graphic designer?

As I said, You can convert an image to HTML but that doesn't make it a website.
 
Upvote 0

RBcreations

Free Member
Feb 23, 2010
9
0
Just as well you are here to keep everyone right then. ;)

Actually you are correct. More information is required but it is wrong to suggest that "any" design can be converted to HTML. I once had a graphics company ask me to do a website based on their design and their layout could not be recreated because it was based on text wrapping around curves. This is one example of what cannot be done.

this is an example of where you would tell the client they will have to do that as a graphic and not code. It can still be done though, to say you cant do it is still nonesense. If you can make a 3d model of an engine explode and rotate on a website you can do text on a curve believe me.
 
Upvote 0
Yes RB - I don't think anyone is saying that it CAN'T be done, they are saying that it SHOULDN'T be done. There is so much more to a site than the pretty pictures. As a lot of people on here have already said, information architecture, user interface design and effective coding are all fairly important.

Most designs can be coded up to fully functioning, semantic and standards compliant, but you can't say for a 100% fact that ALL designs can be made into a site that works across all browsers and is totally semantic.

Surely you can see the point of everyone here?
 
Upvote 0

NextPoint

Free Member
Feb 3, 2009
509
139
Liverpool
I can do that for you , whoever says they cant is talking rubbish. Its the way it should be done. Design department designs and then its up to the skill of the webdesigner to make it happen, taking cross platform issues into consideration and presenting the problems encountered to the designer for an agreeable solution. Give me a bell and i'll have a chat about it.
The words of the type of designer that programmers and Alan Sugar hate to work with. Nearly every series of The Apprentice has had a team that has lost because they had this attitude - one that comes to mind was when the teams were to design a calendar; the losing team designed a nice cats calendar that had great photography, but the calendar was part was too small to be useful. The moral of the story - design should complement functionality and not dictate it; in web terms this means it should complement how the user can access the content - including navigation, readability and SEO.

If this was The Aprentice, Lord Allen would be saying:

sugarRUCK1704_468x347.jpg
 
Last edited:
Upvote 0

RBcreations

Free Member
Feb 23, 2010
9
0
look can you just post the design up so we can see it, its probably an image with a line of text underneath, so let not get too stoppy just yet he folks. Wouldnt that make you stroppy lot smile. Everything everyone has said has been right from a certain point of view by the way, if we were all in a meeting we would commune into a web design sunami ! you can in html if you insert an swf into it. My point is , YES YOU CAN TAKE A PHOTOSHOP DESIGN INTO A WORKING WEBSITE DEPENDING ON WHAT THE DESIGN IS, WHAT INTERACTIVITY YOU WANT, WHAT ACCEPABLE TECHNOLOGY BOUNDRIES APPLY ie "browser and plugin issues" AND IF YOU HAVE ENOUGH MONEY, which is my favourite bit!

Not really my rates are very reasonable.
 
Last edited:
Upvote 0

fisicx

Moderator
Sep 12, 2006
46,713
8
15,384
Aldershot
www.aerin.co.uk
...if we were all in a meeting we would commune into a web design sunami ! you can in html if you insert an swf into it.
Eh?
YES YOU CAN TAKE A PHOTOSHOP DESIGN INTO A WORKING WEBSITE...
No you can't. You can convert a photoshop file into HTML/CSS but all you have done is create a layout not a working website.

What happens if the client decides they want to change the colours, increase the padding around the H1, add a border to an element, increase the width and so on? If the layout was created in photoshop you need to go back to and update the file, export and hope it doesn't affect all the work the programmers have been doing. On the other hand if you had begun with the HTML framework and added CSS to create the layout then making the changes is a doddle and can be done on the fly using a FF plugin.
 
Upvote 0

RBcreations

Free Member
Feb 23, 2010
9
0
Eh?

No you can't. You can convert a photoshop file into HTML/CSS but all you have done is create a layout not a working website.

What happens if the client decides they want to change the colours, increase the padding around the H1, add a border to an element, increase the width and so on? If the layout was created in photoshop you need to go back to and update the file, export and hope it doesn't affect all the work the programmers have been doing. On the other hand if you had begun with the HTML framework and added CSS to create the layout then making the changes is a doddle and can be done on the fly using a FF plugin.


He didnt say he wanted to design a website he wanted to change all the time , he asked a simple question didnt he. he is the client as far as I am concerned and hes asking me if he can get a graphic turned into a working website. You dont have to export it again, you can make changes to the XHTML and CSS directly, you dont just chop it up in imageready or whatever anyway. Only to chopout and optimise images for sprites. Also you can do more if the psd is left with layers in tack as you can export layers then use CSS z-positioning to recreate the individual layers and have control over the position like you do in photoshop with layers. Even in HTML 4 you can do acceptable recreations anyway. You can also do it on the fly with right click, view source, crtl F, type in tag your working on, find it, edit it, file save , refresh. Saves silly gadgets but each to there own. You have to view you files in ie etc anyway, just cut out dreamweaver and dive right in mate. Go on I dare you. Dont tell me you design browsers or something super advanced, just my luck.
 
Upvote 0

fisicx

Moderator
Sep 12, 2006
46,713
8
15,384
Aldershot
www.aerin.co.uk
This is going nowhere. I think the point is being missed.
Agree. You can convert an image into a layout but that doesn't make it a working website. Building a wroking website still needs someone to dive into the code and create all the pages, navigation, content and so on.

The thread has however degenerated into a tit-for-tat about design ethos.
 
Upvote 0

Latest Articles

Join UK Business Forums for free business advice