Entries Tagged 'html help' ↓

Reciprocal linking codes

Here’s the thing.

To get placed more highly in a Google search (who doesn’t want that?), you need to make Google think you’ve got a damned fine site. The higher the PR (Page Rank) you’ve got, the better a site Google thinks you’ve got, and the higher you will come up in a search for your chosen keywords.

One of the ways you do this is by getting links from other sites like yours.

One of the things Google looks at when deciding how good a site you have is incoming links. They look at how many sites are linking to you and what kind of sites they are. The people who wrote the algorithm decided that the more highly ranked sites you have linking to your site, the better quality your site is.

So if you’ve got a site that lots of people with good sites think their readers will want to read, they’ll link to you and you may get a boost out of this. The best way to do this is to start by having quality content on your site. Update your content regularly and people will return to see what’s new. They’ll give you links.

Of course, there are other ways to get links. Some sites will trade links with you. Google looks at links like this and sees that they are reciprocal, which means the two sites link to each other. A link like this is not worth as much to Google, but you may get some good traffic out of it.

When you make a reciprocal link, you should place the site’s link at least as well as they have placed yours. So if they link to your front page, you can link to their front page. If they’ve got a “links” page, you can put their link on your links page or on your front page. But be nice. Don’t hide their link someplace on your site if they are giving you a link to your front page. I have offered to trade links with girls who wanted me to link to their front page, while they were putting my link on a page that was behind a tiny text link. Another girl offered me a link on a password-protected page that nobody but flirts whose banners were on the page had the password to.

It’s the same with topsites. If they want you to host their image, then upload it to your site and link to the image there. Otherwise, use the code they gave you and put the link on the page you gave them.

Here’s a banner for this site:

The url for the image is
http://help4flirts.com/banners/banner.gif.
The code for linking is
<a href="http://help4flirts.com/"><img src="http://help4flirts.com/banners/banner.gif" border="0"></a>

I had to type that out in strange characters for you to see that. In order for the linking code to actually show up the way they need to copy it, you need to either type it in special html characters, format it with <pre></pre> tags:
<pre><a href="help4flirts.com/"><img src="http://help4flirts.com/banners/banner.gif" border="0"></a></pre>

your linking code

See how I didn’t actually put the linking code in there? This one doesn’t work in Wordpress.

Or you can put it in a textarea. “Cols” is the number of columns. Put more to make the textarea wider. “Rows” is the number of rows. You can increase or decrease, but you want the entire code to show without too much wasted white space.
<textarea cols="40" rows="3"><a href="http://help4flirts.com"><img src="http://help4flirts.com/banners/banner.gif" border="0"></a>

You can use any of these in an html page. You can’t use the ‘pre’ tags in Wordpress.

Font colors

Changing font colors

Here’s a big chart of color names. There’s no guarantee that they will work on Niteflirt, but if you like one that doesn’t, just copy the hex code, hashmark and all, and put it instead of the color name.
Color reference

More about fonts

Web-safe fonts your visitor should have on his computer.

Screencast tutorials: Changing font part 1

Changing Fonts

Screencast tutorials: paragraphs

Making Paragraphs with HTML

Screencast tutorials: Getting started in html

Headers

HTML: Adding another photo

Here’s what the listing looked like when we left off.

Just as a refresher, we added a photo here and formatted the text here.

What we’re going to do is add another photo to it, this one over on the right. Then we’ll add a photo that’s centered, and we’ll center the header text.

What we need to do is put the next photo in the second paragraph exactly the same way the first one went in. We take this piece of code

<img src=”http://help4flirts.com/images/portrait2.jpg“>

and insert it right after the header of the second paragraph, changing only the name of the image.

It looks like this, just like the last one did. There’s a photo inline with the beginning of the first sentence.

now we are going to align the photo to the right by adding ‘align=”right”‘ and put a little space between the text and the photo by adding a left margin of 5 pixels to it.
<img src=”http://help4flirts.com/images/portrait2.jpg” align=”right” style=”margin-left:5px”>

Now the photo is on the right side.

To center something, what we do is put <center>and</center> around it.
So if we put those around an image, the code will look like this:

<center><img src=”http://help4flirts.com/images/landscape.jpg”></center>
If we put these around the header text, the code will look like this:

<center><h1>Header</h1></center>

So what we do is put the center tags around both headers. We put center tags around an image we want to use as a header image. We get rid of all those line breaks (<br>), because we won’t be needing them anymore. And here’s what it looks like.

Formatting your listing text


This is what the listing I was prettying up in the Adding a photo, Part I looks like. I want to add a couple more photos to it, but first I’m going to do something with that text.

It’s a huge block of text, the default size font is really tiny, and it’s hard to read even if you’ve got good eyesight. Some callers can’t read that, so you may as well be writing in fake Latin, as far as they are concerned. Let’s do something about that.

First, let’s look at font sizes. Standard html fonts come in 7 sizes, numbered from ‘1′ (smallest) to ‘7′ (largest). To specify a font size, you would put a font tag on either side of the section you want to have that size. If you don’t end it, the rest of your document will be that font. This would change something to font size ‘1′.
<font size=”1″>Word or sentence</font>
The default font face on Niteflirt is called Arial. The default size is ‘2′. This is what Arial looks like in the standard sizes.

To change the font face from Arial to Times New Roman, use this code.
<font face=”times new roman”>Word or sentences</font>
This is what the 7 top web fonts look like in size ‘3′.

There are lots of other gorgeous fonts. Avoid them. Most people don’t have them installed, and their computer will substitute something else that might look really different. Making good font choices.
Make text italic like this.
<i>This is italic.</i>

Make text bold like this.
<b>This is bold.</b>

Make text colored like this.
<font color=”red”>This is red.</font>
To make a multicolored line, color the words individually.

Here’s what it looks like when you do it all together.
<i><b><font face=”comic sans” size=”4″ color=”purple”>Comic sans size 4 purple bold italic</font></b></i>

Wow, this is getting boring. If you want more info, here’s the text file. Download it and look.

I’m just going to go in there and give that listing maroon georgia size 3 italic text. I’m going to add a header at the top, and I’m going to add a subheader before the second paragraph.
<font face=”georgia” size=”3″ color=”maroon”><i>
I’m not going to bother changing the font, so I don’t need to use the end tags on Niteflirt.

Unfortunately, you do have to also separately add font to the headers, or the color will only show up in Firefox.
<h2><font face=”georgia” color=”maroon”>My header</font></h2>

Here’s what it looks like now.

HTML: headings and subheadings

Headings, Titles

Heading sizes are numbered. The lower the number, the larger the size. You want to use headers rather than changing font size for your titles, as search engines look for header text first when deciding what is most important on your page. I can’t demonstrate very well on this page what the different default sizes look like, as my blog theme has changed the defaults, so I’ll use an image.
Here’s how you write them:

Header 1: <h1>Header 1</h1>
Header 2: <h2>Header 2</h2>
Header 3: <h3>Header 3</h3>
Header 4: <h4>Header 4</h4>
Header 5: <h5>Header 5</h5>
Header 6: <h6>Header 6</h6>

And here’s how they look:

Here’s a sample listing:

Let’s format the listing

There is a heading at the top of the listing. We’ll make it an <h1> header.
Here’s what it looks like before in the listing and the edit window:

Here’s what it looks like after:

There are a couple of subheaders lost in the text. I’ll make them <h3> headers.
Before:

After:

Try it!

Changing text color on the feedback and titles

The old-fashioned standard html way of doing it is to put a text attribute in the <body> tag, like so:
<body text="#000000" link="#000000" vlink="#000000" alink="#000000"> where ‘text’ is the color of the text in your listing, ‘link’ is link color, ‘vlink’ is visited link color, or the color of the links that the visitor has clicked, and ‘alink’ is the color of links that are active, or highlighted.

Niteflirt won’t let you do it this way, and if you try you’ll first get a message that you can’t put “text” within the <body> tag, and then that you aren’t allowed ‘link’, ‘vlink’, or ‘alink’ either. So what you have to do is trick it. The formula that’s searching though your code for banned snippets is looking for the entire word ‘ text’ with a space before it. You can add a ‘border’ attribute and remove those pesky spaces, and even though the code is really nonstandard, it will still work.

<body border="0"text="#000000"link="#000000"vlink="#000000"alink="#000000">

will make all the text on the page black, as #000000 is the hex code for black. There are also a number of color names you can use. So

<body border="0"text="red"link="pink"vlink="maroon"alink="purple">

will give you red text, pink links, maroon visited links, and purple active links. Of course it will do it in your listing, too. You probably don’t want that. So what you do is put it at the very bottom of your listing.

You can just copy and paste this, but you should pick a different color than pink, which is really hard to see, maybe like "#ff00ff", which is a hot pink.

<body border="0"text="red"link="#ff00ff"vlink="maroon"alink="purple">

Just in general you should look at the colors on your page to make sure they are dark enough to read and pick a different color if they are not really easy to see. Yellow feedback on a white background won’t work. Take my word for it.