Monday, 10 December 2012

Job Work At Home


I feel obligated to share with you the method I wished I'd had when I first started out those nine long years ago, now. And more fun that most people could imagine, easier, i've developed a simple method for creating stunning web site designs faster, over time, and. And just about every language you can think of, action script, java script, cGI, cSS, xHTML, hTML, pHP, ASP.Net, i've tried ASP. I've gone from a Front Page rookie to a wily PHP designer and hit every bump in between. But I learned more than I ever could have reading some book or taking a class, i've made just about every mistake known to man, in that time. I've been designing web sites for about nine years now.

How NOT to Think About Web Design

Never daring to venture into the code unless I absolutely had to It wasn't until I became absolutely frustrated with the limited nature of the software that I slowly inched my way into learning some HTML. . . I was purely a Front Page guy, for the first four years. One of the biggest road-blocks I encountered on my journey is my own fear of "getting dirty" with the code. It's important to always start off with the right kind of mindset when taking on any project and designing web sites is no different.

You realize how much more you can do knowing just a tiny bit of code, once you begin to learn some code, and. Operate off simple common sense and logic, especially today, most programming languages. Because it's so logical, learning code is easy. I've wished I would have been more brave sooner, from the very first day. . . Let me tell you, and.

And even a basic knowledge of a couple programming languages allows you to do much more than you ever could with any software program, it's easy, it's simple. Learn the code, if you're serious about being a web designer or designing truly professional web sites. Don't spend years frustrated by a software program that will never give you the control you're looking for. My first piece of advice is to NOT do what I did, so.

. . Now onto the cheat sheet.

Step #1: The Pre-Step

One of simplest and most effective steps you can take to make your life less stressful is to take a moment and simply draw out the layout of the design you see on a piece of paper. My friend, not so fast. Your first instinct when you come up with a new idea is to immediately rush to the computer and start working, if you're like me.

And you give your mind a specific and focused direction in which to aim, what the overall look and feel should be, you define exactly what elements you want to have on each page, by putting it on paper. It's as if the mind suddenly focuses once you put your idea on paper. But it makes such a huge difference, it might sound stupid and frivolous.

Draw out your design first, no matter how silly it may or may not seem!

Step #2: Lay Out Your Files

See the resource box below), and include them in a index.php file (Note: if you're not sure what I'm talking about here or how to do it, so just create them, you know you need them. Go ahead and create these files right off the bat. ). Etc, contact us, about, index. 4) style.css and 5) your individual content pages (i.e, 3) sidebar.php, 2) footer.php, if you're using current web design standards (and you should be) then every site you build will have a similar set of core files: 1) header.php.

That way you can focus on designing and you can test your site live to see how it looks, this gets the core functionality of your site out of the way.

Step #3: Build Your Page Layouts

What kind of elements will it have? Where will it go? What about your footer? Will you have a sidebar? Will you have a navigation bar at the top or in the sidebar? Will it have multiple columns or just one? What will your header look like? Yet), here's where you'll need to decide exactly what elements the pages of your site will have and where they will go (we're not worried about what they look like.

Lay all this out first. You're making the blueprint that determines how it all comes together, yet - instead, you're not painting and hanging up pictures. This is where you lay out the basic structure of your site - kind of like building the walls of a house.

Step #4: Conduct Basic CSS Styling

Their basic layout and shape, get your divs lined up how you want - the right heights and widths. You'll want to do some very basic styling, in other words. It's time to start to add some insulation and drywall and see how it all looks, that you've got your "walls" up, now.

So I can see how everything is coming together, i'll leave these colors applied throughout most of my design work, in fact. So I-know which div is which when I look at it in a browser and I can see if everything is lining up how I want it to, and footer) a different color, sidebar, content, a little trick I use is to make all my main divs (which should usually be header.

Step #5: Build Your Design Elements

This is where most of the creative work actually takes place. And so on, headers, bars, logo, this is where you create your background images. You'll spend it in Photoshop (or whatever graphics program you use), this is where you'll spend the majority of your time - and.

And frustration, money, you have a much more clear idea of what kind of elements you'll need - which can save you time, at least if you do, but, you may decide to outsource this portion of your designing, of course, and. Don't move on from here until you've got it exactly how you want it. And get them exactly how you want them, test them, build your design elements.

Step #6: Check Browser Compatibility

There's nothing more frustrating than building an entire site only to find out it causes Internet Explorer to have a heart attack. You want to stop and do this for the major design elements you've built so far, at this point. So inevitably I have check to see how Internet Explorer renders my site, i test my designs in Firefox as I build them.

It typically works out to be less work you have to do later, you have a lot less code to work through and if you handle the major issues now. Stop here and check. . . But trust me, it might seem tedious.

Step #7: Integrate Web Technology

If you're building a Wordpress Theme (which you can do following this same method) this the point when you would integrate the Wordpress PHP code into your design. So you can see how that technology will integrate into your site, it's important to do this now before you do anymore CSS styling. And it's time to add in your major technology elements, you have your site mostly in place, you've got your major design elements down, now.

Step #8: Advanced CSS Styling

The great part is with CSS you can style elements very specifically and get them exactly how you like them. I'm always tweaking my sites here and there. Another thing to keep in mind is that this stage never really ends. You can begin to finalize your CSS styling, now. . . You should have your site mostly built structurally, at this point.

Step #9: Validation

And search engine rankings, credibility, it's well worth the time in terms of reputation. On takes me a half an hour to hour to knock out, typically, it's really not that hard to do and. It's rumored that Google pays attention to this, not to mention. Building a site that validates is the sign of a professional web designer. It's not, for me, but, this might be optional, for some people. Validation. . . Oh yeah.

Wrapping It All Up

Be sure to check out my resource box below, so if you'd like to learn more about web design, we're not able to cover any one topic in too much detail here, of course. But it was worth it in the end, it took me about five years to get it down to a science like this. That is my cheat sheet and the exact method I use to design web sites, well.

No comments:

Post a Comment