Taotao W

Learning goal

I want to be able to build a simple website on my own and have it open and display content correctly. I want to learn how to edit and update page elements such as text, images, links, layout, and basic styling. I want to understand the full workflow from content structure (HTML) to visual design (CSS) and, if needed, basic interaction.

Date Due		Percent
Week 2	Website Analysis	5%
Week 3	Midterm Worksheet (8 Steps)	5%
Week 3	Responsive Mockup	5%
Week 3	CSSSelection Exercise	5%
Week 4	Grid Exersize	5%
	First Quarter Assessment	25%
Week 5	Responsive Wireframe	5%
Week 5	Code Portfolio Front Page	5%
Week 5	Quiz
Week 6	Typography Poster	5%
Week 7	Current Topic Website	5%
Week 8	Portfolio: Class Presentation	5%
	Second Quarter Assessment	25%
Week 9	Final: Worksheet	5%
Week 10	Final: CSS3 Collateral	5%
Week 11	Final: CSS3 Animatic	5%
Week 12	Final: HTML/CSS	5%
Week 12	Final: Modular Navigation	5%
	Third Quarter Assessment	25%
Week 13	Final: Multimedia	5%
Week 13	Final: Alternatives	5%
Week 13	Final: Peer Review	5%
Week 14	Final: Forms	5%
Week 15	Alternative	5%
	Final Quarter Assessment	25%
Week 15	Final: Presentation	10%
	Two assignments dropped:	-10%
	Total:	100%
	List of sources and services used

Chatgpt dialogue

Assignment 1: Website Analysis

Q1. How important is a personal website for recruitment?

A personal website is a nice-to-have, not required for most recruiting, but it becomes much more important for portfolio-driven roles (design, art, UX, writing, freelance) where showing work and process quickly matters; for roles like SWE/data/finance/ops, recruiters usually care more about your resume/LinkedIn (and sometimes GitHub), so a simple one-page site is optional—but if you build one, keep it minimal: a clear headline, 2–4 best projects, a resume link, and contact.

Q2. What elements should a Design and Technology student include in a personal website to be more competitive?

A competitive Design and Technology personal website should communicate both design thinking and technical ability in a scannable way: a clear one-line positioning statement, 2–4 strong projects with visuals plus a short “problem → process → solution → result” breakdown, and a visible role label for what you did (UI, interaction, prototyping, front-end, 3D, etc.). Add a lightweight process trail (sketches, iterations, wireframes, tests) to prove you can design systems—not just final images—and include links to working demos (live site), code (GitHub), and tools used. Keep the layout minimal and readable (space, grid, consistent type), and make it easy to contact you with one click (email/LinkedIn), because recruiters often decide in under a minute.

Q3. I still have three years before entering the job market. How can I improve my competitiveness during this time (in a way that connects to my personal website)?

Over the next three years, treat your personal website as a living “evidence hub” that grows with your skills: every semester, ship at least one polished project and publish it with a short case study, a working prototype/demo, and a reflection on what you learned and improved. Use the site to show progression (better layout, stronger interaction, cleaner code, clearer writing), and curate ruthlessly so the homepage always shows your best 2–4 projects rather than everything. As you learn new tools (HTML/CSS/JS, Figma, motion, 3D, data viz), update one project to include that skill and document the iteration—this makes your improvement visible to recruiters. By the time you apply, your website should feel like a focused narrative: who you are, what you build, how you think, and where to contact you—fast.

Resources

Portfolio
Assignment1
Assignment 2
HTML inline and block elements.
Writing CSS, examples, layout and styling the navigation
Validate your page
Page quality audit