Kicked off the FEND this week.
My focus this week has been working through Web Foundations. These lessons center around HTML, CSS, efficient code writing, responsive websites, pixel & viewport definition, what to include in READMEs, Markdown syntax and last but not least building a project portfolio site.
About half of the course topics for Web Foundations I’ve already completed from my Grow with Google challenge earlier this year. To avoid rework of completed topics I’m familiar with (HTML, CSS) I’m focusing on the responsive design topics and started on the portfolio site project. Although the bulk of the HTML & CSS topics are completed, I can go back and review any of the Udacity completed course topics if needed.
Stuff I learned:
HTML
I reviewed a few HTML topics for funsies to get my brain in learning mode again. What follows are my main takeaways on my HTML refresher this week. Opening and closing tags for all HTML elements. Surrounding each elements with HTML tags is important later on when you want to start implementing CSS and styling the HTML. Try to put each element on their own line to make them easier to read. One way of thinking about HTML trees is single parents raising children.
CSS
Didn’t review all that much on CSS. Will revisit many of the CSS topics as I continue to work on my portfolio site project.
Responsive Design
With responsive design I found it interesting that the course suggested developing websites for the smallest (mobile) viewpoint first then work up to desktop once mobile is finished. Considering how many people use mobile to view websites this makes sense to me in theory. If you can get it working for mobile it will likely fit on desktop. I imagine it’s easier to adjust into a larger viewpoint then try to adjust down. I haven’t tried this since responsive design isn’t something I’ve personally worked with yet and I haven’t previously developed anything specific for mobile viewing. This is something I’d like to test out myself to determine which works better for me. Right now my brain is in desktop web development mode so starting from a mobile viewpoint first will require an adjustment in my approach.
Read a few articles on various blogs regarding adaptive vs. responsive. I’m a fan of the latter. My reasoning for such is probably worth it’s own post so I’ll leave it at that.
One topic that did come up during my responsive research online is some folks recommend doing development to work well with less popular browsers and devices first. This is to work out the nuances and harder stuff up front. Others have the opposite approach – get the site up and running for the most popular browsers and mobile devices then sort out the kinks for less popular formats later. Right now I’m of the opinion I will focus on getting things right for the most popular browsers (current version of chrome will be my primary focus) and devices (newest iphone, samsung etc) and coming back to refactor my code if needed for lesser used browsers/devices as I have time.
Portfolio Site project
Reviewed the project rubric. Created the bare bones CSS stylesheet and HTML documents for this project. Plopped in text and image placeholders for the HTML document. Created a logo on a free logo generator site to use for the project.
Summary of current progress:
- Web Foundations (HTML, CSS, Responsive design…) (83% complete)
- Web Programming with JavaScript (JavaScript, git, version control, DOM..) (30% complete)
- Exploring JS – Object, Tools and Testing (Accessibility, testing, optimization)
- Front-End Applications
- Building with React
- Extracurricular (jQuery, security) (25% complete)
- Career – Job Search Strategies
- Career – Networking
- Career – Front-End Interview Practice