Trying new Programming Software and HTML – Mad Scientist

Previously, I have been using Dreamweaver as my standard coding program. I’ve been using Dreamweaver since my first year of university but I’ve never been the biggest fan of it. So, time to try out some new programs.

When I first taught myself HTML, I used an old library book and notepad on an old Windows XP machine. While I know notepad can still be used, I want something that can still recognise Syntax’s to help out a little when I may type a word slightly wrong. A common problem of mine. And that can easily run on my computer without slowing everything else down. With Adobe products, I find they take up more power than needed.

There’s one program I have heard of before and used slightly, so I think I will give this one a try. Notepad++

Screenshot (162)

Downloaded the software, very easy to install and fast loading. Upon opening the software, I’m a little lost.

Screenshot (163)

I opened a new file and tried to type something simple in JavaScript. The website refereed to the software’s ability to recognise syntax and give suggestions, but I couldn’t see any of that. After looking around a little, I found that in the language setting up above, I can change the coding language and this activates all the little things like syntax recognition. The ‘run’ function is much simpler with plenty of options. At first glance, I think I may prefer this software to Dreamweaver, though admittedly there are things I’ve gotten far too used to. Such as a live coding view.

While I know HTML, I think it will be worth going back and relearning the software from the ground up again, as it has been a while since I’ve used it.

HTML stands for “Hyper Text Markup Language”.

photo-07-02-2018-14-22-02.jpg

<!DOCTYPE html> – Declaration at the beginning of the code to tell the computer what kind of document it is, in this case, HTML.

<html> </html> – Beginning and end of HTML code.

<h1> </h1> – Heading size 1.

Photo 07-02-2018, 14 34 18

<head> </head> – Contains the metadata for a webpage. Metadata is information about the page that isn’t displayed directly on the webpage.

<title> </title> – The browser displays the title of the page because the title can be specified directly inside of the <head> element by using a <title> tag.

The title appears in the tabs at the top of your browser. Like this:

Screenshot (164)

<body> </body> – The main body of the webpage.

So, the basic layout of a webpage looks like this:

Screenshot (165)

<p> </p> – Paragraph tags.

This does all feel very repetitive, but the point is to refresh my mind…

<br /> – Line breaker. when put into a paragraph tag, it separates the text into two lines. Example: <p> Line One <br /> Line Two </p>

– Div boxes allow for code to be placed in “a box” within the body of the code.

Screenshot (166)

Commenting! The most useful tool imaginable. To comment something out, for example a paragraph. Use:

<!– <p> this is being commented out </p> –>

 

Advertisements

What's your thoughts?

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s