Creating Data-Driven Web Sites
eBook - ePub

Creating Data-Driven Web Sites

An Introduction to HTML, CSS, PHP, and MySQL

Bob Terrell

Buch teilen
  1. 138 Seiten
  2. English
  3. ePUB (handyfreundlich)
  4. Über iOS und Android verfĂŒgbar
eBook - ePub

Creating Data-Driven Web Sites

An Introduction to HTML, CSS, PHP, and MySQL

Bob Terrell

Angaben zum Buch
Buchvorschau
Inhaltsverzeichnis
Quellenangaben

Über dieses Buch

The purpose of this book is to provide an introduction to this set of technologies to teach a new programmer how to get started creating data-driven websites and to provide a jumping-off point for the reader to expand his or her skills.

Today's modern world is heavily dependent on the World Wide Web. It affects the way we communicate, how we shop, and how we learn about the world. Every website, every page, consists of four fundamental elements: the structure, the style, the programming, and the data. These correspond to four different "languages, " respectively: HTML, CSS, PHP, and MySQL.

After learning the necessary components, users will have the understanding required to use the above technologies to create a working website. This book is aimed at the programmer or student who understands the basic building blocks of programming such as statements and control structures but lacks knowledge of the syntax and application of the above-mentioned technologies.

HĂ€ufig gestellte Fragen

Wie kann ich mein Abo kĂŒndigen?
Gehe einfach zum Kontobereich in den Einstellungen und klicke auf „Abo kĂŒndigen“ – ganz einfach. Nachdem du gekĂŒndigt hast, bleibt deine Mitgliedschaft fĂŒr den verbleibenden Abozeitraum, den du bereits bezahlt hast, aktiv. Mehr Informationen hier.
(Wie) Kann ich BĂŒcher herunterladen?
Derzeit stehen all unsere auf MobilgerĂ€te reagierenden ePub-BĂŒcher zum Download ĂŒber die App zur VerfĂŒgung. Die meisten unserer PDFs stehen ebenfalls zum Download bereit; wir arbeiten daran, auch die ĂŒbrigen PDFs zum Download anzubieten, bei denen dies aktuell noch nicht möglich ist. Weitere Informationen hier.
Welcher Unterschied besteht bei den Preisen zwischen den AboplÀnen?
Mit beiden AboplÀnen erhÀltst du vollen Zugang zur Bibliothek und allen Funktionen von Perlego. Die einzigen Unterschiede bestehen im Preis und dem Abozeitraum: Mit dem Jahresabo sparst du auf 12 Monate gerechnet im Vergleich zum Monatsabo rund 30 %.
Was ist Perlego?
Wir sind ein Online-Abodienst fĂŒr LehrbĂŒcher, bei dem du fĂŒr weniger als den Preis eines einzelnen Buches pro Monat Zugang zu einer ganzen Online-Bibliothek erhĂ€ltst. Mit ĂŒber 1 Million BĂŒchern zu ĂŒber 1.000 verschiedenen Themen haben wir bestimmt alles, was du brauchst! Weitere Informationen hier.
UnterstĂŒtzt Perlego Text-zu-Sprache?
Achte auf das Symbol zum Vorlesen in deinem nÀchsten Buch, um zu sehen, ob du es dir auch anhören kannst. Bei diesem Tool wird dir Text laut vorgelesen, wobei der Text beim Vorlesen auch grafisch hervorgehoben wird. Du kannst das Vorlesen jederzeit anhalten, beschleunigen und verlangsamen. Weitere Informationen hier.
Ist Creating Data-Driven Web Sites als Online-PDF/ePub verfĂŒgbar?
Ja, du hast Zugang zu Creating Data-Driven Web Sites von Bob Terrell im PDF- und/oder ePub-Format sowie zu anderen beliebten BĂŒchern aus Computer Science & Web Programming. Aus unserem Katalog stehen dir ĂŒber 1 Million BĂŒcher zur VerfĂŒgung.

Information

Jahr
2019
ISBN
9781946646057
CHAPTER 1
image
HTML
HTML is not, strictly, a programming language. HTML stands for hypertext markup language. It is a way of marking text, so that a web browser knows how to display it. It can be considered the most basic “building block” of a web page, and as such, it is where we begin.
It is customary when teaching a new language to begin with a simple program that simply outputs Hello, world! With HTML, it couldn’t be simpler. Open a new document in your editor and type in “Hello, world!”, as seen below (Figure 1.1).
image
Figure 1.1. Desc: “Hello, world!” in a text editor window
Save the file to your web root with the name hi.html (Figure 1.2).
image
Figure 1.2. Desc: file “hi.html” visible in a folder
View the results in your web browser of choice. Enter in the URL for your web root, and add hi.html to the end (Figure 1.3).
image
Figure 1.3. Desc: “Hello, world!” displayed in a web browser
You’re done!
FUNDAMENTALS
So what’s really going on here? The short answer is it is the browser’s job to make as much sense of an HTML file as it can. We can see what it has done by inspecting the web page. In Chrome: View -> Developer -> Developer Tools. In the window or pane that opens, select the Elements tab. We see that the browser has taken our file, which the web server has told it is an HTML file (thanks to the.html extension) and added to it. We should see something like the following (Figure 1.4):
image
Figure 1.4. Developer Tools window in Chrome
The document is located on the left. We see our Hello, world! text on the left. What’s the rest of that?
An HTML file is rendered by the browser into a document with elements. Note the three elements in document: the <html> element, which encompasses the entire document; the <head> element, which is currently empty and provides information about the document; and the <body> element, which contains the part of the document that the web browser is intended to render. Because our file contained only plain text, the browser created enough elements for our document to make sense. It put the contents of our file into the <body> element.
Revisit the document in the text editor and add in some of the elements the browser filled in on its own. Change the document to be as such:
image
Save the file and refresh the browser window. It should look pretty much the same! Only this time, the browser is reading our file and parsing (making sense of) it.
TAGS AND ELEMENTS
An html file is made up of markup contained in tags. An HTML tag consists of an open angle bracket (less than sign), certain characters to denote the type of tag, and a closing angle bracket (greater than sign). Tags may not have a space between the opening angle bracket and the letters. In the file above, note that we have three tags: <html>, <head>, and <body>. These correspond to the html, head, and body elements that the browser renders in its document.
HTML tags usually come in sets. There is an opening tag, as described above, and there is a closing tag, telling the browser when the element in question should end. A closing tag is an angle bracket, followed by a slash, followed by the same characters used in the opening tag. In the file above, every opening tag has a corresponding closing tag. A more correct description of our file would be that there are three opening tags: <html>, <head>, and <body>; and three closing tags: </head>, </body>, and </html>.
Also note that HTML is hierarchical: Elements can contain other elements when tags of another element are found in between the opening and closing tags. The head and body elements are contained within the html element because the <head> and <body> tags appear between the opening <html> and closing </html> tags.
While it’s possible to not close tags—if our file above was missing the closing tags, the browser would still render it correctly—some tags must be closed, and the browser will always try to render a document as if it were well-formed. It’s also possible to close tags not in reverse order: For example, the following would most likely render correctly:
image
but it is not well-formed. The following is well-formed:
image
Note the differences. The </u> closing tag closes the <u> element, which was the last one opened, followed by </b> to end the <b> opening tag. We also properly closed the <p> tag with the closing </p> tag. Don’t worry if you aren’t familiar with what these tags do! They’ll be explained soon enough. For now, simply note what it means to have well-formed HTML: that tags are closed in reverse order that they are opened.
BEST PRACTICE
Although web browsers give their best effort to make sense of an HTML file, throughout this book we will endeavor to generate well-formed documents. A...

Inhaltsverzeichnis