www.webdeveloper.com
Results 1 to 6 of 6

Thread: HTML, Flash or Photoshop?

  1. #1
    Join Date
    Jul 2006
    Posts
    19

    Question HTML, Flash or Photoshop?

    Hi everyone. I'm reasonably new to web design and although I do have a basic/intermediate level of experience with HTML, I'm not sure which program I should use to create my site. I already have a site that I have made with Frontpage, but it all just seems a bit too basic in terms of links, layout, interface ect....

    I've recently started learning Photoshop and Flash in order to widen the possibilities of what I can do, but as yet, my knowledge of both is extremley basic. However, I've taken some time out on making my site and have been designing a new site using the old-age method of hand-drawing it on paper. I now have my final design drawn up and ready to create but I dont know which program will be best to create it with.

    My main layout features a menu at the top of the page which I am hoping to create with Photoshop. However, within Photoshop I cannot seem to work out how to place a clickable link on the menu. I could save the menu as a jpeg, import as an image and place manual links over the top but Im not sure if this will cause the links to move about depending on which browser/resolution the site is viewed on.

    If anyone could help me out on this one a bit that'd be great. I wouldn't mind placing manual links over the menu jpeg, but if anyone knows a way of placing links using photoshop and getting them clickable that'd be even better

    Thanks in advance

  2. #2
    Join Date
    Jul 2005
    Location
    USA
    Posts
    3,910
    Learn CSS[1] and code by hand. Any program, like ImageReady or FrontPage, that outputs an entire page worth of code will create badly written code.

    Feel free to create images in PhotoShop, but be sure to optimize them and then write the X/HTML, CSS, or JavaScript that incorporates them into your page by hand.

    I suggest you learn how semantics apply to X/HTML.

    [1] CSS Links for Beginners:
    Adding a touch of style
    http://www.cssbasics.com/
    http://www.htmldog.com/guides/cssbeginner/
    Integrated Web Design: CSS Beyond the Retrofit
    BrainJar.com: Using Style Sheets
    www.glish.com/css/
    www.thenoodleincident.com/tutorials/css/
    http://kurafire.net/log/archive/2005...-css-revisited
    Internet Explorer & CSS issues
    Learning CSS
    CSS2 Specification

  3. #3
    Join Date
    Jul 2006
    Posts
    19
    Thanks for the reply Kravvitz. However, learning codes isn't what I'm after right now.

    All Im after for now is a way to add clickable links in Photoshop. I've created a basic header with a basic built-in menu menu. Well, I say 'menu', but all I have at the moment is a few basic text layers which need to be clickable. If I was to optomize the image like you said, the links would not be clickable. I know a PS image can be sliced and then I could code the slices, but Im also after a way to change the colour of the text on rollover.

    Here's a link to the header/menu that Ive quickly come up with in PS. Its not much at the minute because before I create it properly, I would like to know how to make them links without slicing....hope this all makes sense?

    Thanks for the CSS links btw. I'll have a read through those soon

  4. #4
    Join Date
    Jul 2005
    Location
    USA
    Posts
    3,910
    Why do you want those links to be images instead of text? With CSS you could position them over the header image. Doing that would also make it easier to make the links change color when rolled-over.

    Quote Originally Posted by wisemonkeyuk
    However, learning codes isn't what I'm after right now.
    Then why are you asking questions here? Is that in response to my suggestion that you learn about semantics? If so then, HTML 4.01 and XHTML 1.0 are semantically the same -- hence the X/HTML. I'm not suggesting that you learn XHTML. The issue of semantics is important. Think of it as a step towards writing better HTML.

    Quote Originally Posted by wisemonkeyuk
    If I was to optomize the image like you said, the links would not be clickable.
    What does one have to do with the other?
    Last edited by Kravvitz; 09-22-2006 at 09:48 AM.

  5. #5
    Join Date
    Jul 2006
    Posts
    19
    It isnt that I want the links to be images. I just posted up a jpeg of the whole thing so you can kinda get the idea of what it is that Im trying to do

    If it is indeed possible to position links over the top of the header, then i'll do it that way. I just wasn't too sure if the links would show up in different places on different browsers and screen resolutions....?

    Thanks for your help...do you know of any direct links that will show me how to place a link over an image using CSS? I know I could go and look myself, but you seem to know your stuff and you'll probably know of better places than I do

    thanks again

  6. #6
    Join Date
    Jul 2005
    Location
    USA
    Posts
    3,910
    You're welcome

    The links won't show up in different places with different browser widths if you set fixed widths on a containing element.

    These three articles explain how to style lists.
    http://www.alistapart.com/articles/taminglists/
    http://css.maxdesign.com.au/listutorial/
    http://www.webreference.com/programming/css_lists/

    You'll also need to learn about CSS Layout/Positioning Techniques

    I'm not saying what I'm suggesting is easy, but it is the best way to do things. When you encounter problems there are many people in the HTML and CSS forums here who can help you.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles