Название страницы

Почему не открывается index html

Почему мой браузер не отображает файл index.html при вводе каталога в URL?

У меня есть папка, содержащая веб-страницу index.html которая перенаправляет на другую страницу. Когда я набираю в браузере URL-адрес этого каталога без указания имени файла, я ожидаю, что он откроет index.html который перенаправит на нужную страницу. Но когда я открываю каталог в любом из моих браузеров (Chrome, Firefox), вместо этого отображается структура / дерево каталогов:

Почему браузер не открывает файл index.html? Я использую Windows 7.

2 ответа 2

Потому что вы обращаетесь к нему по ссылке file:// и он не обслуживается веб-сервером.

Тот факт, что вы можете перейти в каталог и получить файл по умолчанию, является частью конфигурации веб-сервера — Apache имеет директиву DirectoryIndex которая часто указывает несколько файлов (index.htm, index.html, index.php и т.д.), Из которых я Напомним, IIS использует «Default.htm»

Почему браузер не открывает файл index.html?

Как указано в комментариях, две наиболее вероятные причины:

Включение списков каталогов (которые показывают отдельные файлы в каталоге).

Неверно настроены ассоциации страниц по умолчанию (часто называемые документами по умолчанию) (например, вы используете index.html, когда сервер настроен только на распознавание файлов index.htm в качестве допустимых веб-страниц по умолчанию).

Если вы используете IIS, в центральном окне диспетчера IIS должна быть опция «Просмотр каталогов» (панель «Просмотр компонентов»). Обратите внимание, что вы должны выбрать «уровень» (сервер или экземпляр сайта в левом окне), прежде чем появится эта опция. После выбора для данного уровня вы можете включить просмотр каталогов в правом окне (панель «Действия») с помощью «Включить / Отключить». Это может быть сделано для всего сервера, для отдельных сайтов или даже для определенных каталогов.

Открываем HTML-файл в браузере

В этой статье будут рассмотрены лишь вариации того, как открыть уже сохраненный на компьютере файл через любой современный браузер. Если у вас его нет и/или нужно просмотреть HTML-структуру открытой в веб-обозревателе страницы интернета, обратитесь к другому нашему материалу по ссылке ниже.

Подробнее: Просмотр HTML-кода страницы в браузере

Способ 1: Контекстное меню

Уже имеющийся на компьютере HTM/HTML-документ может быть открыт из любого места через контекстное меню «Проводника». Сразу же уточним — все способы полностью применимы к любому браузеру.

Нажмите правой кнопкой мыши по файлу и выберите пункт «Открыть с помощью». В подменю укажите предпочитаемый веб-обозреватель, а если его не оказалось в списке, но при этом он установлен в операционной системе, кликните «Выбрать другое приложение».

Способ 2: Перетаскивание

Реализовать поставленную задачу можно и выполнив простое перетаскивание файла.

1. Если браузер уже запущен, откройте папку с файлом и перетяните его в адресную строку обозревателя.

Способ 3: Адресная строка

Адресную строку в браузере можно использовать не только при перетаскивании документа, но и в качестве проводника для локальных файлов компьютера.

Сайт Github Pages не обнаруживает index.html

Это было исправлено автоматически. Мне просто пришлось немного подождать, пока настройки вступят в силу.

Я также столкнулся с той же проблемой сегодня (28.05.2020). Предположим, что вы все сделали правильно (инструкции в https://pages.github.com/) вы должно быть настроено хранилище с именами username.github.io и index.html .

Для меня сработало то, что я выбрал тему Джекилла. Сначала перейдите к Settings репо. В разделе GitHub Pages найдите Theme Chooser , а затем нажмите Choose a Theme . Он перенаправит вас на страницу GitHub с несколькими темами, которые вы можете выбрать. Выберите тему, которая вам нравится, и нажмите Select Theme . Выполнив эти шаги, я обновил свой username.github.io , и страница работала правильно.

Нажатие на второй коммит исправило это для меня.

Видя другие ответы, где изменения исправляют это, я предполагаю, что вам нужно запустить несколько развертываний, чтобы заставить его работать.

Каждый толчок вызовет новое развертывание. Вы можете отслеживать развертывание по адресу https://github.com/username/username.github.io/deployments .

У меня была похожая проблема для частного хранилища. Мой проект Git содержал index.html в корневом каталоге, но страница не отображалась по пути http(s)://.github.io/ .

Решение в любом случае (общедоступное хранилище или нет) состоит в том, чтобы включить страницы GitHub в настройках хранилища проекта в разделе «Страницы GitHub».

Однако следует помнить, что включение страниц в закрытом хранилище делает файлы .html общедоступными.

Это случилось со мной, и как только я сделал еще один коммит, проблема решилась сама собой. Я просто добавил пробел в файл index.html в моей папке dist, зафиксировал и отправил это изменение в мою ветку gh-pages и BAM! Теперь я могу получить доступ к username.github.io/repository/index.html, просто перейдя в username.github.io/repository.

Довольно поздно на вечеринку, но вот как я исправил это для себя сегодня.

Перейти к настройкам для вашего репозитория: вы можете найти вкладку Настройки на своей странице репо.

Прокрутите вниз до раздела GitHub Pages на странице настроек.

На панели у вас будет информация Источник , в которой говорится: «Ваш сайт GitHub Pages в настоящее время создается из gh-pages branch ». ,

Однако в моих случаях весь код находился в ветке master . Поэтому я выбрал ветку из выпадающего списка в качестве основного, и всего за минуту она была успешно опубликована.

Столкнулся с этим сегодня (октябрь-06-2019)

Я дважды проверил все настройки, все они не исправили проблему, если я не изменил некоторый контент в моем файле index.html. Я также добавил несколько файлов в репо, чтобы сделать его «живым», но тщетно.

Итак, в моем случае я открыл свой index.html прямо в браузере, щелкнул по редактированию и добавил одно слово, зафиксировал основную ветку, обновился, и это заняло менее 5 секунд, и он снова заработал.

Постскриптум Я попробовал почти все решения, предоставленные где-нибудь, у меня ничего не получалось

Если вы не используете Jekyll, обходной путь — поместить файл с именем .nojekyll в корневой каталог.

Мой index.html имел следующую настройку DOCTYPE:

Исправлена проблема для меня.

Если вы не используете Jekyll, удалите файл _config.yml из репозитория. Это исправило проблему для меня.

Вы также можете попытаться отправить локальный репозиторий снова.

Похожая проблема. Мне пришлось создать случайные изменения в моем html, пройти процесс git add / commit / push. Это исправило это для меня! Теперь я могу получить доступ к своей странице, не добавляя .html в конце URL.

У меня была точно такая же проблема. Если вы попробуете ссылку, найденную в указанном репозитории> Настройки> Страницы GitHub, через час после публикации всего кода, страница GitHub будет работать.

Источник

Создаем HTML страницу

Сайты в интернете, состоят из HTML-страниц, точно также как обычная книга состоит из бумажных страниц, только в отличии от страниц книги, HTML-страницы соединены между собой не переплётом, а ссылками. Давайте создадим свою первую HTML-страницу.

Для того чтобы сделать сайт, нужно сначала создать HTML-страницу. Сделав несколько HTML-страниц и соединив их с помощью ссылок, мы получим сайт.

HTML-страницы создаются с помощью языка HTML, а код этого языка записывается в текстовых редакторах, например в обычном Блокноте от Windows. Открыв Блокнот и введя туда код написанный на языке HTML, а затем сохранив получившийся документ в файл с расширением .html мы получим HTML-файл, который можно просмотреть с помощью браузера.

Открыть Блокнот в Windows можно следующим образом:

В Блокноте наберите следующий код:

    
Заголовок статьи
 
Абзац статьи.
  

Или просто скопируйте его и вставьте в Блокнот :

Затем сохраните получившийся документ на Рабочий стол , в виде файла с названием index и расширением .html

Для этого нажмите на кнопки:
Файл — Сохранить как…

В появившемся окне выберите Рабочий стол , имя файла напишите index.html и нажмите кнопку:
Сохранить

Теперь файл index.html , который вы сохранили на Рабочий стол , можно открыть в браузере и посмотреть на получившуюся HTML-страницу. Для этого, нужно нажать правой кнопкой мыши по файлу index.html и выбрать из имеющихся у вас браузеров, я обычно использую браузер FireFox :
Открыть с помощью — FireFox

Если у вас на компьютере не установлен браузер FireFox , то можете открыть файл index.html любым другим браузером, например: Opera , Google Chrome , Internet Explorer или Safari .

Файл index.html , открытый в браузере FireFox :

На этом, первый урок учебника по HTML, окончен. В следующем уроке мы подробно разберём HTML-код и узнаем из каких частей он состоит.

Источник

Как написать и запустить HTML на компьютере

Для того, чтобы написать код, сгодится вообще любой текстовый редактор. Подойдёт даже «Блокнот» на вашем компьютере (но в нём очень неудобно всё делать). Мы скачаем и установим хороший редактор, заточенный под веб-разработку. Покажем всё на примере Visual Studio Code.

Зайдите на сайт и скачайте редактор. Если у вас Windows, то нажмите на любую из синих кнопок. Если OS X или Linux — нажмите Other platforms.

Установка пройдёт как обычно — нужно запустить файл VSCodeUserSetup, много раз нажать «Далее» и поставить пару галочек.

Шаг 2. Запускаем редактор и осматриваемся

Свежеустановленный VS Code встречает нас экраном с большим количеством ссылок. С ними можно познакомиться позже, а сейчас нужно настроить всё для работы.

Хорошо бы, чтобы во время работы все нужные файлы лежали в одной папке (пока проект маленький, так можно делать). Для этого добавим рабочую папку, чтобы VS Code показывал нам только её содержимое.

1. Add workspace folder — открывает меню выбора папки.
2. Создадим новую папку personal_page в любом удобном месте и зайдём в неё.
3. Нажмём Add.

После этого слева появится панель Explorer с пустым рабочим пространством Untitled (Workspace). Мы создали папку, давайте её наполним.

Шаг 3. Добавляем файлы

После создания папка пустая. Щёлкнем правой кнопкой по заголовку personal_page и добавим три файла, которые понадобятся в работе — index.html, style.css и script.js. Для начала этого хватит.

Шаг 4. Делаем работу удобнее

Сейчас все три файла открыты во вкладках, и между ними не всегда удобно переключаться. Чтобы было удобнее, код со стилями можно перенести в другую часть окна, например, вниз. Для этого нажмите правой кнопкой по вкладке со style.css и выберите split down, чтобы увидеть результат.

Шаг 5. Добавляем код

Пока отредактируем только index.html (файл с разметкой) и style.css (файл со стилями), а script.js оставим на будущее. Если у вас уже есть какой-нибудь код, напишите его, или используйте готовый — мы, например, возьмём код из интерактивных курсов.

     
  
 
 
День первый. Как я забыл покормить кота Кто бы мог подумать, что семантика это так важно, мне срочно нужно было об этом поговорить. Взгляд упал на кота. Кот издал настойчивое «Мяу». И я понял — пришло время для первой записи в блог. И покормить кота.
  
    

Скопируем код со стилями из файла — откройте его в браузере, скопируйте все строки и вставьте в файл style.css в редакторе.

Шаг 6. Запускаем код и смотрим на результат

Самый простой способ — открыть папку с файлами через проводник и запустить файл index.html. Вы увидите результат вёрстки в браузере, но это не слишком удобно — при любых изменениях придётся переходить в браузер и обновлять страницу.

Давайте настроим всё так, чтобы наша страничка открывалась сама и обновлялась, если вы что-то изменили в разметке или стилях.

Для этого нам понадобится расширение Live Server. Найти его можно прямо в VS Code (пятая иконка в меню слева) — введите название и нажмите Install. Другой способ — скачать Live Server из магазина расширений, но это менее удобно.

После установки расширения Windows может попросить разрешение на доступ к сети. Это нужно, чтобы запускать локальный сервер, Разрешайте, это безопасно.

Чтобы запустить код, нажмите кнопку Go Live на нижней панели.

Результат выглядит так. Слева — редактор, справа — браузер. Теперь измените код в редакторе и сохраните его, а он автоматически изменится и в окне браузера.

Что мы сделали

1. Установили и настроили редактор кода.
2. Создали рабочую папку и добавили туда файлы нашего проекта.
3. Научились редактировать и сохранять файлы с кодом.
4. Установили расширение, чтобы сразу видеть результат вёрстки.

В следующих частях — о добавлении и проверке кода на JavaScript, и о том, как сделать работу с кодом ещё удобнее.

Внеклассное чтение

«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.

Источник