PDA

View Full Version : Shifted from WYSIWYG to CSS & PHP


Bob96
Wed., Sep. 14, 2005, 6:10 pm
I am in the process of redoing the basic design of our church's website in order to separate its contents from its format and style. I have configured a basic CSS external file from which I can add or edit many of the codes that set the style for many of the elements that will appear on every page of the site. I have two PHP include files that provide the content for the navigation menu and footer boxes.

Here is a link to what will be the Index page of my redesigned website: http://creekwoodbc.org/cbc_test.php. Please check it out and give my your feedback regarding its attraction and "user friendly" qualities. You can compare it to our current Index page by viewing this link:http://creekwoodbc.org

I know I still have a lot to learn about using these codes, but I think that this new setup will be a lot easier to manage than the current one. I look forward to your feedback.

iamcam
Thu., Sep. 15, 2005, 12:55 am
Hi Bob,

What you probably meant to say in the title was a shift from HTML-only to CSS & PHP. Either way, I think this is a good start. One thing I would do is put the main body in its own box (<div> tag), and maybe the navigation in a second, so you have clear divisions not only between the content and nav (which you already do), but also the content and the rest of the page. If you need ideas, check-out http://www.csszengarden.com/. You don't have to copy all the fancy schmancy things they do, but there are a lot of great examples of how to layout basically the same items you have. With those in place you could try adding a few more styles to your existing design.

I would also change the color of the link hover. It's kinda hard to see once the mouse moves over the link. Perhaps a slightly darker or slightly lighter shade of blue would serve the design well. Another thing i've noticed is that the font size and weight aren't consistent across all the pages. Some have large text, others small, some bold, others not. I realize those are existing pages, but it's something to keep in mind.

Finally, if you're looking for some good photos to help spice-up the site, you can try the free stock photo site: http://www.sxc.hu/ (stock.xchng), or very cheap iStockPhoto (http://www.istockphoto.com/).

~Cameron

mrbelfry
Thu., Sep. 15, 2005, 4:32 am
The navigation on the left instead of the top is much better on the new site. I agree with Cameron - the hover text is hard to read on the links. Also from looking at your html you have a mixture of html and xhtml i.e. sometimes you do <br> and sometimes you do <br /> -> you should pick one (probably <br />) and stick with it

Bob96
Thu., Sep. 15, 2005, 9:12 am
iamcam says "put the main body in its own box (<div>tag) and maybe the navigation in a second".

The content for the navigation menu is in its own PHP include file as is the content for the #footer. Each of the basic sections of the format have been designed with their own configurations. I don't know how to make them anymore their "own" boxes.

I agree that the color of the hover link is not very good, but I've tried orange, gray, and aqua. I'll try light blue.

I agree that the fonts on my current site are not consistent, but the fonts on the new site should be. They are set in the CSS rules.

I'm not sure how to use the <BR> tag. Apparently this tag doesn't require the use of any closing tag, but when I don't insert the closing tag <br/> the text isn't appropriately formatted. I'm still trying to learn which tags to use to separate statements without putting an excessive amount of space between them. Some space helps, but too much space disconnects.

Thanks for your suggestions and feedback.
Bob

mrbelfry
Fri., Sep. 16, 2005, 2:33 am
The <br> tag inserts in a line break in a document and starts the text after it on a new line. The <p> tag will add spaces around the top and bottom of the text. You don't need to close a <br> tag using HTML nor do you need to close an <img> tag however in XHTML (which is kind of like HTML tidied up - and which most people recommend using to 'future-proof' your site) all tags MUST be closed. To do this on tags that don't have a pair such as <br> and <img> you just add a / at the end of the tag ie. <br />

flutem3
Fri., Sep. 16, 2005, 11:40 am
Hello to everyone,

Re: the above. I have just begun to learn some html...I mean absolute beginning. However, I am wondering if it is worth my energy to do so.

I have the time, and brain (I think, at least Mr. Belfry doesn't want me to sell myself short. :) ). What I am short of is physical energy. I cannot, for example, work hour after hour at the computer. I have to do it in hitches of an hour to an hour and a half. And I also know that you have all said that it is the content that ends up on a website that is important.

Can somebody give me really compelling reasons to spend the time and energy I will need to spend to learn html and CSS? I know that my file pages would be "cleaner" and load more quickly. What else?

Thanks.

Carol

cwgraves
Sat., Sep. 17, 2005, 12:10 pm
Can somebody give me really compelling reasons to spend the time and energy I will need to spend to learn html and CSS?You have to use html to create the pages, but it is not necessary to use CSS. If you are using Frontpage or Dreamweaver or some such tool to create your pages, you don't need CSS. If the site is simple and doesn't change too often, CSS does complicate things.

If the site is large, CSS does help organize it. If the site is not large, CSS is not necessary.

Personally, I use CSS, but when I first started doing web pages, I didn't use CSS. I used Dreamweaver to create and edit my pages and just used the word processing like interface to set the font sizes, colors, etc...

Hope this helps.

flutem3
Sat., Sep. 17, 2005, 12:44 pm
Curtis wrote:

"You have to use html to create the pages, but it is not necessary to use CSS. If you are using Frontpage or Dreamweaver or some such tool to create your pages, you don't need CSS. If the site is simple and doesn't change too often, CSS does complicate things. "

Hi, Curtis,

I actually don't use the html to create our pages. The software uses it. That is why I am looking for a compelling reason to spend the time and energy.

From what I know at this time in my web designing life, I am able to do what I want to do with the Homestead software. I have no idea if it is similar to anything else because I haven't seen any other kind...except for an old version of Dreamweaver which I couldn't make heads or tales of.

Right now, I have 1st Page downloaded. It intimidates me no end; however, I managed to put together a short bit of html and then could see how it looked.
That is how far I am. And it has taken me quite some time to get there. I keep forgetting the order of things. :rolleyes: And when the code isn't properly done, it doesn't work right.

But the question still remains. Is it worth my time and effort to do this? I still don't know. With the Homestead software I don't need to know one iota of html. However, there are some limitations. One that I don't like is that they have fixed fonts. That is one reason so much of the material on our site is written in larger fonts than I might normally do. However, I use fonts which are comfortable for me to read since I have lousy eyes. I don't want people to have to stick their noses on the monitor to read what is there.

Another rather curious point for you...I have not ever worked on any computer other than my own!!! Weird, don't you think? I am not around another computer, and I had never touched one until I bought one. I had not even been able to watch people because of the CRT monitors and the "wiggle" which bothered my epilepsy. But an LCD monitor works great.

I hope Notre Dame wins again. They look good and so do the Buckeyes even though Texas beat them. I really enjoy college football. I miss my dad because we didn't have a whole lot in common...but we did have football.

Carol

David Gillaspey
Sat., Sep. 17, 2005, 12:53 pm
Can somebody give me really compelling reasons to spend the time and energy I will need to spend to learn html and CSS? I know that my file pages would be "cleaner" and load more quickly. What else?The problem with discussions about CSS is that proponents of CSS speak as if it's all or nothing. Your entire site is CSS enabled, or not at all.

I don't feel that has to be the case at all. I say, use the level of CSS functionality with which you're comfortable.

On my website, I use CSS to control, from one central location (an "external CSS style sheet" ? a text file), choice of font, font color(s), and spacing of paragraphs throughout my site. I don't use CSS to control layout (yet).

This is the level of CSS functionality I am comfortable using and for which I have need. Your mileage may vary.

Sincerely,

David Gillaspey
President
Great Church Websites

cwgraves
Sat., Sep. 17, 2005, 4:48 pm
...I am able to do what I want to do with the Homestead software.I have seen the Homestead software, and it will take care of your basic needs.

But the question still remains. Is it worth my time and effort to do this?You're old enough to remember typewriters (it hasn't been too long people!). I can put together a newsletter using a typewriter and people can read it fine. Or I can use a desktop publishing program to produce a colorful newsletter using different fonts, pictures, bold for the headline, etc...

Both will serve the purpose. The difference is the quality and professionalism. The content is exactly the same. (Please don't take this to mean I'm saying your site isn't quality or professional).

Using Homestead, you can produce a very good website, with no HTML skills. However, I believe you can produce a better website using html. There are just things that you cannot do with an editor like Homestead.

cwgraves
Sat., Sep. 17, 2005, 4:55 pm
I don't use CSS to control layout (yet).

This is the level of CSS functionality I am comfortable using and for which I have need.David,

I also don't use CSS for layout (not completely). I have used it to set relative margins and widths of <div> tags or <table>, but not much beyond that.

I try to design for the least common denominator when it comes to browsers and operating systems. Sadly, not all browsers and OS's render the same, even though things have improved. Using plain HTML (sorry, Carol), I can control where my content is placed with no regard to the browser or OS. I test things on different browsers and ask friends with a Macintosh to look at things for me (I don't have a Mac). Once I'm satisfied that I have a happy compromise and things are relatively stable, I publish.

flutem3
Sat., Sep. 17, 2005, 5:28 pm
Curtis wrote:

"Using Homestead, you can produce a very good website, with no HTML skills. However, I believe you can produce a better website using html. There are just things that you cannot do with an editor like Homestead."

Hallelujah, we are getting to the heart of the issue. What is it that I cannot do with Homestead that you can do with what you know...and just how much difference is it going to make to the viewer if the content is good?

I learned to type of both a manual and electric typewriter at the same time. The electric ones were the height of technology at the time. This was in 1957. Yes, I remember.

Carol

flutem3
Sat., Sep. 17, 2005, 5:31 pm
Curtis wrote:

"Using Homestead, you can produce a very good website, with no HTML skills. However, I believe you can produce a better website using html. There are just things that you cannot do with an editor like Homestead."

Hallelujah, we are getting to the heart of the issue. What is it that I cannot do with Homestead that you can do with what you know...and just how much difference is it going to make to the viewer if the content is good?

I learned to type on both a manual and electric typewriter at the same time. The electric ones were the height of technology at the time. I also learned to drive stick shift and automatic at the same time...and preferred stick shift. I do to this day, but due to other considerations, I use automatic. This was in 1957. Yes, I remember. I also remember how amazed I was at the Univac machine with all of its vacuum tubes, etc.

Carol

cwgraves
Sun., Sep. 18, 2005, 10:46 am
Just so I wasn't saying something I didn't know anything about, I signed up for a trial of Homestead and checked it out.

If you are using the lite version of Homestead, you can only edit the regions or pictures that have been set up in the template you chose when you started the site. If you started with a basic template, there isn't much to work with. This limits the content of the page to only what the template contains. You cannot add additional content sections. You cannot move the content around on the page or resize anything.

If you are using the regular "Site Builder", it makes you download an ActiveX control and the Java Virtual Machine (VM). It installs the program on your local machine and runs every time you want to change your site.

Once you've logged in, you are presented with an editor that allows you to change the content. You are able to add additional content regions and move things around.

It looks like it uses CSS in the background when it generates the pages. You are able to move things around and have items overlap each other.

If you are satisfied with staying within the constraints of the Homestead system, it looks like you can design a site with no html knowledge.

In order to achieve some of the professional looking sites with a full header area, a common trick is to split the larger image into several small images and place each image into an html cell inside a table. This allows us to have exact placement of the images and keep the download time small.

With Homestead, it would be difficult to achieve this type of effect. But in order to do this, even with Homestead, you have to have a graphics program capable of splitting the image into it's smaller pieces. I use Adobe Photoshop, which comes with Imageready for splitting the images.

So, finally, to answer the underlying question: Do you NEED to learn html and/or CSS? After looking at Homestead, I would say "not if you are using the "Site Builder" version of Homestead as opposed to the "Lite" version. You should be able to achieve a very nice web site.

flutem3
Sun., Sep. 18, 2005, 11:54 am
Curtis wrote:

"So, finally, to answer the underlying question: Do you NEED to learn html and/or CSS? After looking at Homestead, I would say "not if you are using the "Site Builder" version of Homestead as opposed to the "Lite" version. You should be able to achieve a very nice web site."

Hi, Curtis,

What a bright man you are!! :D It does my soul good. Thanks for taking the time to find out what I am using. I really appreciate that. I truly do, for most people have not seen what is or is not available. And they make some incorrect assumptions about it as well as nasty remarks.

I have the regular site builder not the lite version. And I have had it since I started. Homestead has just recently introduced the lite version. I wouldn't like that one a bit...especially now. I suppose the difference to you between Homestead and html, CSS is as great as the difference to me between site builder lite and the full-blown site builder.

Curtis, what I am doing right now is learning some html with one of the W3 programs because it manages to explain things so that I understand after a fashion, and there is an area to try the various tags so I can see immediately what is right and what is wrong. It is good because it keeps me from learning incorrectly. I am just working on the extremely basic material, and it is just the place I need to be.

Thanks so much for your interest. Don't be surprise if I have a question or two from time to time. You would not believe the number of people who have offered to help me. It is wonderful. The offers are world wide!!!

What a wonderfully beastie the computer is. Hooray!!

Carol

Bob96
Wed., Nov. 23, 2005, 3:04 pm
It is done for now. My redesigned newly coded website can be seen at http://creekwoodbc.org I think that the textual material is easier to read, the navigation links are easier to change, and the page design is coordinated. I plan to add more pages and features, and will continue to revise my files of codes to improve the display of this material. I'm open to any suggestions that could improve this website. Thanks.

mickmel
Wed., Nov. 23, 2005, 5:32 pm
I like the new look. I was going to give you some advice, but can't find much that needs fixing - kudos!

After some looking, I was able to come up with three minor things:

1 - The text on the front page looks quite intimidating for a non-Christian. I doubt they'd stick around after reading it. "contemporary", "ecumenical", "denominational", "a group of sinners redeemed by jesus", etc. The information there is worthy of being on the front, but I'd use less Christianese language.

2 - On the contact us page, some of the names are linked and some of the titles are linked. Why the inconsistency? Your good use of style sheets makes it easy to tell which is which, but it seems silly to mix-and-match.

3 - At the bottom of the "Sunday Services" page you put "Seekers Welcome". While I'm sure they're welcome there, I doubt they know that they're called "seekers"! :) Again, you might want to back off the Christianese a bit and put something like "visitors welcome" or something to that effect.

Again, nice job with the site!

Mickey

Bob96
Wed., Dec. 28, 2005, 2:04 pm
Michmel wrote:


3 - At the bottom of the "Sunday Services" page you put "Seekers Welcome". While I'm sure they're welcome there, I doubt they know that they're called "seekers"! :) Again, you might want to back off the Christianese a bit and put something like "visitors welcome" or something to that effect.


I did make that change to "Visitors Welcome".

He also wrote:


2 - On the contact us page, some of the names are linked and some of the titles are linked. Why the inconsistency? Your good use of style sheets makes it easy to tell which is which, but it seems silly to mix-and-match.


The reason for this difference is this: in my opinion it is more appropriate to contact some individuals through their names while other might initially be contacted through their titles.

He also wrote:

nice job with the site!


Thanks for the compliment. I'm still seeking to improve the site. Now I'm going to try to improve the page Titles and Meta tags. Should the page Title always include the church's name and location or is that not necessary?

mickmel
Wed., Dec. 28, 2005, 6:25 pm
Should the page Title always include the church's name and location or is that not necessary?
Yes - always! You want to rank well in the search engines on ALL of the pages of your site, so having that info will help. If you have a page about VBS (and your church name and location is on there), you're more likely to come up when someone searches for "vbs your city".

flutem3
Wed., Dec. 28, 2005, 8:19 pm
Mickey wrote:

"Should the page Title always include the church's name and location or is that not necessary?"

Hi, Mickey,

I have our church name, address, etc. at the top of every page we have. Each page has now been picked up by Google as well as some of the other search engines I stuck our site into.

I very much recommend that you title everything that you want a search engine to pick up right at the top of the page or the proper thing will not be "botted." That is my made-up word for the day.

Carol