As01: 5-page Brochure Style Website (HTML-only)
This is a template for Assignment 01. This template is one page of what will be a 5-page static website. Your job is to copy this template file to your webspace, modify it, and make 4 new pages each with navigation bar, thereby creating a 5-page "brochure style" website. Be sure to update the hyperlinks in the navbar on all 5 pages.
Choose a topic for your website. Maybe find an existing company or organization with a crappy website and use it as the starting point to gradually build a better one. Before you start work, check Discussion board to make sure no one has already picked your topic. Pick a local business (or some other organization) that no one else has picked THEN POST YOUR CHOICE ON DISCUSSION BOARD. Finally, make a 5-page Brochure Style Website using HTML only (no CSS!!). Use only placeholders or images you have the right to use. See Canvas document and video on image use.
HTML formatting and styling capabilities are limited, of course, but do your best to make the pages look as decent as you can. Use as many HTML elements as you can to test how they work. Don't worry if the formatting or display is not very good. That's why we have CSS and Bootstrap (coming later).
Placeholder Images
If you don't have copyright free image content, you can generate "placeholder" images from websites like placeholder.com.
Pseudo Latin Text
If you don't have text content, you can generate "filler" text from websites like generator.lorem-ipsum.info.
Lorem ipsum dolor sit amet, cum et enim soluta legendos, his ad posse tritani adipisci. Te sed erat constituto, vel ei nulla rationibus argumentum, cu duo nonumes delicata voluptatum. Et quod tota sed. Delectus tractatos scripserit mei id. Ea velit deleniti consectetuer vim.
Solet oratio consequat vis ad, ut pri affert neglegentur. Sea lobortis sapientem ei, ei sea putant abhorreant, harum insolens ocurreret sit eu. Insolens mediocritatem id quo, at antiopam suavitate mel. Est fabulas alienum adipiscing ne, alienum molestiae per cu. Pro eu scripta abhorreant elaboraret, nam minim facilisis cu, dicant insolens eloquentiam ne his.
Mea cu dolores qualisque. Vis et justo disputando, stet copiosae dissentiet eu sit. Cu has quis deseruisse, nec ad velit inimicus consulatu. Corpora similique usu ne, per tantas suavitate consequat ut. Vocibus propriae sea ea, per illum nostrud eligendi ex.
Per cu nemore dolores, dignissim dissentiunt eos an, zril malorum vel an. Elitr habemus ancillae has in, vim an oblique numquam repudiandae, eam in mazim delenit verterem. Usu posse tollit graecis ut. Te qui purto solet utinam, cu diam quot doctus sit. Nec cu erroribus salutatus. Unum consul mandamus te has.
In vis prima tibique verterem, his dolorum probatus elaboraret ad, ex sea modus ullamcorper concludaturque. Habemus pericula eos in. Id nam omnium praesent complectitur, vim commune perfecto abhorreant ne. Autem putant audiam no nec, consetetur deterruisset ne vim.
Using Tables for Layout (Just This Once!)
If all you have is HTML, then you might use tables for layout. This is not proper practice in today's Web, but in the old days it used to be how people organized content. Give it a try, just to see how the old timers did things. Next exercise, we will remove tables (when doing the CSS version). To save yourself some typing, you can generate tables using websites like www.tablesgenerator.com.
Col 1 |
Col 2 |
Col 3 |
|
Per cu nemore dolores, dignissim dissentiunt eos an, zril malorum vel an. Elitr habemus ancillae has in, vim an oblique numquam repudiandae, eam in mazim delenit verterem. Usu posse tollit graecis ut. Te qui purto solet utinam, cu diam quot doctus sit. Nec cu erroribus salutatus. Unum consul mandamus te has. |
|
|
|
In vis prima tibique verterem, his dolorum probatus elaboraret ad, ex sea modus ullamcorper concludaturque. Habemus pericula eos in. Id nam omnium praesent complectitur, vim commune perfecto abhorreant ne. Autem putant audiam no nec, consetetur deterruisset ne vim. |
|
Finding Images with Acceptable Usage Rights
Copyrighted images. You can google images at images.google.com. To be relatively certain an image is okay to use, filter the search by clicking Tools | Usage Rights | Labeled for reuse.