Join Nigel French for an in-depth discussion in this video Test your site, part of Designing a Portfolio Website with Muse.
- [Instructor] Throughout the course of creating our portfolio we've been doing a lot of testing. We preview, we figure out what's wrong, we go back and fix it, we preview again, repeat, repeat, repeat. Now when you get to a point where you feel like you're ready to show your site to the world first of all, show it to a small entrusted group of family and friends. And sit back and watch them navigate your site without any instruction and just see if they can figure it out. Obviously we want to make sure that there are no spelling errors, so spell-check your work and of course, read it for grammar, as well as spell-checking.
We don't want our hard work marred by very easily avoidable errors. And we need to check all of the links. To help us do this, we can use the W3C link checker. Now this, of course, pre-supposes that you've already uploaded your site to your domain name. If you haven't done that yet, this won't be an option for you. And I'll be going over how we can do that in a movie coming up very shortly. Very importantly, and especially so for a responsive site like ours, we need to check our site in different browsers and on different devices.
One such service that can help you do this is BrowserStack, which will allow you to view your website in an emulation of any browser on any platform. We also have the extremely useful Screenfly which I've mentioned before. Where we can view our pages at a great variety of different screen sizes. And for this, we don't need to have published our site first. We can just come to the temporary URL that is generated when we preview, copy that, and then paste that in here.
And I'm going to rotate my screen there for an emulation of a vertically oriented iPad. So in summary, get lots of feedback. Spell-check. Check your links. And check in as many different browsers and on as many different devices as you can.
- Starting a new portfolio website
- Making a header and footer
- Adding navigation
- Including social media icons
- Adding an autoplay slideshow
- Making thumbnail images and buttons
- Creating an About page and a Contact page
- Linking pages together
- Creating an accordion menu
- Adding breakpoints for responsiveness
- Testing and publishing a website