Understanding HTML5 and Web Design
HTML is the foundation for web pages. Your browser parses and translates the HTML code created by web developers and displays the code in the attractive page you see as a web application. HTML5 is the latest iteration of the language's format and syntax. HTML5 deprecates some older standards such as framesets, but the new syntax introduces some useful content tags such as "video" and "audio." This article gives you an introduction to HTML5 and the language in general, so you can get started with web design and programming.
How the Web Works
The Internet is one large network of computers. These computers mostly serve web-based content (HTML pages), but there are other types of computers networked on the Internet. Each computer (or server) is given an IP address. The Internet works with IP addresses to identify your website's server from millions of others. However, typing IP addresses into a browser isn't user-friendly. The friendly URL or website address you type into your browser is translated to an IP address using servers called name servers or domain name systems (DNS). Once the address is found on the Internet, the web server sends back an HTML-formatted page. This HTML code is translated using a web browser, and that's how you can view images, layouts, content, and videos on the Internet.
The Difference between the Internet and Web Browsing
When you first start out in web design, the Internet, web browsing, and the technical side to networking can be confusing. The Internet, as we said, is a network of computers. These computers can be servers, printers, routers, switches, and other forms of hardware (both virtual and physical) to communicate. You can also keep computers private behind a firewall to protect Internet traffic from entering a private network.
The Internet is sometimes called "the Web," but web browsing is different than the actual Internet. Web browsing is the term given to a web server providing browsers (Chrome, Internet Explorer, Firefox, for example) with content. You can think of the Internet as a library of content disbursed throughout the world. A web browser is the reader that lets you read the content stored on the Internet. Using HTML, you create that content in a presentable format. If that format is broken, the web browser cannot determine how to format and display content. For this reason, it's important that you write proper syntax when you create your web page HTML5 whether it's created dynamically through a back-end language or you write static pages that do not change.
Web Page URLs
Now that you understand how web pages are displayed in a web browser, you should also understand how a URL works. A URL is the address you type into the address bar. The domain is the basic address for your site (remember, the domain name is translated into an IP address). Your domain contains directories and files. The directories categorize and organize your site, and the pages are the physical files that contain your content.
URLs can also contain querystring variables. A querystring variable is a dynamic value that helps you display content dependent on input. When you see website URLs that contain a question mark ( "?" ) in the address, the variables contained after the question mark are querystring values. For instance, you might only want to show blue widgets after the visitor clicks a specific link. You could use a querystring variable such as "color=blue" after the question mark in the URL. The following is an example of a URL with this querystring variable.
You can use multiple querystring variables using the ampersand ( "&" ) to combine them. The following URL uses both the color variable and the size variable to determine what widgets to display to the reader.
What Does a Web Designer Do?
What Do You Need for Web Design?
There are several tools on the market for web designers. You should first learn to recognize and work with HTML syntax before using any kind of tools that automatically create syntax. There are two major web design software on the market: Visual Studio and Dreamweaver. Visual Studio is a Microsoft product and is mainly used with .NET websites. Dreamweaver is a visual tool that helps designers create websites, and it's mostly used with PHP. Of course, there are other tools on the market, but these are the most popular. Most designers have a copy of Adobe Photoshop for editing images. You should also have a CSS editor handy. Notepad++ is great for editing several languages including CSS.
What Should You Learn?
This class focuses on HTML5, which is the basic syntax and language of the web. However, you should learn several other languages when you want to work in the web design world. First, a dynamic back-end language is useful. If you prefer to work in a Linux environment (Apache), it's best to learn languages that are native to Linux such as PHP. PHP is also used with pre-package software such as Joomla and WordPress, so knowing this language will help you build designs for these type
- How to Create a Simple Web Page with HTML5
- HTML5 Videos and Graphics
- How to Build Web Page Layouts with CSS
- A CSS3 and HTML5 Introduction to Responsive Web Design
- Using HTML5 to Add Styles and Classes to Your Web Pages
- Applying Basic Character Formatting in Adobe InDesign
- How to Paint in Adobe Photoshop
- Adobe Captivate Tools Pointer Paths, Highlight Buttons, and More
- How to Work with Symbols in Adobe Edge
- Adobe Premiere: How to do Color Correction
- Starting to Use Microsoft Visio 2016
- Working in Your Workspace in Adobe Photoshop InDesign
- User Agent Values in jQuery
- Understanding the Basics SQL
- Adobe Premiere: Organizing Your Media in the Project Panel