Antony's Logo

Antony's pages of stuff

  • Geek Home
  • HTML & Web Code
    • 2d Canvas
    • 3d Canvas
    • Javascript
  • Command Line
    • Windows CL
    • Windows CL Elevated
    • Windows Powershell
    • Unix & Linux
  • Other Stuff
    • Electronics
    • TV & Radio
    • Excel
    • Powerpoint
    • Word
  • Contact

F*@#ing Web Stuff



Things I have got up to.



Web sites! What Web Sites ?

Once Upon a time I knew nothing about HTML or web stuff.

In the beginning

Roll back to Christmas time 2009. I have always been interested in technology and computers and stuff and thought it about time I got my head around the web.

Those were the days

I guess in the early 2000's I largely ignored social media and then mid 2000's slowly I joined Myspace, Friends Reunited etc and even now continue to regularly follow on Facebook, Twitter Instagram etc.

WTF. It seemed like everyone was on the web or even were getting their own web pages and I wanted to understand what the phenomena was about.

  • How does a web page work?
  • HTML! So what is html?
  • what is PHP?
  • How do you host a web site????

How does a web page work?

So where do you start? As I did not have a web site and I wanted to learn how to create a web page. I guess, I needed an idea or excuse to get started.

At work I was storing lots of data and engineering information on my hard drive! So I thought... What if I could come up with a way to display all this info! Maybe that would be a way to start.... Small steps and all that stuff.

Do I need an Internet Service Provider (ISP)??
Do I need to purchase a domain name??

After short consideration I realised I could use local web pages to perform simple web-related tasks.
Local web pages allow you to create your web applications, photo galleries etc that just run in your browser.
and downloading whole web pages from the internet was also useful for dissecting other peoples websites with the functions I wanted.
and through this enhancing my web development skills.

More recently I moved some of my original web stuff to an ISP. why? because I could!

http://www.telentpa.altervista.org/PA%20Home.html

Over the next few years I have built and developed my web building stuff. Sometimes for fun, other times following requests by others. Check out the following. click and follow links to see full websites

This one was for my friend Ian
https://www.audioart.altervista.org/index.html

This was for me, when I was diagnosed as a Coeliac in 2011
. https://antonysgfstuff.ddns.net/

For when I needed a idea to impress at work:
http://www.acew.x10host.com/Slideshow/index#/spam

When looking forward to my holidays:
http://www.acew.x10host.com/Holiday/Holiday-France-2016
http://www.acew.x10host.com/Holiday/Holiday-Italy-2015

For when I was researching Webrtc:
Note this now only works with Firefox and IE as in Chrome now the getUserMedia without secure SSL certificate (https) is deprecated. http://www.acew.x10host.com/V3_webrtc/webcam.html

And for when i want to go home!
http://www.acew.x10host.com/traffic-1.html http://www.acew.x10host.com/traffic-2.html http://www.acew.x10host.com/traffic-3.html

HTML! So What is HTML ?

HTML stands for Hyper Text Markup Language

HTML is a kind of text file used by Web browsers to present text and graphics.It all starts with opening a text file formatted and saved as .html. (I use Notepad ++, this also applies format so you can more easily see if your html is correct and test its compliance using https://validator.w3.org/.

At the top of the document type the html5 DOCTYPE Declaration <!DOCTYPE html>

next we have the HTML Element <head> which is a container for HTML metadata. Metadata is data about the HTML document. this is closed with </head> Note Metadata is not normally displayed.

Every HTML document needs a title. To display the title text, the title text is preceded by the start tag <title> and ends with the matching end tag </title>. The title should be placed near the beginning of your document in the HTML Head element .

Now for the <body> element which defines the document's body. Contents of the HTML document, such as text, hyperlinks, images, tables, lists, etc. can be placed here.

The <p> tag defines a paragraph and </p> to indicate the end of a paragraph. Browsers automatically add some space (margin) before and after each <p> element. The margins and other all other sytles can be modified with Cascading Style Sheets (CSS)

The <footer> tag defines a footer for a document or section. there can be multiple footer sections in a document each one must be closed with </footer>

Remember as with most elements the document body and html they will need to be closed with the matching end tags </body> and </html>.

<!DOCTYPE html>
<html>
<head>

	  This is for document's metadata
  <title> This is where you place your document <title>
  
</head>
<body>

  This is for document's content

</footer>

  This is for a document's footer

</footer>
</body>
</html

Head

Metadata can be useful , apart from the title,

  • specify your character set <meta charset="UTF-8">
  • One thing I found out was that tabs are not recognised in html but there was no easy way to replace these if you want spaces in your text you could try using:

    • &ensp;  The en space is about the width of two normal spaces
    • &emsp;  The em space is about the width of four normal spaces
    Really the best solution I found is to style your text in CSS with reference to a margin or something similar


PHP ?

PHP is a different language than HTML5 and I have only used it when I came to implement my contact for so I cuurently have not put together much to say about this.
PHP code works on any browser, and is a little more secure than client-side code.

  • A PHP script starts with <?php and should end with ?>:
  • Escape an apostrohe (') using a backslash (\)
  • As with js comments are preceded by // for a single line or preceeded by /* and ended with */

by Ant Monkey on Juice © 

Website Security Test