Join 3,519 readers in helping fund MetaFilter (Hide)


Coding is coding, but it's not coding.
February 10, 2010 9:35 AM   Subscribe

How can I change my type of thought? I am a computer programmer... career and hobby. Just because I can look at a problem and conjure a procedural solution, it doesn't mean I can create a great website. I wanna be a web guy. Hope me.

I have a knack for computers, especially programming. I have been programming and working with PCs for more than 30 years.
I want to create web pages and sites. I have done a couple of sites for friends and businesses of friends but I don't have the zing that really makes it go.

I can write software from the detailed planning stages or just blindly, from the seat of the pants into complex machines that run complex processes.

I look at a website template that I want to modify for a friend's business and it becomes an insane chore. The mental pain and difficulty of pulling the creativity out of my mind is excruciating. I pretty much know what I want and how it should look, but it just won't come off the tips of my fingers.
I stumble over which editor to use... I want the editor to "do it for me". I photo-manipulate the graphic for a logo and end up not saving the intermediate step that I really need later on. I don't know what I'm doing!

I have read books and web tutorials on web design and pages, but the spark is not there.
When I program, it comes naturally to me... I see the code in my mind... the HTML on the other hand, is just a blur.

I am asking specifically because a friend just started a business and wants a small web site. Just something simple. A couple pages of text describing the service he offers, contact information, a form to fill out for more info, and maybe a page of "helpful links". He came to the house last night and it was like pulling teeth to get me to select a template and get started. He thought he would get a site easier than that (i did too). I struggled with placing and trying to move an image from the left to the right side of the page header for far too long and got very frustrated. He only wants maybe five or six pages of static stuff... no flash, shockwave, no database stuff... easy, right?

Of course, then I get to over thinking it. Do I need to use PHP to build up the common areas? (page headers, sidebars, footers) Do I put everything in PHP so the site is all one file and the text that is displayed selected by the menu number... it becomes programming??!?

No, I am not leaving programming forever, I just want to be better at developing web sites. I want it to be easier for me so I can look forward to it instead of dread it.
posted by Drasher to Computers & Internet (36 answers total) 13 users marked this as a favorite
 
Consider yourself very lucky that programing comes naturally to you. The same frustration you're having with web design is the frustration many people have with other types of development.

Sometimes all the flashy Dreamweaver things get to be too distracting for me and I just want to see my code. Have you tried building a site without using a WYSIWYG editor? You might try just using a basic text editor and working on the html & css alone. If you're a code-minded person then just pay attention to the code. You really don't need anything more then Notepad and Firefox to build a website.
posted by Hoenikker at 9:46 AM on February 10, 2010 [1 favorite]


The way to do this is to hook up with a designer who gets clients. A designer is someone who spends their time in photoshop and hands you the templates to slice, dice, and chop up. Clients love talking about colors and pictures but they don't really like talking about databases. It's a natural fit. Hit up the design firms in your area, tell them you're a programmer, and start working.

Specifically, what kind of programming is "PC programming"? I came from a scientific statistical based C++ kind of world to this web world, and the only things I took over from that were UNIX admin stuff, knowledge of data structures (really, really lacking when you look at any random homebrew php pile of code), and an ability to treat everything as text files, which helps so much. Because, in the end, the web is built with images + text files. Learning what the heck was going on with floats? That was a new skill.

The other thing I can recommend (and this will help the most): The web was primed with the "View Source" menu option on the original Mosiac browser. These days, you create HTML with Firebug + Firefox and learn. Spend a few days looking at other websites with Firebug and see how they've created the pages. UberHint: you can edit the values in Firebug. That's how you learn.
posted by sleslie at 9:59 AM on February 10, 2010 [2 favorites]


The same advice applies as if you were just learning any other kind of programming- start small and do some projects that seem fun to you.

Don't over-commit yourself by trying to help your friends before you're ready to- being in over your head with a bunch of new things can be a learning experience, but time pressure/ social pressure can have negative effects on your ability to learn.

Imagine if someone who got their start in web development had a friend ask them to write them a "simple" desktop GUI app. There would be a lot to learn before work on the target project could even begin.
posted by Jpfed at 10:00 AM on February 10, 2010 [1 favorite]


Programming and markup languages/stylesheets are VERY DIFFERENT. HTML + CSS != programming.

*Most* Javascript guys are not very good at the semantic markup/stylesheet side. Javascript is a real programming language that is extremely powerful. I would suggest that you learn that as well as basic HTML and CSS, learning Javascript will be much more fun for you and will drive your need to learn HTML and CSS.

If you don't become a pro HTML and CSS guy, don't sweat it, most people hate it. It's not that you can't learn it, it just doesn't interest you. Don't worry, there are other people who are the opposite.
posted by mallow005 at 10:06 AM on February 10, 2010


You really don't need anything more then Notepad and Firefox to build a website.

If you already know all the weird browser quirks cold, maybe, but you probably want access to some other browsers. Especially older versions (I'm looking at you, IE6) if you're going to support them.
posted by juv3nal at 10:09 AM on February 10, 2010


WRT the over-thinking thing: I've been teaching myself to be less of a perfectionist and more of a kludger when it comes to building websites. This means cut-and-paste coding rather than trying to create a perfect function which does everything just by varying the parameters used to call it; or deliberately writing kludgy code because, you know, it's faster even if it's not elegant. I love elegant code, I like terse code, but I've found that clients change their mind so often it's a way to drive yourself insane if you worry about how the code looks, or whether it is elegant or efficient. Force yourself to write "good enough" code and after a short time you'll find it's actually quite relaxing in a "wrong" kind of way, a bit like eating junk food ;)

Also, guilty-but-everybody-does-it secret about the creative side of the development: everyone steals everyone else's design ideas, whether it be the whole structure of a site or that nifty CSS-based menu or the JavaScript to do the AJAX call-backs (this is pretty much what sleslie is saying I guess). If you like, you can say you've been "influenced" by another designer because it sounds less evil that way, but very few people are original whatever you choose to call it.

Finally, I try not to do anything with graphics except the actual graphics. There is a better way to create menus and other page elements apart from the 1999 way of "hard-coding" an icon or image to do it. Learn to be a CSS god (or a CSS prince, at least) and you will thank yourself later. Move your elegant solutions from the programming to the CSS and you get immense benefits when you need to change things around in a hurry.

Good luck. On the whole I prefer programming but web design has its moments too.
posted by BrokenEnglish at 10:15 AM on February 10, 2010


Rethinking this a bit... would anyone recommend Dreamweaver or the like? I don't use it so I don't know if it solves the cross browser issues, but a "five page static website", the fact that this is a hobby and not a career, and the fact that "ANSI C" is what the original poster put in on his profile leads me to believe this will be the most time-efficient solution.

original poster: props to you for knowing K&R cold, but the web world right now is a where we all were pre-K&R. "Hope me" will be the start of the comminations!

Basically, throw programming completely out of the equation and treat it like a fancy word document.
posted by sleslie at 10:49 AM on February 10, 2010 [1 favorite]


You can't skip being a beginner.
posted by andrewzipp at 11:06 AM on February 10, 2010


It sounds like the "tools" you're trying to use for design are getting in your way a little and frustrating you. If you're looking for visual interest, try using the ultimate, visual-only tools to start out: paper and pencil, or paper and pen. Do a lot of sketches to get your creativity started. It won't look as vivid or perfect as a computer-generated graphic, but this is _just to loosen up_ and get some original ideas out. Once you've got that, you can use your orderly programmer brain to make it perfect/better/fit.
posted by amtho at 11:06 AM on February 10, 2010 [1 favorite]


I've been making websites since high school (I'm in college now) and it was my introduction to programming. Couple lessons that I wish I'd learned sooner rather than later:

1. Web standards are very loose. Browsers have different levels of support for html and css, so don't expect stuff to work as it "should." This is why a lot of programmers hate doing HTML/CSS, and a lot of the traditional programming wisdom doesn't carry over.

2. Copy and tweak code from more experienced web developers. Most of the problems have already been encountered and solved by someone else. This is true with regular programming, but bears repeating.

I have a lot of respect for designers who know what they're doing. A good designer has to deal with the client, keep up with web standards (these change pretty fast), and produce something that satisfies their creative impulse. That's pretty tough so don't beat yourself up if you don't get it immediately!
posted by yaymukund at 11:09 AM on February 10, 2010


Just as I floundered trying to word my question... everyone is hovering...

I have no hope or desire of making the web a full time job. It is supposed to be a fun thing for me... I want to play!

"PC programming"... current project is a combination of embedded code on a PIC micro talking to a PC over USB. The PC is running Win7; the program is a VB.NET GUI front-end with a C++ DLL that I am writing to do the hard number crunching and communications. Previous projects included PC<>UN*X middleware<>Mainframe communications for car dealer ordering systems (for GM)... Micro based (68HC11) to car proprietary communications (RS232 evolving to CAN). Also, micro (6809) based computer that did real-time car performance analysis.

sleslie has the right idea...

I know CSS is a big part of the answer... but the metaphor escapes me... while programming, I write something to do something; while [writing HTML/CSS], I write something to change how something looks... the process is similar, but there is a severe mental twist that I am not making.

I also know that web code is easily borrowed from one place to another. (so is programming code)

"You can't skip being a beginner." Yup, you are quite right... and that is the crux of what I am trying to do. [Shame on me.]
posted by Drasher at 11:22 AM on February 10, 2010


Sounds to me like you're a decent coder, and a lousy designer.

There's nothing wrong with that. Embrace your niche.


Do I need to use PHP to build up the common areas? (page headers, sidebars, footers) Do I put everything in PHP so the site is all one file and the text that is displayed selected by the menu number

The answer to this, as with almost any code architecture question, is "it depends." Do whatever gives you the best combination of ease-of-development and ease-of-longterm-maintenance for the particular project you're working on.

"Put it all in one big file" is almost never the right answer, though.
posted by ook at 11:29 AM on February 10, 2010


Take a bunch of screenshots of websites you like. Re-code them yourself by hand with HTML, CSS, and Photoshop. Use Firebug to understand how these things are put together. Do not use Dreamweaver / FrontPage / WYSIWYG, as you will not learn how to code / tag a webpage. Devour the popular links on Delicious for CSS, HTML and Design and read sites like A List Apart and Smashing Magazine. Again, code this by hand.
posted by kaizen at 11:33 AM on February 10, 2010


Oh, and to answer...

I have tried Dreamweaver (but the trial has since expired, and it costs too much for a hobby), Kompzer, Notepad++. Are there other suggestions??

I really need to learn more CSS. Is there a jump start? I get the tutorials and all that, I have a mazillion bookmarks for CSS template and learning sites... I just cannot seem to wrap my head around it.

"Sounds to me like you're a decent coder, and a lousy designer." - heh, you are right.
posted by Drasher at 11:34 AM on February 10, 2010


kaizen - actually sounds like good advice... certainly not the easy way to go, but the immersion process gets pounded in there by the school of hard knocks.

I like it.
posted by Drasher at 11:36 AM on February 10, 2010


"Just something simple."
That's the phrase every designer dreads hearing from their clients mouth. Because its never simple.

Others have touched on this, but the problem appears to be that you think that because you know programming, web page front end work is easy. Many developers and programmers I've worked with over the years have that mindset, and those are the ones that write absolute shit HTML/CSS. Its not easy, its an entirely different discipline; from the front end coding to the design end of things.

For starters, front end markup really requires a skilled hand that can visualize how the site will be, and how to organize the structure of the document. You need to be able to visualize how the HTML will work in conjunction with stylesheets.

It sounds like you're also dabbling in the design end of things, a completely different discipline. While the two often cross paths, and many web designers can code html, and many coders can do web design, that's not you (yet).

You'll be lest frustrated if you stop thinking of it as easy, and start thinking of it for what it is; a completely new skillset to learn. Stop thinking "Just something simple" and that you can just "figure it out". While I'm sure you can, you'll end up spending more time and pulling your hair out.

You might also want to consider learning to build from scratch, rather than trying to modify someone else's template. Different coders have different styles, and there are different levels of the quality in code. A poorly coded site might look the same as a well coded site, but be a nightmare to modify.

Finally, a book I can't recommend enough is "Transcending CSS" by Andy Clarke. It's more of an intermediate book, but what it does is cover some great ways of thinking about HTML and CSS that you won't find in other how to books.
posted by [insert clever name here] at 11:36 AM on February 10, 2010


I am very similar to you. I am a great web programmer (PHP and the like), but when it comes to the actual design process I have a harder time.

Here is what helped me a lot:

1. Familiarize yourself with the code. You do not need to memorize what every element in CSS does, but as long as you have read through a manual (like W3schools) at least once, you will know what element you need and where (even if you need to Google for it).

2. Practice. Every time you try something new and different, you will not be a grandmaster right away. The key is to just practice. Take your time and enjoy the learning process. Soon you would be able to design an entire website in your sleep.

3. Inspire. Nobody will be a great designer right from the start. The best way to get inspiration is to read web design inspiration blogs (Smashing Magazine always has some great articles) or just 'view source' (in your browser's View menu) on other people's websites and see how they coded it. What is different about HTML and CSS than most other programming languages is that the code is 'compiled' the the end-user's browser and therefore the end-user has complete access to the code.

Good luck and have fun!
posted by 1awesomeguy at 11:47 AM on February 10, 2010


"Because its never simple." - programming is the same thing, when the client says "it should be simple", RUN!

"that you think that because you know programming, web page front end work is easy" - well, I don't think it is easy... but it should be :)

"pulling your hair out" - there isn't much left.

[insert clever name here] and 1awesomeguy - Thanks for the web site and book suggestions... that helps too.

I'm not sure I need to become a designer... I am quite pleased with taking a template and nudging it into submission.
posted by Drasher at 11:54 AM on February 10, 2010


Something you might enjoy as a learning and development tool is the Firefox Web Developer Toolbar. Especially for tinkering with CSS - instead of having to save, refresh, etc., it lets you 'edit css' live while looking at the page. Awesome for trying to figure out what code does what. You can even tinker with pages you don't even own.

Do I need to use PHP to build up the common areas? (page headers, sidebars, footers) Do I put everything in PHP so the site is all one file and the text that is displayed selected by the menu number... it becomes programming??!?

Every web developer deals with this differently. I've made many a site where the header is in one file, the footer in another, and everything in between in a third, with the content coming from separate text files.

You also might enjoy playing with content management systems like Drupal, which is free. Once you've coded your HTML, you can turn it into a theme, and your client can easily modify the content, add new pages, etc. using the CMS. Of course, this has a bit of a learning curve too, but sometimes it is a better way to go than developing your own system from scratch.
posted by beyond_pink at 12:16 PM on February 10, 2010


IANAWD - but, you might want to try some of the pre-existing frameworks built on a lot of other web developers' pain, like blueprint CSS and Jquery. Using these will avoid many cross-browser quirks.

For the project you mention, I think any kind of backend scripting or CMS would be overkill, and it won't achieve your goals, which is to gain mastery of design. I like the suggestion of finding sites you like that use a similar framework (e.g. blueprintsites) and then re-implementing them.
posted by benzenedream at 12:21 PM on February 10, 2010


I made websites with HTML/CSS for years, and will never, NEVER go back. It's SOOOOOO easy to just install Wordpress, find an open source/free template, and make minor customizations to suit your needs.

Like you, I'm not a professional designer, but care for a number of websites designed for friends and family.
posted by coolguymichael at 12:49 PM on February 10, 2010


coolguymichael - I thought I saw enough forums where people were swearing at the Wordpress templates and revisions that I would try and keep away from them. Are they that easy?
I know that there are other CMSs too. Some that don't even need a database. (Not that it is an issue, friend's site is hosted by Blue Host)
posted by Drasher at 1:01 PM on February 10, 2010


Drasher, I'm in a similar situation as you, or at least have been struggling with similar problems.

The mind-fuck really occurs because there's a lot of browser -> server interaction that takes place through Javascript requests. There's no real standardized way to do this and everyone kind of organizes it their own way. For me I really, really did not start understanding how things worked until I looked at the source code of a fairly advanced application, Etherpad. It makes use of Javascript templates to render the view (I think it was called EJS) which is now, I believe, part of the JavascriptMVC project. If you look at the mercurial source and then look at the source from your browser you'll see how much code is really just machine readable and completely abstracted for anything intelligible by the time it gets to you.

That said, some other things that really helped me:

Douglas Crockford's thee party lecture on the Theory of the DOM and of course his Javascript lectures. He also has a great book, "Javascript the Good Parts."

If you're getting into the theory of how you serve things up and how to organize content areas, I recommend looking into frameworks like Ruby on Rails, Django or one of the many MVC frameworks out there. Some of the behind the scenes don't worry about this really helped me starting out and then suddenly I hit a zen like moment and just got it. Feel free to email/memail me, I kind of picked this up on my own so I went through similar struggles that people working in teams probably don't experience (or at least as much).

Oh keep in mind that even with templates you end up duplicating a ton of code on the client side, mostly with validation. This feels wrong but there's no real way to avoid it (or at least anyway that I've found).
posted by geoff. at 2:25 PM on February 10, 2010 [1 favorite]


Oh and I use 960grid as a jumping off point. Khoi Vinh did a nice presentation on Grids are Good for SXSW that's a great presentation on the theory of site design.
posted by geoff. at 2:27 PM on February 10, 2010


Well my first comment is sort of garbled from the cutting and pasting I did, but the main ideas come through.
posted by geoff. at 2:29 PM on February 10, 2010


I'm in the same boat as you. Pretty good web developer (10 yrs) but a novice web designer. IMHO, Wordpress and alike may be easy for someone who "get" web designing. For you or me, we are better off learning by doing things from scratch with the attitude that we are learning a completely new skill set.
Best luck!
posted by tvjoshi at 2:38 PM on February 10, 2010


Chomsky is seminal in both linguistics and computer science

Dewdney's _Turing Omnibus_
posted by at at 5:10 PM on February 10, 2010


I have a coding background followed by many years of web development, and hardly a creative bone in my body. YMMV, but what's essential for me is separating a web job into distinct phases:

1. design - This is the hard bit for me, and I prefer contracting it out to an actual artist. If I can't, I start by getting the client to convey clearly what they want. Have them show you sites they like, and sketch out their mental image (they'll have one). Work with any existing logos or colour schemes. Find sites you like and steal ideas. Stick with basic, simple layouts. You are not doing any markup or coding at this point, just drawing -- on paper, in photoshop, whatever. Settle on a design and commit to it before moving on. (If you code cleanly, you'll be able to make adjustments easily at the end. Good enough is perfect.)

2. html - I do this after the design phase is done, but I could almost do it before, as I'm not really concerned about the appearance, only the structure. Imagine putting a piece of tracing paper over the design and just tracing out the main components in big blocks with a crayon -- header, footer, secondary nav, toolbar, content... Now just build each block in the order it appears, keeping in mind only the function of the bits inside. e.g.: First is a header (div) inside of which is a logo (img) and tagline (p), followed by a list of nav items (ul). Assign class names to things that describe what they are, not how they look.

3. css - Now you'll make your functional document look like your picture. Take it one section at a time, and figure out what colours, margins, backgrounds you need to apply to each bit to make it work. You'll do a lot of back and forth between editor and browser, especially when you're first learning, but that's ok. Tweak, tweak, tweak, tweak.

4. separate - When your template page is done, break it apart so you don't have redundancy on each page. There are lots of ways to do it, but for a tiny site like you mentioned, it's easy to just make a head.php and foot.php and include them in each page with the content in between.

5. code - Build in whatever data-managing, action-handling code you need. Javascript, php, db stuff, etc.

6. content - Making each page should be a breeze now that you have a template. Pull in the components and paste in your blocks of content.

My tools of choice are a syntax-highlighting text editor and firefox with firebug. I test in other browsers once I'm done, and adjust as necessary. I find any editors that "do it for me" just get in the way, cause frustration and hinder learning. You'll suffer a bit at first, but you'll come to understand what you're building and how it's put together. Don't let the phases bleed into each other, and steal code or ask for help when you get stuck on something.
posted by bethnull at 9:16 PM on February 10, 2010 [1 favorite]


My comments above were meant for that other thread on programming.

That I meant to say was:

You might find it more programmerly to think of a web page as a cartesian coordinate plane, and place text, graphics, and other elements on that plane (none of that div, span crap). There are various frameworks that let you do that. SVG is a possibility, but IE's only recently announced support for SVG. Silverlight (Moonlight) is along those lines, as is the processing and processing.js libraries. Does anyone do applets these days?

You might also find it entertaining to attempt new programming paradigms, such as Wadler's Links, or the Scala framework Lift. These are undoubtedly harder to get started with, but you may be more motivated to persevere if you know the time invested learning will scale when you want to develop more complex web apps. Google's Web Toolkit looks like it's got legs (You write in Java which is cross-compiled to javascript).
posted by at at 11:32 PM on February 10, 2010


I am in a similar boat - programming seems natural, design is not. I did my last project with a HTML template that I bought from themeforest.net, and the experience was good enough to convince me that I'm never going to write HTML from scratch again.

The templates there (and presumably other such sites; themeforest is just my favourite) are good and criminally cheap, even for hobby sites. I've realized that as a programmer, premade templates are ideal for me (and possibly for you) because:

- though I can't come up with good designs, I can certainly recognize them when I see them (due to spending a lot of time online)
- I know enough html/css to be able to integrate the template into my project (though certainly not enough to have made it from scratch)
- it doesn't matter that the design will not be unique to my site, because the type of sites I build are never going to get enough traffic to make it likely that a visitor will see mine and a similar one in the same year

In short, I find it much more fun picking out designs, and browsing through them for inspiration, than trying to build them. You might find the same to be true.
posted by primer_dimer at 1:58 AM on February 11, 2010


After reading the first few responses, I figured that there was not a "best" answer... there were a bunch of very good answers.

I am marking bethnull's as the best so far because it is a very nice description of the process of going about creating a solution.

I really appreciate the replies... if you have something to add, I would like to hear it!

Please post here (I will continue to monitor), or email (memail) me directly.
posted by Drasher at 7:18 AM on February 11, 2010


2. html - I do this after the design phase is done, but I could almost do it before, as I'm not really concerned about the appearance, only the structure. Imagine putting a piece of tracing paper over the design and just tracing out the main components in big blocks with a crayon -- header, footer, secondary nav, toolbar, content... Now just build each block in the order it appears, keeping in mind only the function of the bits inside. e.g.: First is a header (div) inside of which is a logo (img) and tagline (p), followed by a list of nav items (ul). Assign class names to things that describe what they are, not how they look.

This is good advice, but I must add, make sure you're using the right code for the markup. So many people (ab)use div's for everything. You need to look at the actual content and make sure that the code reflects what the content is. A div is a page division, and that's all it should be used for, not a generic holder. In fact, when I code, I generally add div tags last; I build out the content markup first. Then I decide where, if any, the divisions are.

This is particularly important because HTML 5 moves further in that direction with tags like "header" and "article" and "aside". It's a ways off, for sure, but learning good, semantic HTML now will mean you won't have to relearn this basic concept.
posted by [insert clever name here] at 7:41 AM on February 11, 2010


bethnull's comment is really close to my development process. However, my process is just a little bit different (but in what I think is a critically important way).

When working on a site, I always, always start with the content. I sit down with the client and ask "What do you want your website to say and do?" In some cases, I'm asking about the types of content. For example, if we're building an e-commerce site, we hash out all the different types of information that needs to be displayed on a product page/listing. If we're talking about an about page, I ask the client to start working on writing copy, this way when we're in the design process, we're thinking about how to best showcase the content. In other words, we make designing not just an artistic process, it's a problem solving process.

I start the design process with building flow charts and site maps, At this time I hash out how the different users will interact with the site. For example, we ask questions like "What is the best way to showcase all the different types of content?" or "Will a sign up form be a single-step or multi-step process?" From there, I move to pen-and-paper prototyping and layouts, then straight to html/css/javascript prototyping. For some projects, I just use blueprintcss and jquery to do it quickly (this code need not validate!), for others I actually start coding the template I'm actually going to use (depending on the complexity of the site). The questions I am asking myself and my clients is always "Does this showcase your work in the best way?" I never ask "Is this pretty enough" because that is never the question at this point. These are predominantly design thinking questions, not artistic questions. (Although they bear on artistic decisions, such as "do we want to use a grid system.")

Only after we've hashed out the layout, and interactions do I move to the graphic design and coding. This way, when I'm doing graphic design, I'm not stuck with asking all the design questions at once, I've already got a layout (which just involves punching out clean html/css), I've already got the interactions decided on (which just involves punching out good javascript). By this time, you've already dealt with the really big questions in the graphic design of the site. While you still have to answer questions on branding and graphics (which are important, to be sure), it's easier to work on those parts when you don't also have to figure out layouts and interactions at the same time.

I find this method does a few very useful things:
  1. It keeps the client intimately involved in the design process (which they love). Ultimately, when you do this, the likelihood of buyers' remorse drops to almost nil, because they have to sign off on everything, (which is just as likely when you're working for friends).
  2. It keeps the content front and center, which is better for everyone.
  3. It breaks the designing up into smaller, easier to deal with processes. Processes that, as a programmer, you're probably more accustomed to working with.

posted by thebestsophist at 8:53 AM on February 11, 2010


Good point, thebestsophist. I left out step.. uh.. 0, planning site architecture. This is essential for a site of any significant size or complexity, and I like your process. For a five-page small-business marketing site for a friend, well, it tends more to a chat over a beer about what handful of specific pages they want, written down on a napkin. The OP seems to have that down.

[insert clever name here]'s answer brings up the fact that there's always more than one way to do it; you have to find a style that works for you. I find that I need to break things into coarse semantic chunks first, lest I get overwhelmed and distracted.

It also reminds me of some markup I recently saw in a commercial application that displayed tabular data via a table with a single td, inside of which were divs with more floated divs inside them, each containing a data item. *cries*
posted by bethnull at 11:23 AM on February 11, 2010


I had a comment typed up yesterday but forgot to post, but that's ok because bethnull pretty much said what I was going to say. The only thing I'll add is that the web design is very much a top down process, while programming (for me) is more seeing the functions that make the whole and then tackling those functions one by one. In other words, I've found that in web design I have to identify *and* flesh out the overall structure first (just like bethnull laid out), and then work my way down to the bottom sub-components. Programming, on the other hand, I identify the overall structure well enough to just determine the sub-components, build the sub-components, and then integrate the sub-components into the structure I want. So for me, web design is completely top down, while programming is understand the top, and then build bottom up. Building web sites was frustrating until I understood that difference (ok, they're still frustrating, just less so now).
posted by forforf at 11:39 AM on February 12, 2010


forforf - the differences you mention are quite true. The mental images are distinctly different. I cannot (at this time) visualize the "workings" behind a web page, but I can often see software processes in my mind's eye. I need to get better brain glasses.
posted by Drasher at 1:33 PM on February 12, 2010


« Older Looking for a very specific mu...   |  At what point is adding more i... Newer »
This thread is closed to new comments.