Announcement Announcement Module
Collapse
No announcement yet.
PSD to HTML Page Title Module
Move Remove Collapse
Search Search Module
Collapse

Advertisement Advertisement Module
Collapse

Featured Images Featured Images Module
Collapse

Mediabistro Creative Sites Mediabistro Creative Sites Module
Collapse
Latest Topics Latest Topics Module
Collapse

  • approveme
    Reply to How to choose a good graphic design for a web design company?
    approveme
    These are 10 things you should take into account when choosing a logo designer:

    Proven Success & Experience
    Positive Testimonials
    A Thorough Design Process
    Awards &
    ...
    Today, 09:06 AM
  • sfys
    Reply to school project one pager
    sfys
    thanks! could it be that you watched the site through Internet explorer ?
    I don’t know why but it pushes some things two pixel down. I work on a mac so I mostly tested it on chrome, safari...
    Today, 06:01 AM
  • extraordenary
    First Poster Design
    extraordenary
    Hey guys!
    I wanted to know what you guys think about my first poster design. I'm still in high school and I've just recently decided that I was going to pursue in this career path. Prior to this...
    Today, 05:26 AM
  • megoggsc
    Reply to Oh Portland!
    megoggsc
    Thank you Billy! I am still working on it, but here is the version that I meant to upload. I emphasized the Portland sign a little more in this one. ...
    Today, 02:49 AM
  • BillyLogan
    Reply to Oh Portland!
    BillyLogan
    Great work! My only concern is that it does not seem to have a focus subject on it. Add something really cool or highlight something you want to emphasize. Aside from that, I find it really artistically...
    Today, 01:45 AM
Advertisement Advertisement Module
Collapse

Sponsors Sponsors Module
Collapse

X
Conversation Detail Module
Collapse
  • Filter
  • Time
  • Show
Clear All
new posts

  • #31
    You can always give it a try -- see what the results look like for a comparatively simple project. That could give you a feel for what does and doesn't work well. In my experience very little comes over in good enough shape to be worth keeping, so I just avoid such tools. You might find some value in them though. Nothing works like experimentation.

    Comment


    • #32
      Originally posted by aaronjunited
      Can you confirm if it's possible to design a site in photoshop or fireworks, slice it all and write...
      I agree with what Meffy said.

      There's obviously a place for Photoshop (or Fireworks) in web design, just like there's a place for a chainsaw in cutting lumber to build a house. But as Meffy alluded, it's a matter of using the right tool for the job.

      When I design websites, I'll often prototype the main pages in Photoshop since it's fast and enables me to rapidly make and see the results of tweaks and changes. An added benefit is that when I'm satisified, I already have most of the bitmapped images (backgrounds, icons, etc.) ready to go. I'll position all the Photoshop elements on different layers — especially those I intend to use as actual graphics in the website. I don't, however, simply slice chunks out of the flattened image for use on the site. Instead, I'll carefully take only those graphics from the mock-up that can't be duplicated with HTML/CSS, then trim, reduce and compress them to their most minimal and efficient form. Then I'll write the HTML/CSS by hand and incorporate those minimal bitmapped graphics as needed.

      I always try to build sites that are as minimal and efficient as possible. If there's a way to remove a few bytes, I'll do it. When I'm done, one of my goals is to have as little flab as possible. When you use a term like "slice" up a Photoshop or Fireworks file, I instantly imagine big rectangular chunks of the layout built from chopped up bitmap images, then glued back together with HTML to produce the final piece. There's just no way to build a svelte and efficient site when doing it that way. The code might validate, but if the pages unnecessarily weigh in at 500 hundred kilobytes instead of 50, it's not a well-built site.

      Comment


      • #33
        Yes! A hundred times this.

        I recently did a conversion on the documentation for a graphics library for programmers. The original HTML had been... um, non-compliant with standards. I broke the half-megabyte page (that's just the code alone) into over a hundred pages, cleaned up the code, reformatted it as best I could, with decent indentation and so forth, and made it validate 100% both XHTML and CSS. That took care of the first order of cruft.

        However, it's still not as efficient as it could be. There are redundancies, places where two consecutive spans with the same class could be combined into one, that kind of thing. Had I time I'd go back over it and take care of those second-order uglinesses.

        I want to stress that the original author, the same programmer who ported this library from C++ to Pascal, did a great job of writing the original document -- from a programmer's point of view. It tells how to use the various functions and such. The HTML code his authoring tool generated didn't do the work justice IMO. I think I've done better, though not well enough to call it perfect.

        That said, it's got to be "perfect enough" for now. I have to USE the library I've been re-documenting to write new programs. :-} ("Gotta program! Will write docs later" is why a lot of programming stuff never does get properly documented. I can't escape it either.)

        Comment


        • #34
          Marvelous, you two have really helped me a lot in understand psd to html.

          I can't thank you enough for the advice given and the insight into what way it can be done, should be done and what is professional.

          Thanks.

          Comment


          • #35
            Originally posted by Meffy View Post
            I recently did a conversion on the documentation for a graphics library for programmers. The original HTML had been... um, non-compliant with standards. I broke the half-megabyte page (that's just the code alone) into...


            That reminds me of a job I was hired to do about ten years ago. The client's website totaled about 20,000 static pages (of mostly useless information). There was no rhyme or reason to any of it. Every page looked different and the whole site was a conglomeration of WordPerfect and MS Excel documents that had been auto-saved to HTML, then altered and re-altered innumerable times with MS Frontpage and Adobe PageMill.

            I was hired to design a new site in a content management system, then take all the information from these 20,000 pages, sort through it, clean it up, make logical sense of it all then move it into the CMS database.

            Aggghhhhh!

            It was 20,000 static pages of this kind of auto-generated total nonsense:

            HTML Code:
            <v:stroke color2="#f60 [7]">
                 <o:left v:ext="view" color="black [0]" color2="#f60 [7]" weight="1pt"
            joinstyle="miter"/>
                 <o:top v:ext="view" color="black [0]" color2="#f60 [7]" weight="1pt"
            joinstyle="miter"/>
                 <o:right v:ext="view" color="black [0]" color2="#f60 [7]" weight="1pt"
            joinstyle="miter"/>
                 <o:bottom v:ext="view" color="black [0]" color2="#f60 [7]" weight="1pt"
            joinstyle="miter"/>
                 <o:column v:ext="view" color="black [0]" color2="#f60 [7]"/>
                 <br><BR><BR>
                 <i><i><i><i><i><i><strong><strong><i><b><i><i><i><i><i><i>
            <i><i><i><i><i><I><I><I><I><I><I>
            
                 <FONT=arial><SIZE=2>
                       Thanks<BIG><strong><BIG>!!!!!!</BIG></strong></BIG>
                 </SIZE></FONT>
            
                 </I></I></I></I></I></i></i></i></i></i></i></i></i></i></i></i></i>
                 </b></i></strong></strong></i></i></i></i></i></i><br>
                 <BR><br>
            
            </v:stroke>

            Comment


            • #36
              *goes crosseyed just at the thought of dealing with such... schtuff*

              <i><i><i><i>
              <canta y no llores>
              <porque cantando se alegran>
              <cielito lindo los corazones>

              Comment


              • #37
                <b>...that would drive me nuts!!!! Cross-eyed?? I'd have gone postal, I'm sure. LOL
                "Go ahead, make your logos in PS. We charge extra money to redraw your logo into vector art so it can be printed on promotional product. Cha CHING! " - CCericola

                Comment


                • #38
                  Hey guys you have too much knowledge thanks for sharing you experience and knowledge with us....

                  Comment


                  • #39
                    That's great information that ever I get as above. I used the photo shop as well. I didn't faced any problems to make the designs according to my choice as well. It will have very creative tools that you can use through different ways.

                    Comment

                    Mediabistro A division of Prometheus Global Media home | site map | advertising/sponsorships | careers | contact us | help courses | browse jobs | freelancers | content | member benefits | reprints & permissions terms of use | privacy policy Copyright © 2014 Mediabistro Inc.
                    Working...
                    X