When in doubt draw your wireframe

Adobe-Proto

This might sound crazy but sometimes going back and drawing out your wireframe for a website can sometimes help you build a lot easier. Especially when you get into the situation of Div’s in div’s in div’s. Now I think some of the basics you can go back to is just to simply get a pencil and pad and just simply draw it out. I know that sounds very “basic” and not really something people like doing but I have done it a few times when I need to plan out a complicated website or design and it just helps flush it out easier and bring to light a few things and eliminate a few bugs that could come up if I just go in code blazing.

When I actually do draw it out, I plan out names, which elements can go where and also I will draw out sizes too and that helps plan out the website in a more efficient manner cause sometimes I will forget a element or run into something that I didn’t foresee and that has caused problems. So its one of those live and learn moments.

Now probably one of my favorite tools that I wish adobe kept on using was adobe proto. I use to have this on my old android tablet. now what this did was allow you to draw out a outline of websites and actually export it over to dreamweaver. Now what did this come in handy for? well doing email templates and also building basic landing pages and microsites. This was definitely the more high tech method to building a simple wireframe and figuring out what you are going to name your div’s and other elements to your website. I really hope adobe brings back proto or actually includes it into dreamweaver cause it was really cool building a simple website with just your tablet and exporting it to the cloud and just having it work….but thats for another blog post.

What are some of the ways that you like planning out a website? Drawing? Lego set? share your ideas in the comments and let me know!