My Process for Marking Up Design
Code HTML Only - Don't go back and forth between HTML and CSS markup. Structure the page to make sense using as few DIVs as possible.
Modify CSS for phones - Stay out of the HTML and write CSS for viewing from a users phone.
Modify CSS for tablet - Again stay out of the HTML and see how far I can get with the design for tablet viewing.
Modify CSS for Desktop - Again stay out of the HTML and see how far I can get with the design for desktop viewing.
Modify HTML if need and corresponding CSS to finalize page.
Clean up.
Thanks to Mikael & Travis for helping me get so proficient here.
Written by Brandon Gadoci
Related protips
4 Responses
Cool, I'll try this the next time
This would work even more efficiently with HAML and Sass.
is a good thought, but sometimes we need to include new elements in HTML css throughout development. I'll try to do as you say, because currently I do it for parts, then do the top, then the rest, always di top to bottom, HTML and CSS, and it is satisfying to see the layout forming, this brings encouragement to continue and complete.
Agreed. I actually have moved to SLIM and SASS. Love them.