PSD to html conversion [closed] - html

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
I have completed designing the template in photoshop. now i want to convert it into html although i am very well aware of all the html, css javascript elements i use firebug too , i have converted many templates till date. my codes does not comprise of the quality it needs. when i download any templates from some premium sites and look onto their codes i feel my code is very bad in shape, my codes crave for improvement. i want to master the proper use of div , ul and li elements, and the css.
is their any proper resource on the web that could teach me how i do it?
is it good if i use 960gs framework?

My Bible: A List Apart

Well, HTML5 Boilerplate provides a layout for quick coding of pages, although you'll need to go through it and pick out what you don't need.
Line25 has a lot of tips on coding sites, including a tutorial on converting from PSD to HTML, and Soh Tanaka's site also has a lot of tutorials.

Such resources as bestpsdtohtml.com can be useful too

css-tricks is another great resource and has some free video content demonstrating converting a photoshop mock up into html and css.
I think this is the first of three showing the end to end process.

Related

Haml: for whom is it? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
In professional development different people make code for web applications and HTML for views. First are programmers and second are HTML markup developer with basic programming skills, but with good skills of Photoshop/etc.
I have asked some of HTML developers: did they try Haml? I showed it to them and they replied that it's an awful tool.
For Whom is this tool? For HTML developers? Or just for programmers who have to make HTML on their own without HTML developers?
What is the advantage of using it for HTML developers?
The Wikipedia entry for Haml does a good job of explaining the problems that Haml tries to solve. In short, it allows for more readable, less verbose markup by enforcing indentation, reducing repetition, etc.
It's probably more useful for a programmer who's using it inside of a framework like Rails, which will automatically take care of converting the Haml markup to HTML in the context of a web application.
A designer working with HTML and Photoshop might not find it worth the extra complexity it would add to their workflow.

Are WordPress templates really just HTML and CSS? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
Are WordPress templates really just HTML styled with CSS in the context of the WordPress "loop"?
Thanks.
Yes, a Wordpress theme can be as simple as a child theme that includes only a single css file with some css overrides, or a full fledged Theme Framework which includes copious amounts of php and more...or they can be just your normal theme(which generally contains css, possibly javascript, and php files that might utilize php only to integrate with the content Wordpress provides into an html document that is embedded in the php file).
The best way to start out playing with themes is to begin making child themes based off a theme like twentyten or twentyeleven made by Wordpress.
They are HTML, CSS, Javascript, and PHP
A quick answer to your question can be found on the requirements page for Wordpress, http://wordpress.org/about/requirements/ where you see that php and mysql are required. If you browse through the developer and advanced topics sections you will see topics about the use of javascript and ajax in word press. I am sure there are other options available depending on how your installation is set up.

Is there a good resource for beautiful HTML forms? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
I am working in rails, and a looking for some resources to design visually pleasing HTML forms. I can write the CSS, so even examples would be great.
Any recommendations?
There are many resources out there, you can just google for well looking forms or something like this.
There are also javascript libraries which makes customized selects/checkboxes etc -for example a project called uniform - check it out, you might like it. It provides you tools to customize it.
You can try Gravity Forms for WordPress then you never need to hand code the html and it inserts unique id's and matching classes in the HTML. This means the sky is the limit when it comes to styling your form.
If you are not using WordPress, here is a nice tutorial for designing form layouts.

HTML layouts best practice [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
Is there a good website or book that gives best practices for HTML layouts? I mean how to use divs to build differet kinds of layouts in a proper way. Thanks
I'd recommend going to CSS Zen Garden (http://www.csszengarden.com/). They're a site that is essentially having an eternal design contest, so they give you well structured markup to style (so you can see how they do it and take a stab at styling as well).
Good luck!
For HTML, there is really only one wellwritten book I know of: HTML Mastery.
HTML Mastery focus on HTML alone, without losing focus telling about CSS and JavaScript.
HTML5 is hot these days though. Introducing HTML5 is a quick read, so is HTML5 for Web Designers.
I use this basically as a guide:
http://www.hotpepper.ca/articles/semantic.shtml
Also check W3Schools on definitions of the different HTML tags and what you need to use them for. For example, you wouldn't use the < caption > tag for something that isn't a caption, would you?
Same thing for paragraphs, unordered lists, etc. One primarily bad example I saw from my former job was ordered lists. They used ordered lists to list down some users. That is good, but in the css, they hid the decimals. That means they could've have done with UN-ordered lists, which is what they should have used.
Always ask yourself why you are using a tag before using it. "Do I really need to emphasize this text? If yes, I should use an < em > tag." etc etc
See The 960 Grid System Made Easy. http://sixrevisions.com/web_design/the-960-grid-system-made-easy/

Looking for real life examples of World Wide Web sites with great HTML 5 markup usage [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
I really would like to get into HTML 5 way.
As a title implies, I am looking for web sites that could serve as an example of HTML 5 usage. I am not talking about some kind tutorials. I am also not interested in shiny things like canvas, video, workers, geolocation ect, yes they are important and nice, but I would really like to become from the roots.
What I am looking for are the cases of, not only correct, but beautiful and self descriptive usage of markup (html elements, new and old, sectioning examples, new form features, microformats). So I could Ctrl + U them (view the source) and learn from them. As there a lot of not really well written websites, and from the other side, most of them are XHTML served as text/html, I found this a not so easy task. That is the reasoning behind that question.
Will be really grateful for all good links.
http://html5gallery.com/
check out http://www.html5rocks.com/
My favorite link for some awesome examples of HTML5 usage is at http://www.chromeexperiments.com/