How to build a website

[wiggins]

OK! I'm a complete newbie, but err...how do you make a cool websites with animated icons and all that other generally cool stuff?

[Mithrandir]

Is there anything in particular you want to put on it? That's a fairly broad scope question, there.

[inkhana]

If you've got Photoshop 7 or Imageready, you can make it a fairly quick, painless process using the "slice" feature on a correctly-sized background image (sort-of "advanced" technique if you were doing it by hand, but works well for me). If not, I recommend as an HTML editor 1st Page Express. I won't say anything more til I know what you want to do though...^^

[wiggins]

I want to make a webmanga page like Ink's (which is only in character design and sotryboarding stages... plus I still need to learn photoshop so this is kinda *understatement of the century* early...) with cool flash thingies like on Glitch's website.

[Mithrandir]

Hmm. That means you are going to need to:
1. Find a place to host it.
2. Buy and Learn Photoshop (or equiv).
3. Buy and learn Flash.
4. Learn HTML (or buy/learn a program to spit it out for you).
5. Design the site.
6. Construct the site.

Anyway, that's the order I'd suggest.

[Lochaber Axe]

Well the best way to do it is that you first create your graphics through photoshop and then create the site through frontpage. I've just finished a class on web design and I think I'll spend the $160 at Walmart instead of doing it all the html on notepad.

My two ruples.

EDIT: whoops, oh well, at least I gave an example of where to get the html editor Oldphil was mentioning.

[Mithrandir]

Ug. At least get a decent HTML editor. Frontpage spits out code that crashes browsers if you don't watch it carefully. I'd recommend (*shudders*) dreamweaver over FP.

[Lochaber Axe]

So the best way to make a webpage is through notepad and html by hand? Ow....

Well... at least notepad is free.

[wiggins]

Hmm. That means you are going to need to:
1. Find a place to host it.
2. Buy and Learn Photoshop (or equiv).
3. Buy and learn Flash.
4. Learn HTML (or buy/learn a program to spit it out for you).
5. Design the site.
6. Construct the site.

Anyway, that's the order I'd suggest.

Could you please explain "Find a place to host it?"

[glitch1501]

oldphil, do you not like dreamweaver?

[Straylight]

Best thing ever for editing anything... it does HTML too:

http://www.crimsoneditor.com/

If you're just using Notepad to write out your HTML, that's great! Do yourself a favour though and get a proper programmer's text editor like the one I've just mentioned. It will colour all your code for you and allows you to specify 2 spaces for each tab, among other cool things

Oh yeah, Photoshop is expensive, so if you're short of money get Elements instead (kinda like Photoshop Lite).

Moved to Computing

[Mithrandir]

You are talking to a man who does most of his HTML in vi (or pico if I can get it). All my code is just that. My code. I know every nook and crany, and can precisely where anything I need to find is. I'm part of a dying breed of "code heads" who don't use any development tools.

However: I realize that not everyone wants to learn the HTML, so I can at least understand using tools. If you have to use a tool, though, I try to recommend whatever one will create the 'least evil' filler information. DW give you less 'overhead' in your code than FP, and it doesn't ASSUME THAT EVERYONE WHO VISITS YOUR SITE HAS INTERNET EXPLODER!!!

Sorry, I tend to ramble about stuff like that.

[wiggins]

What's vi and pico?

[Straylight]

What's vi and pico?

Old skool text based editors that run from the command line. If you ever do Linux at university, they'll teach you how to use it. Apparently you can edit stuff really fast once you get used to the controls.

I tend to prefer window based text-editors like Crimson anyway

[Mithrandir]

pico and vi are text editors in un*x. Editing a webpage in vi looks like this:

See attachement, and please ignore the file size.

[wiggins]

ummm... what's the difference between old skool text and window based-text editors? And, sorry to post the same thing twice, but can someone explain finding someone to host my website to me? What is this host thing?

[glitch1501]

for me i use dreamweaver, i really like the design view, so i can see my code that im typing, you could use dreamweaver or 1st page(not to be confused with frontpage) to do the same things.
for begining...and if you dont really know or want to know how to code, you should probably try a WYSIWYG(wizziewig) which is "what you see is what you get"

you can do almost anything you want to without knowing the code(might not even know the code is there..lol)

noz, i used crimson editor for a few things a few months ago...ill give it another try

[wiggins]

k... so if your so low on cash and don't want to pay, would just using notepad be the best way?

[glitch1501]

notepad would probably be the easiest,
or you could try this out
http://www.evrsoft.com

there should be a free version there

[shooraijin]

> for me i use dreamweaver, i really like the design view, so i can see my code that im typing,



Design based web site editors are really putting the cart before the horse.

HTML was originally created explicitly to get design and content separate, i.e., you could make a document up and put HTML in it, and the browser was supposed to take care of the hard work of making your document look acceptable to the end user in whatever ways were available to it. In fact, any SGML-type tag language is designed like that.

The problem with design-oriented editors, like FrontPage, Dreamweaver, whatever, is that the *design* comes first over the document. The whole idea of browsers was to give people choices about how their documents were displayed to them -- text-only (Lynx), voice (browsers for the blind), low-bandwidth, high-power, etc. Design-oriented editors are forcing HTML to do explicit design and element positioning on a document, and *it wasn't designed for it*.

I strongly agree with oldphil -- learn HTML and code your pages by hand. More to the point, come to designing web pages with a design that can be accomplished in a flexible manner. Rather than forcing elements on a page to be aligned to pixel-perfect positions (which never works), or standardizing on a standard screen size (which never happens), learn to code your documents flexibly so that even if some tags aren't supported, or some design elements don't end up right at that perfect position, your page is suddenly viewable, useful *and attractive* to a larger audience. Dreamweaver tries a bit on this, but FP is aggressively IE only, and you'll pay for it later. Learn how it works and reap the benefits of cleaner, clearer, more efficient HTML.

Rant off.

[Fsiphskilm]

You really want t

[redkorn]

use microsoft front page to put together ya site it really easy too use, also look up swish flash program and
http://www.50free.com is the best ive ever found but i have a friend hosting me i got 150gig of space unlimited bandwidth and media is allowed and no ads, ftp supported.

[Straylight]

To me, webdesign is kind of like an art form. My ethos involve striving to make a system as functional / user friendly as possible, and at the same time trying to make it look as aesthetically pleasing as possible. As far as forums or other frequently used web applications go, I think graphics and layout have an important part to play in whether a user decides to revisit a website.

It is very possible to take graphics too far though. Having a 800x2000, high quality JPEG image in the background may look cool, but the poor guy with the 56K connection sure won't think so. If you are building webgraphics, file sizes are a very important thing to consider.

[LorentzForce]

for me, it's all programming. i'd rather a simply layout with lots of content with just enough graphics over a site that have lots of images all over it.

i wuv notepad. i too often use dreamweaver to modify some PHP coding, because it's coloured and it's already installed on my harddrive.

[inkhana]

I agree with Glitch, Evrsoft's 1st Page is a great tool. I've never tried Crimson though.

Whatever you do, I definitely recommend getting to know the code. You don't have to know everything (I certainly don't) but it helps to look at something and at least have a vague idea why it does what it does. However, I don't know the first thing about Flash...

If odds come to odds and you can't find a place to get free hosting you like without a big hassle (banners, etc), I may be able to help you out, just let me know.

[madphilb]

It is very possible to take graphics too far though. Having a 800x2000, high quality JPEG image in the background may look cool, but the poor guy with the 56K connection sure won't think so. If you are building webgraphics, file sizes are a very important thing to consider.

It doesn't even have to be that bad... many people have broadband, but there are still plenty of us with dialup (some of us with very slow dialup).

A friend of mine did a web site a while back (his own personal one). He used an image map for navigating his site, but it was one pretty big image (500x600 or something), it had a logo on the top half and the bottom half was the text. Because of the design you had to wait for just about the whole image to load to navigate his site. He didn't notice, but I did since I was dialup (and I think it was almost 56K at the time too).

There are usually multiple solutions too, decide 1) Do I need that much graphics?, 2) can I split it up?, 3) can I reuse some pieces?

He could have used a table and a hand full of image files (as well as normal links).

Oh, and don't forget the ALT tags on the Images... esp. if the image is a text link... blind people won't be able to navigate your site if the images all say "JPEG 200x80 24k" for the text (or worse, nothing).


More on the lines of creating web pages, I've always used Notepad (or Qedit years ago) to write my web pages... in more recent years I've started using Orb to help automate some stuff (it's a pre-processor, much like programming languages use), however the free software seems to have come to a standstill and it could use a few more features (which if I knew a bunch more about C/C++ I could add/fix, but.... sigh... no such deal). I did try a more powerful utility like that at one point, but it didn't feel right, seemed much more complicated to do some things.

Frontpage should be shot.... the pages are much bigger than they need to be, and since it's a MS product, they follow MS's standards rather than the W3C's.

[Fsiphskilm]

[quote="djnoz"]To me,

[LorentzForce]

http://www.merekatcreations.com/

i love her site. now how fast did that load for you 56kers?

[shooraijin]

Dusted off the old modem and tried it. About 30 seconds, at least on this phone line.

It wouldn't kill people to design a text-only layout which could be accessed by a teensy-tiny link.

[LorentzForce]

took me 25. so close enough i guess. thankfully it's all cached eventually, so it's all good.