~~NOTOC~~ ====== A Webpage Tutorial ====== ===== Create Your Page ===== - Log in to your math account on one of the department computers, open a terminal window. - Follow [[https://www.math.ucdavis.edu/resources/comp/comp-faq/#website_setup|these instructions]] from our computing staff. Don't skip the ''chmod'' part, if you want your page to be publicly accessible. - Your webpage will be visible at ''www.math.ucdavis.edu/~mathusername'' ===== Editing the Webpage ===== As it stands, your web page is just a generic placeholder. You need to edit the file ''index.html'' to make it into a real web page. The main principle at work is: whatever file you cook up and save as ''index.html'' in your ''public_html'' directory, that's what will appear when anyone looks you up on the web. There are two main options for customizing your webpage: ==== Option 1: Make it yourself. ==== The internet is graced by a billion website design tutorials. At the time of writing, [[https://developer.mozilla.org/en-US/docs/Web|Mozilla's documentation]] is perhaps the best of them. ==== Option 2: Use a third-party ==== Another good option is to use some website-hosting application and just have your math URL redirect users. Some good options include * [[https://www.google.com/sites/overview.html|Google Sites]] * [[https://wordpress.com|WordPress]] * [[https://www.blogger.com|Blogger]] * Or search online for "free website" To redirect ''www.math.ucdavis.edu/~yourusername'' to your real website, the ''index.html'' file in ''public_html'' should be the file ===== Good Practices ===== **A good website is an accessible one.** Some ways to promote accessibility are pretty intuitive, e.g. * Avoid text content in images. * Don't have flashing elements. * Avoid relying solely on color to distinguish elements. Other aspects of accessibility would be pretty hard to guess if you weren't familiar with the situation. e.g. * **Don't use HTML tables to layout your website.** * Use ''

'' tags instead of ''
'' ones to break up lines. * Include meaningful alt-text descriptions for your images. See [[https://developer.mozilla.org/en-US/docs/Web/Accessibility|Mozilla's Accessibility Guide]] for many practical tutorials and guidelines on this topic. For more general computer help, e-mail IT