Design for the Internet

Gallery Syllabus Projects Calendar Resources

New Links

http://www.digital-web.com Principles of design

eppspro.com organize a web site / layout
tools-and-wizards list wizard!
css.maxdesign.com.au/floatutorial/ css floating
theinspirationgallery.com/ backgrounds
dafont.com/ fonts
css.maxdesign.com.au floating thumbnails with captions

rounded corners

more-rounded-corners/
even-more-rounded-corners/
projects/dialog2/

Case Sensitivity

There have been a number of problems archiving work due to files with uppercase names not being displayed.
ALL FILE NAMES MUST BE LOWERCASE
Below is a note from the sys admin:
"The issue with case sensitivity stems from the fact that your site is being hosted on a UNIX server. Because UNIX filenames are case sensitive, your site is. It would be my advice to encourage them to use all lowercase filenames. This is good practice anyway, as UNIX is the predominant webserver platform, and will make writing their code much easier."

Email Script

replace the email address with text of your choice - edited by Nicholas Ivins:The variable "name" defines what text will act as the hyperlink, in this case the word "e-mail."  Change it to whatever you want.

=====================
 
<script type="text/javascript">
<!-- Begin
 
user = "portraits";
site = "nicholasivins.com";
name = "e-mail";
 
document.write('<a href=\"mailto:' + user + '@' + site + '\">');
document.write(name + '</a>');
 
// End -->
</script>
 
=====================

FTP UPDATE

Regarding ftp: get fetch as a backup. It seems to be a reliable option even when nothing else works properly.
Macusers: Free at this link, or get it from me in class. fetchsoftworks.com.
You just have to apply as students.
PC users: Download filezilla .exe free ware about 4 meg or get it from me, in class.

 

Misc links

An example of an xml dropdown menu from an old site - links are dead ends
Rachel Greene's History of Internet Art
Free search engine atomz.com
Miscellaneous Links: see also Links
new! free css block menus...someone try 'em and share with the class
studiosmackdown.com a great animation of a flying saucer beaming up a cow
try putting a favicon on your sites
sample banners and ads
random image command
templatemonster.com/
Macromedia design contest winner Crutchfield
exporting flash movie with options, transparent bg

 

CSS/Javascript

http://www.cssbeauty.com/
layout gala - lots of layouts
mezzoblue.com support link for "the zen of css"
glish.com Layout techniques
http://www.bluerobot.com/web/layouts/ Layout techniques
www.stopdesign.com Using bg images to replace text
CSS in DW8 macromed tut
http://www.bbd.com/stylin/ support site for book
web design for handhelds - article
javascript link effects
bubble tooltips
Thumbs and CSS
100% height with header and footer
Forms layout
A List Apart

Where am i?

podcasts and RSS
podcasting http://www.ipodder.org
creating an RSS feed
mp3 and rss players
how to create a podcast
Audacity free crossplatform soundeditor
against RSS feeds
MIT weblogs
FREQUENTLY USED LOGOS links to check out for various reasons

webpagesthatsuck
fordvehicles.com/
project86.com/main.php
espn.go.com/
dickblick.com/
hotwheelscollectors.com

http://www.sitepoint.com a support site for the book with downloads
deafread.com
www.mono-1.com/
cameraontheroad views of a web page on different sizes and platforms
Popular chinese websites:
mag.xunlei.com/
xunlei.com/

access archived websites - the wayback machine www.archive.org/web/web.php
Favorite Website Awards
Coby preschools
coppermine-gallery manage your fotos
http://www.bravenet.com/ free web tools
http://www.elated.com/pagekits/ prefab pagekits, some CSS
http://www.bauda.com
http://javascript.internet.com/
preloader .fla to download

DW8.0.1 notes: be sure u update to 8.0.1 wierd things can happen - my copy hung until I cleaned up my template list.

random image load

head

<SCRIPT language="JavaScript">
<!--
/* You can get this script and many others
by visiting JavaScript City at: http://www.javascriptcity.com . */ pic_width=336; /*change to match the height of all your images */
pic_height=325; /* change to match the width of all your images */
border_size=0; /* change to the border size you want on the images */
alignment=1; /* 0=left,1=center */

/* define image urls */

if (document.images)
{
pic1= new Image(pic_width,pic_height);
pic1.src="1.jpg";
pic2= new Image(pic_width,pic_height);
pic2.src="2.jpg";
pic3= new Image(pic_width,pic_height);
pic3.src="3.jpg";
pic4= new Image(pic_width,pic_height);
pic4.src="4.jpg";
pic5= new Image(pic_width,pic_height);
pic5.src="5.jpg";
}

/* no need to edit past this point (unless you want to add more image slots) */
if (alignment==1)
{
cent_it="<CENTER>";
cent_it2="<\/CENTER>";
}
else
{
cent_it="";
cent_it2="";
}

function get_random(maxNum)
{
if (Math.random && Math.round)
{
var ranNum= Math.round(Math.random()*(maxNum-1));
ranNum+=1;
return ranNum;
}
else
{
today= new Date();
hours= today.getHours();
mins= today.getMinutes();
secn= today.getSeconds();
if (hours==19)
hours=18;
var ranNum= (((hours+1)*(mins+1)*secn)%maxNum)+1;
return ranNum;
}
}
function get_Image()
{
if (document.images)
{
var choose_one= get_random(5);
choose_one--;
var pics= new Array(5)
pics[0]=pic1.src;
pics[1]=pic2.src;
pics[2]=pic3.src;
pics[3]=pic4.src;
pics[4]=pic5.src;
document.write(cent_it+"<IMG SRC='"+pics[choose_one]+"' width='"+pic_width+"' height='"+pic_height+"' border='"+border_size+"'>"+cent_it2);
}
}
//-->
</SCRIPT>body
<SCRIPT language="JavaScript">
<!--
get_Image()
//-->
</SCRIPT>or id "div" Goes Here

The popular swap image command below. Be careful about file size, loading times, naming your images, typing in javascript:; in the link box, and having the swapped images all be the same size. Don't forget to send the swapped images over to the server. roll over the color rectangles to view