How important is your Profile Page - An HTML Lesson - Part II
Sep 25 '01 (Updated Sep 26 '01)
The Bottom Line Improve your profile page with some simple-to-follow HTML coding lessons...
Hi Everyone.
About a month ago, I posted what turned out to be one of my most popular reviews here on Epinions (and it wasn't related to the rock-band Rush - go figure). Actually, it was my attempt to show how important an Epinions Profile page is to gathering more hits against your reviews, earning more trust from fellow members and displaying something about yourself in your own HTML-driven style.
Now, I won't bother repeating the introduction to that essay that highlights those PROs, but if you'd like to read it, please go to: http://www.epinions.com/content_2071044228
In that review, I went on to cover three basic, yet effective, HTML coding routines that were designed to give your profile page a little more pizzazz. Since it was such a hit, I decided to write a follow-up review with some more HTML goodies that are sure to further improve your profile page which, in turn, will benefit you, benefit Epinions and benefit consumers everywhere.
Last time out, we focused on adding drop-down menus on your profile page which could help other members browse directly to your other opinions. We also talked about inserting background graphics and displaying pictures. This time around, I'd like to focus on formatting text. Since most of us like to write a little bit about each of us on our profile page, the formatting of that prose is certainly important.
Because Epinions allows full HTML code access to one's profile page, you're forced to use some basic HTML code in order to do such rudimentary things such as line feeds, indentation, paragraph formatting, etc. But once you know how to do this, you'll see that it's as easy as pie - HTML pie that is :)
So, let's begin, shall we?
Basic Text Formatting
Most of you know already that using the coding <b> or <i> before some text and </b> or </i> after the text will result in your text appearing as bold or italics or both. While this is the only HTML coding Epinions will allow within a review, you do have access to more formatting abilities in your profile page.
First, there's <u> text </u> which will underline your text. Next, there's <tt> text</tt> which will format your text like a teletype or typewriter-style text. As with the bold and italics coding, you can mix, match and combine any of these four formats.
Next, in order to get a line-feed (carriage return) at the end of some text, simply enter in the coding <br>. Each <br> equates to one line feed, so if you want to space out your text, just keeping adding those <br>'s. Simple, huh?
How about paragraph formatting you say? Just as simple. By default, text will be left-justified (all text aligns on the left side). If you want to switch to right justify where the text aligns on the left and the right side, simply enter the code of <p align = "justify">. If you want to switch back to the left justification, simply replace the code 'justify' with 'left'. How easy is that?
Now, what about the placement of the text on the screen (or the placement of any items such as pictures, icons, etc.). Again, by default, text and pictures will appear on the left side of the screen. But you can center them or place them on the right side of the screen as simple as this.
To center text or an object, use the coding <center> before the text/object and </center> after the text/object. Replace 'center' with 'right' and you'll throw everything to the right side of the screen. Now of course the true placement and appearance of this information will be dependant on the user's browser and screen-resolution settings, but you get the idea I'm sure.
"But Jag, what about fonts? Hey, I'm glad you asked. Changing the font is simpler than you think and it's pretty powerful.
The coding is: <font color=" black " size="2" face="Arial"> where the color is just that, the color you want to appear (you can use plain English or hexadecimal coding for the color), size relates to the point-size of the text (the larger the number, the larger the text) and finally the 'face' is the name of the font you wish to access. Keep in mind that if you indicate a font that a user does not have, it will likely default to the user's browser setting. To end a particular font segment, enter the code </font>. This way you can mix and match and change fonts, colors, formatting, and more to your heart's content. Have fun with it!
Hey, but there's more - how about special effects like marquee scrolling? You won't believe how complex that is.
Enter the coding <marquee> then your text and then </marquee>. That's it :) Note: Marquee scrolling only seems to work with Microsoft Explorer Browsers.
Borders and boxes and lines, oh my...
Surrounding your text or pictures or anything with lines and borders is relatively simple as well but does involve more coding that some of the listed HTML coding above.
The coding below should help you set up a variety of tables, boxes and lines. As with anything, a little trial and error will go a long way to improving your HTML coding skills.
<table border=#> where # is the width size.
Sets width of border around table cells.
<table cellspacing=#> where # is the space size/count
Sets amount of space between table cells
<table cellpadding=#> where # is the amount of cells.
Sets amount of space between a cell's border and its contents
<table width=# or %> use the % sign when specifying % of document width
Sets width of table - in pixels or as a percentage of document width
<td rowspan=#>
Sets number of rows a cell should span <default=1>
<td nowrap>
Prevents the lines within a cell from being broken to fit
HTML Links and Tags
The final bit of HTML coding I'd like to go over is placing a hyperlink on your page. The hyperlink or tag can be linked to another web site/page or an email address.
To link to a web page, use the coding: <a href="web site address"text</a> where the 'web site address' is the full address of the link, and the text is the text you want to appear as the link (i.e. Click Here to go to Jag2112's profile page).
To link to an email address, which typically opens up the user's email program, use the coding: <a href="mailto:email" text</a> where the 'email' is the full email address and the text is, once again, the text you want to appear as the link.
And so ends our second course in simple to follow HTML coding. Once again, I'd like to stress that, through Epinions's Profile Page, you can create your own unique personality that will likely draw in others users and help you increase your opinion hits and Web of Trust.
Thanks for taking the time to read and, as before, should you need any further help on HTML coding, feel free to contact me at jag2112@hotmail.com
Thanks for reading and happy HTML coding...
 |
|
|
|
|
|
|
Epinions.com ID:
jag2112
|
 - Top 100 |
|
Member: John
Location: Clinton, NJ
Reviews written: 304
Trusted by: 309 members
About Me:
The writer stares with glassy eyes...
Defies the empty page...
|
|
|
© 1999-2009 Shopping.com, Inc.