7. Тестирование сайта.

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

8. Загрузка файлов на сервер провайдера.

После того, как работа над сайтом закончена, готовые файлы необходимо загрузить на сервер провайдера. Это делается с помощью одного из так называемых FTP-клиентов, т. е. программ, передающих файлы по FTP-протоколу. Если при разработке использовались специализированные средства (пример: FrontPage Extensions), необходимо заранее убедиться, что сервер провайдера поддерживает все нужные сервисы; в этом случае загрузка файлов должна осуществляться при помощи специальных программ. После этого стоит ещё раз всё проверить: нередко можно обнаружить неправильные ссылки на те или иные файлы, возникшие вследствие того, что конфигурация сервера провайдера может существенным образом отличаться от конфигурации вашего компьютера.

Инструменты веб-дизайнера

Если вы уже пытались создавать HTML-страницы, используя соответствующие возможности Microsoft Word, забудьте об этом. Если начали изучать FrontPage -- также рекомендую забыть, он вам не пригодится... я сам работал в нём два года и наконец оставил это невесёлое занятие. Вам понадобится... вот почитайте-ка ниже, что вам понадобится.

1. Adobe Photoshop

Мощное средство создания графики для Интернет и не только. Веб-дизайнера он интересует в особенности, т. к. оснащён развитыми средствами оптимизации графики, т. е. уменьшения размеров графических файлов без проигрыша в качестве или с мининальным проигрышем. Имейте в виду, что в Интернет используются два основных графических формата: GIF (для изображений с небольшим количеством цветов) и JPEG (для полноцветных фотографических изображений), с каждым из которых Photoshop справляется очень неплохо. Представьте: каждая веб-страница должна весить не более 50-100 килобайт в худшем случае... сами понимаете, без оптимизации не обойтись.

Я пользуюсь 6-й версией Photoshop, но, если у вас установлена версия 5.0 или 5.5, ничего страшного. Сайт программы:

Adobe Systems Incorporated

2. Macromedia Dreamveaver

Самый приличный из современных визуальных редакторов веб-страниц.

Существует мнение, что HTML должен писаться только руками и только в текстовом редакторе. Это чистейшей воды снобизм: при таком «профессиональном» подходе большой заказ переживёт заказчика... да и исполнителя, возможно. Другое дело, что вы должны уметь писать HTML руками без помощи визуальных редакторов, иначе какой же вы профессионал? Лично я, к сожалению, шёл к HTML от Word'а, что существенно замедлило прогресс.

Используйте версию 4.0, она предоставляет разработчику наибольшие возможности и снабжена прекрасной информационно-справочной системой по HTML, CSS и JavaScript. Сайт программы:

Macromedia

Эта же компания разрабатывает Flash и Shockwave.

3. Notepad

Без этого весёлого редактора тоже не обойтись: по крайней мере вы всегда будете знать, что код сохранён именно в том варианте, в котором вы его создавали. Сам я пишу в Notepad'е файлы таблиц стилей, правлю скрипты... а если приходится сесть за компьютер без Dreamweaver'а, то и полностью делаю странички. Никто не заставляет вас заниматься этим постоянно, но уметь это необходимо. Сайт программы:

Microsoft

4. Perl

Если вы собираетесь изучать Perl в среде Windows, установите на своём компьютере Active Perl версии 5.6 или выше. Не волнуйтесь, практически все ваши скрипты будут работать и под Unix. Сайт программы:

ActiveState -- Programming for the People

5. Perl Builder

Так вот, если вы всё ещё собираетесь изучать Perl, вам понадобится соответствующий редактор-отладчик. Используйте версию 2.0, она значительно лучше первой. Сайт программы:

Solutionsoft Home Page

6. Apache Web-server

Этот сервер вы можете использовать для тестирования веб-страниц и скриптов, написанных на языке Perl. Используйте версию 1.3.14 или более современную. Сайт программы:

The Apache Software Foundation

7. Браузеры.

Для начала достаточно, если вы будете тестировать свои страницы на совместимость в двумя браузерами: Internet Explorer, google chrome, mozzila, opera

8. LeapFTP

Для загрузки файлов на сервер провайдера вы можете воспользоваться одним из множества FTP-клиентов. На мой взгляд, лучший из них -- LeapFTP версии 2.6 и выше. Сайт программы:

LeapWare

http://lifehacker.ru/2013/07/01/30-instrumentov-dlya-veb-dizajna-na-kazhdyj-den/

Web страница: положительные и отрицательные элементы дизайна

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

 1. Пространство Под понятием пространства понимается место или арена действий, площадка, где собственно и находится вся композиция. Может быть двухмерное и трехмерное пространство. Объекты в трехмерном пространстве имеют глубину и объем.

2. Линия Линия – это базовый элемент дизайна, который представляет собой непрерывную последовательность из точек на поверхности, сделанную карандашом или кистью. С помощью линий задаются контуры или очертания. Линии могут быть кривые, горизонтальные, вертикальные, волнистые, параллельные, пунктирные.

3. Фигура Когда линия пересекает себя или другую линия, то образуется фигура. Существуют геометрические фигуры (круг, вадрат, прямоугольник, треугольник) и органические фигуры (очертания листа, ракушки, цветка итд).

4. Цвет Цвет очень хорошо передает эмоции и позволяет объектам выделяться от фона. С помощью цвета можно привлечь внимание к определенной части сайта. Существуют основные цвета (красный, желтый, синий), вторичные цвета (оранжевый, зеленый, фиолетовый) – они получаются путем смешения основных цветов, промежуточные (основной + вторичный) и дополнительные цвета (противоположные цвета на цветовом круге).

5. Текстура Текстура передает визуальный или тактильный вид поверхности. Текстура может быть гладкой, шероховатой, мягкой. Различают реалистичные текстуры, такие как дерево, бумага, тканевыe текстуры, текстуры кожи итд.

6. Форма Форма представляет собой трехмерный объект, в отличие от фигуры. У формы можно измерить ширину, высоту и глубину. Также форма передается светотенью. Форма может быть получена путем объединения двух или более фигур.

7. Светотень Этот элемент определяет соотношение светлых и темных областей применительно к объекту. Светотень создается внешним источником света, который накладывает на объект блики и тени. Именно светотень создает глубину у фотографии.

8. Размер Каждый дизайнерский элемент, участвующий в композиции, обладает определенным размером, или массой по отношению к другим элементам и ко всему дизайну в целом. Регулируя размер, можно обеспечить внимание, передать настроение, создать необходимый контраст, выделить информацию.

http://lpgenerator.ru/blog/2014/02/27/3-principa-optimizacii-konversii-i-yuzabiliti-veb-dizajna/