|
2.2 HTML Files
"So why on earth is she writing about this stuff - surely anyone knows how to save a
file?" I hear you say!
Well, whilst it may not make much sense now, if you take heed of the following you may be inclined to write and thank me someday!
- SAVING: when you go to save your html page don't just hit "Save". Instead select
"File", and "Save As". When you do this, there will not appear to be the
option of saving as an .htm file and your text editor will be set to save as a .txt file - which won't look
right in your browser! No problemo! Just type the .htm extention in yourself, making sure you use a suitable
filename (see further down here).
- DIRECTORIES/FOLDERS: in the "Save As" dialogue box, you will be able to choose the location
on your hard drive to which to save the file. Make sure you save your web pages in a specific and separate
folder on your system. I have an area of my hard drive called "WWW" and in there I have one directory
per web site, e.g. in the case of this web site, "didilogix" all the .htm files go in there.
In that
directory I also create a subdirectory called "Assets" and that is where all the image files go, e.g.
the logo on the left and the wooden-looking navigation buttons at the bottom of each page. There are two reasons
this is a good idea. Firstly, it makes uploading your web site to your web server a breeze because you can just
click, say, the "didilogix" folder and select to upload that, rather than having to upload individual
files from different locations on your hard drive. Secondly, when you are building your web site and accessing the
files locally (i.e. have opened one of the .htm files on your local hard drive into your browser), all the links
and images should work properly (if you've coded them right in the first place). If they are sitting all over your
hard drive, then even if you have coded to support this, when you go to upload your site, nothing will work
unless you have managed to exactly replicate the directories on your hard drive, which would be rather silly!
- VERSION CONTROL: this simple, vital technique has saved me many tears. All it means is that, in addition to
saving your work regularly, you incrementally save your files. If you are working on an .htm file and make
a drastic change to it (e.g. layout), then use the "Save As" command and name the file
"{filename}-V2.htm", then the next "-v3.htm" and so on. Why? Because if you decide
you have made changes that look horrid, you can just revert back to the last version. This is very useful when
doing complicated code that could have a massive impact on the page and be difficult to troubleshoot if you decide
you don't like it!
When I was learning web design, I learnt the merits of using version control the hard way. For,
having made some dramatic changes to the source code of a page and overwritten the original, I loaded the revised
page into my browser only to find it didn't work as I had intended. It took me ages to unpick the screwy code I
had written - sorting duff HTML tags can sometimes be like looking for a needle in a haystack! Had I used version
control, I could just have loaded up the previous (non-dodgy) version!
- FILE NAMING: when you code up your pages, you will be putting in links to the various other pages you want on your
site and also linking (or "inlining") various image files into your documents. Whatever you do, make
sure you are really happy with the names you call your files! This is because, if you change the filename/s
after you have coded your pages, you will have to go through all your pages and change all the
links to the new name! Trust me, this can be a total pain. This is why it is a good idea to have a set file
naming convention. Normally I prefix htm pages as pg-filename.htm, headline graphics as hg-filename.gif (or jpg),
animated gifs as an-filename.gif, navigational gifs as d-filename.gif ("d" for "direction") and
suchlike. Obviously, you don't have to use my naming conventions but it will save you huge amounts of
coding time if you decide upon, and then stick, to using one.
- HOME PAGE NAME: contrary to the above, there is one page
that you do have to name in a certain set way - your "Home" or "Start" page - the one
user's first land on when they type in your domain name. This always has to be called "index.htm"
because most web servers have a default that states that this will be the name of your initial - or "landing" page.
Most web hosts do let you change the default index page name, but why bother! Also since a lot of search engines look
specifically for a page called "index.xxx", changing it to something else may not bode well for successful
search engine results - remember, your web site is only as good as the ability to find it amidst the millions of other
web sites out there, so search engines and directories are very important!
- UPPERCASE: be very careful to name your files in a
convention that also takes into account use of lower or uppercase. Again this saves time and heartache in coding
because Apache and other web servers (the programs that are used to show your pages to visitors) are case-sensitive -
if you have a graphic called "Image.jpg" in your Assets file, but you link to it in your web page as "image.jpg" in your "assets"
directory - the image will not appear! I have a convention that my filenames are usually are all in lowercase - that way,
I can just always code in lowercase and then it doesn't matter because the links will always work!
NEXT: Wanna know how to format text using HTML?
|
|