• Coffee House
  • Dagnabbit! So now I've got to learn XHTML, Doctypes AND CSS?! UURRRGH!!! (p.3)
2014/08/29 14:25:19
dubdisciple
Beepster
This is great stuff, guys.
 
Now here's a question. Considering CSS seems to be bulkier than HTML tags does it use extra bandwidth? Does it consume extra resources on the end user's system?
 
 



 
The answer is actually the opposite.   I hope this does not sound confusing but think of it like this:
 
Every page styled via HTML codes requires tags for every formatting choice (color, position, font, etc) and then multiply that by every pade of that site.  For a massive site like a blogging site that means repeating the exact some code and adding that weight for every page.  With css you could theoretically define all the major formatting with one set of instructions to be applied across the page and every page for that matter by specifying once.  The larger the site, the more time and bandwidth you save. 
2014/08/29 14:25:36
dubdisciple
looks like sharke beat me to it
2014/08/29 14:35:37
Beepster
Well that is definitely a point score for CSS. Thanks for the info, guys.
2014/08/29 15:41:05
soens
craigb
Basically, I'm just doing a lot of scratching for very little scratch. 



2014/08/29 16:17:43
gswitz
Css3 does use extra resources on the client machine in exchange for less bandwidth for both parties. This is especially true when coupled with something like bootstrap.js.

I find bootstrap very helpful for using css3.
2014/08/31 12:34:49
Beepster
Thanks, Geoff (sorry for the late reply... been immersed in all this). I haven't touched CSS3 yet but now after a day or so of "studying" I have a basic understanding of CSS and how it relates to HTML (and now understand HTML/XHTML better). Still annoying that I have to learn a whole new thing (CSS) but I can definitely see how it's useful.
 
If anyone is curious after poking around at a bunch of confusing vids and websites this is the video that has made it click:
 
https://www.youtube.com/watch?v=BxUv_n3T7n0
 
It is almost 5 hours long and the guy is kind of a clownwad but it is extremely thorough (as far as basics) and the little bits of comic relief certainly made it far less dry than it could have been.
 
Between that and these two references...
 
http://www.w3schools.com/tags/ref_byfunc.asp
 
http://www.w3schools.com/cssref/default.asp
 
as well as the related tuts/articles on that site I think I should be able to do 99% of what I need to at the moment.
 
One thing however that is annoying me is even though I can change my bulk layout or formatting by tweaking a CSS file it doesn't seem like I can change bulk content.
 
For example:
 
1) Let's say I want to have a banner area for ads. I don't want Javascript or to just have google tossing up whatever the frack they want. I want to just have it as a space where a sponsor can give me X amount of dollars and then I post a link/image directly into my code that leads to their site. It should subvert adblockers, not cause viruses or stupidness, I can control the content (so I'm not leading viewers to a company I don't like or putting up ads that look ugly), etc...
 
I just want to be able to paste an image link up there and have it show up on all my pages. If the sponsor changes or updates their graphics or whatever I can just strip out the old code and toss in new code and it will appear on all the appropriate pages.
 
2) If I have headers, sidebars and footers where I have navigation links that I want to have appear on every page so people can get around easily I'd like to be able to update those as the site grows. Like when I first start I'll only have five main links in those areas but as it grows and I create new areas I end up with a dozen links I'd like to again simply strip out the code for those elements (like the sidebar for example) and replace it with the new code without doing it for every page.
 
Now I'm hoping that this can be done WITHOUT using anything beyond HTML and CSS. Like maybe those banners, headers and sidebars could simply have a code that points to it's own little page (just like an external CSS page would work) and then the data from that one page loads into those areas on all pages of the site. Kind of like a webpage within a webpage I guess.
 
Is that just more advanced usage of CSS/HTML or am I stuck with either using other programs/languages (Java, PHP, whatever) or simply stuck as in I have to change nothing or everything manually a page at a time?
 
Hope that makes sense... and yeah, I shouldn't be asking you guys to teach me webdesign but it seems like we've got some experienced dudes here and it's on my mind so would like to know if that's possible and if not what exactly I should be looking at next to accomplish it.
 
So far that little dilemma is the 1% out of the 99% that HTML/CSS does not seem to cover at the moment and it's making my OCD go all wiggy. lol
 
Cheers and thanks for all the insights so far even if this doesn't garner any more attention. I'm sure I'll figure it all out eventually.
2014/08/31 13:20:15
Beepster
Oh and another nice thing about that vid is the guy uses Notepad++
 
I had heard of it and seen it recommended (and have had it recommended to me personally) many times but to me I was just "Meh... I'd rather be a stubborn dillwad and makes things harder for myself so I learn the HARD way!!!"
 
Now that I see how it works and how it allows collapsing of tags and stuff I gotta say I think that would be far more helpful for even learning purposes... never mind the convenience.
 
It'll also be an excuse to install and try out Wine on Linux because it is MS only. I know there are similar Linux based programs and I may try them but I'll probably be doing this stuff on both Windows and Linux systems so might as well use something that will work on both (which the Linux ones won't unless I use and set up a virtual PC which I'm not interested in for this). I figure I can use a flash drive to store my work on, make sure I have the installer for Notepad++ on it then I can just work from/save to that flash drive on whatever system I want (installing NP++ as needed) and then back up the flash drive every so often.
 
Just thinking out loud. Cheers.
2014/08/31 16:01:46
dubdisciple
Beepster. It sounds like what you would like falls outside the bounds of xhtml and css. Maybe someone knows a workaround using just those two, but ifbit were me and I wanted to have dynamically changing banners and such, I would go with some scripting and database based solution. This just takes the idea of seperating content data from layout another step. With today's large constantly changing websites, having to constantly alter HTML manually would be next to impossible. Building the sight based on a procedural semantic system would allow you to create sections like footers and headers and still use something like php to alter the content as needed.
2014/08/31 16:09:43
sharke
In the case of the banner ads, you can encapsulate the ad into a CSS style which can apply to every page. When you get into this you'll see that there are HTML tags called "div" which basically define an area on the screen for whatever purpose. In the CSS, you can apply a class or an ID to these div's which specifies the image file to be used as the background. So when you need to replace an old banner with a new one, it's simply a matter of changing the image file name in the CSS style. I'm not sure if you can specify the link in the CSS as well, it's been a while since I've worked with it, but I'm sure someone else can tell you how to go about this.
 
As for the navigation links, well you have a number of options. One way of doing it would be to use a simple PHP script - PHP is actually quite simple and you can learn how to incorporate it into a web page or a day or two. Even if you don't want to learn the language then you can learn how to incorporate ready made scripts into your pages. Some years ago I wanted to include a Wordpress blog on my site (i.e. install Wordpress on the server and style it all to fit my website design rather than use a Wordpress template) and found that I had to learn a little PHP to do it. It was actually quite simple - PHP isn't that much harder than HTML or CSS and you don't have to learn the whole language to make use of it.
 
But there is an even easier way - use the search and replace function in Notepad++. You can paste the old navigation menu HTML into the "search" field and then paste the new navigation HTML into the "replace" field. Notepad++ will then go through every page in your site and replace the old links with the new links. It's easy, you'll work it out in no time.
2014/08/31 16:26:03
Beepster
Thanks, guys. I'm not opposed to learning other stuff (even Javascript which I hate) and will do it. I guess at the moment I figure as I try stuff out in HTML and CSS I'll be doing mock ups of what I actually want to go live. I would hate to create something that is really cool that I want to use, get excited and actually use it for a bunch of pages THEN find out that I need those other languages. If it's totally impossible then I'd hold of for a bit and learn those other things first before even starting to play around.
 
However if notepad++ can actually scour and bulk replace material in multiple docs like that somehow then that is REALLY cool and pretty much solves the problem. I'll have to test it out of course. I never would have known if you hadn't mentioned it.
 
Thanks again, guys.
© 2026 APG vNext Commercial Version 5.1

Use My Existing Forum Account

Use My Social Media Account