This page features links to a variety of sites and resources
that will make creating simple HTML webpages easy.
The
basic anatomy of a webpage is pretty straightforward. You can write
HTML code in either notepad (Windows) or TextEdit or SimpleText (Mac)
and preview it with any web browser locally (choose file, open). You
can even copy this code (or any simple html you find on the net -- view
source and copy the HTML), modify it to your needs (edit in text editor
or authoring program) and upload (using an ftp program.
<html> <!--Opens the document, tells the browser this is a webpage-->
<!--
This is a comment, it will tell you things about the code you are
looking at, but will not print or affect the page. Notice that HTML
uses "container tags," tags that open and close and change/style the
content within the tag -->
<head>
<title>Page Title: shows up in the title bar</title>
<!--
This is also where links to stylesheets, or CSS tags can go. You can
also place Javascript here, to create graphic rollovers, for example
-->
</head>
<body>
<!-- You can apply background and text colors to the body tag. If you have javascript in your header, load it here -->
<p>
<!-- Add align="left", align="center" or align="right" inside the <p> container tag to control alignment-->
Your Text Goes Here.
This is what shows up in the browser window
</p>
</body> </html> <!--Closes the document-->
Links to Resources
Web Colors (for text, tables or backgrounds)
140 web color names, displayed alphabetically with their respective RGB values.
From O'Rielly. Colors can be chosen by name or hex number.
A chart and explanation of Web Safe color from Wikipedia
Strange Banana
(generates a random webpage design that you can copy and customize,
just keep refreshing until you find one you like) Using Strange Banana
CSS Listomatic
(creates webpage structures with css) CSS is the most up-to-date and accessible way to layout and design pages.
W3C Core Styles
(you can link to these -- or copy the code -- to control the look of
your pages)
CSS Zen Garden
This site features webpage design created with CSS. Select from the
featured designs to see the power of CSS design. The HTML code in these
all of the examples is exactly the same, the CSS style sheet (and images it references) is the only thing altered.
Google Image Search
Please note that while the Google Image Search is a great way to find
images, most of those images are probably owned by somebody. Be careful
and considerate of copyright when using images found through this
search.
HTML Dog
Tutorials and guides for creating HTML and CSS
WebMonkey
Extensive tutorials for HTML, a javascript library and more. WebMonkey for Kids is a good "getting started" site for middle/high school students.
W3Schools
Interactive Web-building tutorials from basic HTML and XHTML to CSS and
advanced XML, XSL, Multimedia and WAP
Visibone Printed references. You can print out PDFs of some of these charts
Spider School
Technology Planning for the arts community
Not an HTML tutorial, but good information about planning technology
initiatives for the arts.
A Free and Comprehensive Web Authoring Tool
The Mozilla Browser features
"Composer" a built-in HTML webpage editor. This is a great alternative
browser that can be installed on any computer (Mac, Windows, Linux)
Note:
Switching from Internet Explorer to Mozilla (or Firefox, Netscape or
Opera) will help keep your PC virus free. Spyware and Adware utilizes
flaws in IE to place unwanted pop-ups, redirects or worse on your
computer. You do not HAVE to use Internet Explorer to surf the web. Mac
0S X users should consider using Safari. Netscape or Firefox, all great
browsers. IE is not being supported for the Mac anymore.
Nvu An
enhanced standalone web editor. Based on the same code as Composer, Nvu
is an open-source project (developed by a team of volunteers and will
always be free). Easy to learn. Available for all platforms.
Getting online
You
will need server space somewhere to host your pages so they can be seen
on the World Wide Web. Most internet server providers (AOL, RCN,
Comcast) offer webspace to their customers. Many also include templates
you can use to make your pages. You may also be able to get space
through your school. If you need CGI (server side scripts) or want to
maintain a domain and don't want advertising on your page you will
probably need to spend a little money. You can usually get a full
service server account for around $10 per month. You generally FTP your
pages to your host's web-readable area (or your domain name, if you
have one).
Babel.Massart.edu
Massart provides server space for full-time students, or students
taking web technology courses at the school through any of its
departments. These pages do not support CGI scripting but you can add
javascript to your pages, or host Flash pages if you want to add
interactivity.
Dreamhost My
server provider (also hosts AEContent). I like them a lot. Lots of free
goodies to make your sites work great. Plans from $7.95 per month
DotEasy I have heard good things about this web provider. Free (with domain registration) or cheap webspace.
NewbieSite Similar deal as Doteasy, pay for the domain, get the hosting for free.
Weblogs
Weblogs,
or Blogs, are great for those who want to keep an online diary or
frequently update their information without having to learn a lot about
HTML or webservers. They can also be used to create class sites. Here
is an example of one: Somerville 21st Century Web Club. Weblogging software features browser-based submissions of your text and images via templates.
Blogger
Free weblog hosting. Premium services also available.
Typepad
Not free, starting at $4.95 per month (30 day free trial). From the
people who created Movabletype. Weblogs or Photoblogs.
LiveJournal Basic site is free or upgrade for a fee.
Weblogs.us Free Wordpress weblogs for non-commercial webloggers.
AEContent can also host webpages or weblogs for members who are Massachusetts-based art educators. Contact the
.
(document prepared by Eleanor Ramsay, updated 10/03/05)
Tutorials