Coding Ur Web

Web essentials

HUSH Developer

Groundbreaking people

1 ene 2024

Developer

Want to start a website?

What you need to know about — First Things First

Neither difficult, nor easy. You just need to give it a try.
There are many forums you can count on. Just check what you're going to enter on your website.
Find an everyday problem you want to solve. Code them — and you're good to go.

To the point

If you're looking for an easier and more sustainable option, you can use an editor like Wix's Editor X or Framer. Sometimes it's going to what works and using it to your advantage.
If you're looking for the above, there are times when you'll run into problems that will be solved with a little money on a subscription.

What does a blank page look like?

When loading a website, there are many files that are indexed on the server and interpreted. The text, the style, and things like automations or components that you can interact with and give a plus to the web.

<!DOCTYPE html>
  <h1>Sup Bro</h1>
  <p>No stylized page</p>
</html>

Remember

HTML — The text and content of your website.
CSS — The style and animations of your website.
JS — User Interaction & Experiences.

What does a "basic" website look like?

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="urstylefile.css">
  <title>Ur Web Title</title>
</head>
<body>
    <h1>Sup Bro</h1>
    <p>No stylized page</p>
</body>
</html>

Code Explanation

<!DOCTYPE html> — Standard for interpreting code in HTML5.
<html> — It wraps everything from the document type declaration (<!DOCTYPE html>) to the closing (</html>). It's the fundamental structure that defines your page as an HTML document and tells the browser that what's inside is HTML code.
viewport — It refers to the visible window of your web page in the browser. The meta tag called "viewport" controls how content is adjusted and scaled across different devices. A well-configured viewport ensures that your page is displayed optimally on both mobile phones and desktops.
<head> — This section stores information about your document, but it doesn't show up directly on the page.
<body> — Everything you want to display on your page goes inside this tag. Text, images, links, videos, you name it!
Like this

<!DOCTYPE html>
<html lang="en">
<head>
  <!-- Here are the settings, CSS links, etc. -->
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Ur Web Title</title>
</head>
<body>
  <!-- Here's the actual content of your page -->
</body>
</html>

<> to </> — HTML tags are always closed in a specific way. The correct notation is with a forward slash before the name of the closing tag.

<p>Here's ur paragraph content</p>

<link> — It is used to link external resources, such as CSS files, and the attribute.
href — Specifies the location of the file. There is no need for a closing label for <link> in this context.

<head>
  <!-- Other settings go here -->
  <link rel="stylesheet" href="urstylefile.css">
</head>

Bienvenido, hermano

14:00

...

Select Language