7/29/2013

Syntax and coding it is labor intensive

Like almost every programming language in the known world, HTML, JavaScript, Flash and CSS have their own respective syntax, which if coded incorrectly can result in your project either not displaying correctly or at worst not displaying at all.  but just what is meant by Syntax and why can it bee considered so Labor Intensive anyway?

Merriam-Webster describes Syntax as a noun meaning

1 a : the way in which linguistic elements (as words) are put together to form constituents (as phrases or clauses)
b : the part of grammar dealing with this

2: a connected or orderly system : harmonious arrangement of parts or elements <the syntax of classical architecture>

3: syntactics especially as dealing with the formal properties of languages or calculi

with the origin of the word being either of Middle French or Late Latin and likely evolved from Sintaxe (Middle French) or Syntaxis (Late Latin)

So, now that we have established the history and meaning of the word, just why is coding it in each of the languages so labor intensive anyway?

Well the fact is, with basic combinations of HTML and CSS Language a person has to use the two to communicate with each other, HTML telling the Web Browser where to put a detail, CSS telling the Web Browser how the detail is supposed to look. for example, look at the code below ( in order to position an image)

with the HTML, a web design keys in the following:

<img src="folder/file.ext" alt="filename" height="size in pixels" width="size in pixels">

this breaks down as telling the browser to look for a image file (img) at the source (src) location  with a specific title and extension (file.ext) and that the file should be a specific size height and width wise with a name that displays if the image can not be found.  Depending on the location of where this line of code goes the Web Browser will display the image on that area of the screen.

Now with the CSS File we can add style to this image, for example:
#sidenav img{background:#000000; padding: 5px; margin:auto; float:left:}

this information tells the Web Browser that our image file (img) is located in an are called the sidenav.  It goes further into detail by telling the Browser to put a black background behind the photo with 5 pixels of spacing around the image on each of its 4 sides and to align the image in relation to everything else but if there is text the image will flat to the left wrapping the text around it.

This syntax has to be 100% correct in it's Syntax or errors can be returned and hours of recoding needing in order to properly display the items correctly.

No comments:

Post a Comment