🔄 Topic

Improving the website for real users on phones, not just desktop previews.

🎯 Goal

Understand why responsive design and mobile usability matter for a local business website.

🛠 What I Did

I focused on the practical user experience of the Farina website. A local agricultural business website is likely to be visited from phones: people checking products, looking for directions, viewing photos, or contacting the business quickly. This means layout, spacing, readability, buttons, galleries, and contact actions must work well on smaller screens. The work was not pure cybersecurity, but it was operationally real: a broken mobile experience is a business failure.

Main areas covered:

  • mobile-first layouts
  • readable typography
  • touch-friendly buttons
  • responsive sections
  • fast navigation
  • clear contact paths

🔗 Key Cybersecurity Connections

Reliability matters in security because availability is part of the CIA triad. If users cannot use the site properly, the service is effectively failing its purpose.

🔍 Investigation Questions

  • Does the site work on mobile?
  • Are calls to action easy to tap?
  • Does layout break on small screens?
  • Are images too heavy for mobile connections?
  • Can customers contact the business without friction?

🚨 Detection Opportunities

Potential monitoring ideas:

  • mobile error spikes
  • high bounce rate after deployment
  • slow page loads
  • broken navigation after asset changes
  • unexpected layout regressions

Example:

project=farina-farm-website
change_type=public_website_update
risk_area=repository_deployment_or_public_input
triage=review_change_intent_and_validate_build

🧭 MITRE ATT&CK Techniques

Possible mappings depending on confirmed behavior:

  • T1499 — Endpoint Denial of Service
  • T1498 — Network Denial of Service

🗺 Visual Investigation Diagram

User device
    ↓ Mobile layout
    ↓ Page speed
    ↓ Contact action
    ↓ Business outcome

⚠ Challenges

The challenge was not overbuilding. A small business site needs clarity more than complex effects.

📚 What I Learned

I learned that usability is operational reliability. If people cannot navigate the site, the system is not doing its job.

➡ Next Steps

  • Test important pages on mobile
  • Keep buttons obvious
  • Optimize image weight
  • Avoid unnecessary animation

🧠 Reflection

This was useful because it turned a real project into security-aware learning without pretending that every task was a pure cybersecurity lab.

🧩 Lessons Learned

What worked

Prioritizing real customer behavior.

What broke

Designing only from desktop view.

Why it broke

Desktop preview hides many mobile problems.

Fix / takeaway

Test the site the way real users will use it.

📈 Skill Progression Context

This supports cybersecurity progression because security professionals must understand availability, reliability, and user behavior, not just attacker tools.

😄 TL;DR

Mobile usability is business availability.