Tuesday, November 25, 2008

CF Website Update

I redesigned the CF Website, here's the first page:

Monday, November 10, 2008

Preformatted text, Cross-browsing, HTML Text & SEO

I've not written an entry for a bit because I've been caught up in ... stuff, heh. In my absence I've discovered a few new things:

PREFORMATTED TEXT
Late last month I posted a blog that required me to show you code that I used in another website. Through a little creative trickery I think I got the point across, but it was definitely hard to follow, I'm sure. Since that time I've learned about Preformatted Text.

The issue in the entry that required showing the viewer the HTML code that I used for a website was that when I tried to write the code in this blogger window, the blogger window wanted to read the code instead of show it. To fix this, what you have to do is use &lt; in place of the < and &gt; in place of the >.

The following text is code that I've enclosed in &lt; and &gt; so that you can see it as written code:

<head>This is a sentence.</head>

Another way to display your code for viewers is to use a textbox like the following one:



CROSS-BROWSING
In my last entry I was concerned with the fact that sometimes my coding shows up fine in Opera but Firefox makes it look slightly different. I have found these two websites that help you see what a webpage will look like on different browsers (again, the a href tag doesn't work for me on blogger and I have no idea why so you'll have to copy and paste the link into your address bar until I can figure out why it doesn't work):

http://ipinfo.info/netrenderer/
http://browsershots.org/

In addition, I also found these two websites that will tell you if there are any errors in your (X)HTML code or your CSS, respectively:

http://validator.w3.org/
http://jigsaw.w3.org/css-validator/
HTML TEXT
Also in my last entry I wrote about my dismay when I discovered that when I visited the website from another computer the font defaulted to verdana and would not show up as the font I had used when designing the site, which was Boopee.

The reason other computers wouldn't show my chosen font is because the fonts are not embedded in the code but rather the code tells the computer system to search within itself to find the font. If the font is not installed on that particular computer system, the code tells it to resort to default fonts such as Arial, Verdana and Times New Roman.

Unfortunately the only way I can come up with to avoid this is to use images as the font instead of the font itself if you choose to use an off-the-wall font (like Boopee). However, if you use something like Verdana or Arial or Times New Roman it's highly unlikely you'll have this issue because most computers have these fonts installed.

SEO
SEO stands for Search Engine Optimization. According to wikipedia (such a fun word to say!), meta tags used to be the way to go for getting your website to come up as the #1 site when using an internet browser.

Because web developers have misused this system a new system using new calculus algorithms has been established. Now I get to research algorithms because I have no idea what the crap that is...although I suspect it's got a lot to do with patterns in numbers and such. We'll see.

Sunday, November 2, 2008

Webby's To Do List

DESIGN ISSUE
My resume website found at http://www.wku.edu/~tabitha.holmes969 shows up perfectly fine in my Opera browser, however problems occur when viewed in the Firefox browser.

In Firefox my scrolling gallery does not show up. Also, when I visit the site on my parent's Gateway computer that has a 14'' screen I find that my content does not conform to that size but rather you have to scroll left and right and up and down more to see the whole page. The browser I use on that computer is IE, but the IE on my laptop shows the website fine as well. 

So my current battle is a battle of the browsers and making my site look good on all browsers. 

TO DO LIST
1. Find out how to make my website look good on all browsers.

2. Add a way for viewers to know when the website was last updated. 

3. Edit video of Colby's parents.

4. Finish CF website design: Add contact form using php, Design a links page and a What is CF page as well as a CF Patients page. Add the rss feed into the new design.

5. Use CSS to make this blog match the Resume Website.

Building a Contact Form Using PHP in Dreamweaver CS3

I wanted to build a contact form to serve as a feedback and guestbook. I googled "contact form using php in Dreamweaver CS3" and found a great tutorial at the following website:

http://www.kirupa.com/web/php_contact_form.htm

A few things I found difficult and not dummy proof with this tutorial was:

1. When it prompts you to copy and paste the code to go into the html page it doesn't specify where in the code to put it. Paste it into the body section.

2. On page 2 you find the code for the php page. To create the php page open an html page, go to code view, delete all the code and replace it with the code you copied. 

Other than that, the tutorial rox out. Happy contact page-making!

AutoRun

I was applying for an internship at ImageWest at Western Kentucky University and I wanted to copy my entire website onto a cd and turn it in that way.

I wanted it so that when the cd was inserted into a computer, the index.html page opened automatically instead of the viewer having to navigate through my folder that contained my entire website.

I googled, "copying a website to a cd" and eventually came across something that resembled what I wanted. The answer was to put an autorun code onto the cd.

After many failed attempts I discovered this website (let's see if the hyperlink function is working today...by the way I'm using Firefox today and it didn't change my Title into some funky language, yay!):

Boo...it didn't work. So it's obviously not a Opera browser thing, must be a blogger.com thing. Copy and Paste:

http://www.longtion.com/autorunpro/autorunpro.htm

Anywho who, I downloaded the trial version of autorunpro. Autorunpro is fairly simple to use.

Go to file-wizard and the autopro wizard walks you through the process step by step. A feature that I found very neat was that you can create a logo (the program calls it a splash page) and when you insert the cd the image is shown for a brief moment before proceeding onward to open your html page that you specified by the computer's default browser. However, the autorunpro program does not recognize .png so if your image is saved as a .png you gotta change it! Here's mine:



Testing the autorun feature on Vista proved difficult as you had to visit the settings for Vista's autorun and pretty much turn everything off...still not a big fan of Vista, although I do understand the idea behind this is to add security, but it's still a painus in my anus.

Moving forward...now if you're using Dreamweaver to create your html pages, you'll discover the four documents that autorunpro creates when you open your website in dreamweaver again. From that point forward when you copy the entire site to a cd it will contain code for autorun. Sweet, huh?

Friday, October 31, 2008

Portfolio Resume Update

INTRO PAGE
Because my portfolio website is currently a project for a course I'm taking I have to include an intro page because it is on the check list of things to include on the site in order to get a good grade. Currently my intro page is horrid:

http://www.wku.edu/~tabitha.holmes969

(The 'create hyperlink' button on this interface is currently not working. Please copy and paste the link into your address bar to view the page. Sorry for the inconvenience. Is this an Opera browser bug like the Firefox browser bug I found?)

I am thinking of designing a splash page in Flash. This would suffice the "include a flash element of some sort" requirement as well. Killing two birds with one stone is never a bad idea, right?

HOMEPAGE
I'm in love with my homepage, however. It showcases a scrolling gallery and a fun font as well as my favorite choice of colors: black with gray and PINK.

CSS
CSS was used in the scrolling gallery to make it functional but it was also used for tables, background and links to pull the site together. A good, apparent, example of this is that all pages include the same background piece.

BACKGROUND IMAGE
This background image was also a product of a class assignment. The project was to take the conceptualized idea of "takeaway" and produce a visual image. A "takeaway" in short is the one thing you'd take with you if you were to die today. It could be an idea, a memory, a feeling or even something material. Being a girl and quite prone to girly ideas and girly thoughts, I chose feeling love...imagine that...awww.

CONTACT FORM
I found a tutorial on a website that I can't remember now and copied the .php from it. I built the page and made sure to put in my own email address to send it to upon hitting the 'submit' button. However, when I tested the form about 2 minutes after uploading it either A. did not work or B. takes a bit to send the emails to the email account. While I'm hoping for B I'm guessing the answer is A so I'll have to consult my professor to see if he would know why it might not be working...or I can do the smarter thing and figure it out on my own. I think I'll go that route...won't always have professors to answer your questions, you know!

CHANGES TO BE MADE
I had a few friends view and critique the site. One person commented on the different fonts that were used. On the homepage I used boopee and times new roman, whereas on the resume I used a different set of fonts that I can't even remember the name of now. So later today or perhaps tomorrow I plan on editing the resume and incorporating boopee and times new roman fonts instead. The problem here is that boopee is not a very professional font and while it works well on my homepage, I don't feel it would be appropriate for a resume.

RESUME IDEA
I have this ingenius idea to make a folder-type resume. For example, if you go into a nice restaurant the waiter/waitress will hand you a menu that opens up like a book. It contains a front cover, inside left face, inside right face and back cover. This is the way I would like to have my print resume be, however I'm sure this type of printing costs a pretty penny. We'll see what I come with!

CF Website Update

CF WEBSITE
Originally the objective was to produce a small, informational website. Initially the purpose was to provide the community with up-to-date information and news. True to my rural community spirit and upbringing the website has developed into a "home" for my viewers due to the videos.

VIDEOS
I had another video shoot with Mr. and Mrs. David & Lori Lear. They are the parents of Colby Lear who is seven years old. I just shot the video last night and have not made it digital nor edited the content. This time I got over 40 minutes of video, which is twice as much as I had for Brandi. Brandi's information was concise and compact, to the point, whereas the information I gathered from David and Lori was expansive, covering a lot of aspects all at once. This was, somehow, a more difficult shoot.

DESIGN
Originally I planned to use div tags and javascript as the basis for the whole website, however it got pretty complicated when I started adding more content and expanding on my initial ideas. Because javascript is new to me and I'm concerned with the amount of time it will take me to produce the website in a condition that can be published, I rerouted my design application decision.

I have decided to drop the div tag and javascript idea and instead use CSS. I did keep the original color scheme. At some point I hope to incorporate a flash element of some sort as the website is not as interactive as I hoped it to be.

With the progression of my knowledge of CSS, XHTML, Javascript, Flash and the like, I hope to see the website grow and expand in terms of design and content.

CF PATIENTS PAGE
I really did not enjoy the CF Patients page of the site so I'm currently working toward a new design idea. I did, however, generate a Great Strides page that I am somewhat proud of and you can see it below: