Creating a Website Using HTML, XML, XHTML, and CSS
HTML
HTML or Hypertext Markup Language is mostly used to create webpages. HTML is a code made up of small pieces called tags. Tags are small pieces of the HTML code that give commands to the computer on how to format whatever it is linked to. tags begin with a less than symbol (<), then the command is written, then closed with a greater than symbol (>). That is the beginning tag. Next the text it applies to is inserted. Then, the tag is ended with a less than symbol (<), followed by a common slash (/), then the same command code as it began with, then a greater than symbol (>). So, your basic code will look something like this: </(insert code)> Applied Text Here </(insert code)>.
There are so many different things you can do with HTML. You can highlight text (even in different colors), you can make text different colors, you can (Hover Mouse Here), as well as bold face or italicize text. These are just some of the basic modifications that can be created by using HTML formatting. There are even ways to insert images as well hyperlinks. You can link to web pages and use images and links. The possibilities are almost endless when using HTML.
The biggest problem with HTML is that most people do not want to take the time to sit down and learn all of the little codes and specifications. It is very useful when trying to organize webpages once it is mastered. HTML allows users the ability to manage where images, videos, animations, and text formatting are all located. It is a very powerful and useful design tool and something that seems to be somewhat overlooked and taken for granted.
The newest version of HTML is HTML5, which is being created to replace both HTML and XHTML. HTML5 is designed to be simpler and many things have changed or added to the coding for HTML5. The DOCTYPE and character encoding declarations have both changed to be simpler to code. Along with new declarations have come new elements for semantics, controls, graphics, and multimedia because more and more websites are becoming more complex with more information being packed into a website. Some of the new semantic elements include <header> and <footer>, which make it easier for a web designer to indicate where a new page will begin and end. New controls for HTML5 markup language include the date, time, and a calendar to help users be more aware. The biggest addition for HTML5 is the <audio> and <video> multimedia elements, because a multitude of users love to be able to listen or watch something that is useful on the website. This is especially true for e-commerce websites because potential buyers would like to be able to see a product in use, which can be shown through a video. All in all, HTML5 is a newer markup language that simplifies the coding for web designers and also makes their websites more appealing to look at.
A BRIEF HISTORY OF CSS
The way CSS and HTML work together is very much like a Mr. Potato Head toy. The content of the web page using HTML is the potato itself, whereas the stylish customization using CSS is the collection of items that personalize your potato.
To make your website truly stand out, it needs a sense of style greater than what HTML and its ilk can provide. This is where CSSs come into play. CSSs stand for Cascading Style Sheets, and they offer a way to not only specifically style a Web page but even the entire Web site to which it belongs. Before CSSs there had been individuals who created style sheets for their own purposes but thought it unnecessary to publish their developed syntax, believing that each browser should decide how best to display pages to its users. When Web page writers issued complaints that they couldn’t customize more deeply, they were generally ignored, forced to deal with browsers that offered consistently fewer options for the sake of streamlining. To address this, a Norwegian by the name of Hakon Wium Lie offered a first draft of Cascading HTML Style Sheets in 1994. He couldn’t have imagined how popular his development would become. CSSs offer plenty of room for style without being needlessly complicated like some of its rival setups, such as DSSSL. The easiest way to describe what makes CCS stand out as a language is how it works to separate the content of a page from its display. CSS3 is the most popular variation of CSS right now, but number 4 is already growing in notoriety.
XML AND XHTML
Similar, yet very different than HTML, another type of markup language is called Extensible Markup Language, a universal format for structured documents and data on the Web. The biggest difference between the two markup languages is the fact that HTML describes presentation, whereas XML describes content. Simply, HTML describes the actual content such as text and graphic images, but only in terms of how it is to be displayed and interacted with. On the other hand, XML describes the content in terms of what data is being described. To do so, XML tags are then assigned to pieces of data. Once the data is tagged, it can be used with any XML document. XML is called “extensible” because the data contained in XML documents can be extracted and used whenever needed.
Another version of HTML that is based on XML is known as the Extensible Hypertext Markup Language, or XHTML. It combines the flexibility of HTML with the extensibility of XML. This language is used to create Web pages while also supporting XML, unlike HTML. This way, XML controls the actual content displayed, while XHTML controls the appearance and format of the Web page. However, one major difference between XHTML tags and HTML tags is the fact that there are stricter rules about how the markup tags are written. For example, unlike HTML, while using XHTML, all tags must be written in lowercase letter, every tag must have an end tag, and quotation marks are required for values.
MULTIMEDIA WEB DEVELOPMENT
Multimedia presentation uses graphics, sound clip, video clips, and text to deliver a message to the audience. All you need is a multimedia authoring program and a computer in order to create a presentation. The reason in using multimedia will be able to not only get the message you want to convey to the audience out but it provides a creative way in making it for the viewer. These following are types of situations that would see yourself wanting to use multimedia presentations in order to provide a creative presentation. One is for projects in order to show your teacher or a classmate in a more formal setting, another would be a class exhibit for the library or computer lab, for a more personal use you could utilize it as a diary, and the last two ways would be in a slideshow format and or utilize it for a yearbook. The three C’s in making a good multimedia presentation would be keeping it Clean, being Consistent and bring Character to the presentations. Next you will need to design the presentations in which make it able to be presentable and attract the attention of the audience. To continue, you’ll have to plan your presentation. Make an outline and make sure you understand the major topics of the presentation. Next the presenter will have to choose their media; multimedia elements support the main points of the presentation. Certain data will benefit the presentation as well, like, charts, graphs, maps, images and videos. Afterwards, review revise and rearrange so you know that the information is accurate and ready to be presented.
Creating The Website
Web site developers use a number of tools to create web sites. These can be divided into three large groups: markup languages, scripting languages, and web site authoring software. Markup languages are the foundation; they are coding systems that create the overall structure/appearance of the web page by the use of tags. Tags are commands that allow the web page designer to arrange text and multimedia. HTML, or Hypertext Markup Language, is the dominant markup language used today. The current version is HTML5, and it is intended to replace both HTML and XHTML, another markup language.
Scripting languages allow the developer to create instructions, or scripts, that run in the code of the web page. One example of a very popular scripting language used today is Javascript. Scripting languages are found everywhere. For example, Ajax technology is found in the widely-used services Google Maps and Gmail. When used in combination with markup languages, scripting languages can enable developers to implement a wide-range of features and content into their web pages.
Web site authoring software is used to make more complex web pages where developers can take advantage of commands that automatically generate tags and Cascading Style Sheets, which are used in the look and formatting of what was written by the markup language. This enables the developer to work in a more productive manner because animations, effects, backgrounds, etc. can be applied all at one time. For example, when menu options are selected, the appropriate JavaScript or other code used to add animation or interactivity is generated. Along with this, web site authoring programs almost always have the capability to include a variety of multimedia elements, like Shockwave and Flash animations, animated GIFs, video clips, and audio clips. Two of the most popular web site authoring programs are Adobe Dreamweaver and Microsoft Expression web. There are a few general features of web authoring applications a designer should know. This includes WYSIWYG, which stands for What You See Is What You Get, users can click and drag various website elements to a design canvas without having to code these widgets manually. Advantages of authoring software also include the ability to set up and use templates to ensure consistency between webpages and multi-media can be inserted into webpages. However, a disadvantage for using a web site authoring software is that it’s not intuitive and easy to pick and use, some training or technical knowledge is needed. Web sites developed with these tools may not be coded efficiently, which leads to increased load times for users. Also, one needs a basic understanding of HTML. Furthermore, web site authoring software can be an expensive purchase.
Other Content Development Tools
ActiveX is a component of the software in Microsoft’s Windows operating system. Many of Windows’ applications such as Internet Explorer, Microsoft Office, and Windows Media Player use ActiveX in order to embed their functions into other applications. Microsoft Internet Explorer replacement browser, Microsoft Edge, will not support ActiveX, marking the end of the technology.
Testing, Publishing, and Maintaining the Site
It is extremely important, before your webpage goes out, to make sure that it is up and running and functioning at one hundred percent capability. This means that there cannot be any bugs, glitches, or error pages displayed when a user is utilizing your web page. Though this may seem easy enough, there are many different steps that one should go through to make sure their page is up to speed. Every link, icon, animation, picture, and etc., needs to be tested. Many websites like to utilize the software that is out there that will manually do these needed checks for you, however it is still important to keep an eye out personally for anything that could be raising red flags. At this point, after vigorous testing, the site should be set and ready to be published. All though the page has been successfully published, the work does not stop there. Many people like to think that they are set for the future, but these pages require constant maintenance. The publisher needs to be constantly checking to make sure everything is still running smoothly, things are still up to date, and links and animation are still functioning. With out this much needed maintenance, a site becomes difficult and outdated, and users will go out of their way to make sure that they do not use it.
Demand For Multimedia Website Development
In this day and age everything is online, everyday individuals go online and they use the Internet for different purposes. There is a lot of money in the industry to make web sites. The demand for these sites is that they are intriguing, useful, and navigable to users. Companies hire web designers and web developers to create multimedia elements and create sites for the online presence of the company. As a web designer, you need to have knowledge in Photoshop, Illustrator, HTML, CSS, and JavaScript. A good web developer needs to know all the things that a web designer needs to know plus advanced programming skills. Graphic design has truly emerged as a demanding field of the economy with new technological developments in multimedia and software. As mentioned above, HTML5 and CSS3 are new coding techniques that are available for developers. Students interested in these fields should continue to study HTML and CSS.
We offer free in-depth courses on HTML and CSS.
Earn a Certificate of Completion for completing this course. Pass a 50-question test on this course with a score of 70 or higher and receive a certificate of completion. Visit our Computer Information Systems Certificate of Completion page for more information.
The text for this course is available from WikiBooks under the Creative Commons Attribution-ShareAlike License.