I have to come up with some good looking webpages for my professor which will include pages for topics like research work, current students, alumni, paper published, etc.
Can someone please help me by leading me to some good tutorial in website development ? I have planned to use Adobe Dreamweaver for this ? Is this a good software to start with as i have no prior experience with website development or creating webpages.
DreamWeaver: Not bad!
Just stay away from 'template' feature (updating DW templates makes a big MESS).
DreamWeaver Kick Start
Here's some basic information about DreamWeaver : http://www.haverford.edu/acc/docs/software/dreamweaver/welcome.htm
Website Templates
You can even skip designing your website from scratch and find a pre-fabricated one that suits you, with sites like these : http://www.steves-templates.com/
Web Design Kick Start
In case you're still set on designing a website from scratch (a great idea! but more work), it's hard to give out just one link for web-design. I think webdesign has two components : knowing HTML/CSS/etc, and making it "work". Here's a webpage (ugh ads) full of good advice by example, rather than by novel.
http://www.webpagesthatsuck.com/
Dreamweaver will be hard to learn if you cannot pick up the tools properly, because if you are not using the tools within Dreamweaver you might as well use a different text editor with syntax highlighting :
Notepad (or Notepad++)
Vim/Emacs
Coda
Along with a ftp and a local server to test (XAMPP/IIS) your webpages before displaying it to the public.
University webpages are very simple and not very heavy on design (at least from what I have seen).
So you are really only going to need to know what the following mean
<html>
<body>
<head>
<meta>
<title>
<p>
<strong>
<a>
<img>
and focus on the content being served.
And this is a bare html file
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<style type="text/css">
</style>
</head>
<body>
</body>
</html>
Please do not use w3schools. Use it for a quick reminder every once in a while as to what certain tags do but do not use it for practice.
So start off with Opera Web Standards Curriculum as said there:
This is a web standards course
comprised of several articles, aimed
at pretty much anyone who wants to
learn web standards–based web design
from scratch. It is intended to take
the reader from nothing more than a
basic familiarity with browsing the
web, to being competent with CSS and
HTML, and have basic knowledge of
JavaScript and how it fits in to the
puzzle.
If you still choose to go the Dreamweaver way here are some supporting articles
Getting Started with Dreamweaver CS3
Getting started with Dreamweaver CS4
Learn Dreamweaver CS5
Related
I used Angular 1 years ago but everything has changed....so I feele like an idiot. I'm using a material design implementation from "unpkg" in a simple desktop based javascript web application. without SCCS, React, etc.
Trying to activate a theme compiled using the theme builder at https://m3.material.io/theme-builder but there are no examples of how to put it into use.
In a simple single page app I have included the unpkg material components like so, following their readme, and a theme package created using the Material site's theme builder
<link rel="stylesheet" href="https://unpkg.com/material-components-web#latest/dist/material-components-web.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet"** href="/xxxx/assets/css/theme.css"**>
<script type="text/javascript"
src="https://unpkg.com/material-components-web#latest/dist/material-components-web.js">
</script>
<script type="text/javascript"
src="https://unpkg.com/material-components-web#latest/dist/index.js">
</script>
<link type="text/javascript" src="/xxxxx/assets/app.js">
<html>
....
</html>
<script>mdc.autoInit()</script>
But I don't know how/where to put the compiled theme into action. I just get the default theme within the material components within the page. One issue is that while the theme builder explicitly says its for m3, I don't know what version of Material unpkg is giving me. The only example I can find is in back-end code in a c# application. This is an entirely front-end generated UI.
The theme compiled by the theme builder is not compatible with material-components-web. material-components-web is M2 implementation. At the moment there is no M3 web implementation, only work in progress - https://m3.material.io/develop/web
If you look at my website at vrbluedog.com, you can see that the home page and venue pages appear fine on PC and mobile phones, but the navigation pages (which you can see by clicking the "Find VR Service") appear tiny on mobile phones.
Can someone please tell me what code I need to add to make the navigation pages appear readable on mobile phones?
Thanks a lot guys,
Ana
Make sure this html tag is inside your meta on all pages.
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
Here is an explanation on what this tag is, and why it is needed for mobile websites: https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag
When I run my app in visual studio 2017 using IIS Express it is able to locate the favicon.ico in the wwwroot folder.
When it's deployed to IIS on a server then it can't find it.
I think it has to do with the url...
in development the url is https://localhost:44359
The favicon show up and if I manually type https://localhost:44359/favicon.ico then it returns it.
in production the url is https://localhost/reporting
The favicon doesn't show up and seems to be looking for it at https://localhost/favicon.ico (which returns a 404).
If I change that to http://localhost/reporting/favicon.ico then it returns the icon.
Can someone please suggest why it's not automatically looking for the icon under /reporting/ ??
I have a couple of routing issues as well, but other than that the app seems to work fine. I think the routing issues may have the same cause as the favicon.
Browsers only check example.com/favicon.ico - they don't check in subfolders.
If you're putting it somewhere non-standard (you are!), you'll need to point browsers to it. In the <head> of your pages:
<link rel="shortcut icon" href="/reporting/favicon.ico">
There is an issue with finding static resources for applications that are in subfolders of a website. However, in Razor pages, in the <head> you can use:
<link rel="shortcut icon" href='#Url.Content("~/favicon.ico")'>
where the ~ refers to your application's wwwroot folder.
I have a weird problem with webfonts rendering on IE11 (v11.0.9600.17631) windows 8.1 pro.
I am using both an iconmoon produced iconset and 2 typekit fonts (proxima nova and rooney) and nothing is rendered using these.
I have tried so many things but nothing seems to do the job. Tried a dozen tweaks on my css, also a number of google webfonts, generated a couple of tests through fontsquirrel. Nothing works.
It doesn't look like i am having CORS issues, on several of these tests fonts are on the same directory as the application i am building.
I managed to get it to work by disabling protected mode in Internet Options > Security, which i understand its turned on by default.
Anybody faces similar issues? This is so disappointing.
Your problem may be in the browsers emulation mode (Compatibility View). Force the UserAgent for IE by including this as the first metatag:
<meta http-equiv="X-UA-Compatible" content="IE=edge">
x-ua-compatible ie-compatibility-mode
I have a small WordPress site. I do a lot of audio work and I'm trying to post HTML5 audio clips in blog entries on WordPress. For some reason it isn't working. It might have something to do with the style I'm using on my WordPress site but I haven't been able to nail it down. I know my audio tags are valid, as they work elsewhere.
Here's an example audio tag:
<audio src="http://files.dannystewart.com/dom2008.mp3"></audio>
And here's a page demonstrating it not working:
http://www.dannystewart.com/html5-audio-test/
I'm quite sure this is something very simple that I've just missed, but any pointers would be appreciated.
Thanks!
You seem to be missing the controls attribute. This made it all work in Chrome for me:
<audio src="http://files.dannystewart.com/dom2008.mp3" controls></audio>
Note it won't work in Firefox - it doesn't support MP3 files. See http://adactio.com/journal/1669/ for a possible solution. As of December 2013, Firefox supports MP3 on Windows (XP+), Linux, Android, FirefoxOS, but not MacOS (bug). See https://developer.mozilla.org/en-US/docs/HTML/Supported_media_formats#Browser_compatibility.
Cool sound!
The problem is your doctype: html5 allows <!DOCTYPE html> only. Which is not to say that browsers won't support html5 elements with other doctypes...but YMMV.