Lab 3

Page Layout

    ~ How to span cells across rows and columns in a table ~

1. 

• Table cells can be spanned across columns using the  colspan  attribute and spanned across rows using the  rowspan  attribute.

• Here is an example of colspan:

1. <table border="1"> 
2.   <tr> 
3.     <th colspan="2">Veterinary Services</th> 
4.   </tr> 
5.   <tr> 
6.     <td>Medical</td> 
7.     <td>Surgical</td> 
8.   </tr> 
9. </table> 

• This merges multiple columns into a single cell.

• Here is an example of rowspan:

1. <table border="1"> 
2.   <tr> 
3.     <th rowspan="2">Service</th> 
4.     <td>Medical</td> 
5.   </tr> 
6.   <tr> 
7.     <td>Surgical</td> 
8.   </tr> 
9. </table> 

• This merges multiple rows into a single cell.

2.

• Overall coding tables was a positive experience. Once I managed to format it correctly I was able to get a clean and clear presentation of information on my page.

3.

a. University of Alaska

• The homepage is dynamic, with a slider showing campus images, program names, promotional campaigns etc. 

• The navigation links to “Campuses,” “Admissions,” “Degrees & Programs,” “Financial Aid,” etc. 

• There is a strong visual hierarchy: large images, bold headings, and grouped content in sections (e.g. “Information for Prospective Students,” “Featured Campaigns,” “News & UA in the News”). 

• The colour scheme is consistent (blues, whites, accent colours) and ties into the brand of the university.

b. Academy of Art University

• The design is image-rich and visually impressive which suits an art & design school. There are large banners, photographic backgrounds, creative visuals. 

• Clear messaging on the page: “Apply Now,” “Request Info,”.

• The menu is comprehensive — categories like “Academics,” “Admissions,” “Campus,” “Life at the Academy,”.

• The colour and typography choices are modern and bold; they lean on visual contrast and aesthetics.

c. Delaware State University

• The site uses a conventional university layout: main navigation bar with categories like “Admissions,” “Academics,” “Current Students,”.

• Important links (campus tour, location, contact) are easily accessible. 

• The content is segmented in sections: e.g. news, features, student services..

• Colour branding is consistent (school colours, logo colour scheme) and used across headings, banners, etc.

After reviewing all three, here are four features they share:

1. Responsive / Mobile-Friendly Design
   All three websites adjust to different screen widths (desktop, tablet, mobile). Their navigation, content blocks, images, and layout adapt so the site remains usable on smaller devices.

2. Prominent Navigation & Drop‑Down Menus
   Each site has a well‑structured top navigation bar (often across the top) with drop‑downs or submenus linking to major sections like Academics, Admissions, Programs, Student Life, etc.

3. Visual Emphasis on the Homepage
   They all feature large banners, sliders or high-visibility images on the homepage to grab attention and showcase campus life, student activity, or promotional content.

4. Clear Calls to Action (CTAs)
   Each site includes noticeable buttons or links for desired visitor actions: “Apply Now,” “Request Info,” “Visit Campus,” “Admissions,” etc. These CTAs guide users in what steps to take next.

4 - 6.

Common Features of three Irish universities

Responsive / Mobile‑Friendly Layouts

• All three sites adjust to different screen widths; menus collapse, columns reflow, and interactive elements remain usable on mobile devices.
• The use of fluid widths, responsive images, and mobile-friendly navigation menus is evident..

Strong Branding & Institution Identity

• Each site makes the university’s name, logo, and key brand colours prominent (e.g. ATU uses its teal/green/blue palette, MTU uses its Cork / Munster identity, SETU uses consistent institutional visual style).
• They often include Irish-language versions or bilingual names.
• Branding consistency helps users immediately know which institution they are viewing, and helps to engage users.

Clear Segmentation / Sections for Key Audiences

• Common sections or navigation areas for “Study / Academics / Courses / Programs,” “Research & Innovation,” “International Students,” “News & Events,” etc.
• The sites tend to have blocks on the homepage with teasers or links to those major segments.
• This helps prospective students, researchers, or stakeholders find relevant content quickly.

Calls to Action (CTAs) & Engagement Links

• Buttons or links like “Apply Now,” “Find a Course,” “Request Info,” “Visit Us / Campus Tours,” “News & Events” are easily visible.
• They encourage user interaction and direct visitors toward conversion or further engagement.
• These CTAs are typically styled in contrasting colours to stand out against the page’s background.

7.

The Irish university websites that I viewed tended to be simpler, more direct, and more functional, focusing on program details and contact information. The US university websites that I viewed were more polished, content-heavy, and experience-driven, treating the website more like a marketing tool. This may reflect a greater degree of competition between US universities. The Irish ones that I looked at were all technical universities and so shared a similar format which may differ from other Irish universities.

8.

    a.

• Flat design is a minimalist design approach that uses simple, two-dimensional elements without textures, shadows, gradients, or three-dimensional effects.
• One example of this is Vesterland Music Festival website.

    b.

Style	Definition	Example Website
Skeuomorphism	Mimics real-world materials and textures	https://www.theradioapp.com/
Neumorphism	Soft, 3D-like UI with subtle shadows	https://neumorphism.io
Glassmorphism	Frosted-glass effect with transparency and blur	https://apple.com/macos/monterey
Neubrutalism	Bold, raw, high-contrast design with minimal          polish	https://brutalistwebsites.com/