County Coordinator Web Site Reference PageHow do I organize everything? Where do I start? First, it is best to have one folder identified for all your images! Usually, this folder is labeled 'images' or even 'img'. By having all your graphic files in one location, rather than mixed in with your web pages, you will find it MUCH easier to locate the CA GenWeb logo or even a special county logo! Also, if you think you are going to be providing copies of documents in either .pdf (portable document format) or .txt/.doc format, you might want to have a special folder for these items as well! Again, this will make it MUCH easier for you to find particular items if you keep your files organized. Organization IS the key. (You can have, within your images folder, additional folders to help you better identify such things as cemetery pictures, headstone shots, etc...) Be especially careful when you are naming your files. If at all possible, keep the names all lower case rather than upper or mixed case and, do NOT leave any spaces between words! Why? The vast majority of servers do not 'like' upper case letters and, if you do not remember whether your document was upper or lower, you may never find your page on the internet!! Example: index.htm is different than Index.htm or, resources_city.htm is different than resources city.htm. If you looked at the URL (web address) for the second, you would see something like resources%20city.htm (instead of resources city.htm) or even end up getting an error message that the page doesn't exist! Don't forget to SPELL CHECK your pages!!! There are a few basic requirements when you are using html to 'code' your web page. Mainly, what you START you must END. That's the big secret!(Example:<html> and </html> are needed!) Also, in this more 'modern' age of web design, you will do yourself a HUGE favor if you start using 'Cascading Style Sheets' or CSS. A 'style' sheet' takes care of all your formatting in one place. You can have the css coding as part of your page or, as an external page you link to. That way, you don't have to worry about duplicating font colors and font sizes in particular. You can become quite creative and let your style sheet control how your web page looks. (More on this later...) And though many 'assume' everyone is using your same web 'browser', that is rarely the case. You will help yourself and your visitors by viewing your page using multiple browsers before you push the revised page out onto the web. It also doesn't hurt to have an older browser version available because not everyone upgrades their computer or browser as quickly as we would all like... So it is recommended that have copies of Internet Explorer (PC), Safari (Mac), Firefox, Opera, etc... installed on your computer... And there are SO many more browsers available!! Avoid using underline of text as much as you can. Why? If you think about it, we all look to just about anything with an underline as a link to another page, anchor, etc... Try to help your viewers by limiting the use of underline as much as possible. Images: Make sure you have a 'size' included when you are adding an image to your page. Why, this will help browsers display your page quicker. And try to avoid resizing your image by limiting the size of the image within your coding! It is better to optimize your image first and then use the proper size within the page code. Again, this makes it easier and faster for browsers to display your page properly. Alt Tags: DON'T forget to include an 'alt' tag when you include an image. 'Alt' tags are used by many text readers when someone with limited or no sight is surfing the internet. You can limit your description or not - but imagine if you were wanting to know what the photograph on your page REALLY was and your alt tag simply state <img src="images/CA_map.jpg" alt="California map with YOUR County displayed" width="200" height="230" > A table is a great way to 'organize' your data, keep everything aligned exactly the way you want. Coding for a table can be tricky at first but once you get the hang of your columns and rows, you may never go back to NOT using a table! Click on this link to see a basic table code. A list is another way to organize your data. Just as word processors have ordered and unordered lists, so does html. The ONLY difference is the starting and ending code of each: <ul> </ul> for unordered and <ol> </ol> for ordered. Click on this link to see coding for both ordered and unordered lists. Linking to anchors is very similar to normal links. Normal links always point to the top of a page. Anchors point to a place within a page. <a href="#anchor>Anchor link</a> takes you TO the anchor point on that same page. <a href="page.com#anchor>Page with anchor point</a> takes you TO a page and a place on that page. Cascading Style Sheets Style Sheets allow you to control the rendering — e.g. fonts, colors, leading, margins, typefaces, and other aspects of style — of a Web document without compromising its structure. Cascading Style Sheets (CSS) are a simple style sheet mechanism that allows authors and readers to attach style to Web pages. It uses common desktop publishing terminology which should make it easy for professional as well as untrained designers to make use of its features. Visual design issues, such as page layout, can thus be addressed separately from the Web page logical structure. One of the main purposes of CSS is to separate the content from the document's structure. CSS is used to style the content of the document while HTML/XHTML/XML is used to build the structure. That way, once the document is "built", any changes to the look of the page can be made in the style sheets. The changes are made once and then take effect throughout the entire site. This makes the site much easier to maintain and, if necessary, change a small part of it or its entire format. A great source to learn about CSS are all over the internet. Here is a sample page link: http://www.wdvl.com/Style/Style/Sheets/ and don't forget to validate your CSS code just to make sure it is formatted correctly. As an example, you might have the following coding embedded on your page: <p
style="text-align: center; font-family: Arial; size:12pt"> <strong>My
text is here.</p> But you COULD have a cleaner code Your style sheet will state: p { That means, every time you enter a 'p' tag, your text will look the same time and time again. Change your stylesheet and ALL code now changes to reflect your new coding requirements! You can even have a 'style' for those times you want BOLD text!!! As an example, on this page the 'titles' are set to reflect a style. That
code is: The last thing to do. You may have checked, double checked and even triple checked your code and on multiple browsers but there is still one more thing you really should do. Validate your pages! No, you don't need special or fancy software and no, you don't even need to have your revised pages uploaded already (sometimes it is better to validate your pages BEFORE you upload your revisions...) Go to the W3C website for free validation. And remember, if there is a web page you REALLY like (or a piece of a page) you can view that page coding information by looking at the source code and copying. (Your browser has a menu probably called 'view' - just look for the words "source code" and click.) Just remember though, if you are copying a WHOLE page and/or text on that page, if the document/page is copyrighted, then step away! You can at least see HOW someone has coded their page and then you can do the same on yours but their page is copyrighted and NOT in the 'public domain'! Return to California Genealogy Go to The USGenWeb Project Page Copyright © 1996-2012. This Web page is sponsored by Supporters on behalf of the California portion of The USGenWeb Project by The Administrative Team of the CAGW. Although believed to be correct as presented, if you note any corrections, changes, additions, or find that any links provided on this page are not functioning properly please contact the Webmaster [cagenweb2012@gmail.com] for prompt attention to the matter. AL RIGHTS RESERVED Page Last Modified: 7 March 2012 |