Led by Guest Speaker, Ivy Hover, Poizon Ideas

Conducted by Robin Nobles

Academy of Web Specialists

RobinN:Rhoda, do you have any particular items you'd like to learn about from Ivy?

schueller:I have a question that I have been saving up. Karin and I have their Country-art.com site which has now grown in a way that

schueller:I need to redo the home page. Currently it ranks very well but it has a lot of text on it. I would like to condense it

schueller:by using more graphics but am afraid it could change our rankings with a drastic drop in text.

IvyHover:OK, I'm looking at it now...

IvyHover:I think if you made the navigation graphics it should still do fine.

schueller:My motto has always been "less is more" for search engines. So I have not gone for the fancy graphics.

IvyHover:If you use your alt tags and name the images the same words that where on the page before

IvyHover:you should come out even.

IvyHover:Just make sure the page loads in about 30 seconds, that's a biggie.

schueller:Also, what about the graphic in the upper left corner. We had it as a slide show. Recently took the java off to see if it would make a difference.

IvyHover:seems like you could make it an animation.

IvyHover:Ok, I don't feel you have to sacrifice graphics, just use them wisely.

schueller:It will be more complex as Allen has rented the Wild Wings site which will provide all the prints for all their artists. So this is why I am planning some changes.

IvyHover:The biggest mistake I see is people using the wrong format

IvyHover:Do you know when to use JPS vs GIF?

schueller:We will be adding many more artists.

IvyHover:It is best to use GIFs for images with areas of solid color and a limited color range, like a logo. JPG was designed for continuous tone photographs.

IvyHover:If you use the wrong one, the download time can increase significantly.

schueller:Do you recommend a specific software to use. I have had great luck with the Ulead Smart Saver.

IvyHover:I use Adobe products, expensive but they do some much. The new versions actually show you different compression options so you can see the difference in quality and download time.

schueller:Smart Save does this also.

IvyHover:What does everyone want, do you want a little backgorund first?

schueller:It also interfaces with Photoshop

IvyHover:My take on what makes a site appealing, yet search engine friendly.

IvyHover:Loading speed - Optimize graphics and don't go too nuts with them (at least on the main page). Know when to use GIF and when to use JPG. We just briefly covered this.

IvyHover:Use your graphics to help placement - Name the image files using keywords, not "logo1". and Image Alt tags let you use more keywords. Use a background image on your pages, it's another keyword opportunity. schueller:.

IvyHover:Use Tables - They let you control placement and sophisticated layouts generally do better in the engines. But Try to avoid Frames (at least on the main page) - Most engines won't index them. If you do use frames make sure the index page does contain some content most don't.

IvyHover:and Make it easy for the bots - always include text links at the bottom of the page.

IvyHover:That's my basic rules.

valentijnb:how to design a site that appears to be in frames? but actually isnt?

IvyHover:Do you mean that hidden frame thing? Haven't had a need for it yet

valentijnb:no, I dont know exactly. I just started to make a page today not using frames, but I am not getting what I want.

Ang:could do layers

valentijnb:http://www.firstfind.nl

valentijnb:not optimized for SE

IvyHover:If you use tables you can set up columns and rows for better design placement

IvyHover:Val, I'm putting up your site now.

RobinN:Val, in the advanced lessons, I do mention this -- on the "Additional Strategies" page (advantages for using frames --which are FEW)

IvyHover:What do you want that your not getting?

valentijnb:Ah well, download-time. hmmm a small site today nothing much, but all in jpg

valentijnb:What I am not getting is that every page the black thing on the left is located at the SAME PLACE

Ang:tables are great for that

valentijnb:services is different, using same table

IvyHover:Gee, it seems to be the same when I check it

schueller:Val, could you say left align to put it to the edge. Also this is perfect for a table.

Max:this kinda leads to my question. If a page is created mostly using images set up in tables, shouldn't the page take a long time to load, or do you bypass that by incorporating much of the design (not affected by links, etc) into the background image?

valentijnb:contact I mean

IvyHover:Oh I see a tiny shift now. What did you write the HTML in?

valentijnb:frontpage / note pad / pagemill, just tried it all

Ang:have you set the it to align where you want it to

valentijnb:the it ?

IvyHover:Max, no it shouldn't take much longer, and definitely keep the background image uncomplicated.

valentijnb:yes I think so

IvyHover:Otherwise you can end up with some weird stuff, I'm supposed to fix this page (Ed. not a current URL.)

IvyHover:because the entire image (minus Nav) is the background, takes forever to load and it's a new background on every page.

valentijnb:So I have to do it all over again, because I was using all jpg. dammed.. :(

IvyHover:With images in tables the real backgorund tiles and the only thing that should change is the upper right page header.

Max:uncomplicated? Can you specify what you mean by that? You mean as far as how dynamic the design is (colors, shape)? Does a more intricate background mess things up on occasion, perhaps with different browsers?

IvyHover:Val, I can tell you I always had these types of problems with Pagemill, don't have them with GoLive.

Ang:I use dreamweaver and have not had any problems

valentijnb:Golive is a design tool?

schueller:Ivy, you mentioned GoLive. How do you like it?

IvyHover:I love GoLive!

IvyHover:Much better than PageMill, except it does crash a bit.

RobinN:I've heard GoLive is absolutely excellent

Max:I've read that some of these page design programs (or whatever you want to call them), such as Front Page or Page Mill cause occasional problems with engines, so to some of the meta content that they either include or omit. Can someone provide and details on this?

Max:such, not so... : P

IvyHover:FrontPage seems to cause problems, I've had to redesign a lot of FrontPage sites.

RobinN:YES -- FrontPage is a NIGHTMARE when it comes to the engines

valentijnb:Yes frontpage changes your metas negative. You always have to change them

valentijnb:puts title tag to bottom

NataliaKim2:I swear to Dreamweaver!!! I love it!!!

RobinN:it puts meta tags in front of the title tags; puts in a BUNCH of irrelevant meta tags; plus it seems to "fight" with most of the other HTML editors

IvyHover:I've never had a chance to use DreamWeaver

RobinN:I've heard that's very good too (I use HotMetal Pro)

schueller:I have looked at Dreamweaver but could not find a screen of html to look at.

valentijnb:Dreamweaver--> to complicated foor a quicke design I think.

valentijnb:No time, need simplicity!]

Ang:actually it is very user friendly

Ang:to view the html click on the bottom right hand button

NataliaKim2:What I like most is to add a title or something to hundreds of pages in seconds... And it doesn't alter ANYTHING in your head. (Well, in the head of the pages, that is... Mine is already altered :-)

Ang:I agree the search and replace in there is a great tool just have to be careful

NataliaKim2:I think what's really difficult in this business is to make designers believe they NEED text!!!

IvyHover:I don't have that problem with text, they need to think of it as indexable ad copy

Max:My only other question at the moment-- and maybe you have a suggestion Robin-- is, how the heck do I get the guy writing the code for my dummy page design to get his butt in gear and do it, so that I can finally submit it and start on my homework assignments? Anyone? : )

RobinN:for the certification project?

RobinN:just start on your assignments and not worry about the cert project right now

Max:that, and just submitting for each lesson

RobinN:he's going to do the HTML work for you?

Ang:is that not supposed to be us doing it

Max:yup. It's funny that he was telling me to hurry up with my design, and now look...

RobinN:Max -- write to me -- we'll talk about it. I've had other students who have had these problems

RobinN:Does anyone have any questions for Ivy?

Max:not the meta tags though... I mean encoding the page. i'll be in charge of the content

RobinN:I do :)

Max:don't think I'm cheating here...

RobinN:I'd like to know the exact tag for utilizing a keyword in the ALT tag for a background image -- I guess you just add an ALT tag??

RobinN: NO problem

Ang:So Ivy to make our pages more desirable for the search engines is there any little tips that you can share besides the images

IvyHover:and make sure you name the image a keyword.

Ang:not doorway pages but the actual site pages

RobinN:so just stick in an ALT tag with the background image? Nothing more than that?

valentijnb:Nat --> you talked about 100 pages change in a second? ... Please explain what you mean by that

NataliaKim2:That's the problem when you work with clients, their designers believe you are the devil and enemy in one, no way they'll name an image other things than img45.gif :-(((

IvyHover:Just keep your keywords in mind and use them with the images. Something like webdesign.gif is seen by the engines

valentijnb:searching for a pic in AV is getting you the most horrible crap this way :)))

NataliaKim2:with Dreamweaver you can Find and Replace as big pieces of text as you like (and I mean big!!) and it searches the whole folder and subfolder and changes everything you tell it to...

RobinN:<body background=/spacer.gif ALT="Put Keyword Phrase Here" text="#222222" bgcolor="white" link="#0033ff" vlink="#555555" alink="red">

IvyHover:Robin, I think so I'm checking...

valentijnb:OK. ideal for creating doorways, true?

RobinN:is that right??

Ang:the only thing is you end up with the same title for each doorway page

RobinN:(I'm very VISUAL -- have to see it in front of me to learn!)

IvyHover:Robin, sorry GoLive doesn't auto offer that option, I just always name the image my important keyword.

RobinN:You wouldn't want to use the same title on every page -- your tags must go along with the text for that page

IvyHover:Doen't mean it won't work though...

NataliaKim2:I make "save as" keyword.jpg over and over again until I have the same image called as every keyword I'm going for...

Max:if you're naming the image your important keyword, wouldn't you have to save a different version of the image for each optimized page...?

Ang:I agree with Nat it is an awesome program have been using it for 3 years and it just gets better

RobinN:Max -- easy to do -- because each page should be optimized for a slightly different keyword phrase anyway

valentijnb:You can also search for keyword in note pad and replace you alt by paste

Ang:checking out flash and director as well just not sure how flash sites would do on the search engines

Max:well, does it make a big diff to rename the actual file as opposed to just changing the ALT tag?

RobinN:I consider it "evening the playing field" Max -- by naming your images after your keyword phrase AND using ALT tags, you're getting a double boost (with those engines that consider ALT tags for relevancy)

Max:will the spiders actually read the image filename?

Ang:I guess naming images and alt tags in with the keywords and similiar to would be beneficial

NataliaKim2:As I've got servers of my own, many times I use virtualmail so I can make as many e-mails as I like with keyword_phrase! It's great when you just don't know WHERE to put them...

RobinN:yes, in most cases

Max:okay, that's a new one

RobinN:Oh Natalia -- that's a great idea! I had never thought of that!

IvyHover:Maybe I was misunderstood, you also don't want all your images to have to load again everything, which will happen if you rename them all over the place

RobinN:OH Ivy -- you're so right. Very very good point.

RobinN:Ivy, you mentioned images -- which load faster, gifs or jpegs. I've always been very confused about the differences -- would like to learn more

schueller:Don't forget the handy cleardot.gif

Ang:what if you had images that were in every page in a library then the images do not take as long to load

schueller:It is great for keywords and can be worked into the design many ways.

IvyHover:Well once they're loaded they are cached so they are quick.

IvyHover:JPG vs GIF It is best to use GIFs for images with areas of solid color and a limited color range, like a logo. JPG was designed for continuous tone photographs.

Ang:Ivy which graphic program or programs do you use

IvyHover:Doen't mean there aren't exceptions, just a good rule. If you have a program that shows you the differences in optimazation you can learn what to use.

Max:I assume y'all recommend the option of using the 1 pixel gif for hallways.... providing a link from each one, plus ALT tag for each one...

NataliaKim2:Personally I like MicroGraph and CompuPic

RobinN:does one load faster than the others, as a general rule? Or is that a very dumb question, because it depends on size (which I'm sure it does!)

IvyHover:I Primarily use Adobe Illustrator, Photoshop and ImageReady (great for optimizing animations).

valentijnb:yes max

Ang:Never tried ImageReady is that mainly for the optimizing

RobinN:Max -- yes, if you're talking about adding hidden links to doorways at the bottom of your main page

valentijnb:or just graffics

schueller:I'll offer another suggestion--Fireworks. It now shows what a graphic will look like in a mac also

Ang:Nat why is that you prefer those programs

IvyHover:Loading is all based on the image itself, but a lot of people don't compress enough.

IvyHover:Like why use 256 colors in a gif when it only has 16.

Ang:yes fireworks is not to bad some limitations though

schueller:What do you see as limitations?

RobinN:Oh that's interesting Ivy. (since I know nothing about color) -- you can choose how many colors to use?? very dumb question, I'm sure

IvyHover:or saving JPS at a level 12 (great for print) but on the web you can usually use a level 3 to 5 depending on the detail in the image.

schueller:Both Smart Saver Pro and Fireworks lets you choose the number of colors needed.

RobinN:interesting -- I just never work with images (except to add them and add ALT tags!)

RobinN:Any last questions for Ivy?

IvyHover:No dumb questions, when you save the image there is usually a pallette option, you can adjust it an see the results. But if you image is a red button with white text, you know you don't need 256 colors ;)

RobinN:very good point

IvyHover:Anything else

RobinN:I REALLY appreciate your coming, Ivy. Ivy has been sick this week, so it took a lot for her to show up here, and we *really* appreciate it.

schueller:Thank you for the advice.

IvyHover:Thanks I hope everyone learned something

RobinN:I offered to cancel it for her -- do it next week. But, she's a real trooper!

Max:gee, Robin, i think you made it all the way through without getting booted and are even able to say goodbye this time

NataliaKim2:thanks to everybody!!! :-)) I wish I could join more often, but time difference is hell :-(((

RobinN:I sure did -- I know nothing about "design" -- couldn't create a decent looking page if my life depended on it (unless I could cheat)

IvyHover:Thanks, I'll do it again if you want, lots of software questions

RobinN:yes! that would be wonderful Ivy -- there certainly were a lot of software questions. That would be a great topic

IvyHover:It's just I haven't used a lot of what these folks are using

RobinN:I understand, but you're giving them a glimpse into what a professional designer uses -- someone that optimizes for the engines too -very helpful/important

Designing Engine Friendly Websites

Chat Transcript

March 3, 2000

Led by Guest Speaker, Ivy Hover, Poizon Ideas

Academy of Web Specialists