I am trying to get an image to display on a basic webpage I am writing for a class. It just shows a box with my alternate text. Here is my code:
<html>
<head>
<title>Practice Features</title>
</head>
<body>
<img src=“images/FLCLogo.JPG” alt=“Folsom”>
</body>
</html>
Both the textedit doc and the images folder are in the same folder. In fact, they are the only files in that particular folder.
I'm doing the coding on a Mac, if that makes a difference at all. I've viewed it on both Chrome and Safari. Same issue.
You need to copy the file location..
Go to your image/properties/location+
Copy the location and paste it inside your quotes
Related
Reaching out to see if any ADA compliance experts might know how I might resolve an ADA compliance issue pertaining to our video transactions. We essentially provide links to .txt files for all of our videos which contain the video transcription. But when running an ADA scan we receive 2 errors pertaining to our transcriptions.
"Language missing or invalid "
"Missing or uninformative page title"
I'm not sure how I would tell a screen reader or ADA scanner the language or a page title given that these are just plain txt files. Any assistance would be greatly appreciated. Thanks.
This might be more about how your browser is set up to handle .txt files. Is your default action to download the file or to view it in the browser?
If the file is downloaded, then it's up to the end user to display the .txt file in whatever program they have set up to view them.
If you're letting the browser display the page, then that page is generated by the browser and I'm not sure if you can customize the page that's generated. I tried Firefox, Chrome, and Edge and they all generated a similar template to view a text file. (Edge uses the chromium engine so it's not surprising that Edge and Chrome have the same template). There's just a minor difference in the <head> between Firefox and Chrome.
This is essentially what's generated:
<html>
<head>
<!-- if using firefox -->
<link rel="stylesheet" href="resource://content-accessible/plaintext.css">
<!-- if using chrome/edge -->
<meta name="color-scheme" content="light dark">
</head>
<body>
<pre>
(contents of text file)
</pre>
</body>
</html>
If you run an accessibility scanner on this generated page, you will indeed get the two errors you mentioned.
3.1.1 Language of Page
2.4.2 Page Titled
For the language, that's specified on the <html> element with the lang attribute. If you bring up the code inspector on this stackoverflow page, you'll see lang="en":
<html class="html__responsive " lang="en">
For the page title, that's specified in the <head> with a child element of <title>. You can also see that in the stackoverflow page:
<head>
<title>wcag - ADA Compliance Language Missing or Invalid for video transcription txt files - Stack Overflow</title>
...
</head>
If no page title is specified, the browser usually shows the URL or just the filename as the title.
So, can you do anything about the template? I'm not sure. That would be an interesting project.
An alternative is to have your own webpage display the text file, which you would obviously have complete control over and could specify the language and the page title. But I would make this a lower priority issue over other accessibility issues that your website might have.
I have an app that, when clicking on a link, opens a new window with the following code:
<html>
<head>
</head>
<body>
<img src="data:image/png;base64,...">
</body>
</html>
On Chrome, if I right-click and select Save image as... option, the pop up to select saving location does not appear.
At the beginning I thought it was a Chrome error, but to test it I have copied the same code on a separate html page and I am able to download it.
So, anyone has a clue for what can be happening here?
The Html
<link rel=stylesheet href=../static/css/foundation-icons/foundation-icons.css>
<a class="button radius search-header"><i class="fi-magnifying-glass"></i> Search</a>
I have navigated to foundation-icons.css after hitting Ctrl+U within Firefox so I am definitely linking to the file correctly.
I have copied the foundation-icons folder exactly and not removed anything. It looks like this:
./static/css/foundation-icons/
- foundation-icons.css
- foundation-icons.eot
- foundation-icons.svg
- foundation-icons.ttf
- foundation-icons.woff
- svgs/*
- preview.html
Edit: I have changed the title and added the Firefox tag because everything seems to be working fine in Chromium. I am a little stumped because that means it's a Firefox issue and probably not possible for me to fix.
The preview.html file that comes with foundation-icons works correctly in my Firefox as well.
If you're using the SCSS files, you should point the $fi-path variable to the correct location of your foundation-icon-fonts folder.
For me I had to add the following before importing foundation-icon-fonts:
$fi-path: 'foundation-icon-fonts';
First correct this:
<link rel="stylesheet" href="../static/css/foundation-icons/foundation-icons.css">
In examples of Foundation, Firefox use .woff files. Check if you have access to them.
It's a relative path. Are you sure 'static' folder is reachable with your browser ?
I recently started to use dreamweaver and i like it so far. I only got one problem with it.
I saw on youtube videos that when somebody types the code, after pressing enter dreamweaver automatically indents the code. The problem is, is that my dreamweaver doesnt do this for me.
I searched every forum, recreated my config folder and rechecked al the preferences (preferences -> format code) and enabled the auto indent in the code view options but nothing works.
Instead of getting this:
<html>
<head>
<title></title>
</head>
<body>
<h1></h1>
</body>
</html>
i get this:
<html>
<head>
<title></title>
</head>
<body>
<h1></h1>
</body>
</html>
anbody has the same problem?
I know you can set the indentation with specific tags, but html know allot of tags so i would be a pain if i had to do it one by one.
thanks!
Edit > Preferences > Code Format
Check the Indent checkbox.
I searched through many sites, but I failed to get an answer.
Question :
I want to change icon as per given in below image in my browser.
Currently chrome and Mozilla does not support this feature if you want check you can check it in either ie or safari, it will show where you want.
you should add this tag to head
<link rel="shortcut icon" href="<YOUR ICON PATH>">
this is a tool to help you to create icon using converter
http://www.favicongenerator.com/
Those are called "favicons", and you can set one for your website using a special tag in the HEAD of your HTML. You can find many tutorials on this by Googling (now that you know what they're called).
Wikipedia suggests a tag something like this:
<link rel="shortcut icon" href="http://example.com/myicon.ico" />
As an alternative, your website can provide an image named favicon.ico in the root folder.
That icon names "favicon". To create Something like that go to THIS LINK, Upload an image and get the favicon.ico file, then put it next to your template page on your host.
To get more information go HERE.