What do I need for starters? Book suggestions?

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View
I have slapped together a quick site for a church's Awana program.
http://www.showcase.netins.net/web/awanapmc It is very basic, but does the
trick for now.  Contains over 100 photos (updated weekly), and about a dozen
links.  I've been asked to do a couple other sites now and am wondering what
anyone would recommend as the basic tools needed to add to what I already
know, which is obviously not much since I don't understand a lot of what I'm
reading on here.

*At this point I have the following programs installed:

    Notetab Pro (so far I'm writing all the code myself from the ground up,
no WYSIWYG's here)
    Dreamweaver (would take a lot to learn - - but I have gone through some
of the tutorial that comes with it)
    FrontPage ("    "     "     "     "     ")

    Adobe Photo (looks powerful enough, but I still don't have a clue on how
to make that cute little dove             graphic look like an embossed

    Cute FTP (seems pretty easy to use for transfer, and for editing)  I
started out with a trial version of Ipswitch     FTP and I like Cute better.

    IExplorer 6
    Netscape 7.2
    (and a friend with a Mac that definitely doesn't display the graphics
like my browser/pc)

I've been working my way thru W3C's online tutorials and am now on HTML
Advanced, which doesn't feel very advanced but is certainly a start.  I
began with Webmonkey HTML.

*What I'd like to have is an easy-to-read, yet informative, book to hold in
my hands, to carry with me everywhere, so I won't always be sitting at the
computer, making my wrist (and backside) tingle more than it does already!
My ISP suggested:

    Sams Teach Yourself HTML & XHTML in 24 Hours, Sixth Edition
    by Dick Oliver, Michael Morrison (Paperback -- May 19, 2003)
    Avg. Customer Review:

(Amazon.com product link shortened)

    *HTML & XHTML: The Definitive Guide, 5th Edition
    By Chuck Musciano, Bill Kennedy
    5th Edition August 2002
    ISBN: 0-596-00382-X
    670 pages, $39.95 US, $61.95 CA, 28.50 UK
    http://www.oreilly.com/catalog/html5 /

Anyone know of these, or have better suggestions?

Thanks in advance!

PC kolzdari@netins.net

Re: What do I need for starters? Book suggestions?

PC wrote:
Quoted text here. Click to load it
(Amazon.com product link shortened)
Quoted text here. Click to load it

Uninstall FrontPage.

Buy yourself the O'Reilly CSS and HTML bibles.

Use DreamWeaver for all your markup; only ever use it in code-view. dont
use the WYSIWYG panel in it. DW supports all the major languages and has
excellant site management tools.

I should work for Macromedia :D


x theSpaceGirl (miranda)

# lead designer @ http://www.dhnewmedia.com #
# remove NO SPAM to email, or use form on website #

Re: What do I need for starters? Book suggestions?

Quoted text here. Click to load it

Thanks Brucie and SpaceGirl.

Yeah, that was a pretty good pitch for DW...they owe you big time for that.
What will DW do for me if I'm typing code manually in the HTML editor?
"HTML cleanup" menu item?

I left out a paragraph from my ISP guy about books:  "...O'Reilly has an
excellent reputation in the Industry, their books are more expensive and bit
more technical.  In general you cannot go wrong with a book from O'Reilly.
I should mention there is no relation between O'Reilly Books and the
political guy... ;-) ..."

Would a beginner understand it?  I have HTML for Dummies, 3-4 years old.  It
has the basic markup codes that still work, but nothing new of course.
Also..... *PC ducks with head securely wrapped in arms to avoid "garlic
pelting" again (it didn't really hurt...i just wasn't expecting it)*
.....Javascript for Dummies (did i hear someone gasp?), but I didn't
understand that at all.  (my daughter bought it)  I only used it to find the
code for a particular item a couple months ago, but I've filled my pea brain
with so much more since then, I can't remember what it was.

Brucie, I don't know HOW to optimize my images yet.  Is Adobe Photo what you
would call a "graphics editor"?  That is also complicated, but comes with a
tutorial that I plan to get to one of these days or nights.

I'm actually pretty proud of what I have so far.  I had no knowledge of HTML
a few months ago.  Now I have a bunch of pages full of a bunch of
meaningless stuff that hardly anyone ever looks at, but it's my baby.  I'm
so hooked now that I can't stop.  My wrist hurts, my eyes burn, and I can't
have a decent conversation with anyone because they don't speak my language
anymore.  You CAN teach an "old dog" a new trick.  *PC stretches real hard
to pat own back*


Re: What do I need for starters? Book suggestions?

PC wrote:
Quoted text here. Click to load it

It does code completion example: type in <div> and it instantly adds the
</div> after it, then moves the cursor to the content of the div. It
does that for all tags.

It also does full code suggestion, in little popups, so as you're typing
it tells you what the likely next-syntax option is, which you can just
click rather than having to type it it.

It real-time validates your mark-up (CSS and X/HTML), indicating mark-up
errors with red underlines. It's also browser aware, so it tells you
when you add something to your HTML that only works in IE, for example.

It lets you do code snippits - simply highlight a block of HTML you find
yourself typing over and over and add it to the Code dialogue. The next
time your want to write that block of code, just hit whatever key
combination you assigned to it.

It also provides short-cut icons for instantly generating hundreds of
different things (from tables to dragable divs), and there are 1000s of
other free extensions you can download which automate elements of hand

You can drag and drop objects (flash, images, code snippits, form
elements, whateer you want) to wherever your cursor is in your code and
DW will insert the proper code and a link to that object (example; drag
a flash movie into code view and it automatically adds all of the flash
object code; drag an image and it automatically adds the <img> tag with
a link to your image.

etc :)

Quoted text here. Click to load it

They are pretty easy going, and informal (mostly). Best to use them as a
companion to the excellant (and free) http://www.w3schools.com web site
(which has cut-n-paste examples).

Quoted text here. Click to load it

JS takes a lot more learning. It is a programming language. HTML is
*not* a programming language, it's just an abstract mark-up language. If
you have no experience of programming, again I suggest you start at

Quoted text here. Click to load it

Don't worry about that yet. Whatever program you are using, you have to
remember to balance size and quality with download size.

Quoted text here. Click to load it

That's a great start, and don't be disheartened by how much there is to
learn. It comes together really quickly once you get into it. And if you
get stuck, you can always ask here.


x theSpaceGirl (miranda)

# lead designer @ http://www.dhnewmedia.com #
# remove NO SPAM to email, or use form on website #

Re: What do I need for starters? Book suggestions?

dropped a +5 bundle of words...

Quoted text here. Click to load it

  <body bgcolor="#FFDAB9" text="#A52A2A">
  <h1 align="center"><acronym title="Self
Contained...">SCUBA</acronym></h1> (Links are underlined, so your text
is confusing, I know becuse I tried clicking on it.)
  <p align="center"><span style="{font-
  <br />
  <h2 align="center">Animal Kingdom!</h2>
  <br />
  <hr align="center" width="70%" color="(Whatever rgb triplet or
hexidecimal value is for brown)" />

<!-- Comment your stuff, mang. -->
<!-- You don't need to write a book about it. It's for your benefit -->

Your text is a little small. Teeny tiny text is terrible to try
to tabulate. (Okay, that was a reach.)

Quoted text here. Click to load it

There's nothing wrong with that. Like you said, it does the trick, for

Quoted text here. Click to load it

Keep the links, lose most of the meaningless photos, make the meaningful
photos bigger and write a little about what the picture would relate to.


<p style="{text-align:justify; text-indent:.2em}"><img
src="redcandl1.jpg" style="{float:left; margin:.4em;}" alt="Greta Von
Hapsburg at bingo night" /> Bingo night was a huge success! Everyone had
a great time, Greta Von Happsburg (shown on the left) was the big winner
of the night! She won a $50 gift certificate to...</p>

<br clear="all"/>

<hr align="center" width="60%" color="#BBBBBB"/>

<br clear="left"/>

... will give you a lot more bang for your image buck, imo.

Here's an idea, resize some of the keeper images to be a little bigger
and link to various articles/pages. You can reuse the same image with a
larger size on the target page, if you so desired. Do be mindful that
not everyone has a zip-bang connection and more bigger pictures equals
more bigger download time for your page. More bigger audio/video files
equals more bigger download time for your page. Frames equals more
bigger download time for your page. (Since you're actually displaying
multiple webpages at one time, though pics/audio/video/flash/java is the
big culprit for slow download)

<p align="center"><img src="breakfast.jpg" alt="something"/><a
href="breakfast.html" style="{margin:.4em; vertical-align:top}">Read
about last weeks church breakfast!</a><br/><a href="breakfast.html"
style="{margin:.4em; vertical-align:top}">Read about the church
breakfast!</a><img src="breakfast.jpg" alt="something"/></p>

(img size I used to experiment with was 141 x 106, if anyone was

Wow, that's a nice thick block of code. Better clean it up a little.


<!-- affects all a tags enclosed in p tags -->
p a {margin:.4em; vertical-align:top; text-decoration:underline}

<!-- affects all a elements regardless of where they are -->
a: hover {background-color:yellow; font-style:italic}

Now you can take out all of that style="..." AND you get a little yellow
background that italicizes the letters when someone hovers on the link.

<p align="center">
  <img src="breakfast".jpg" alt="The Church Breakfast"/>
  <a href="breakfast.html">
    Read about last weeks church breakfast!
  <a href="thoughts.html">
    Pastor Dave's thoughts for the week...
  <img src="pastorDave.jpg" alt="Pastor David Whatshisname"/>

Can you spot the changes I made? If the block was written like this, you
could pretty easily.

Quoted text here. Click to load it

All you need is notepad. Seriously.

What book? Any book. Anything that has a current list of the elements
and attributes and tells you what they are and how to use them in plain
simple english.

<!-- You don't need a zillion comments, just a few to help out -->

Quoted text here. Click to load it

It doesn't feel advanced. So what? It's not like they've taken away the
basic elements, they've replaced some of them with a better way.
Everything that's advanced builds on something basic, so don't be so
quick to dismiss them. The web is littered with examples of people
making things really hard on themselves because they didn't know you
could just do something easier. I learned basic html from a text file a
friend sent me and made a zillion insane crappy pages with them. Now,
I'm learning how to make clean, neato pages through the local JuCo.
Without the basics, advanced gets a lot harder real quick, no matter
where you learn it from.

Quoted text here. Click to load it
(Amazon.com product link shortened)
Quoted text here. Click to load it

Whatever explains it in a way that you understand easily.

And something that explains storyboarding a site too. That's just as
important as what the elements do.

Quoted text here. Click to load it


Starshine Moonbeam
mhm31x9 Smeeter#29 WSD#30
sTaRShInE_mOOnBeAm aT HoTmAil dOt CoM

Site Timeline