• 220 likes • 437 Views
INFO 330 . Reverse Engineering Activity Introduction and Instructions. Steps. Dissect the site Name the areas Analyze the info areas Model the info types from the analysis of info areas Implement the info types in an RDB Model and implement the Navigation Turn pages into templates.
E N D
INFO 330 Reverse Engineering Activity Introduction and Instructions
Steps • Dissect the site • Name the areas • Analyze the info areas • Model the info types from the analysis of info areas • Implement the info types in an RDB • Model and implement the Navigation • Turn pages into templates
Part 1 Reverse Engineering Built page Nav Area 4 Data base Content Area Dissected Page Page Template 3 2 1 Nav Area Nav Area Content Area Content Area 5
A Web site from the usual perspective All about page design • HTML • CSS • Layout, color, font and image • A focus on Pages
A Web page from our perspective Page Area 1 Area 2 Area 3 Area 3.1 Area 4 A layout of areas
1.1 Name the areas The Page http://www.dorm-room-biz.com/category/eventsconferences/
1.1 Name the areas Banner Global Nav Info area: partial views Ads Local nav
1.1 Name the areas Banner Global Nav Ads Info Area:Full View Local nav
An Area from our Perspective Banner The database The page Global Nav Info Area Ads • Has info types • Each with some number of items • They are the site’s content • Has access structures • To allow you to ACESS the items • They are the site’s navigation Local nav
p.date c.num 1.2. Analyze the Info Areas p.title p.text.link (e) Navigation (not info) Entities p = post c = comment Areas o = optional cv = controlled vocab p = paras only rt = rich text Links e = external i = internal p.Text (rt)
1.2. Analyze the Info Areas c.num Navigation (not info) p.title c.name c.image c.date c.Text (p) comment (r) Entities p = post c = comment Areas o = optional cv = controlled vocab p = paras only rt = rich text r = repeats Links e = external i = internal c.name c.email c.site c.text
2. Model the info types from the analysis of info areas There is lots of room for judgment!
Rich Text • image • p • link(e) • External Link • title • url Info Model Post • title • dateTime • text Comment • name • date • image • email • site • Text (p)
Screen Dissection Activity Snopes.com
Controlled Vocabulary • A list of phrases (one or more words) • Composed by a set process (experts, folksonomy, etc.) • That constrains the values that a (field, attribute, element, etc.) can have • Different than a data type
Sub Areas- Rumor Area t.truth(cv) • Controlled vocabulary • True • Mixture • Undetermined • False • Legend
1.1 Name the Areas • Go to Snopes.com • Name the areas in the following pages • The home page • A category page (click on a category in the local nav) • A rumor page (click on a rumor on the category page)
1.2 Analyze the Info Areas • Go to and think about the info areas on these pages • Forever Twinkies (http://www.snopes.com/food/ingredient/twinkies.asp ) • The Microwaved Pet (http://www.snopes.com/horrors/techno/microwavedpet.asp ) • Sources page (http://snopes.com/sources/toogood.htm and http://snopes.com/sources/sources.htm ) • Source Types • Find entities as follows • The main type of info on the page is an entity • Any areas that repeat are separate entities • Any areas that can be re used in different items (in different pages) are separate entities • Name entities. Create a prefix for each entity (for example, the Rumor entity might be “r”) • Label each sub area on the page with an entity and name (for example the area that contains the rumor title might be labeled “r.title”) • Add qualifiers • Anything that comes from a controlled vocab gets (cv) • Anything that is optional gets (o)
1.2 Analyze the Info Areas • Do further analysis on text areas • If the text area is unformatted (i.e. a single unformatted paragraphs) do nothing more • If the text area contains multiple unformatted paragraphs mark the area with (p) • If the text area contains more than just unformatted paragraphs it is “rich.” Mark the area with (rt) • Label links (inside or outside text areas) • External (e) • Internal (i) • Place boxes very carefully. DO NOT cover non data
Make an info model • Further analyze the text area • Images • Links • Bullets • Bold, underline, italics, etc. • Find and list all controlled vocabularies • Distinguish internal from external links