Message 13 of 27

I guess I'm the "Guru"

Hi all,

I've been developing Web sites since 1996. You can review some of my work inside my company Web site, L.T. Creations, LLC. which you will find is 100% CSS. It's a new design just completed the first part of February 2008.

In 2000 I began using CSS, when I created my company. Since then I have moved far beyond most in that I "hate" using tables and I don't use anything but Notepad to write all of the code for the pages you see and the CSS used to manipulate the code. I don't use "hacks" or "workarounds" for the various browsers. I have learned how to code in such a manner to satisfy all of the top browsers. Because there are so few using anything but Internet Explorer (IE), Firefox (FF or Mozilla), Opera (my favorite), or Safari (sorry Apple...but you failed on that development), I'm not concerned about checking to see if anything else can render pages correctly. However, designing for these top 4 "usually" satisfies 99.9% of whatever someone uses to surf the Internet.

Somewhere in 2006 I moved to 100% CSS Web development and find now that it's "so" much more simple to maintain a CSS site. There is a "huge" advantage to using CSS if you are into Search Engine Optimization (SEO), which I am. I'm also an SEO specialist.

So, here I am. Opening the "flood-gates" by offering my knowledge. I "can" be very technical, but usually I provide information in very easy to understand terminology.

photo of WebGuyTom
Replies 1 - 5 of 11
Yeah, CSS is the only way to go. I did notice that on your completed project page, the pseudo table with thumbs falls apart rather quickly at smaller font sizes. A clearer div after each

straightens things out nicely. A "guru" should know something as basic as that. ;)

.clear {
height:1px;
overflow:hidden;
clear:both;
margin-top:-1px;
}



photo of golinux

5 months ago
Looked a little more closely and thought I'd share a few more observations. I only checked in FF because it's the only browser I have installed on Ubuntu.

While the layout on the completed projects page falls apart at a smaller font size, much more bombs at an increased font size:

1. the text in the header overlaps text in the image
2. the date bleeds down into the page
3. the nav list does not wrap and disappears under the second column
4. the footer text goes out of bounds

In fact most of your sites break quite easily with just a little nudge. Most often it is the header and navigation that suffer. I guess if you're just aiming for the most common denominator, you've achieved your goal. Not "guru" quality, IMO.

Finally, the repetitious keyword linking on the index page is extremely annoying and screams "I can play the SEO optimization" game. Gimme a break!

PS. Fixed width sites at 1024px are also a little user unfriendly. Not everyone keeps their browser maximized, you know. ;)

photo of golinux

5 months ago
I don't pretend to be the guru, but I am also a person who codes with ten wiggly fingers and a brain. In fact, I just put a claw hammer to the style sheet on my profile. It looks a bit rough, but I like the colors and I got rid of that awkward right scroll.

The black borders are to help me keep track of all those floating divs, consider them training wheels. I'll eventually make them thinner or get rid of them when I find a graphic for the #mainbody. There is a reason I like tables with my style sheets. There are things that style sheets simply don't do.

Have you looked at the default style sheet for Eons profiles yet (600 plus lines and counting!)? What do you recommend for those of us whose enthusiasm excedes our meager abilities? How do we best tackle that behemoth?

photo of EileenKramer

3 months ago
If you are a professional developer you know that whatever you do you must consider every possible option that a visitor will use to view a site. Knowing there are an infinite number of possibilities as to how a visitor may have their particular computer set, it's only logical to provide code that allows for "some" changes because it's not possible to provide the exact rendering in every possible scenario. To code so that no matter what settings a visitor uses when viewing a Web site is - impossible.

Viewing in any browser the page to which is referred in the LTCreations site is found the same. More than 90% of the visitors to any Web site use "Medium" text size. Those who would use a large text size would do so for one of 2 reasons - either they don't see very well, or, they want to find some fault in the page. If they don't see very well the size they would select is still one that renders the page as intended.
Unless the page in question is viewed at the "largest" text size, the page holds together just fine. So I have to ask, why in the world would you concern yourself (with the screen size and resolution you currently use) as to whether the page holds together at some outlandishly large text size? You don't view a site in that text size normally. Why would you critque a site in other than what you would normally use? As an attempt to try to find fault with a design? What's the point?

Could the page have a specific font size? Yes. But do all browsers observe the font size chosen? No. So there "has" to be a happy medium.
With more than 10 years of engineering Web sites I have to say that there will always be someone to point out a failure in a design - whether the failure is truly a failure or simply something that "can be done if..."

To put restrictions on a design means that "someone" won't like it or can't render the site as it was intended. When designing for the masses there are always consessions.
photo of WebGuyTom

3 months ago
Regarding the CSS - you are doing exactly what you need to do in order to see what your div is doing when you add a small border. That shows you the 'box' you have created and where the dimensions are found. When you are finished with your design then you remove the borders.
When you find there is a problem in your design it's often times easy to simply put a border around the div and see where the fault lies.

As far as lengthy CSS coding, there are a couple of things you can do. One is good housekeeping. For each class or ID tag, that's where you have ".atag" followed by { width: 20%; } which will contain all of your attributes for the tag you specified, keep everything from the opening { bracket to the closing } bracket on one line. Then you can easily find each class tag, go to the attributes for that one tag and manage it as you wish.
Generally, you will see a class tag then bracket and a line for each of the attributes. It's not necessary to do that and it's a pain to find things when you have a large CSS style sheet.

Another solution would be to use more than one style sheet. There is no limit to the style sheets you can use in a page. However, since I haven't spend any time "playing" with the Eons system I don't know how they've arranged things. I have been asked to help, so I will bring this to their attention. My suggestion would be to allow additional style sheets created by each individual who wishes to alter something. That way you could create your own class tags and styles without worrying about what Eons has already created in order to render the basic pages.
Does that make sense?

Users who want to create their own page styles should be able to make changes by using a clean style sheet as opposed to working within the one that Eons created. This is not something the user would do but something Eons would allow within their system.

I hope this helps.
photo of WebGuyTom

3 months ago
Replies 1 - 5 of 11