Okay, so I’m editing a website and there are a few pretty basic things I want to do, but I unfortunately have got no idea how to go about doing them. Finally, if all y’all would be so kind, look at two screenshots and tell me which one you like better, by how much, and why.
I want to add a section in a frame that’s like a “Random HTML display.” At the top of the website we’ve got some sort of script that chooses randomly (or sequentially) between different photos. What I want to do is add the same sort of thing where a section of text or HTML is randomly selected from around 5-8 different options. So, what’s the easiest, most compact means for doing this?
The website which I’m working from somehow directs the browser to “highlight” text in mouseover. I want to stop this or at least change the color, but from searching around a bunch in the source code I still haven’t been able to find what actually directs these colors to change or be turned off. What type of tags should I be looking for?
Now, for just the graphic design folks, tell me which one you like better, by how much, and why. Remember, the actual photos shift around randomly, but what about the basic design?
This seems to have been done via CSS. If you don’t know what it is, Cascading Styles Sheets is a technology that works alongside HTML to control the presentation of webpages. In your particular class, the HTML tag that invokes the CSS is:
Change the color and background-color to other values (using standard HTML color codes or names) or remove the entire a:hover line to disable the highlighting altogether.
As for #1: The page currently uses JavaScript to display the random images. This is a rather strange way of doing them (they’re usually done with CGI/Perl or PHP), but I guess that’s what they chose to use.
The most consistent way, then, would be to implement text using more of the same JavaScript. Just insert something like the following code snippet where you want the random text to appear:
<script language="JavaScript">
var j,d="",l="",m="",p="",q="",z="",KW_ARI= new Array()
KW_ARI[KW_ARI.length]='This is an example of random text.';
KW_ARI[KW_ARI.length]='This is another sample sentence.';
KW_ARI[KW_ARI.length]='I talk so much yet I have so little to say.';
KW_ARI[KW_ARI.length]='Blah blah blah';
j=parseInt(Math.random()*KW_ARI.length);
j=(isNaN(j))?0:j;
document.write(KW_ARI[j]);
</script>
Replace the sample sentences as you see fit. You can also add as many more as you need. However, you should know that both the random images and random text will break if the visitor has JavaScript turned off in his or her web browser. Ask your webhost whether Perl or PHP are supported – if so, they would be more reliable methods of doing this.
As Reply notes, javascript isn’t the best way to do this, because not everyone will get the same results. You can go that way if you want, but remember to include <NOSCRIPT> content to substitute for people who have javascript disabled. (And you have no way to know if it’s rendering correctly for everyone, anyway.) The only reason you might want to go this way is because you’re hosting the page somewhere where you can’t run CGI scripts.
There are plenty of free scripts floating around to do this for you. Here are a couple of workable Perl scripts:
If you don’t want to use someone else’s script, this will at least give you an idea of how to go about it on your own.
I like the second design better as well. The fonts are better suited to the subject and suggest speed and strength, and the photo places more emphasis on the cyclists and their motion.
There is no required DOCTYPE at the top of the page. Without it, there is no way to correctly validate the code and browsers will attempt to recreate the page without proper direction. As a side benefit, a page with the required DOCTYPE can be tested with the W3C Validator and used to locate bad code.
That’s good in theory, but not necessarily in practice. Unless you’re sure all your code is properly adhering to whatever the declared DOCTYPE is, it might be safer to not include a DOCTYPE at all. The browsers are usually pretty good at figuring out noncompliant HTML on their own and explicity declaring a DOCTYPE will only make them less tolerant.
I prefer number 2. The layout looks clearer to me, and more professional. I like the way the top frame of links is shown as the same width as the main frame (just by using a different colour to the background.)
Also, the font for “2005 NCCA Road and Mountain…” and “Welcome” is a lot clearer.
IMO cute cursive or handwriting type fonts look like they should belong on a family website done by a 14 year old girl for a school project. Not that I think your whole page looks like that, just that the use of the handwriting font makes it look less professional.
There’s nothing wrong with specifying a Doctype that is transitional, which is what’s recommended, for better compatability without avoiding web standards.
But if you specify the wrong doctype or provide a URL, browsers sometimes switch out of “quirks mode” and the page will look wrong.
Basically, all I’m saying is that if you’re a good HTML coder, if you know what you’re doing and if you can write compliant HTML/XHTML according to a certain doctype, then by all means, go for it. It’s a noble goal. But realistically, not everybody is able to do that and if your page already looks fine in the major browsers, adding an unnecessary doctype won’t really gain you anything and may mess up your page layout, giving you one more headache to debug. What’s the point?