Hi! I'm designing my very first website with photoshop, I need help creating my design into a dynamic website. I previously met face to face with a webdesigner, discussing my plans of creating my site. I'm very determined about how I want my website to look, and I don't feel like leaving the designing to anybody else. He advised me to design my website with photoshop, not only would I get my site exactly the way I wanted, but it would also make it a lot less expensive. I'm in the prosess of designing the homepage of my site, but I don't have an overview over all details the person creating the site would need befor I send it to person who code/HTML it. And I'm unsure if I would need split up the design and save all the small details for web, or if the webdesigner would be able to do this (and how much less would it cost me if I did it myself?). Before I can hire someone I would need to know who to hire (I don't know the title of the profession of someone who would take my design and make it into a site). I also need to know what details I need to make clear (about the design) for the person who will do this work for me. I hope someone here can help me with my questions. Thank you
Usually, it's best to find the person or company first - they will be able to suggest better design solutions, or maybe even tell you about things you want that are either not possible or just not avisable. Designing something entirely in Photoshop and then using that design to make a website is a bit of a 90s approach, and involves a lot of not-necessary pictures to be used as backgrounds etc. Usually, a lot of the needed effects, colors etc. can be achieved with the proper use of CSS. Hence, I advice you to first get in touch with a professional webdesigner, and then do the design. Making a mock-up in Photoshop is usually good, but don't create a set design and say "this is how it should look - make it" and be done.
@PoPSiCLe is being polite. Now, word of warning, I'm going to be BRUTALLY frank with you -- you aren't designing jack ****! Dicking around drawing goofy pictures in photoshop is NOT sane nor rational web design. Generally speaking you are probably saddling yourself with images too big to belong on websites in the first place, fixed height elements that are the antithesis of accessible design, and making life WAY harder once it comes time to make the layout elastic (auto-expanding/shrinking to user's default font size, which is different from zoom!), semi-fluid (since fixed widths, ANY fixed width is inaccessible inept re-re BS, no matter how many lazy morons tell you otherwise), much less responsive (the new kid, changing the layout based on available screen width). By starting out drawing pretty pictures that have NOTHING to do with accessible design, you have put the cart before the horse and the end result is NEVER going to be a good website. You should be starting out with the content of one of your pages, or at the very least a reasonable facsimile. Put it into a 'logical document order' in a plain text editor where if there was no HTML it would still make sense. The ONLY thing you should be using a paint program for at this point is resizing/cropping your CONTENT images. (as opposed to presentation/layout images) You then mark it up semantically (aka put HTML tags in) adding your navigational elements where they too would make sense assuming there was no such thing as the default appearance of the tags or the screen style you will eventually make. This gives you a nice baseline that is what screen readers, braille readers and search engines see -- since if you are choosing tags or putting ANYTHING in your markup to say what things look like, you're doing it all wrong! Then you bend that markup to your will with CSS to create your layoutS (Yes, PLURAL!!!), adding any extra DIV and SPAN (aka semantically neutral containers) as needed and ONLY as needed. People screw this up all the time adding things like DIV around perfectly good block-level containers like UL for no good reason. -- then and ONLY then do you have any business going into Photoshop to make any images you hang on the layout if any -- thanks CSS3!. The final step being to add any "gee ain't it neat" scripting to further enhance the user experience -- remembering the unwritten rule of JavaScript that "If you can't make the page functional without JavaScript FIRST, you likely have no business adding JavaScript to it!" This procession of steps is called "progressive enhancement" -- and should be done so that should any one of those technologies be blocked, unsupported or unavailable the page is still useful to as many users as conceivably possible -- called "graceful degradation" -- that's WHY HTML EXISTS! -- sadly most people sleazing out websites any old way can't see any further than the screen they're in front of, and they waste time and money destroying any project they work on in the process. Wasting time screwing around in Photoshop is a massively back-assward approach to building a website; JUST as back-assward as a number of other 'common practices' in the industry like trying to shoe-horn content into off the shelf templates (one of the BIGGEST scams out there). In many ways it's akin to using WYSIWYG's to build websites in that what you see is NOT what the user is going to get. It is the antithesis of accessible design and I've never seen a website where a PSD jockey spanked it on the screen first that wasn't a fat, bloated, slow loading inaccessible train wreck of how NOT to build a website. With the range of resolutions, screen sizes, and device capabilities that your site might be viewed on, working in a tool entirely designed for the creation of FIXED graphics just flat out doesn't make any sense. Seriously, I meet whoever started this idiotic halfwit BS of crapping out PSD's and calling it "design" in a dark alley, someone isn't leaving that alley.
To sum up what @deathshadow, elegant as always, is pointing out: Designing a website in Photoshop is a no-no, really. It doesn't do anything a modern website should do, and the only elements you really need to (maybe) design in Photoshop, is a logo (which shouldn't be designed in Photoshop anyway, as Photoshop doesn't really (at least it didn't a couple versions ago) produce proper vector images - images that scale flawlessly depending on the user-settings). But then, Illustrator would be a better tool for the job. Most anything else - menu-elements, boxes, shadows, gradients - they can all be achieved using CSS. Making a mock-up in Photoshop or any other image program of what you _want_ it to look like, is okay - just don't tell the webdesigner that "this needs to be the exact layout".
... and I wouldn't go that far just because it encourages the notion of it, and it's a wasted step. FAR too many people waste FAR too much time putting FAR too much thought into what a site "MUST look like" before anyone asks the important question of "What's the content?" -- particularly sad when what it looks like pretty much NEEDS to be adaptive and fluid to meet the needs of all users -- again the entire reason HTML was created in the first place: device neutral delivery of CONTENT. The end result of that mode of broken thinking is akin to the old Wendy's commercial. It's a big bun. It's a really big bun. Really big fluffy bun. WHERE'S THE BEEF?!? See the idiotic halfwit BS of off the shelf templates from whorehouses like Themeforest or TemplateMonster; shoe-horning content into one of those is such a massive road to /FAIL/ the only way any of the scam artists on those sites are able to make money is the ignorance of the average person who goes "I want a website" without enough knowledge of the topic to make anything resembling a sane and rational choice. Side note, this is why grammar school teachers hated me. I can make what looks like a run-on sentence that is in fact not...
From personal experience, every project I started out was designed somehow (either with Photoshop or a different software). It makes it easier for the stakeholder to see the design, change it or approve it. Any front-end developer worth their word should be able to convert that design into proper HTML/CSS code (I happened to work with great front-end developers who can easily convert a design into HTML easily and look exactly like it looked on photoshop, which made my life much easier as a backend coder).
Then you've probably never had an accessible fast loading properly coded design. Which shouldn't be done until after you've determined what goes on the site; at which point just code it -- particularly since the markup should be ~95% or so the same regardless of what layout and graphics are hung on it. There is WAY too much "what it looks like at a fixed size on desktop" and not enough "what's going into it" out there. Because dicking with finding the right layer is easier than changing the code how exactly? Can you make that wider? (edit css in one spot) Can you make that a different color (change the color attribute)... Nope, don't get it. Which means it likely doesn't adjust to the visitors needs. Which illustrates a further problem; most PHP dev's don't know enough about HTML/CSS/DESIGN end to be coding jack ****, and most PSD jockeys don't know enough about HTML, CSS or accessibility to be designing jack ****. I've NEVER seen a website built with the PSD first approach that wasn't a fat, bloated inaccessible train wreck of "gee ain't it neat" garbage that was actually useful to visitors -- no matter how 'pretty' they end up. But again, I say the same thing about 99.999999% of the nube predation brothels like ThemeForest or Template monster. The only way any of that crap manages to lumber on like a behemoth is the ignorance of the average person who goes "I want a website" without the knowledge or foresight to be allowed to even have one in the first place! Which is why eductating people that "what it looks like on your screen" has ABSOLUTELY NOTHING to do with what everyone else sees, off the shelf templates are a giant scam, and how most all of the people dicking around making pretty pictures in photoshop aren't qualified to open their mouths on the topic of web design.
@deathshadow - we both know we're never gonna agree on this, but for (quite a few) web isn't about real content any more - it's about "neat" and "flashy" and "looks cool" - content is often secondary, or at least just added as sort of an afterthought. Although, most of the most popular webpages nowadays are fairly simple in their design - YouTube, Instagram, Tumblr, Facebook (exception to the rule), Google, Gmail, Twitter - they're not very flashy, either of them - rather, fairly simple. Not saying they're well coded, because they're usually a complete mess of javascript and other anomalies, but they look (and mostly work) okay
... and that is what is wrong with most websites, and why the vast majority of startups end up little more than dead-end "also ran"... because if you don't have content, what is the point of even HAVING the site in the first place? "neat, flashy and looks cool" might scam people into throwing money at it, but it also means what is actually there to make anyone visit, much less revisit it at all? People visit websites for the content, no matter how many SEO-tards, PSD jockeys and ignorant halfwit "sophisticated Internet investor, will give money for vague promises" site owners try to say otherwise. ... and have been simple all along -- you can toss e-bay, amazon, slashdot, and a whole host of other sites on that too; They are not a visual tour-de-force, they emphasize what's important -- the content they are trying to deliver! You really think ANY of those had some PSD jockey dicking around drawing goofy pictures as their starting points? I can't think of any major successful website that did! I can think of a lot of steaming piles of manure that take a day and a half to load and are inaccessible train wrecks that started as PSD's though since again, I've never seen a website that started out as a PSD that wasn't a buggy, broken, inaccessible, bloated slow loading disaster that is completely doomed to failure.
Oh. Most of the "simple" designs have gone through a rigorous design process - mostly professional UX-designers, granted, and they mostly work in wireframes more than PSD, but they're often at the beginning of the design process - of course the idea is paramount, and comes first.