Its FINALLY UP!

Try working through the validator errors. I realize they can be a bit cryptic until one gets used to them. I’ll do my best to explain them.

https://validator.w3.org/nu/?doc=http%3A%2F%2Fjimgwilliams.com%2F

  • Error: CSS: font: tahoma is not a font value.

This should either be changed to font-family, or if you want to use the shorthand put the required font-size in with it.

  • Error: No space between attributes

This simply means that attribute="value"attribute="value" should be attribute="value" attribute="value"

  • Error: Bad value 220px for attribute width on element img: Expected a digit but saw p instead.

Unlike most “height” and “width” values where a length unit is needed, <img> tags are different in that pixels are assumed and the attribute values should be integers without a length unit.

  • Error: An img element must have an alt attribute, except under certain conditions. For details, consult guidance on providing text alternatives for images.

This is a usability thing. If for some reason an image fails to load, or a user is using a screen reader, the alt value lets then know what’s there.

  • Error: No p element in scope but a p end tag seen.

This is a not well-formed nesting error. Perhaps the one single error that is most likely to cause problems. You should make it to be more like <a><img></a> or <p><img></p>. The point is that except for self closing tags like <img> or <br> etc. for every start tag there should be a corresponding end tag. And nesting should not overlap. eg. Not <p><a></p></a> but <p><a></a></p>

<a><img class="me"src="me2.jpg"width="220px" height="220px"> </p>
4 Likes

There are also a few malformed anchor tags in the Blogs page which need addressing.

<a href="https://bluffcityblast.wordpress.com/2018/07/08/memphis-and-the-mississippi/">Memphis and the Mississippi<a>

There needs to be a slash in the closing tag, otherwise it’s another opening tag and anchors can’t be nested.

<a href="https://bluffcityblast.wordpress.com/2018/07/08/memphis-and-the-mississippi/">Memphis and the Mississippi</a>
3 Likes

As I told you use margin on the left and right to get de desired result

Hi there lombardy160,

check out the attachment, which contains a responsive reworking
of your home page and basic templates for your other pages. :winky:

lombardy160.zip (26.3 KB)

coothead

1 Like

I used the w3 validator, there’s probably a bunch out there, and no telling what problems they will find. It was just a vaildator I used, based on numerous referrals, coming from instructors and books alike. It was quite gentle with it, relatively. This is the very first site I have ever put up, so I have a LONG way to go to get a great one up, but it was a good start, I thought.

Thanks for pointing that out! Fixed it.

I have NO idea what you are talking about. What specific issue is involved here, and where in the code is it?

The error message says “no space between attributes” though it might be clearer if it was “no space between the quotation mark of the prior attributes value and the name of the next attribute”

Please post the URL to the validator that you used.

Fine, but there are techniques other than massive amounts of fixed padding and margins to accomplish that responsively.

Then get control of yourself. You don’t have to be one of them. :eek:
You’re fighting the wrong war. Recalcitrance is futile. Surrender yourself to assimilating modern methods. :slight_smile:

Take a different author’s class. A person does not learn everything about a subject or skill by reading one book or taking one internet class. You know that. So do we. High School is where one learns the basics then goes on to College (or a trade school) where he builds on the High School basics to advance his knowledge to a professional level.

Properly written web sites work just fine on the vast majority of devices.

You CAN do it… and we will be glad to help you throught difficult spots, but we cannot learn HTML and CSS basics for you. sdesole

Opinion: If you do not enjoy learning or do not have the ability to approach problems with the optimistic, solution-seeking, logical attitude of an engineer, then you are trying to shoehorn yourself into the wrong career. It won’t be fun.

2 Likes

Your next mission Jim if you choose to accept it:

https://search.google.com/test/mobile-friendly?id=QFLpDoXOLBOpselPSxndjA

The W3C Validator gives this error, which shows you where in the code the problem occurs:

no-space

In your code, you have this:

<img class="me"src="me2.jpg"width="220px" height="220px">

class=" ", src=" ", width=" " and height=" " are all attributes of the image tag <img>. They each need to be separated by a space, which the first three are not, in your code.

<img class="me" src="me2.jpg" width="220px" height="220px">

Often, the errors which the Validator picks up are simple typos, which are easy to overlook when reviewing your own code, but which can prevent the site displaying correctly. Learn to look on the Validator as your best friend - not afraid to point out your errors, but always with your best interests at heart. smile It’s also the case that fixing one error often has a knock-on effect and removes several others, so fix a few and then revalidate to see what’s left, rather than trying to do everything in one go.

2 Likes

My comment in post #27 is in error.

 font:tahoma, geneva, sans-serif;  /* either relocate before "font-size:" or  change to "font-family:"  */

It should say:

 font:tahoma, geneva, sans-serif;  /* change to "font-family:"  */

My apologies to anyone who was misled by the error.

1 Like

Hey,

I would recommend you take a online course in HTML & CSS to help you with your website. I have noticed that the site is not mobile friendly at all.

I would recommend looking into bootstrap or something similar.

Hi there joey13,

the O.P. does not need “Bootstrap” in any shape or form. :unhappy:

The attachment in post #44 makes his site responsive with
extremely simple “Vanilla CSS”. :winky:

coothead

4 Likes

I do apologise I must of missed that post. Good job with that!

Personally I use Bootstrap so thats why i recommended it, maybe I should learn to just use Vanilla.

1 Like

It’s a matter of personal preference, but it is a good idea to understand vanilla in any event. That way you understand better how Bootstrap works and have a better idea when or when not to use it.

3 Likes

@coothead. He indeed doesn’t need Bootstrap, but maybe in this case Bootstrap is not even a bad idea. And vanilla is a framework as well. So it’s all about what your favorite is

Hi there donboe,

Come on, the O.P. only has a one column top to bottom site. :winky:

coothead

2 Likes

@coothead. Hahaha. I know. But in this case it’s not a bad idea at all. He can even download a one column top to bottom template from there