Architecture, urban design, master planning Website Mockup

The Overlapping Image and Three-Column Directory Need Careful Screen Review

The opening Contact Us section is the first responsive-sensitive area because it combines several visual layers: a construction photograph, a rounded white content card, orange and gray geometric backgrounds, and an action button. At narrower widths, the relationship between image scale, card placement, text width, and decorative shapes should be checked so the photograph remains identifiable and the introductory content does not become crowded.

The All Offices section presents a different review challenge. Nine sample entries are arranged in three columns on larger screens, with location, address, telephone, and fax details repeated in each unit. A responsive presentation should be examined for column stacking, text wrapping, and the amount of vertical space created by the directory. The repeated structure needs to remain easy to scan without allowing long sample addresses or telephone lines to distort neighboring entries.

The lower contact block also combines a rounded form, an orange information panel, and a building image. Review should focus on the order and width of these areas, the visibility of the Submit action, and the balance between contact details and photography on smaller screens. The compact header and menu control should be checked alongside these sections so navigation remains proportionate to the page’s dense information areas.