HTML Basic Concept

An overview:

  • HTML provides the basic structure of sites, which is enhanced and modified by other technologies like CSS and JavaScript.
  • CSS is used to control presentation, formatting, and layout.
  • JavaScript is used to control the behavior of different elements.

Now, let’s go over each one individually to help you understand the roles each plays on a website and then we’ll cover how they fit together. Let’s start with good ol’ HTML.

HTML

HTML is at the core of every web page, regardless the complexity of a site or number of technologies involved. It’s an essential skill for any web professional. It’s the starting point for anyone learning how to create content for the web. And, luckily for us, it’s surprisingly easy to learn.null

Let me show you what I mean. Take a look at the article below. If I were to ask you to label the types of content on the page, you’d probably do pretty well: There’s the header at the top, then a subheader below it, the body text, and some images at the bottom followed by a few more bits of text.

magazine-page-example

Markup languages work in the same way as you just did when you labeled those content types, except they use code to do it — specifically, they use HTML tags, also known as “elements.” These tags have pretty intuitive names: Header tags, paragraph tags, image tags, and so on.

Every web page is made up of a bunch of these HTML tags denoting each type of content on the page. Each type of content on the page is “wrapped” in, i.e. surrounded by, HTML tags.

For example, the words you’re reading right now are part of a paragraph. If I were coding this web page from scratch (instead of using the WYSIWG editor in HubSpot’s COS), I would have started this paragraph with an openingparagraph tag: <p>. The “tag” part is denoted by open brackets, and the letter “p” tells the computer that we’re opening a paragraph instead of some other type of content.

Once a tag has been opened, all of the content that follows is assumed to be part of that tag until you “close” the tag. When the paragraph ends, I’d put a closing paragraph tag: </p>. Notice that closing tags look exactly the same as opening tags, except there is a forward slash after the left angle bracket. Here’s an example:

<p>This is a paragraph.</p>

Using HTML, you can add headings, format paragraphs, control line breaks, make lists, emphasize text, create special characters, insert images, create links, build tables, control some styling, and much more.

To learn more about coding in HTML, I recommend checking out our guide to basic HTML, and using the free classes and resources on codecademy — but for now, let’s move on to CSS.

 

5.800 comments

  1. harga jam tayang

    Very rapidly this web site will be famous amid all blogging and site-building users, due to it’s pleasant posts

  2. crime scene cleanup texas

    I am not positive where you are getting your info, but great
    topic. I needs to spend some time studying more or understanding more.
    Thanks for great info I used to be searching for this information for my mission.

  3. Cheap VPS servers in egypt UK and US

    naturally like your website but you have to check the spelling on quite a few
    of your posts. A number of them are rife with spelling problems and I to find it very bothersome to tell the truth on the other hand
    I will certainly come back again.

  4. create logic

    I all the time emailed this webpage post page
    to all my friends, since if like to read it then my links will
    too.

  5. daftar sabung ayam s128 uang asli

    Hi mates, how is the whole thing, and what you would like to say on the topic of this
    post, in my view its truly awesome in favor of me.

  6. 메이저놀이터

    Good day I am so happy I found your webpage, I really found you by mistake, while I
    was browsing on Bing for something else, Anyhow I am here now and would just like to say kudos for
    a marvelous post and a all round entertaining blog
    (I also love the theme/design), I don’t have time to browse it all at the minute
    but I have saved it and also added in your RSS feeds,
    so when I have time I will be back to read much more, Please do keep up the fantastic work.

    my web blog: 메이저놀이터

  7. 토토사이트 추천

    Hi there to every one, the contents existing at this web site are genuinely remarkable for people knowledge, well,
    keep up the nice work fellows.

    Review my blog – 토토사이트 추천

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *