About - Québec

Home → About About this website... Version 1 Jump to Version 2

This website is designed by Chris Fiorito for individual midterm project.

The photograph credit goes to:
- Matt Forsythe - student of Rochester Institute of Technology
He was using a professional camera with an extra zoom lens to take many great photos during the vacation and some of them are are chosen as the best photos that are shown on this website.

- Samuel Attard - student of Syracuse University.
He was using his slim digital camera for taking a quick photos that do not require an adjustment of the lens. Many photos ended up beautiful as well and some of them are chosen to be on the website.

Basic Desgin
This website template is made mostly by me from scratch. Of course, I have used the XHTML and CSS references to check if I have done the codes correctly by their syntax.

This page is mostly blue because that is my favourite colour and also it is Québec's colour.

The title "Québec", I imported the font called "Sans Culottes" using CSS as well as other font for text body which is called "Enriqueta". Those fonts are provided by 1001Fonts.com. I like to pick different fonts rather than using the traditional ones.

This page has a random images upper right corner, it would be fun to see any random pictures being taken in Québec!

This website is designed using Notepad++. Also it is designed with only XHTML 1.0 transaction, CSS and JavaScript.

Navigation
The menu is a fly out style which would be a good for creating breadcrumbs, the information are kept in a group of the cities in the province of Québec.

Content (XHTML & CSS)
All content are designed with only XHTML. The layout, speaking of the styles with fonts, sizes, colour, alignments is design completely with CSS. Also all XHTML tags are reset with CSS style sheet so it gives me more flexible option to customize the styles on website. I use CSS heavily and there are three CSS files attached to this website: reset.css, style.css, and menu.css. The style.css is the master CSS files that manipulates the XHTML tags. There are two CSS files being imported to style.css: reset.css and menu.css. The reset.css is to clear out every XHTML tags and they no longer have their own properties, it allows me to overcome each tags' properties. The menu.css is used for fly out menu on every webpages. I keep the CSS files separately and organized for easily debugging the webpages.

JavaScript
There are only two JavaScript files attached to the website, randomimgtop.js and menu.js. The JavaScript files are written in a very basic JavaScript with my own knowledge. Randomimgtop.js allows to pick a picture randomly on the top to make the website more interesting. The menu.js file is for fly out menu. Why is that? The menu will work without JavaScript but I added JavaScript to make it very useful and A LOT easier for web designers. Every webpages have the fly out menu and they all are linked to each others so the visitor could stay on the website. Suppose I add a new webpage to it and its file is funthings.html, I would have to add the link funthings.html on every pages. What if there are over 100 pages? No way, I wouldn't sit down all day for updating each pages over one little thing like adding funthings.html to every one of these pages. So, the menu.js, the JavaScript file is linked to ALL webpages. All I can do is add funthings.html in the menu.js, and upload the .js file to the server, then funthings.html appears on ALL webpages at once. This method takes me less than a minute to complete. It's simple and sweet.

Back to Top

About this website... Version 2 PHP Includes Files
As I mentioned the JavaScript that post hyperlinks on every page. I was told that it wasn't a good idea because of a search engine would not be able to find a webpage with hidden links. The more to stay in school, the better we learn. I was required to change some things for version 2 website which is for final project. I switched all the pages from HTML files to PHP files because every page is able to include partial codes. The "PHP includes" allows me to include one header HTML file and one footer HTML file. You are currently at the "About" page and you may want to check the codes in a view source but you won't see anything about including the HTML files because it is a server side. When I'm designing a website on a server side, I'm able to see the PHP codes that links header.inc file on the top and footer-menu.inc (the menu is inside the footer file.). Between those links of header.inc and footer-menu.inc are any content that I am able to fill in that you are viewing right now. Let's take a look at the header.inc and the footer-menu.inc file so you can see what this page is puzzled together. - header.inc and footer-menu.inc The included files are blend in one file when you as a client side view the webpage, the search engine is as well as able to see those links and it is able to find it. If I remove "Contact" from the menu, EVERY webpage won't display "Contact" link, so the link is easily customized once that updates all webpages.

Browser Check
All web browsers display this website a little differently but it is tested on the most browsers, Chrome, Firefox, Safari, Opera, and Internet Explorer. The Internet Explorer (IE) is the least recommended browsers by many users. It is not because of this website you are visiting is no good for IE, many websites are no good for IE because the IE is not designed with many cool codes that viewers may see. If you have Internet Explorer of any version installed on your computer (If you are using Windows, then you obviously have it), copy this url: http://nova.it.rit.edu/~cjf7545/409/project_final/ and paste it on IE's address bar, you will see a yellow bar on top that brings you an attention that it is not fully compatible only shows that "it should be okay" to visit the whole website but highly recommended to use other browers than IE. This code is generated using JavaScript.

Form Validation
The form validation is a protection that users won't submit a blank field and invalid email address. The code is generated using JavaScript, and not only that, a user may turn off the JavaScript and submit invalid information. I do not want a user to trash the information on my database so the PHP code also validates the form and there is no way a user may turn off the PHP code.

The "Contact" Page
I added the "Contact" page to it, yes you now can contact me. Well, not really, it won't just email me because I am required to connect to my database (It is SQL), so it can store information of your name, email address and your messages. You can provide your information and submit so I can look up in my database. I can look up your email and your comments, then I can respond back to you but other people may see your comments on log page, so submit your information with care. :-)

Breadcrumbs
It is a path that you know where you are at. It is not the food. When you are in any webpages, you see they begin with Home and there is an arrow that you are at the other pages than Home. They are displayed on top of the content web pages. This helps from getting lost in this small website.

Back to Top